/** 
    color picker
*/

var gsPicker = new Class({
	initialize: function() {
		this.hasEffectLib = String.prototype.parseColor != null;
	},
	/*  Function: setOptions
    */
	setOptions: function(options){
		this.o = {
			className:         "picker",
      minWidth:          100, 
      minHeight:         20,
      resizable:         false,
      closable:          true,
      minimizable:       true,
      maximizable:       false,
      draggable:         true,
      userData:          null,
    	showEffect:        (this.hasEffectLib ? Fx_.Appear : Element.show),
      hideEffect:        (this.hasEffectLib ? Fx_.Fade : Element.hide),
      showEffectOptions: {},
      hideEffectOptions: {},
      effectOptions:     null,
      parent:            document.body,
      title:             "Color Picker",
      top:               1,
      left:              0,
      onload:            Class.empty,
      width:             380,
      height:            240,
      opacity:           1,
      recenterAuto:      false,
      wiredDrag:         true,
      closeCallback:     null,
      destroyOnClose:    true,
      gridX:             1, 
      gridY:             1
		};
		return Object.extend(this.o, options || {});
	},
	called: function(options){
		this.options = this.setOptions(options);
		if($(this.options.id))return false;
		if(!this.initialised)this.create();
		this._picker.showCenter('',this.options.top,this.options.left);
		this._picker.toFront();
		this.initialised = false;
	},
	create: function(){
		this._picker = new picker("colorPicker",this.options);
		this.initialised = true;
	}
});

