view release on metacpan or  search on metacpan

t/private/javascripts/jscolor.js  view on Meta::CPAN

				jscolor.picker.box.appendChild(jscolor.picker.sldM)
				jscolor.picker.padB.appendChild(jscolor.picker.pad)
				jscolor.picker.box.appendChild(jscolor.picker.padB)
				jscolor.picker.box.appendChild(jscolor.picker.padM)
				jscolor.picker.boxB.appendChild(jscolor.picker.box)
			}

			var p = jscolor.picker

			// recompute controls positions
			posPad = [
				x+THIS.pickerBorder+THIS.pickerFace+THIS.pickerInset,
				y+THIS.pickerBorder+THIS.pickerFace+THIS.pickerInset ]
			posSld = [
				null,
				y+THIS.pickerBorder+THIS.pickerFace+THIS.pickerInset ]

			// controls interaction
			p.box.onmouseup =
			p.box.onmouseout = function() { target.focus() }
			p.box.onmousedown = function() { abortBlur=true }
			p.box.onmousemove = function(e) { holdPad && setPad(e); holdSld && setSld(e) }
			p.padM.onmouseup =
			p.padM.onmouseout = function() { if(holdPad) { holdPad=false; jscolor.fireEvent(valueElement,'change') } }
			p.padM.onmousedown = function(e) { holdPad=true; setPad(e) }
			p.sldM.onmouseup =
			p.sldM.onmouseout = function() { if(holdSld) { holdSld=false; jscolor.fireEvent(valueElement,'change') } }
			p.sldM.onmousedown = function(e) { holdSld=true; setSld(e) }

			// picker
			p.box.style.width = 4*THIS.pickerInset + 2*THIS.pickerFace + jscolor.images.pad[0] + 2*jscolor.images.arrow[0] + jscolor.images.sld[0] + 'px'
			p.box.style.height = 2*THIS.pickerInset + 2*THIS.pickerFace + jscolor.images.pad[1] + 'px'

			// picker border
			p.boxB.style.position = 'absolute'
			p.boxB.style.clear = 'both'
			p.boxB.style.left = x+'px'
			p.boxB.style.top = y+'px'
			p.boxB.style.zIndex = THIS.pickerZIndex
			p.boxB.style.border = THIS.pickerBorder+'px solid'
			p.boxB.style.borderColor = THIS.pickerBorderColor
			p.boxB.style.background = THIS.pickerFaceColor

			// pad image
			p.pad.style.width = jscolor.images.pad[0]+'px'
			p.pad.style.height = jscolor.images.pad[1]+'px'

			// pad border
			p.padB.style.position = 'absolute'
			p.padB.style.left = THIS.pickerFace+'px'
			p.padB.style.top = THIS.pickerFace+'px'
			p.padB.style.border = THIS.pickerInset+'px solid'
			p.padB.style.borderColor = THIS.pickerInsetColor

			// pad mouse area
			p.padM.style.position = 'absolute'
			p.padM.style.left = '0'
			p.padM.style.top = '0'
			p.padM.style.width = THIS.pickerFace + 2*THIS.pickerInset + jscolor.images.pad[0] + jscolor.images.arrow[0] + 'px'
			p.padM.style.height = p.box.style.height
			p.padM.style.cursor = 'crosshair'

			// slider image
			p.sld.style.overflow = 'hidden'
			p.sld.style.width = jscolor.images.sld[0]+'px'
			p.sld.style.height = jscolor.images.sld[1]+'px'

			// slider border
			p.sldB.style.position = 'absolute'
			p.sldB.style.right = THIS.pickerFace+'px'
			p.sldB.style.top = THIS.pickerFace+'px'
			p.sldB.style.border = THIS.pickerInset+'px solid'
			p.sldB.style.borderColor = THIS.pickerInsetColor

			// slider mouse area
			p.sldM.style.position = 'absolute'
			p.sldM.style.right = '0'
			p.sldM.style.top = '0'
			p.sldM.style.width = jscolor.images.sld[0] + jscolor.images.arrow[0] + THIS.pickerFace + 2*THIS.pickerInset + 'px'
			p.sldM.style.height = p.box.style.height
			try {
				p.sldM.style.cursor = 'pointer'
			} catch(eOldIE) {
				p.sldM.style.cursor = 'hand'
			}

			// load images in optimal order
			switch(modeID) {
				case 0: var padImg = 'hs.png'; break
				case 1: var padImg = 'hv.png'; break
			}
			p.padM.style.background = "url('"+jscolor.getDir()+"cross.gif') no-repeat"
			p.sldM.style.background = "url('"+jscolor.getDir()+"arrow.gif') no-repeat"
			p.pad.style.background = "url('"+jscolor.getDir()+padImg+"') 0 0 no-repeat"

			// place pointers
			redrawPad()
			redrawSld()

			jscolor.picker.owner = THIS
			document.getElementsByTagName('body')[0].appendChild(p.boxB)
		}


		function redrawPad() {
			// redraw the pad pointer
			switch(modeID) {
				case 0: var yComponent = 1; break
				case 1: var yComponent = 2; break
			}
			var x = Math.round((THIS.hsv[0]/6) * (jscolor.images.pad[0]-1))
			var y = Math.round((1-THIS.hsv[yComponent]) * (jscolor.images.pad[1]-1))
			jscolor.picker.padM.style.backgroundPosition =
				(THIS.pickerFace+THIS.pickerInset+x - Math.floor(jscolor.images.cross[0]/2)) + 'px ' +
				(THIS.pickerFace+THIS.pickerInset+y - Math.floor(jscolor.images.cross[1]/2)) + 'px'

			// redraw the slider image
			var seg = jscolor.picker.sld.childNodes

			switch(modeID) {
				case 0:
					var rgb = HSV_RGB(THIS.hsv[0], THIS.hsv[1], 1)
					for(var i=0; i<seg.length; i++) {
						seg[i].style.backgroundColor = 'rgb('+
							(rgb[0]*(1-i/seg.length)*100)+'%,'+
							(rgb[1]*(1-i/seg.length)*100)+'%,'+
							(rgb[2]*(1-i/seg.length)*100)+'%)'
					}
					break
				case 1:
					var rgb, s, c = [ THIS.hsv[2], 0, 0 ]
					var i = Math.floor(THIS.hsv[0])
					var f = i%2 ? THIS.hsv[0]-i : 1-(THIS.hsv[0]-i)
					switch(i) {
						case 6:
						case 0: rgb=[0,1,2]; break
						case 1: rgb=[1,0,2]; break
						case 2: rgb=[2,0,1]; break
						case 3: rgb=[2,1,0]; break
						case 4: rgb=[1,2,0]; break
						case 5: rgb=[0,2,1]; break
					}
					for(var i=0; i<seg.length; i++) {
						s = 1 - 1/(seg.length-1)*i