//create a namespace object in the example namespace:
var colorpicker_dialog;

YAHOO.namespace("colorpicker")

//create a new object for this module:
YAHOO.colorpicker.inDialog = function() {

	//Some shortcuts to use in our example:
	var Event=YAHOO.util.Event,
		Dom=YAHOO.util.Dom,
		lang=YAHOO.lang;

	return {

		//In our initialization function, we'll create the dialog;
		//in its render event, we'll create our Color Picker instance.
        init: function() {

            // Instantiate the Dialog
            this.dialog = new YAHOO.widget.Dialog("yui-picker-panel", {
				width : "400px",
				close: true,
				fixedcenter : true,
				visible : false,
				constraintoviewport : true,
				buttons : [ { text:"Submit", handler:this.handleSubmit, isDefault:true },
							{ text:"Cancel", handler:this.handleCancel } ]
             });


			// Once the Dialog renders, we want to create our Color Picker
			// instance.
            this.dialog.renderEvent.subscribe(function() {
				if (!this.picker) { //make sure that we haven't already created our Color Picker
					YAHOO.log("Instantiating the color picker", "info", "example");
					this.picker = new YAHOO.widget.ColorPicker("yui-picker", {
						container: this.dialog,
						showhexcontrols: true,
						images: {
							PICKER_THUMB: "/web/yui/colorpicker/assets/picker_thumb.png",
							HUE_THUMB: "/web/yui/colorpicker/assets/hue_thumb.png"
						}
						//Here are some other configurations we could use for our Picker:
						//showcontrols: false,  // default is true, false hides the entire set of controls
						//showhexcontrols: true, // default is false
						//showhsvcontrols: true  // default is false
					});

					//listen to rgbChange to be notified about new values
					this.picker.on("rgbChange", function(o) {
						YAHOO.log(lang.dump(o), "info", "example");
					});
				}
				
			});



			// If we wanted to do form validation on our Dialog, this
			// is where we'd do it.  Remember to return true if validation
			// passes; otherwise, your Dialog's submit method won't submit.
            this.dialog.validate = function() {
				return true;
            };

            // Wire up the success and failure handlers
            this.dialog.callback = { success: this.handleSuccess, thisfailure: this.handleFailure };

            // We're all set up with our Dialog's configurations;
			// now, render the Dialog
            this.dialog.render();
            


			// We can wrap up initialization by wiring all of the buttons in our
			// button dashboard to selectively show and hide parts of the
			// Color Picker interface.  Remember that "Event" here is an
			// alias for YAHOO.util.Event and "Event.on" is therfor a shortcut
			// for YAHOO.util.Event.onAvailable -- the standard Dom event attachment
			// method:

            //Event.on("show", "click", this.dialog.show, this.dialog, true);

      var pickerdialog = this.dialog;

      
      //show font color picker
      Event.on("fontColorArea", "click", function(e)
      {
            var p = this.picker;
            

            //get color
            fontColorValue = $('fontColor').value;

            fc = fontColorValue.split('-');

            //get rgb
            r = parseInt(fc[0]);
            g = parseInt(fc[1]);
            b = parseInt(fc[2]);
            
            //set color
            p.setValue([r, g, b], false);

            //set picker name
            $('yui-picker-dialog-name').value='fontColor';

            pickerdialog.show();
      }, this.dialog, true);
      
      //show border color picker
      Event.on("borderColorArea", "click", function(e)
      {
            var p = this.picker;

            //get color
            fontColorValue = $('borderColor').value;
            fc = fontColorValue.split('-');

            //get rgb
            r = parseInt(fc[0]);
            g = parseInt(fc[1]);
            b = parseInt(fc[2]);

            //set color
            p.setValue([r, g, b], false);

            //set picker name
            $('yui-picker-dialog-name').value='borderColor';

            pickerdialog.show();
      }, this.dialog, true);
      
      //show border color picker
      Event.on("innerBorderColorArea", "click", function(e)
      {
            var p = this.picker;

            //get color
            fontColorValue = $('innerBorderColor').value;
            fc = fontColorValue.split('-');

            //get rgb
            r = parseInt(fc[0]);
            g = parseInt(fc[1]);
            b = parseInt(fc[2]);

            //set color
            p.setValue([r, g, b], false);

            //set picker name
            $('yui-picker-dialog-name').value='innerBorderColor';

            pickerdialog.show();
      }, this.dialog, true);
      
      //show shadow color picker
      Event.on("shadowColorArea", "click", function(e)
      {
            var p = this.picker;

            //get color
            fontColorValue = $('shadowColor').value;
            fc = fontColorValue.split('-');

            //get rgb
            r = parseInt(fc[0]);
            g = parseInt(fc[1]);
            b = parseInt(fc[2]);

            //set color
            p.setValue([r, g, b], false);

            //set picker name
            $('yui-picker-dialog-name').value='shadowColor';

            pickerdialog.show();
      }, this.dialog, true);
      
      
      //show button background color picker
      Event.on("backgroundColorArea", "click", function(e)
      {
            var p = this.picker;

            //get color
            fontColorValue = $('backgroundColor').value;
            fc = fontColorValue.split('-');

            //get rgb
            r = parseInt(fc[0]);
            g = parseInt(fc[1]);
            b = parseInt(fc[2]);

            //set color
            p.setValue([r, g, b], false);

            //set picker name
            $('yui-picker-dialog-name').value='backgroundColor';

            pickerdialog.show();
      }, this.dialog, true);
      
      //show button gradient color picker
      Event.on("gradientColor1Area", "click", function(e)
      {
            var p = this.picker;

            //get color
            fontColorValue = $('gradientColor1').value;
            fc = fontColorValue.split('-');

            //get rgb
            r = parseInt(fc[0]);
            g = parseInt(fc[1]);
            b = parseInt(fc[2]);

            //set color
            p.setValue([r, g, b], false);

            //set picker name
            $('yui-picker-dialog-name').value='gradientColor1';

            pickerdialog.show();
      }, this.dialog, true);
      
      //show button gradient color picker
      Event.on("gradientColor2Area", "click", function(e)
      {
            var p = this.picker;

            //get color
            fontColorValue = $('gradientColor2').value;
            fc = fontColorValue.split('-');

            //get rgb
            r = parseInt(fc[0]);
            g = parseInt(fc[1]);
            b = parseInt(fc[2]);

            //set color
            p.setValue([r, g, b], false);

            //set picker name
            $('yui-picker-dialog-name').value='gradientColor2';

            pickerdialog.show();
      }, this.dialog, true);
      
      //show button gradient color picker
      Event.on("gradientColor3Area", "click", function(e)
      {
            var p = this.picker;

            //get color
            fontColorValue = $('gradientColor3').value;
            fc = fontColorValue.split('-');

            //get rgb
            r = parseInt(fc[0]);
            g = parseInt(fc[1]);
            b = parseInt(fc[2]);

            //set color
            p.setValue([r, g, b], false);

            //set picker name
            $('yui-picker-dialog-name').value='gradientColor3';

            pickerdialog.show();
      }, this.dialog, true);
      
      
      
			//initialization complete:
			YAHOO.log("Example initialization complete.", "info", "example");

		},

		//We'll wire this to our Dialog's submit button:
		handleSubmit: function() {
			//submit the Dialog:
			this.submit();
			//log this step to logger:
			YAHOO.log("Dialog was submitted.", "info", "example");
		},

 		//If the Dialog's cancel button is clicked,
		//this function fires
		handleCancel: function() {
			//the cancel method automatically hides the Dialog:
			this.cancel();
			//log this step to logger:
			YAHOO.log("Dialog was submitted.", "info", "example");
		},

		//We'll use Connection Manager to post our form data to the
		//server; here, we set up our "success" handler.
		handleSuccess: function(o) {

			var response = o.responseText;
			//On Yahoo servers, we may get some page stamping;
			//we can trim off the trailing comment:
			response = response.split("<!")[0];
			
			//alert(response);
			
      pickerDialogName = $('yui-picker-dialog-name').value;
     
      //alert(pickerDialogName);

			switch (pickerDialogName)
      {
        case 'fontColor':
            $('fontColor').value = response;
            updateColorPickerArea('fontColor');
            buttonUpdate(response,'updateFontColor')
          break;
        case 'borderColor':
            $('borderColor').value = response;
            updateColorPickerArea('borderColor');
            buttonUpdate(response,'updateBorderColor')
          break;
        case 'innerBorderColor':
            $('innerBorderColor').value = response;
            updateColorPickerArea('innerBorderColor');
            buttonUpdate(response,'updateInnerBorderColor')
          break;
        case 'shadowColor':
            $('shadowColor').value = response;
            updateColorPickerArea('shadowColor');
            buttonUpdate(response,'updateShadowColor')
          break;
       case 'backgroundColor':
            $('backgroundColor').value = response;
            updateColorPickerArea('backgroundColor');
            buttonUpdate(response,'updateBackgroundColor')
          break;
       case 'gradientColor1':
            $('gradientColor1').value = response;
            updateColorPickerArea('gradientColor1');
            buttonUpdate(response,'updateGradientColor1')
          break;
       case 'gradientColor2':
            $('gradientColor2').value = response;
            updateColorPickerArea('gradientColor2');
            buttonUpdate(response,'updateGradientColor2')
          break;
       case 'gradientColor3':
            $('gradientColor3').value = response;
            updateColorPickerArea('gradientColor3');
            buttonUpdate(response,'updateGradientColor3')
          break;
      }
      
			

		},

		handleFailure: function(o) {
			YAHOO.log("Connection Manager returned results to the handleFailure method.", "error", "example");
			YAHOO.log("Response object:" + lang.dump(o), "error", "example");
		}

	}


}();

//The earliest safe moment to instantiate a Dialog (or any
//Container element is onDOMReady; we'll initialize then:
YAHOO.util.Event.onDOMReady(YAHOO.colorpicker.inDialog.init, YAHOO.colorpicker.inDialog, true);