var moveSelector = true;
var moveHue = true;
var picker = new Class({
  // Constructor
  // Available parameters : className, title, minWidth, minHeight, maxWidth, maxHeight, width, height, top, left, bottom, right, resizable, zIndex, opacity, recenterAuto, wiredDrag
  //                        hideEffect, showEffect, showEffectOptions, hideEffectOptions, effectOptions, url, draggable, closable, minimizable, maximizable, parent, onload
  //                        add all callbacks (if you do not use an observer)
  //                        onDestroy onStartResize onStartMove onResize onMove onEndResize onEndMove onFocus onBeforeShow onShow onHide onMinimize onMaximize onClose
  
  initialize: function() {
  	this.keepMultiModalWindow = false;
		this.hasEffectLib = String.prototype.parseColor != null;
		this.resizeEffectDuration = 0.4;
		this.color = new color();		
    var id;
    var optionIndex = 0;
    // For backward compatibility like win= new Window("id", {...}) instead of win = new Window({id: "id", ...})
    if (arguments.length > 0) {
      if (typeof arguments[0] == "string" ) {
        id = arguments[0];
        optionIndex = 1;
      }
      else
        id = arguments[0] ? arguments[0].id : null;
    }
    
    // Return if id not specified
    if (!id)return;
		
    if ($(id)){
      //alert("Window " + id + " is already registered in the DOM! Make sure you use setDestroyOnClose() or destroyOnClose: true in the constructor");
		}
		this.options = this.setOptions(this.getDefaultOptions(), arguments[optionIndex]);
		
		
		
		
    if (typeof this.options.top == "undefined" &&  typeof this.options.bottom ==  "undefined") 
      this.options.top = this._round(Math.random()*500, this.options.gridY);
    if (typeof this.options.left == "undefined" &&  typeof this.options.right ==  "undefined") 
      this.options.left = this._round(Math.random()*500, this.options.gridX);

    if (this.options.effectOptions) {
      Object.extend(this.options.hideEffectOptions, this.options.effectOptions);
      Object.extend(this.options.showEffectOptions, this.options.effectOptions);
      if (this.options.showEffect == Element.Appear)
        this.options.showEffectOptions.to = this.options.opacity;
    }
    if (this.hasEffectLib) {
      if (this.options.showEffect == Fx_.Appear)
        this.options.showEffectOptions.to = this.options.opacity;
    
      if (this.options.hideEffect == Fx_.Fade)
        this.options.hideEffectOptions.from = this.options.opacity;
    }
    if (this.options.hideEffect == Element.hide)
      this.options.hideEffect = function(){ this.element.hide(); if (this.options.destroyOnClose) this.destroy(); }.bind(this)
    
    if (this.options.parent != document.body)  
      this.options.parent = $(this.options.parent);
      
 

    this.element = this._createPicker(id);
 
    // Bind event listener
    this.eventMouseDown = this._initDrag.bindAsEventListener(this);
    this.eventMouseUp   = this._endDrag.bindAsEventListener(this);
    this.eventMouseMove = this._updateDrag.bindAsEventListener(this);
    this.eventOnLoad    = this._getWindowBorderSize.bindAsEventListener(this);
    this.eventMouseDownContent = this.toFront.bindAsEventListener(this);
    this.eventResize = this._recenter.bindAsEventListener(this);
 
    this.topbar = $(this.element.id + "_top");
    this.bottombar = $(this.element.id + "_bottom");
    this.content = $(this.element.id + "_content");
    
    Event.observe(this.topbar, "mousedown", this.eventMouseDown);
    Event.observe(this.bottombar, "mousedown", this.eventMouseDown);
    Event.observe(this.content, "mousedown", this.eventMouseDownContent);
    Event.observe(window, "load", this.eventOnLoad);
    Event.observe(window, "resize", this.eventResize);
    Event.observe(window, "scroll", this.eventResize);
    
    
    this._buildContentPicker();
    this.makeDraggable();
    //this.initHue();
    this.initColorRGB();
		this.watchEvents();
    
    if (this.options.draggable)  {
      var that = this;
      this.topbar.addEvent("mousedown", that.eventMouseDown);
      this.topbar.addClass("top_draggable");
      $('1').addEvent("mousedown", that.eventMouseDown);
      $('1').addClass("top_draggable");
      $('2').addEvent("mousedown", that.eventMouseDown);
      $('2').addClass("top_draggable");
     
     	this.bottombar.addEvent("mousedown", that.eventMouseDown);
      this.bottombar.addClass("bottom_draggable");
      $('3').addEvent("mousedown", that.eventMouseDown);
      $('3').addClass("bottom_draggable");
      
    }    
    
    if (this.options.resizable) {
      this.sizer = $(this.element.id + "_sizer");
      Event.observe(this.sizer, "mousedown", this.eventMouseDown);
    }  
    
    this.useLeft = null;
    this.useTop = null;
    if (typeof this.options.left != "undefined") {
      this.element.setStyle('left',parseFloat(this.options.left) + 'px');
      this.useLeft = true;
    }
    else {
      this.element.setStyle('right', parseFloat(this.options.right) + 'px');
      this.useLeft = false;
    }
    
    if (typeof this.options.top != "undefined") {
      this.element.setStyle('top', parseFloat(this.options.top) + 'px');
      this.useTop = true;
    }
    else {
      this.element.setStyle('bottom', parseFloat(this.options.bottom) + 'px');      
      this.useTop = false;
    }
      
    this.storedLocation = null;
    
    this.setOpacity(this.options.opacity);
    if (this.options.zIndex)
      this.setZIndex(this.options.zIndex)

    if (this.options.destroyOnClose)
      this.setDestroyOnClose(true);
		
    this._getWindowBorderSize();
    this.width = this.options.width;
    this.height = this.options.height;
    this.visible = false;
    
    this.constraint = false;
    this.constraintPad = {top: 0, left:0, bottom:0, right:0};
    
    if (this.width && this.height)
      this.setSize(this.options.width, this.options.height);
    this.setTitle(this.options.title)
    Picker.register(this);       
  },
  setOptions: function(defaults, options){
		return Object.extend(defaults, options || {});
	},
	setUpOptions: function(options) {
		Object.extend(this.options, options || {});
	},
  getDefaultOptions: function(){
		return {
			className:         "dialog",
      minWidth:          100, 
      minHeight:         20,
      resizable:         true,
      closable:          true,
      minimizable:       true,
      maximizable:       true,
      draggable:         true,
      userData:          null,
    	showEffect:        (this.hasEffectLib ? Fx_.Appear : Element.show),
      hideEffect:        (this.hasEffectLib ? Fx_.Fade : Element.hide),
      showEffectOptions: {},
      hideEffectOptions: {},
      effectOptions:     null,
      parent:            document.body,
      title:             " ",
      onload:            Class.empty,
      width:             200,
      height:            300,
      opacity:           1,
      recenterAuto:      true,
      wiredDrag:         true,
      closeCallback:     null,
      destroyOnClose:    true,
      gridX:             1, 
      gridY:             1,
      initColor: 				 {r:235,g:152,b:26},
      inputSet: 				null,
      imgSet:           null,
      inputPhoto:				null
		}
	},
  // Destructor
  destroy: function() {
    this._notify("onDestroy");
    Event.stopObserving(this.topbar, "mousedown", this.eventMouseDown);
    Event.stopObserving(this.bottombar, "mousedown", this.eventMouseDown);
    Event.stopObserving(this.content, "mousedown", this.eventMouseDownContent);
    
    Event.stopObserving(window, "load", this.eventOnLoad);
    Event.stopObserving(window, "resize", this.eventResize);
    Event.stopObserving(window, "scroll", this.eventResize);
    
    Event.stopObserving(this.content, "load", this.options.onload);

    if (this._oldParent) {
      var content = this.getContent();
      var originalContent = null;
      for(var i = 0; i < content.childNodes.length; i++) {
        originalContent = content.childNodes[i];
        if (originalContent.nodeType == 1) 
          break;
        originalContent = null;
      }
      if (originalContent)
        this._oldParent.appendChild(originalContent);
      this._oldParent = null;
    }

    if (this.sizer)
        Event.stopObserving(this.sizer, "mousedown", this.eventMouseDown);

    if (this.options.url) 
      this.content.src = null

     if(this.iefix) 
      this.iefix.remove();

    this.element.remove();
    Picker.unregister(this);         
  },
  _buildContentPicker: function(){
		var pick  = "<div id='ddPicker'>";
				pick += "<div id='pickerDiv'>";
			  pick += "<img id='pickerbg' src='js/widgets/gsPicker/picker/pickerbg.png' alt='' />";
			  pick += "<div id='selector'><img src='js/widgets/gsPicker/picker/select.gif' /></div>"; 
				pick += "</div>";
		
			  pick += "<div id='hueBg'>";
			  pick += "<div id='hueThumb'><img src='js/widgets/gsPicker/picker/hline.png' /></div>"; 
				pick += "</div>"; 
		
				pick += "<div id='valdiv'>";
				pick += "<form name='rgbform' onsubmit='return userUpdate()' style='float:left'>";
				pick += "<br />";
				pick += "R <input style='width:30px' name='rval' id='rval' type='text' value='0' size='3' maxlength='3' />";
				pick += "&nbsp;H <input style='width:30px' name='hval' id='hval' type='text' value='0' size='3' maxlength='3' />";
				pick += "<br />";
				pick += "G <input style='width:30px' name='gval' id='gval' type='text' value='0' size='3' maxlength='3' />";
				pick += "&nbsp;S <input style='width:30px' name='gsal' id='sval' type='text' value='0' size='3' maxlength='3' />";
				pick += "<br />";
				pick += "B <input style='width:30px' name='bval' id='bval' type='text' value='0' size='3' maxlength='3' />";
				pick += "&nbsp;V <input style='width:30px' name='vval' id='vval' type='text' value='0' size='3' maxlength='3' />";
				pick += "<br />";
				pick += "<br />";
				pick += "# <input style='width:70px' name='hexval' id='hexval' type='text' value='0' size='6' maxlength='6' />";
				
				pick += "<br />";
				pick += "<span class='pickerftr'><input type='button' value='Valider' id='validate' onmouseover='btover(this)' onmouseout='btout(this)'></span>";		
				pick += "</form>";
				pick += "</div>";
		
				pick += "<div id='swatch'>&nbsp;</div>";
				pick += "</div>";
				
				this.getContent().innerHTML = pick;
				correctPickerPNG_lelen();
				
	},
	makeDraggable: function(){
		var that = this;
		this.h_dragOptions = {
			handle: $('hueThumb'),
			limit:{x:[0,0], y:[0,180]},
			onDrag: function(){
				that.hueUpdate();
			}
		};
		this.hue = this.h_dragOptions.handle;
		
		this.p_dragOptions = {
			handle: $('selector'),
			limit:{x:[0,180], y:[0,180]},
			onDrag: function() {
				that.pickerUpdate();
			}
		};
		this.selector = this.p_dragOptions.handle;
		
		this.hue.makeDraggable(this.h_dragOptions);
		this.selector.makeDraggable(this.p_dragOptions);
		
		this.hueUpdate();
	},
	pickerUpdate: function() {
		this.swatchUpdate();
	},
	initHue: function(){
		var h = 1;
		if (h == 1) { h = 0; }
		
		var a = this.color.hsv2rgb(h, 1, 1);

		$("pickerDiv").style.backgroundColor = "rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";

		this.initSwatch();
		//if(document.all)window.addEvent("load", correctPNG);
	},
	initSwatch: function(){
		var h = 180;
		if (h == 180) { h = 0; }
		$("hval").value = (h*2);

		h = h / 180;
		
		var s = this.selector.offsetLeft / 180;
		$("sval").value = Math.round(s * 100);


		var v = (180 - this.selector.offsetTop) / 180;
		$("vval").value = Math.round(v * 100);


		var a = this.color.hsv2rgb( h, s, v );

	  $("swatch").style.backgroundColor = "rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";

		$("rval").value = a[0];
		$("gval").value = a[1];
		$("bval").value = a[2];
		$("hexval").value = this.color.rgb2hex(a[0], a[1], a[2]);
	},
	hueUpdate: function() {
		var newVal = this.hue.offsetTop;
		var h = (180 - newVal) / 180;
		if (h == 1) { h = 0; }
		
		var a = this.color.hsv2rgb(h, 1, 1);

		$("pickerDiv").style.backgroundColor = "rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";

		this.swatchUpdate();
	},
	swatchUpdate: function() {
		var newVal = this.hue.offsetTop;
		var h = (180 - newVal);
		if (h == 180) { h = 0; }
		$("hval").value = (h*2);

		h = h / 180;
		
		var s = this.selector.offsetLeft / 180;
		$("sval").value = Math.round(s * 100);


		var v = (180 - this.selector.offsetTop) / 180;
		$("vval").value = Math.round(v * 100);


		var a = this.color.hsv2rgb( h, s, v );

	  $("swatch").style.backgroundColor = "rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";

		$("rval").value = a[0];
		$("gval").value = a[1];
		$("bval").value = a[2];
		$("hexval").value = this.color.rgb2hex(a[0], a[1], a[2]);
		moveSelector = true;
		moveHue = true;
	},
	watchEvents: function(){
		var that = this;
		$("pickerDiv").addEvent("mousedown",that.moveSelector.bindAsEventListener(that));
		$("hueBg").addEvent("mousedown",that.moveHue.bindAsEventListener(that));
		
		$("rval").addEvent("keyup",that.swatchColorRGB.bind(that));
		$("gval").addEvent("keyup",that.swatchColorRGB.bind(that));
		$("bval").addEvent("keyup",that.swatchColorRGB.bind(that));
		$("hval").addEvent("keyup",that.swatchColorHSV.bind(that));
		$("sval").addEvent("keyup",that.swatchColorHSV.bind(that));
		$("vval").addEvent("keyup",that.swatchColorHSV.bind(that));
		$("hexval").addEvent("keyup",that.swatchColorHex.bind(that));
		$("validate").addEvent("mousedown",that.validate.bind(that));
	},
	validate: function(evt){
		if(this.options.inputSet != null)this.options.inputSet.value = $("rval").value.toInt()+" "+$("gval").value.toInt()+" "+$("bval").value.toInt();
		if(this.options.imgSet != null)this.options.imgSet.style.backgroundColor = "rgb("+$("rval").value+","+$("gval").value+","+$("bval").value+")";
		if(this.options.inputPhoto != null)this.options.inputPhoto.value = "#"+ $("hexval").value;
		this.close();
	},
	moveSelector: function(evt){
		if(moveSelector){
			var that = this;
			this._selector = new panel(this.selector,{
				duration: 800,
				onComplete: function(){
					that.pickerUpdate();
				}
			});
			var dTop = Math.abs(evt.clientY - $("pickerDiv").getTop());
			var dLeft = Math.abs(evt.clientX - $("pickerDiv").getLeft());
			dTop = (dTop > 180)? 180: dTop;
			dTop = (dTop < 0)? 0: dTop;
			dLeft = (dLeft > 180)? 180: dLeft;
			dLeft = (dLeft < 0)? 0: dLeft;
			this._selector.start(dTop,dLeft);
		}
		moveSelector = false;
		Event.stop(evt);
	},
	moveHue: function(evt){
		if(moveHue){
			var that = this;
			this._hue = new Fx.Style(this.hue,'top',{
				duration: 800,
				onComplete: function(){
					that.hueUpdate();
				}
			});
			var dTop = Math.abs(evt.clientY - $("hueBg").getTop());
			dTop = (dTop > 180)? 180: dTop;
			dTop = (dTop < 0)? 0: dTop;
			this._hue.start(dTop);
		}
		moveHue = false;
		Event.stop(evt);
	},
	swatchColorRGB: function() {
		rval = parseInt($("rval").value);
		gval = parseInt($("gval").value);
		bval = parseInt($("bval").value);
		if (!rval) rval = 0;
		if (!gval) gval = 0;
		if (!bval) bval = 0;
		$('swatch').style.backgroundColor = "rgb("+rval+","+gval+","+bval+")";
		$("hexval").value = this.color.rgb2hex(rval, gval, bval);
		
		var hsv = this.color.rgb2hsv(rval,gval,bval);
		var rgb = [rval,gval,bval];
		$("hval").value = (Math.abs(hsv[0])*180)*2;
		$("sval").value = Math.round(hsv[1] * 100);
		$("vval").value = Math.round(hsv[2] * 100);
    this.updateDisplay(hsv,rgb);
	},
	initColorRGB: function(){
		$("rval").value = this.options.initColor.r;
		$("gval").value = this.options.initColor.g;
		$("bval").value = this.options.initColor.b;
		this.swatchColorRGB();
	},
	swatchColorHSV: function() {
		hval = parseInt($("hval").value);
		sval = parseInt($("sval").value);
		vval = parseInt($("vval").value);
		h = hval/360; if (h == 1) { h = 0; }
		s = sval/100;
		v = vval/100;
		var rgb = this.color.hsv2rgb(h,s,v);
		var hsv = [h,s,v];
		$("rval").value = rgb[0];
		$("gval").value = rgb[1];
		$("bval").value = rgb[2];
		$('swatch').style.backgroundColor = "rgb("+rgb[0]+","+rgb[1]+","+rgb[2]+")";
		$("hexval").value = this.color.rgb2hex(rgb[0], rgb[1], rgb[2]);
		
    this.updateDisplay(hsv,rgb);
	},
	swatchColorHex: function() {
		hexval = $("hexval").value;
		if(!hexval) hexval = "FFFFFF";
		RGBval = this.color.hex2rgb(hexval);
		$("rval").value = RGBval[0];
		$("gval").value = RGBval[1];
		$("bval").value = RGBval[2];
		$('swatch').style.backgroundColor = "rgb("+RGBval[0]+","+RGBval[1]+","+RGBval[2]+")";
		
		var hsv = this.color.rgb2hsv(RGBval[0],RGBval[1],RGBval[2]);
		var rgb = [RGBval[0],RGBval[1],RGBval[2]];
		$("hval").value = (Math.abs(hsv[0])*180)*2;
		$("sval").value = Math.round(hsv[1] * 100);
		$("vval").value = Math.round(hsv[2] * 100);
    this.updateDisplay(hsv,rgb);
	},
	updateDisplay: function (hsv,rgb) {
		h = (Math.abs(hsv[0])*180);
		if(h == 0){ h = 180}
    // Markers
    var dTop = 180 - h;
		dTop = (dTop > 180)? 0: dTop;
		dTop = (dTop < 0)? 0: dTop;
		
		this._hue = new Fx.Style(this.hue,'top',{
			duration: 800
		});
		
		this._hue.start(dTop);
    //this.hue.setStyle('top',  dTop + 'px');
    
		var dLeft = hsv[1]*180;
		dLeft = (dLeft > 180)? 180: dLeft;
		dLeft = (dLeft < 0)? 0: dLeft;
		
		var dTop = 180 - (hsv[2]*180);
		dTop = (dTop > 180)? 180: dTop;
		dTop = (dTop < 0)? 0: dTop;
		//alert(dLeft);
		this._selector = new panel(this.selector,{
			duration: 500
		});
    this._selector.start(dTop,dLeft);
    /*this.selector.setStyle('left',  dLeft + 'px');
    this.selector.setStyle('top',  dTop + 'px');*/
		$("pickerDiv").style.backgroundColor = "rgb(" + rgb[0] + ", " + rgb[1] + ", " + rgb[2] + ")";
  },
    
  // Sets close callback, if it sets, it should return true to be able to close the window.
  setCloseCallback: function(callback) {
    this.options.closeCallback = callback;
  },
  
  // Gets window content
  getContent: function () {
    return this.content;
  },
  
  // Sets the content with an element id
  setContent: function(id, autoresize, autoposition) {
    var element = $(id);
    if (null == element) throw "Unable to find element '" + id + "' in DOM";
    this._oldParent = element.parentNode;

    var d = null;
    var p = null;

    if (autoresize) 
      d = Element.getDimensions(element);
    if (autoposition) 
      p = Position.cumulativeOffset(element);

    var content = this.getContent();
    // Clear HTML (and even iframe)
    this.setHTMLContent("");
    content = this.getContent();
    
    content.appendChild(element);
    element.show();
    if (autoresize) 
      this.setSize(d.width, d.height);
    if (autoposition) 
      this.setLocation(p[1] - this.heightN, p[0] - this.widthW);    
  },
  
  setHTMLContent: function(html) {
    // It was an url (iframe), recreate a div content instead of iframe content
    if (this.options.url) {
      this.content.src = null;
      this.options.url = null;
      
  	  var content ="<div id=\"" + this.getId() + "_content\" class=\"" + this.options.className + "_content\"> </div>";
      $(this.getId() +"_table_content").innerHTML = content;
      
      this.content = $(this.element.id + "_content");
    }
      
    this.getContent().innerHTML = html;
  },
  
  setAjaxContent: function(url, options, showCentered, showModal) {
    this.showFunction = showCentered ? "showCenter" : "show";
    this.showModal = showModal || false;
  
    options = options || {};

    // Clear HTML (and even iframe)
    this.setHTMLContent("");
 
    this.onComplete = options.onComplete;
    if (! this._onCompleteHandler)
      this._onCompleteHandler = this._setAjaxContent.bind(this);
    options.onComplete = this._onCompleteHandler;

    //new Ajax.Request(url, options);    
    new Ajax(url,options).request();
    options.onComplete = this.onComplete;
  },
  
  _setAjaxContent: function(originalRequest) {
    var resp = ($type(originalRequest) == 'string')? originalRequest: originalRequest.responseText;
    this.getContent().update(resp);
    if (this.onComplete)
      this.onComplete(originalRequest);
    this.onComplete = null;
    this[this.showFunction](this.showModal)
  },
  
  setURL: function(url) {
    // Not an url content, change div to iframe
    if (this.options.url) 
      this.content.src = null;
    this.options.url = url;
    var content= "<iframe frameborder='0' name='" + this.getId() + "_content'  id='" + this.getId() + "_content' src='" + url + "' width='" + this.width + "' height='" + this.height + "'> </iframe>";
    $(this.getId() +"_table_content").innerHTML = content;
    
    this.content = $(this.element.id + "_content");
  },

  getURL: function() {
  	return this.options.url ? this.options.url : null;
  },

  refresh: function() {
    if (this.options.url)
	    $(this.element.getAttribute('id') + '_content').src = this.options.url;
  },
  
  // Stores position/size in a cookie, by default named with window id
  setCookie: function(name, expires, path, domain, secure) {
    name = name || this.element.id;
    this.cookie = [name, expires, path, domain, secure];
    
    // Get cookie
    var value = PickerUtilities.getCookie(name)
    // If exists
    if (value) {
      var values = value.split(',');
      var x = values[0].split(':');
      var y = values[1].split(':');

      var w = parseFloat(values[2]), h = parseFloat(values[3]);
      var mini = values[4];
      var maxi = values[5];

      this.setSize(w, h);
      if (mini == "true")
        this.doMinimize = true; // Minimize will be done at onload window event
      else if (maxi == "true")
        this.doMaximize = true; // Maximize will be done at onload window event

      this.useLeft = x[0] == "l";
      this.useTop = y[0] == "t";
			
			if(this.useLeft){
      	this.element.setStyle('left',x[1]);
      }else{
      	this.element.setStyle('right', x[1]);
      }
      if(this.useTop){
      	this.element.setStyle('top',y[1]);
      }else{
      	this.element.setStyle('bottom',y[1]);
      }
    }
  },
  
  // Gets window ID
  getId: function() {
    return this.element.id;
  },
  
  // Detroys itself when closing 
  setDestroyOnClose: function() {
    this.options.destroyOnClose = true;
  },
  
  setConstraint: function(bool, padding) {
    this.constraint = bool;
    this.constraintPad = Object.extend(this.constraintPad, padding || {});
    // Reset location to apply constraint
    if (this.useTop && this.useLeft)
      this.setLocation(parseFloat(this.element.style.top), parseFloat(this.element.style.left));
  },
  
  // initDrag event

  _initDrag: function(event) {
    // No resize on minimized window
    if (Event.element(event) == this.sizer && this.isMinimized())
      return;

    // No move on maximzed window
    if (Event.element(event) != this.sizer && this.isMaximized())
      return;
      
    if (window.ie && this.heightN == 0)
      this._getWindowBorderSize();
    
    // Get pointer X,Y
    this.pointer = [this._round(Event.pointerX(event), this.options.gridX), this._round(Event.pointerY(event), this.options.gridY)];
    if (this.options.wiredDrag) 
      this.currentDrag = this._createWiredElement();
    else
      this.currentDrag = this.element;
      
    // Resize
    if (Event.element(event) == this.sizer) {
      this.doResize = true;
      this.widthOrg = this.width;
      this.heightOrg = this.height;
      this.bottomOrg = parseFloat(this.element.getStyle('bottom'));
      this.rightOrg = parseFloat(this.element.getStyle('right'));
      this._notify("onStartResize");
    }
    else {
      this.doResize = false;

      // Check if click on close button, 
      var closeButton = $(this.getId() + '_close');
      if (closeButton && Position.within(closeButton, this.pointer[0], this.pointer[1])) {
        this.currentDrag = null;
        return;
      }

      this.toFront();

      if (! this.options.draggable) 
        return;
      this._notify("onStartMove");
    }    
    // Register global event to capture mouseUp and mouseMove
    Event.observe(document, "mouseup", this.eventMouseUp, false);
    Event.observe(document, "mousemove", this.eventMouseMove, false);
    
    // Add an invisible div to keep catching mouse event over iframes
    PickerUtilities.disableScreen('__invisible__', '__invisible__', this.overlayOpacity);

    // Stop selection while dragging
    document.body.ondrag = function () { return false; };
    document.body.onselectstart = function () { return false; };
    
    this.currentDrag.show();
    Event.stop(event);
  },
  
  _round: function(val, round) {
    return round == 1 ? val  : val = Math.floor(val / round) * round;
  },

  // updateDrag event
  _updateDrag: function(event) {
    var pointer =  [this._round(Event.pointerX(event), this.options.gridX), this._round(Event.pointerY(event), this.options.gridY)];  
    var dx = pointer[0] - this.pointer[0];
    var dy = pointer[1] - this.pointer[1];
    
    // Resize case, update width/height
    if (this.doResize) {
      var w = this.widthOrg + dx;
      var h = this.heightOrg + dy;
      
      dx = this.width - this.widthOrg
      dy = this.height - this.heightOrg
      
      // Check if it's a right position, update it to keep upper-left corner at the same position
      if (this.useLeft) 
        w = this._updateWidthConstraint(w)
      else 
        this.currentDrag.setStyle('right',(this.rightOrg -dx) + 'px');
      // Check if it's a bottom position, update it to keep upper-left corner at the same position
      if (this.useTop) 
        h = this._updateHeightConstraint(h)
      else
        this.currentDrag.setStyle('bottom',(this.bottomOrg -dy) + 'px');
        
      this.setSize(w , h);
      this._notify("onResize");
    }
    // Move case, update top/left
    else {
      this.pointer = pointer;
      
      if (this.useLeft) {
        var left =  parseFloat(this.currentDrag.getStyle('left')) + dx;
        var newLeft = this._updateLeftConstraint(left);
        // Keep mouse pointer correct
        this.pointer[0] += newLeft-left;
        this.currentDrag.setStyle('left', newLeft + 'px');
      }
      else 
        this.currentDrag.setStyle('right',parseFloat(this.currentDrag.getStyle('right')) - dx + 'px');
      
      if (this.useTop) {
        var top =  parseFloat(this.currentDrag.getStyle('top')) + dy;
        var newTop = this._updateTopConstraint(top);
        // Keep mouse pointer correct
        this.pointer[1] += newTop - top;
        this.currentDrag.setStyle('top', newTop + 'px');
      }
      else 
        this.currentDrag.setStyle('bottom',parseFloat(this.currentDrag.getStyle('bottom')) - dy + 'px');

      this._notify("onMove");
    }
    if (this.iefix) 
      this._fixIEOverlapping(); 
      
    this._removeStoreLocation();
    Event.stop(event);
  },

   // endDrag callback
   _endDrag: function(event) {
    // Remove temporary div over iframes
     PickerUtilities.enableScreen('__invisible__');
    
    if (this.doResize)
      this._notify("onEndResize");
    else
      this._notify("onEndMove");
    
    // Release event observing
    Event.stopObserving(document, "mouseup", this.eventMouseUp,false);
    Event.stopObserving(document, "mousemove", this.eventMouseMove, false);

    Event.stop(event);
    
    this._hideWiredElement();

    // Store new location/size if need be
    this._saveCookie()
      
    // Restore selection
    document.body.ondrag = null;
    document.body.onselectstart = null;
  },

  _updateLeftConstraint: function(left) {
    if (this.constraint && this.useLeft && this.useTop) {
      var width = this.options.parent == document.body ? PickerUtilities.getPageSize().windowWidth : this.options.parent.getDimensions().width;

      if (left < this.constraintPad.left)
        left = this.constraintPad.left;
      if (left + this.width + this.widthE + this.widthW > width - this.constraintPad.right) 
        left = width - this.constraintPad.right - this.width - this.widthE - this.widthW;
    }
    return left;
  },
  
  _updateTopConstraint: function(top) {
    if (this.constraint && this.useLeft && this.useTop) {        
      var height = this.options.parent == document.body ? PickerUtilities.getPageSize().windowHeight : this.options.parent.getDimensions().height;
      
      var h = this.height + this.heightN + this.heightS;

      if (top < this.constraintPad.top)
        top = this.constraintPad.top;
      if (top + h > height - this.constraintPad.bottom) 
        top = height - this.constraintPad.bottom - h;
    }
    return top;
  },
  
  _updateWidthConstraint: function(w) {
    if (this.constraint && this.useLeft && this.useTop) {
      var width = this.options.parent == document.body ? PickerUtilities.getPageSize().windowWidth : this.options.parent.getDimensions().width;
      var left =  parseFloat(this.element.getStyle("left"));

      if (left + w + this.widthE + this.widthW > width - this.constraintPad.right) 
        w = width - this.constraintPad.right - left - this.widthE - this.widthW;
    }
    return w;
  },
  
  _updateHeightConstraint: function(h) {
    if (this.constraint && this.useLeft && this.useTop) {
      var height = this.options.parent == document.body ? PickerUtilities.getPageSize().windowHeight : this.options.parent.getDimensions().height;
      var top =  parseFloat(this.element.getStyle("top"));

      if (top + h + this.heightN + this.heightS > height - this.constraintPad.bottom) 
        h = height - this.constraintPad.bottom - top - this.heightN - this.heightS;
    }
    return h;
  },
  
  
  // Creates HTML window code
  _createPicker: function(id) {
    var className = this.options.className;
    var el = new Element('div');
    el.setProperty('id', id);
    el.toggleClass(className);

    var content;
    if (this.options.url)
      content= "<iframe frameborder=\"0\" name=\"" + id + "_content\"  id=\"" + id + "_content\" src=\"" + this.options.url + "\"> </iframe>";
    else
      content ="<div id=\"" + id + "_content\" class=\"" +className + "_content\"> </div>";

    var closeDiv = this.options.closable ? "<div class='"+ className +"_close' id='"+ id +"_close' onmouseover='btover(this)' onmouseout='btout(this)' onclick='Picker.close(\""+ id +"\", event)'> </div>" : "";
    var minDiv = this.options.minimizable ? "<div class='"+ className + "_minimize' id='"+ id +"_minimize' onmouseover='btover(this)' onmouseout='btout(this)' onclick='Picker.minimize(\""+ id +"\", event)'> </div>" : "";
    var seAttributes = this.options.resizable ? "class='" + className + "_sizer' id='" + id + "_sizer'" : "class='"  + className + "_se'";
    var blank = "../themes/default/blank.gif";
     
    this.innerW  = closeDiv + minDiv ;
    this.innerW += "<table id='"+ id +"_row1' class=\"top table_window\">";
    this.innerW += "<tr>";
    this.innerW += "<td class='"+ className +"_nw' id='1'>&nbsp;</td>";
    this.innerW += "<td class='"+ className +"_n'><div id='"+ id +"_top' class='"+ className +"_title title_window'>"+ this.options.title +"</div></td>";
    this.innerW += "<td class='"+ className +"_ne' id='2'>&nbsp;</td>";
    this.innerW += "</tr>";
    this.innerW += "</table>";
    this.innerW += "<table id='"+ id +"_row2' class=\"mid table_window\" cellpadding='0' cellspacing='0'>";
    this.innerW += "<tr>";
    this.innerW += "<td class='"+ className +"_w'></td>";
    this.innerW += "<td id='"+ id +"_table_content' class='"+ className +"_content' valign='top'>" + content + "</td>";
    this.innerW += "<td class='"+ className +"_e'></td>";
    this.innerW += "</tr>";
    this.innerW += "</table>";
    this.innerW += "<table id='"+ id +"_row3' class=\"bot table_window\">";
    this.innerW += "<tr>";
    this.innerW += "<td class='"+ className +"_sw' id='3'></td>";
    this.innerW += "<td class='"+ className +"_s'><div id='"+ id +"_bottom' class='status_bar'><span style='float:left; width:1px; height:1px'></span></div></td>";
   	this.innerW += "<td " + seAttributes + "></td>";
    this.innerW += "</tr>";
    this.innerW += "</table>";
		    
    el.setHTML(this.innerW);   
    el.hide();
    this.options.parent.insertBefore(el, this.options.parent.firstChild);
    $(id + "_content").addEvent("load",this.options.onload);
    
    return el;
  },
  
  
  changeClassName: function(newClassName) {
    var className = this.options.className;
    var id = this.getId();
    var win = this;
    $A(["_close","_minimize","_maximize","_sizer", "_content"]).each(function(value) { win._toggleClassName($(id + value), className + value, newClassName + value) });
    $$("#" + id + " td").each(function(td) {td.className = td.className.sub(className,newClassName) });
    this.options.className = newClassName;
  },
  
  _toggleClassName: function(element, oldClassName, newClassName) {
    if (element) {
      element.removeClassName(oldClassName);
      element.addClassName(newClassName);
    }
  },
  
  // Sets window location
  setLocation: function(top, left) {
    top = this._updateTopConstraint(top);
    left = this._updateLeftConstraint(left);

    var e = this.currentDrag || this.element;
    e.setStyle('top', top + 'px');
    e.setStyle('left', left + 'px');

    this.useLeft = true;
    this.useTop = true;
  },
    
  getLocation: function() {
    var location = {};
    if (this.useTop)
      location = Object.extend(location, {top: this.element.getStyle("top")});
    else
      location = Object.extend(location, {bottom: this.element.getStyle("bottom")});
    if (this.useLeft)
      location = Object.extend(location, {left: this.element.getStyle("left")});
    else
      location = Object.extend(location, {right: this.element.getStyle("right")});
    
    return location;
  },
  
  // Gets window size
  getSize: function() {
    return {width: this.width, height: this.height};
  },
    
  // Sets window size
  setSize: function(width, height, useEffect) {    
    width = parseFloat(width);
    height = parseFloat(height);
    
    // Check min and max size
    if (!this.minimized && width < this.options.minWidth)
      width = this.options.minWidth;

    if (!this.minimized && height < this.options.minHeight)
      height = this.options.minHeight;
      
    if (this.options. maxHeight && height > this.options. maxHeight)
      height = this.options. maxHeight;

    if (this.options. maxWidth && width > this.options. maxWidth)
      width = this.options. maxWidth;

    
    if (this.useTop && this.useLeft && this.hasEffectLib && Fx_.ResizeWindow && useEffect) {
      new Fx_.ResizeWindow(this, null, null, width, height, {duration: this.resizeEffectDuration});
    } else {
      this.width = width;
      this.height = height;
      var e = this.currentDrag ? this.currentDrag : this.element;

      e.setStyle('width', width + this.widthW + this.widthE + "px")
      e.setStyle('height', height  + this.heightN + this.heightS + "px")

      // Update content size
      if (!this.currentDrag || this.currentDrag == this.element) {
        var content = $(this.element.id + '_content');
        content.setStyle('height', height  + 'px');
        //content.setStyle('width', width  + 'px');
        content.setStyle('width', (width-4)  + 'px');
      }
    }
  },
  
  updateHeight: function() {
    this.setSize(this.width, this.content.scrollHeight, true);
  },
  
  updateWidth: function() {
    this.setSize(this.content.scrollWidth, this.height, true);
  },
  
  // Brings window to front
  toFront: function() {
    if (this.element.style.zIndex < Picker.maxZIndex)  
      this.setZIndex(Picker.maxZIndex + 1);
    this._notify("onFocus");
    if (this.iefix) 
      this._fixIEOverlapping(); 
  },
  
  // Displays window modal state or not
  show: function(modal) {
    if (modal) {
      // Hack for Safar!!
      if (typeof this.overlayOpacity == "undefined") {
        var that= this;
        setTimeout(function() {that.show(modal)}, 10);
        return;
      }
      Picker.addModalWindow(this);
      
      this.modal = true;      
      this.setZIndex(Picker.maxZIndex + 1);
      Picker.unsetOverflow(this);
    }
    else
      if (!this.element.style.zIndex) 
        this.setZIndex(Picker.maxZIndex++ + 1);        
      
    // To restore overflow if need be
    if (this.oldStyle)
      this.getContent().setStyle('overflow', this.oldStyle);
      
    if (! this.width || !this.height) {
      var size = PickerUtilities._computeSize(this.content.innerHTML, this.content.id, this.width, this.height, 0, this.options.className)
      if (this.height)
        this.width = size + 5
      else
        this.height = size + 5
    }

    this.setSize(this.width, this.height);
    if (this.centered)
      this._center(this.centerTop, this.centerLeft);    
    
    this._notify("onBeforeShow");   
    if (this.options.showEffect != Element.show && this.options.showEffectOptions)
      this.options.showEffect(this.element, this.options.showEffectOptions);  
    else
      //this.options.showEffect(this.element);  
      this.element.show();
      
    this._checkIEOverlapping();
    this.visible = true;
    PickerUtilities.focusedWindow = this
    this._notify("onShow");
  },
  
  // Displays window modal state or not at the center of the page
  showCenter: function(modal, top, left) {
    this.centered = true;
    this.centerTop = top;
    this.centerLeft = left;

    this.show(modal);
  },
  
  isVisible: function() {
    return this.visible;
  },
  
  _center: function(top, left) {
    var windowScroll = PickerUtilities.getWindowScroll();    
    var pageSize = PickerUtilities.getPageSize();    

    if (typeof top == "undefined")
      top = (pageSize.windowHeight - (this.height + this.heightN + this.heightS))/2;
    top += windowScroll.top
    
    if (typeof left == "undefined")
      left = (pageSize.windowWidth - (this.width + this.widthW + this.widthE))/2;
    left += windowScroll.left 
    
    this.setLocation(top, left);
    this.toFront();
  },
  
  _recenter: function(event) {
    if (this.centered) {
      var pageSize = PickerUtilities.getPageSize();

      // Check for this stupid IE that sends dumb events
      if (this.pageSize && this.pageSize.windowWidth == pageSize.windowWidth && this.pageSize.windowHeight == pageSize.windowHeight) 
        return;
      this.pageSize = pageSize;

      // set height of Overlay to take up whole page and show
      if ($('overlay_modal')) 
        $('overlay_modal').setStyle('height', (pageSize.pageHeight + 'px'));
      
      if (this.options.recenterAuto)
        this._center(this.centerTop, this.centerLeft);    
    }
  },
  
  // Hides window
  hide: function() {
     this.visible = false;
    if (this.modal) {
      Picker.removeModalWindow(this);
      Picker.resetOverflow();
    }
    // To avoid bug on scrolling bar
    this.oldStyle = this.getContent().getStyle('overflow') || "auto"
    this.getContent().setStyle('overflow',"hidden");

    this.options.hideEffect(this.element, this.options.hideEffectOptions);  

     if(this.iefix) 
      this.iefix.hide();

    if (!this.doNotNotifyHide)
      this._notify("onHide");
  },

  close: function() {
    // Asks closeCallback if exists
    if (this.visible) {
      if (this.options.closeCallback && ! this.options.closeCallback(this)) 
        return;

      if (this.options.destroyOnClose) {
        var destroyFunc = this.destroy.bind(this);
        if (this.options.hideEffectOptions.afterFinish) {
          var func = this.options.hideEffectOptions.afterFinish;
          this.options.hideEffectOptions.afterFinish = function() {func();destroyFunc() }
        }
        else 
          this.options.hideEffectOptions.afterFinish = function() {destroyFunc() }
      }
      Picker.updateFocusedWindow();
      
      this.doNotNotifyHide = true;
      this.hide();
      this.doNotNotifyHide = false;
      this._notify("onClose");
    }
  },
  
  minimize: function() {
    if (this.resizing)
      return;
    
    var r2 = $(this.getId() + "_row2");
    
    if (!this.minimized) {
      this.minimized = true;
      
    	if(!document.all)$('ddPicker').hide();
      var dh = r2.getDimensions().height;
      this.r2Height = dh;
      var h  = this.element.getHeight() - dh;

      if (this.useLeft && this.useTop && this.hasEffectLib && Fx_.ResizeWindow) {
        new Fx_.ResizeWindow(this, null, null, null, this.height -dh, {duration: this.resizeEffectDuration});
      } else  {
        this.height -= dh;
        this.element.setStyle('height', h + "px");
        r2.hide();
      }

      if (! this.useTop) {
        var bottom = parseFloat(this.element.getStyle('bottom'));
        this.element.setStyle('bottom', (bottom + dh) + 'px');
      }
    } 
    else {
      this.minimized = false;
      
      if(!document.all)$('ddPicker').show();
      var dh = this.r2Height;
      this.r2Height = null;
      if (this.useLeft && this.useTop && this.hasEffectLib && Fx_.ResizeWindow) {
        new Fx_.ResizeWindow(this, null, null, null, this.height + dh, {duration: this.resizeEffectDuration});
      }
      else {
        var h  = this.element.getHeight() + dh;
        this.height += dh;
        this.element.setStyle('height', h + "px")
        r2.show();
      }
      if (! this.useTop) {
        var bottom = parseFloat(this.element.getStyle('bottom'));
        this.element.setStyle('bottom', (bottom - dh) + 'px');
      }
      this.toFront();
    }
    this._notify("onMinimize");
    
    // Store new location/size if need be
    this._saveCookie()
  },
  
  maximize: function() {
    if (this.isMinimized() || this.resizing)
      return;
  
    if (window.ie && this.heightN == 0)
      this._getWindowBorderSize();
      
    if (this.storedLocation != null) {
      this._restoreLocation();
      if(this.iefix) 
        this.iefix.hide();
    }
    else {
      this._storeLocation();
      Picker.unsetOverflow(this);
      
      var windowScroll = PickerUtilities.getWindowScroll();
      var pageSize = PickerUtilities.getPageSize();    
      var left = windowScroll.left;
      var top = windowScroll.top;
      
      if (this.options.parent != document.body) {
        windowScroll =  {top:0, left:0, bottom:0, right:0};
        var dim = this.options.parent.getDimensions();
        pageSize.windowWidth = dim.width;
        pageSize.windowHeight = dim.height;
        top = 0; 
        left = 0;
      }
      
      if (this.constraint) {
        pageSize.windowWidth -= Math.max(0, this.constraintPad.left) + Math.max(0, this.constraintPad.right);
        pageSize.windowHeight -= Math.max(0, this.constraintPad.top) + Math.max(0, this.constraintPad.bottom);
        left +=  Math.max(0, this.constraintPad.left);
        top +=  Math.max(0, this.constraintPad.top);
      }
      
      var width = pageSize.windowWidth - this.widthW - this.widthE;
      var height= pageSize.windowHeight - this.heightN - this.heightS;

      if (this.useLeft && this.useTop && this.hasEffectLib && Fx_.ResizeWindow) {
        new Fx_.ResizeWindow(this, top, left, width, height, {duration: this.resizeEffectDuration});
      }
      else {
         this.setSize(width, height);
        if(this.useLeft)
        this.element.setStyle('left', left);
        else this.element.setStyle('right',left);
        if(this.useTop)	
        this.element.setStyle('top',top);
        else this.element.setStyle('bottom',top);
      }
        
      this.toFront();
      if (this.iefix) 
        this._fixIEOverlapping(); 
    }
    this._notify("onMaximize");

    // Store new location/size if need be
    this._saveCookie()
  },
  
  isMinimized: function() {
    return this.minimized;
  },
  
  isMaximized: function() {
    return (this.storedLocation != null);
  },
  
  setOpacity: function(opacity) {
    /*if (Element.setOpacity)
      Element.setOpacity(this.element, opacity);*/
  },
  
  setZIndex: function(zindex) {
    this.element.setStyle('zIndex', zindex);
    Picker.updateZindex(zindex, this);
  },

  setTitle: function(newTitle) {
    if (!newTitle || newTitle == "") 
      newTitle = "&nbsp;";
      
    $(this.element.id + '_top').update(newTitle);
  },

  setStatusBar: function(element) {
    var statusBar = $(this.getId() + "_bottom");

    if (typeof(element) == "object") {
      if (this.bottombar.firstChild)
        this.bottombar.replaceChild(element, this.bottombar.firstChild);
      else
        this.bottombar.appendChild(element);
    }
    else
      this.bottombar.innerHTML = element;
  },

  _checkIEOverlapping: function() {
    if(!this.iefix && (navigator.appVersion.indexOf('MSIE')>0) && (navigator.userAgent.indexOf('Opera')<0) && (this.element.getStyle('position')=='absolute')) {
        new Insertion.After(this.element.id, '<iframe id="' + this.element.id + '_iefix" '+ 'style="display:none;position:absolute;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);" ' + 'src="javascript:false;" frameborder="0" scrolling="no"></iframe>');
        this.iefix = $(this.element.id+'_iefix');
    }
    if(this.iefix) 
      setTimeout(this._fixIEOverlapping.bind(this), 50);
  },

  _fixIEOverlapping: function() {
      Position.clone(this.element, this.iefix);
      this.iefix.style.zIndex = this.element.style.zIndex - 1;
      this.iefix.show();
  },
  
  _getWindowBorderSize: function(event) {
    // Hack to get real window border size!!
    var div = this._createHiddenDiv(this.options.className + "_n");
    this.heightN = div.offsetHeight;    
    div.parentNode.removeChild(div);

    var div = this._createHiddenDiv(this.options.className + "_s");
    this.heightS = div.offsetHeight;    
    div.parentNode.removeChild(div);
    
    var div = this._createHiddenDiv(this.options.className + "_e");
    this.widthE = div.offsetWidth;    
    div.parentNode.removeChild(div);

    var div = this._createHiddenDiv(this.options.className + "_w");
    this.widthW = div.offsetWidth;
    div.parentNode.removeChild(div);
    
    var div = document.createElement("div");
    div.className = "overlay_" + this.options.className ;
    document.body.appendChild(div);
    //alert("no timeout:\nopacity: " + div.getStyle("opacity") + "\nwidth: " + document.defaultView.getComputedStyle(div, null).width);
    var that = this;
    
    // Workaround for Safari!!
    setTimeout(function() {that.overlayOpacity = ($(div).getStyle("opacity")); div.parentNode.removeChild(div);}, 10);
    
    // Workaround for IE!!
    if (window.ie) {
      this.heightS = $(this.getId() +"_row3").offsetHeight;
      this.heightN = $(this.getId() +"_row1").offsetHeight;
    }

    // Safari size fix
    if (window.khtml && !window.webkit)
      this.setSize(this.width, this.height);
    if (this.doMaximize)
      this.maximize();
    if (this.doMinimize)
      this.minimize();
  },
 
  _createHiddenDiv: function(className) {
    var objBody = document.body;
    var win = document.createElement("div");
    win.setAttribute('id', this.element.id+ "_tmp");
    win.className = className;
    win.style.display = 'none';
    win.innerHTML = '';
    objBody.insertBefore(win, objBody.firstChild);
    return win;
  },
  
  _storeLocation: function() {
    if (this.storedLocation == null) {
      this.storedLocation = {useTop: this.useTop, useLeft: this.useLeft, 
                             top: this.element.getStyle('top'), bottom: this.element.getStyle('bottom'),
                             left: this.element.getStyle('left'), right: this.element.getStyle('right'),
                             width: this.width, height: this.height };
    }
  },
  
  _restoreLocation: function() {
    if (this.storedLocation != null) {
      this.useLeft = this.storedLocation.useLeft;
      this.useTop = this.storedLocation.useTop;
      
      if (this.useLeft && this.useTop && this.hasEffectLib && Fx_.ResizeWindow)
        new Fx_.ResizeWindow(this, this.storedLocation.top, this.storedLocation.left, this.storedLocation.width, this.storedLocation.height, {duration: this.resizeEffectDuration});
      else {
        if(this.useLeft)this.element.setStyle('left', this.storedLocation.left);else this.element.setStyle('right', this.storedLocation.right);
        if(this.useTop)this.element.setStyle('top', this.storedLocation.top);else this.element.setStyle('bottom', this.storedLocation.bottom);
        this.setSize(this.storedLocation.width, this.storedLocation.height);
      }
      
      Picker.resetOverflow();
      this._removeStoreLocation();
    }
  },
  
  _removeStoreLocation: function() {
    this.storedLocation = null;
  },
  
  _saveCookie: function() {
    if (this.cookie) {
      var value = "";
      if (this.useLeft)
        value += "l:" +  (this.storedLocation ? this.storedLocation.left : this.element.getStyle('left'))
      else
        value += "r:" + (this.storedLocation ? this.storedLocation.right : this.element.getStyle('right'))
      if (this.useTop)
        value += ",t:" + (this.storedLocation ? this.storedLocation.top : this.element.getStyle('top'))
      else
        value += ",b:" + (this.storedLocation ? this.storedLocation.bottom :this.element.getStyle('bottom'))
        
      value += "," + (this.storedLocation ? this.storedLocation.width : this.width);
      value += "," + (this.storedLocation ? this.storedLocation.height : this.height);
      value += "," + this.isMinimized();
      value += "," + this.isMaximized();
      PickerUtilities.setCookie(value, this.cookie)
    }
  },
  
  _createWiredElement: function() {
    if (! this.wiredElement) {
      if (window.ie)
        this._getWindowBorderSize();
      var div = document.createElement("div");
      div.className = "wired_frame " + this.options.className + "_wired_frame";
      
      div.style.position = 'absolute';
      this.options.parent.insertBefore(div, this.options.parent.firstChild);
      this.wiredElement = $(div);
    }
    if (this.useLeft) 
      this.wiredElement.setStyle('left', this.element.getStyle('left'));
    else 
      this.wiredElement.setStyle('right', this.element.getStyle('right'));
      
    if (this.useTop) 
      this.wiredElement.setStyle('top', this.element.getStyle('top'));
    else 
      this.wiredElement.setStyle('bottom', this.element.getStyle('bottom'));

    var dim = this.element.getDimensions();
    this.wiredElement.setStyle('width',dim.width + "px");
    this.wiredElement.setStyle('height',dim.height +"px");

    this.wiredElement.setStyle('zIndex', Picker.maxZIndex+30);
    return this.wiredElement;
  },
  
  _hideWiredElement: function() {
    if (! this.wiredElement || ! this.currentDrag)
      return;
    if (this.currentDrag == this.element) 
      this.currentDrag = null;
    else {
      if (this.useLeft) 
        this.element.setStyle('left', this.currentDrag.getStyle('left'));
      else 
        this.element.setStyle('right', this.currentDrag.getStyle('right'));

      if (this.useTop) 
        this.element.setStyle('top', this.currentDrag.getStyle('top'));
      else 
        this.element.setStyle('bottom', this.currentDrag.getStyle('bottom'));

      this.currentDrag.hide();
      this.currentDrag = null;
      if (this.doResize)
        this.setSize(this.width, this.height);
    } 
  },
  
  _notify: function(eventName) {
    if (this.options[eventName])
      this.options[eventName](this);
    else
      Picker.notify(eventName, this);
  }
});

