いつも何かツクットル

var extTest2 = function(){};
var pt = extTest2.prototype = new Object();
pt.r = 255;
pt.g = 255;
pt.b = 255;
pt.h = 0;
pt.s = 0.0;
pt.v = 1.0;
pt.updatingSlider = false;
pt.sliderR = null;
pt.sliderG = null;
pt.sliderB = null;
pt.sliderH = null;
pt.sliderS = null;
pt.sliderV = null;
pt.colorSelector = null;
pt.init = function(){
	this.rgbLabel = Ext.get("divRgbLabel");	
	this.hsvLabel = Ext.get("divHsvLabel");
	this.updateRGBLabel();
	this.updateHSVLabel();
	this.updateColorView();
	
	this.sliderR = new Ext.Slider({
	   	id:'sliderR',
        renderTo: 'divSliderR',
        width: 255,
        minValue: 0,
        maxValue: 255,
		value : this.r,
		increment: 1,
        plugins: new Ext.ux.SliderTip()
    });
	this.sliderR.addListener("change",this.onSliderChange,this);
	this.updateLabel(this.sliderR);
	this.sliderG = new Ext.Slider({
	   	id:"sliderG",
        renderTo: 'divSliderG',
        width: 255,
        minValue: 0,
        maxValue: 255,
		value : this.g,
		increment: 1,
        plugins: new Ext.ux.SliderTip()
    });
	this.sliderG.addListener("change",this.onSliderChange,this);
	this.updateLabel(this.sliderG);
	this.sliderB = new Ext.Slider({
	   	id:"sliderB",
        renderTo: 'divSliderB',
        width: 255,
        minValue: 0,
        maxValue: 255,
		value : this.b,
		increment: 1,
        plugins: new Ext.ux.SliderTip()
    });
	this.sliderB.addListener("change",this.onSliderChange,this);
	this.updateLabel(this.sliderB);
	this.sliderH = new Ext.Slider({
	   	id:"sliderH",
        renderTo: 'divSliderH',
        width: 360,
        minValue: 0,
        maxValue: 360,
		value : this.h,
		increment: 1,
        plugins: new Ext.ux.SliderTip()
    });
	this.sliderH.addListener("change",this.onSliderChange,this);
	this.updateLabel(this.sliderH);
   	this.sliderS = new Ext.Slider({
	   	id:"sliderS",
        renderTo: 'divSliderS',
        width: 200,
        minValue: 0,
        maxValue: 100,
		value : this.s,
        plugins: new Ext.ux.SliderTipDiv100()
    });
	this.sliderS.addListener("change",this.onSliderChange,this);
	this.updateLabel(this.sliderS);
   	this.sliderV = new Ext.Slider({
	   	id:"sliderV",
        renderTo: 'divSliderV',
        width: 200,
        minValue: 0,
        maxValue: 100,
		value : this.v,
        plugins: new Ext.ux.SliderTipDiv100()
    });
	this.sliderV.addListener("change",this.onSliderChange,this);
	this.updateLabel(this.sliderV);
	
	var colorView = Ext.get("colorViewLink");
	colorView.on("click",this.onColorClick,this);
	
	this.colorSelector = new Ext.ColorPalette({value:'ffffff',hideParent:true});
	this.colorSelector.on('select',this.onColorSelect,this);
}
pt.onSliderChange = function(slider, value){
	this.colorSelector.hide();
	if (this.updatingSlider) {
		//trace("updatingSlider");
		return;
	}
	var rgbUpdate = false;
	switch (slider.id) {
		case "sliderR":
			this.r = slider.getValue();
			rgbUpdate = true;
			break;
		case "sliderG":
			this.g = slider.getValue();
			rgbUpdate = true;
			break;
		case "sliderB":
			this.b = slider.getValue();
			rgbUpdate = true;
			break;
		case "sliderH":
			this.h = slider.getValue();
			break;
		case "sliderS":
			this.s = slider.getValue() / 100;
			break;
		case "sliderV":
			this.v = slider.getValue() / 100;
			break;
	}
	if(rgbUpdate){
		this.setHsvByRgb();
	}else{
		this.setRgbByHsv();
	}
	var hsvUpdate = !rgbUpdate;
	this.updateAll(rgbUpdate,hsvUpdate);
}
pt.updateAll= function(rgbSliderUpdate,hsvSliderUpdate){
	//スライダーのchangeイベントが発動するので無視するためのフラグを立てる
	this.updatingSlider = true;
	if(rgbSliderUpdate){
		this.updateHsvSlider();
	}
	if(hsvSliderUpdate){
		this.updateRgbSlider();
	}
	this.updatingSlider = false;
	
	this.updateLabel(this.sliderR);
	this.updateLabel(this.sliderG);
	this.updateLabel(this.sliderB);
	this.updateLabel(this.sliderH);
	this.updateLabel(this.sliderS);
	this.updateLabel(this.sliderV);
	this.updateRGBLabel();
	this.updateHSVLabel();
	this.updateColorView();
}
pt.setHsvByRgb = function(){
	var o = harayoki.utils.ColorUtil.rgb2hsv(this.r,this.g,this.b);
	this.h = Math.floor(o.h);
	this.s = o.s;
	this.v = o.v;
}
pt.setRgbByHsv = function(){
	var o = harayoki.utils.ColorUtil.hsv2rgb(this.h,this.s,this.v);
	this.r = Math.floor(o.r);
	this.g = Math.floor(o.g);
	this.b = Math.floor(o.b);	
}
pt.updateHsvSlider = function(){
	this.sliderH.setValue(this.h);
	this.sliderS.setValue(this.s*100);
	this.sliderV.setValue(this.v*100);
}
pt.updateRgbSlider = function(){
	this.sliderR.setValue(this.r);
	this.sliderG.setValue(this.g);
	this.sliderB.setValue(this.b);	
}
pt.updateLabel = function(slider){
	var labelId = {
		sliderR: "divLabelR",
		sliderG: "divLabelG",
		sliderB: "divLabelB",
		sliderH: "divLabelH",
		sliderS: "divLabelS",
		sliderV: "divLabelV"
	}[slider.id];
	var value = slider.getValue();
	if (slider == this.sliderS || slider == this.sliderV) {
		value /= 100;
	}
	Ext.get(labelId).dom.innerHTML = slider.id+" : "+value;
}
pt.getRgbHex = function(){
	return 	("0"+this.r.toString(16)).slice(-2)
	+("0"+this.g.toString(16)).slice(-2)
	+("0"+this.b.toString(16)).slice(-2);
}
pt.setRgbFromColorString = function(colorString){
	var colorNum = Number("0x"+colorString);
	this.r = (colorNum & 0xff0000)>>16;
	this.g = (colorNum & 0x00ff00)>>8;
	this.b = (colorNum & 0x0000ff);
}
pt.updateRGBLabel = function(){
	this.rgbLabel.dom.innerHTML = this.getRgbHex();
}
pt.updateHSVLabel = function(){
	this.hsvLabel.dom.innerHTML = 
	this.h.toFixed(2)+","+this.s.toFixed(2)+","+this.v.toFixed(2);
}
pt.updateColorView = function(){
	var colorView = Ext.get("divColorView");
	colorView.dom.style.backgroundColor = this.getRgbHex();
}
pt.onColorClick = function(){
	if(!this.colorSelector.rendered){
		Ext.get('divColorSelector').show();
		try{
			//IEでエラーになるが正常に動くようだ 
			this.colorSelector.render('divColorSelector');
		}catch(e){
			//'child(...)'はNullまたはオブジェクトではありません。
		}
	}else if(this.colorSelector.hidden){
		this.colorSelector.show();
	}else{
		this.colorSelector.hide();
	}
}
pt.onColorSelect = function(selector,colorString){
	this.colorSelector.hide();
	this.setRgbFromColorString(colorString);
	this.setHsvByRgb();
	var rgbUpdate = true;
	var hsvUpdate = true;
	this.updateAll(rgbUpdate,hsvUpdate);	
}
pt.toString = function(){
	return "[object extTest2]";
}

/**
 * @class Ext.ux.SliderTip
 * @extends Ext.Tip
 * Simple plugin for using an Ext.Tip with a slider to show the slider value
 */
Ext.ux.SliderTip = Ext.extend(Ext.Tip, {
    minWidth: 10,
    offsets : [0, -10],
    init : function(slider){
        slider.on('dragstart', this.onSlide, this);
        slider.on('drag', this.onSlide, this);
        slider.on('dragend', this.hide, this);
        slider.on('destroy', this.destroy, this);
    },

    onSlide : function(slider){
        this.show();
        this.body.update(this.getText(slider));
        this.doAutoWidth();
        this.el.alignTo(slider.thumb, 'b-t?', this.offsets);
    },

    getText : function(slider){
        return slider.getValue();
    }
});
/**
 * @class Ext.ux.SliderTipDiv100
 * @extends Ext.ux.SliderTip
 * 数値の表示を1/100になるようにカスタム化
 */
Ext.ux.SliderTipDiv100 = Ext.extend(Ext.ux.SliderTip, {
    getText : function(slider){
        return slider.getValue()/100;
    }
});
extTest2 = new extTest2();
Ext.onReady(extTest2.init, extTest2, true);