// Windows containers, register all page windows
var Picker = {
  windows: [],
  modalWindows: [],
  observers: [],
  focusedWindow: null,
  maxZIndex: 0,
  overlayShowEffectOptions: {duration: 0.5},
  overlayHideEffectOptions: {duration: 0.5},

  addObserver: function(observer) {
    this.removeObserver(observer);
    this.observers.push(observer);
  },
  
  removeObserver: function(observer) {  
    this.observers = this.observers.reject( function(o) { return o==observer });
  },
  
  //  onDestroy onStartResize onStartMove onResize onMove onEndResize onEndMove onFocus onBeforeShow onShow onHide onMinimize onMaximize onClose
  notify: function(eventName, win) {  
    this.observers.each( function(o) {if(o[eventName]) o[eventName](eventName, win);});
  },

  // Gets window from its id
  getWindow: function(id) {
    return this.windows.detect(function(d) { return d.getId() ==id });
  },

  // Gets the last focused window
  getFocusedWindow: function() {
    return this.focusedWindow;
  },

  updateFocusedWindow: function() {
    this.focusedWindow = this.windows.length >=2 ? this.windows[this.windows.length-2] : null;    
  },
  
  // Registers a new window (called by Windows constructor)
  register: function(win) {
    this.windows.push(win);
  },
    
  // Add a modal window in the stack
  addModalWindow: function(win) {
    // Disable screen if first modal window
    if (this.modalWindows.length == 0)
      PickerUtilities.disableScreen(win.options.className, 'overlay_modal', win.overlayOpacity, win.getId());
    else {
      // Move overlay over all windows
      if (this.keepMultiModalWindow) {
        $('overlay_modal').style.zIndex = Picker.maxZIndex + 1;
        Picker.maxZIndex += 1;
        PickerUtilities._hideSelect(this.modalWindows.last().getId());
      }
      // Hide current modal window
      else
        this.modalWindows.last().element.hide();
      // Fucking IE select issue
      PickerUtilities._showSelect(win.getId());
    }      
    this.modalWindows.push(win);    
  },
  
  removeModalWindow: function(win) {
    this.modalWindows.pop();
    
    // No more modal windows
    if (this.modalWindows.length == 0)
      PickerUtilities.enableScreen();     
    else {
      if (this.keepMultiModalWindow) {
        this.modalWindows.last().toFront();
        PickerUtilities._showSelect(this.modalWindows.last().getId());        
      }
      else
        this.modalWindows.last().element.show();
    }
  },
  
  // Registers a new window (called by Windows constructor)
  register: function(win) {
    this.windows.push(win);
  },
  
  // Unregisters a window (called by Windows destructor)
  unregister: function(win) {
    this.windows = this.windows.reject(function(d) { return d==win });
  }, 
  
  // Closes all windows
  closeAll: function() {  
    this.windows.each( function(w) {Picker.close(w.getId())} );
  },
  
  closeAllModalWindows: function() {
    PickerUtilities.enableScreen();     
    this.modalWindows.each( function(win) {if (win) win.close()});    
  },

  // Minimizes a window with its id
  minimize: function(id, event) {
    var win = this.getWindow(id)
    if (win && win.visible)
      win.minimize();
    Event.stop(event);
  },
  
  // Maximizes a window with its id
  maximize: function(id, event) {
    var win = this.getWindow(id)
    if (win && win.visible)
      win.maximize();
    Event.stop(event);
  },

  // Closes a window with its id
  close: function(id, event) {
    var win = this.getWindow(id);
    if (win) 
      win.close();
    if (event)
      Event.stop(event);
  },
  
  unsetOverflow: function(except) {    
    this.windows.each(function(d) { d.oldOverflow = d.getContent().getStyle("overflow") || "auto" ; d.getContent().setStyle('overflow', "hidden") });
    if (except && except.oldOverflow)
      except.getContent().setStyle('overflow', except.oldOverflow);
  },

  resetOverflow: function() {
    this.windows.each(function(d) { if (d.oldOverflow) d.getContent().setStyle('overflow', d.oldOverflow) });
  },

  updateZindex: function(zindex, win) {
    if (zindex > this.maxZIndex)
      this.maxZIndex = zindex;
    this.focusedWindow = win;
  }
};

/*
  Based on Lightbox JS: Fullsize Image Overlays 
  by Lokesh Dhakar - http://www.huddletogether.com

  For more information on this script, visit:
  http://huddletogether.com/projects/lightbox/

  Licensed under the Creative Commons Attribution 2.5 License - http://creativecommons.org/licenses/by/2.5/
  (basically, do anything you want, just leave my name and link)
*/

// From mootools.net
// window.ie - will be set to true if the current browser is internet explorer (any).
// window.ie6 - will be set to true if the current browser is internet explorer 6.
// window.ie7 - will be set to true if the current browser is internet explorer 7.
// window.khtml - will be set to true if the current browser is Safari/Konqueror.
// window.webkit - will be set to true if the current browser is Safari-WebKit (Safari3)
// window.gecko - will be set to true if the current browser is Mozilla/Gecko.
if (window.ActiveXObject) window.ie = window[window.XMLHttpRequest ? 'ie7' : 'ie6'] = true;
else if (document.childNodes && !document.all && !navigator.taintEnabled) window.khtml = true;
else if (document.getBoxObjectFor != null) window.gecko = true;
{
  var array = navigator.userAgent.match(new RegExp(/AppleWebKit\/([\d\.\+]*)/));
  window.webkit =  array && array.length == 2 ? parseFloat(array[1]) >= 420 : false;
}


var PickerUtilities = {  
  getWindowScroll: function() {
    var w = window;
      var T, L, W, H;
      L = window.pageXOffset || document.documentElement.scrollLeft;
      T = window.pageYOffset || document.documentElement.scrollTop;

      if (window.ie) 
        W = Math.max(document.documentElement.offsetWidth, document.documentElement.scrollWidth);
  		else if (window.khtml) 
  		  W = document.body.scrollWidth;
  		else 
  		  W = document.documentElement.scrollWidth;
  		  
  		if (window.ie) 
  		  H = Math.max(document.documentElement.offsetHeight, document.documentElement.scrollHeight);
    	else if (window.khtml) 
    	  H = document.body.scrollHeight;
    	else
    	  H = document.documentElement.scrollHeight;
    	
      return { top: T, left: L, width: W, height: H };
  }, 
  //
  // getPageSize()
  // Returns array with page width, height and window width, height
  // Core code from - quirksmode.org
  // Edit for Firefox by pHaez
  //
  getPageSize: function(){
    var xScroll, yScroll;

    if (window.innerHeight && window.scrollMaxY) {  
      xScroll = document.body.scrollWidth;
      yScroll = window.innerHeight + window.scrollMaxY;
    } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
      xScroll = document.body.scrollWidth;
      yScroll = document.body.scrollHeight;
    } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
      xScroll = document.body.offsetWidth;
      yScroll = document.body.offsetHeight;
    }

    var windowWidth, windowHeight;

    if (self.innerHeight) {  // all except Explorer
      windowWidth = self.innerWidth;
      windowHeight = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
      windowWidth = document.documentElement.clientWidth;
      windowHeight = document.documentElement.clientHeight;
    } else if (document.body) { // other Explorers
      windowWidth = document.body.clientWidth;
      windowHeight = document.body.clientHeight;
    }  
    var pageHeight, pageWidth;

    // for small pages with total height less then height of the viewport
    if(yScroll < windowHeight){
      pageHeight = windowHeight;
    } else { 
      pageHeight = yScroll;
    }

    // for small pages with total width less then width of the viewport
    if(xScroll < windowWidth){  
      pageWidth = windowWidth;
    } else {
      pageWidth = xScroll;
    }

    return {pageWidth: pageWidth ,pageHeight: pageHeight , windowWidth: windowWidth, windowHeight: windowHeight};
  },

  disableScreen: function(className, overlayId, overlayOpacity, contentId) {
    var that = this;
    PickerUtilities.initLightbox(overlayId, className, function() {that._disableScreen(className, overlayId, overlayOpacity, contentId)});
  },

  _disableScreen: function(className, overlayId, overlayOpacity, contentId) {
    var objBody = document.body;

    // prep objects
    var objOverlay = $(overlayId);

    var pageSize = PickerUtilities.getPageSize();

    // Hide select boxes as they will 'peek' through the image in IE, store old value
    if (contentId && window.ie) {
      PickerUtilities._hideSelect();
      PickerUtilities._showSelect(contentId);
    }  
  
    // set height of Overlay to take up whole page and show
    objOverlay.style.height = (pageSize.pageHeight + 'px');
    objOverlay.style.display = 'none'; 
    if (overlayId == "overlay_modal" && this.hasEffectLib && Picker.overlayShowEffectOptions) {
      objOverlay.overlayOpacity = overlayOpacity;
      new Fx_.Appear(objOverlay, Object.extend({from: 0, to: overlayOpacity}, Picker.overlayShowEffectOptions));
    }
    else
      objOverlay.style.display = "block";
  },
  
  enableScreen: function(id) {
    id = id || 'overlay_modal';
    var objOverlay =  $(id);
    if (objOverlay) {
      // hide lightbox and overlay
      if (id == "overlay_modal" && this.hasEffectLib && Picker.overlayHideEffectOptions)
        new Fx_.Fade(objOverlay, Object.extend({from: objOverlay.overlayOpacity, to:0}, Picker.overlayHideEffectOptions));
      else {
        objOverlay.style.display = 'none';
        objOverlay.parentNode.removeChild(objOverlay);
      }
      
      // make select boxes visible using old value
      if (id != "__invisible__") 
        PickerUtilities._showSelect();
    }
  },

  _hideSelect: function(id) {
    if (window.ie) {
      id = id ==  null ? "" : "#" + id + " ";
      $$(id + 'select').each(function(element) {
        if (! PickerUtilities.isDefined(element.oldVisibility)) {
          element.oldVisibility = element.style.visibility ? element.style.visibility : "visible";
          element.style.visibility = "hidden";
        }
      });
    }
  },
  
  _showSelect: function(id) {
    if (window.ie) {
      id = id ==  null ? "" : "#" + id + " ";
      $$(id + 'select').each(function(element) {
        if (PickerUtilities.isDefined(element.oldVisibility)) {
          // Why?? Ask IE
          try {
            element.style.visibility = element.oldVisibility;
          } catch(e) {
            element.style.visibility = "visible";
          }
          element.oldVisibility = null;
        }
        else {
          if (element.style.visibility)
            element.style.visibility = "visible";
        }
      });
    }
  },

  isDefined: function(object) {
    return typeof(object) != "undefined" && object != null;
  },
  
  // initLightbox()
  // Function runs on window load, going through link tags looking for rel="lightbox".
  // These links receive onclick events that enable the lightbox display for their targets.
  // The function also inserts html markup at the top of the page which will be used as a
  // container for the overlay pattern and the inline image.
  initLightbox: function(id, className, doneHandler) {
    // Already done, just update zIndex
    if ($(id)) {
      $(id).setStyle('zIndex', Picker.maxZIndex + 1);
      Picker.maxZIndex++;
      doneHandler();
    }
    // create overlay div and hardcode some functional styles (aesthetic styles are in CSS file)
    else {
      var objBody = document.body;
      var objOverlay = document.createElement("div");
      objOverlay.setAttribute('id', id);
      objOverlay.className = "overlay_" + className
      objOverlay.style.display = 'none';
      objOverlay.style.position = 'absolute';
      objOverlay.style.top = '0';
      objOverlay.style.left = '0';
      objOverlay.style.zIndex = Picker.maxZIndex + 1;
      Picker.maxZIndex++;
      objOverlay.style.width = '100%';
      objBody.insertBefore(objOverlay, objBody.firstChild);
      if (window.khtml && id == "overlay_modal") {
        setTimeout(function() {doneHandler()}, 10);
      }
      else
        doneHandler();
    }      
  },
  
  setCookie: function(value, parameters) {
    document.cookie= parameters[0] + "=" + escape(value) +
      ((parameters[1]) ? "; expires=" + parameters[1].toGMTString() : "") +
      ((parameters[2]) ? "; path=" + parameters[2] : "") +
      ((parameters[3]) ? "; domain=" + parameters[3] : "") +
      ((parameters[4]) ? "; secure" : "");
  },

  getCookie: function(name) {
    var dc = document.cookie;
    var prefix = name + "=";
    var begin = dc.indexOf("; " + prefix);
    if (begin == -1) {
      begin = dc.indexOf(prefix);
      if (begin != 0) return null;
    } else {
      begin += 2;
    }
    var end = document.cookie.indexOf(";", begin);
    if (end == -1) {
      end = dc.length;
    }
    return unescape(dc.substring(begin + prefix.length, end));
  },
    
  _computeSize: function(content, id, width, height, margin, className) {
    var objBody = document.body;
    var tmpObj = document.createElement("div");
    tmpObj.setAttribute('id', id);
    tmpObj.className = className + "_content";

    if (height)
      tmpObj.style.height = height + "px"
    else
      tmpObj.style.width = width + "px"
  
    tmpObj.style.position = 'absolute';
    tmpObj.style.top = '0';
    tmpObj.style.left = '0';
    tmpObj.style.display = 'none';

    tmpObj.innerHTML = content;
    objBody.insertBefore(tmpObj, objBody.firstChild);
    
    var size;
    if (height)
      size = $(id).getDimensions().width + margin;
    else
      size = $(id).getDimensions().height + margin;
    objBody.removeChild(tmpObj);
    return size;
  }  
}

var color = new Class({
	initialize: function(){
		this.hexchars = "0123456789ABCDEF";
	},
	// hsv values = 0 - 1
  // rgb values 0 - 255
  hsv2rgb: function (h, s, v) {
      var r, g, b;
      if ( s == 0 ) {
         r = v * 255;
         g = v * 255;
         b = v * 255;
      } else {

         // h must be < 1
         var var_h = h * 6;
         if ( var_h == 6 ) {
             var_h = 0;
         }

         //Or ... var_i = floor( var_h )
         var var_i = Math.floor( var_h );
         var var_1 = v * ( 1 - s );
         var var_2 = v * ( 1 - s * ( var_h - var_i ) );
         var var_3 = v * ( 1 - s * ( 1 - ( var_h - var_i ) ) );

         if ( var_i == 0 ) { 
             var_r = v; 
             var_g = var_3; 
             var_b = var_1;
         } else if ( var_i == 1 ) { 
             var_r = var_2;
             var_g = v;
             var_b = var_1;
         } else if ( var_i == 2 ) {
             var_r = var_1;
             var_g = v;
             var_b = var_3
         } else if ( var_i == 3 ) {
             var_r = var_1;
             var_g = var_2;
             var_b = v;
         } else if ( var_i == 4 ) {
             var_r = var_3;
             var_g = var_1;
             var_b = v;
         } else { 
             var_r = v;
             var_g = var_1;
             var_b = var_2
         }

         r = var_r * 255                  //rgb results = 0 ÷ 255
         g = var_g * 255
         b = var_b * 255

         }
      return [Math.round(r), Math.round(g), Math.round(b)];
  },
 	rgb2hex: function (r,g,b) {
      return this.toHex(r) + this.toHex(g) + this.toHex(b);
  },
  toHex: function(n) {
      n = n || 0;
      n = parseInt(n, 10);
      if (isNaN(n)) n = 0;
      n = Math.round(Math.min(Math.max(0, n), 255));

      return this.hexchars.charAt((n - n % 16) / 16) + this.hexchars.charAt(n % 16);
  },
 	toDec: function(hexchar) {
      return this.hexchars.indexOf(hexchar.toUpperCase());
  },
	hex2rgb: function(str) { 
      var rgb = [];
      rgb[0] = (this.toDec(str.substr(0, 1)) * 16) + 
                      this.toDec(str.substr(1, 1));
      rgb[1] = (this.toDec(str.substr(2, 1)) * 16) + 
                      this.toDec(str.substr(3, 1));
      rgb[2] = (this.toDec(str.substr(4, 1)) * 16) + 
                      this.toDec(str.substr(5, 1));
      return rgb;
  },
  isValidRGB: function(a) { 
      if ((!a[0] && a[0] !=0) || isNaN(a[0]) || a[0] < 0 || a[0] > 255) return false;
      if ((!a[1] && a[1] !=0) || isNaN(a[1]) || a[1] < 0 || a[1] > 255) return false;
      if ((!a[2] && a[2] !=0) || isNaN(a[2]) || a[2] < 0 || a[2] > 255) return false;

      return true;
  },
  rgb2hsv: function(r, g, b){
		var _R = ( r / 255 );                    //RGB values = 0 ÷ 255
		var _G = ( g / 255 );
		var _B = ( b / 255 );
		
		var _Min = Math.min(_R,_G,_B );    //Min. value of RGB
		var _Max = Math.max(_R,_G,_B) ;    //Max. value of RGB
		var del_Max = _Max - _Min ;             //Delta RGB value
		
		var	v = _Max;
		
		if (del_Max == 0){                     //This is a gray, no chroma...
		   h = 0;                                //HSV results = 0 ÷ 1
		   s = 0;
		}else{                                    //Chromatic data...
		   s = del_Max / _Max;
		
		   del_R = ( ( ( _Max - _R ) / 6 ) + ( del_Max / 2 ) ) / del_Max;
		   del_G = ( ( ( _Max - _G ) / 6 ) + ( del_Max / 2 ) ) / del_Max;
		   del_B = ( ( ( _Max - _B ) / 6 ) + ( del_Max / 2 ) ) / del_Max;
		
		   if (_R == _Max ) h = del_B - del_G;
		   else if ( _G == _Max ) h = ( 1 / 3 ) + del_R - del_B;
		   else if ( _B == _Max ) h = ( 2 / 3 ) + del_G - del_R;
		
		   if ( h < 0 )h += 1;
		   if ( h > 1 )h -= 1;
		}
		return [h,s,v];
  },
  RGBToHSL: function (rgb) {
    var min, max, delta, h, s, l;
    var r = rgb[0], g = rgb[1], b = rgb[2];
    min = Math.min(r, Math.min(g, b));
    max = Math.max(r, Math.max(g, b));
    delta = max - min;
    l = (min + max) / 2;
    s = 0;
    if (l > 0 && l < 1) {
      s = delta / (l < 0.5 ? (2 * l) : (2 - 2 * l));
    }
    h = 0;
    if (delta > 0) {
      if (max == r && max != g) h += (g - b) / delta;
      if (max == g && max != b) h += (2 + (b - r) / delta);
      if (max == b && max != r) h += (4 + (r - g) / delta);
      h /= 6;
    }
    return [h, s, l];
  },
  unpack: function (color) {
    if (color.length == 6) {
      return [parseInt('0x' + color.substring(0, 2)) / 255,
        parseInt('0x' + color.substring(2, 4)) / 255,
        parseInt('0x' + color.substring(4, 6)) / 255];
    }
    else if (color.length == 3) {
      return [parseInt('0x' + color.substring(0, 1)) / 15,
        parseInt('0x' + color.substring(1, 2)) / 15,
        parseInt('0x' + color.substring(2, 3)) / 15];
    }else return false;
  }
});
/*
function correctPNG(){ // correctly handle PNG transparency in Win IE 5.5 or higher.
	for(var i=0; i<document.images.length; i++){
		var img = document.images[i]
		var imgName = img.src.toUpperCase()
		if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
		   {
		 var imgID = (img.id) ? "id='" + img.id + "' " : ""
		 var imgClass = (img.className) ? "class='" + img.className + "' " : ""
		 var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
		 var imgStyle = "display:inline-block;" + img.style.cssText 
		 if (img.align == "left") imgStyle = "float:left;" + imgStyle
		 if (img.align == "right") imgStyle = "float:right;" + imgStyle
		 if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle		
		 var strNewHTML = "<span " + imgID + imgClass + imgTitle
		 + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
		   + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
		 + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 
		 img.outerHTML = strNewHTML
		 i = i-1
		   }
	 }
}
*/
function correctPickerPNG_lelen() { // correctly handle PNG transparency in Win IE 5.5 or higher.
	if(document.all && $('pickerbg')) {
		var img = $('pickerbg');
		var imgName = img.src.toUpperCase();
		if (imgName.substring(imgName.length-3, imgName.length) == "PNG") {
			var imgID = (img.id) ? "id='" + img.id + "' " : ""
			var imgClass = (img.className) ? "class='" + img.className + "' " : ""
			var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
			var imgStyle = "display:inline-block;" + img.style.cssText 
			if (img.align == "left") imgStyle = "float:left;" + imgStyle
			if (img.align == "right") imgStyle = "float:right;" + imgStyle
			if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle		
			var strNewHTML = "<div " + imgID + imgClass + imgTitle
			+ " style=\"" + "width:190px; height:190px;" + imgStyle + ";"
			+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
			+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></div>" 
			img.outerHTML = strNewHTML
		}			
	} 
}

var panel = new Class({
	initialize: function(elmnt,options){
		el = elmnt;
		if(el)el = $(elmnt);
		this.options = this.setOptions(this.getDefaultOptions(), options);
		this.moveTop = new Fx.Style(el, 'top', this.options);
		this.options.onComplete = function(){};
		this.moveLeft = new Fx.Style(el, 'left', this.options);
	},
	setOptions: function(defaults, options){
		return Object.extend(defaults, options || {});
	},
	getDefaultOptions: function(){
		return {
			duration:1000,
		 	transition: Fx.Transitions.quadInOut,
		 	onComplete: function(){
		 		/////
		 	}
		}
	},
	start: function(t,l){
		this.moveTop.start(t);
		this.moveLeft.start(l);
		return false;
	}
});