function opacity(id, opacStart, opacEnd, millisec) { 
    //speed for each frame 
    var speed = Math.round(millisec / 100); 
    var timer = 0; 

    //determine the direction for the blending, if start and end are the same nothing happens 
    if(opacStart > opacEnd) { 
        for(i = opacStart; i >= opacEnd; i--) { 
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed)); 
            timer++; 
        } 
    } else if(opacStart < opacEnd) { 
        for(i = opacStart; i <= opacEnd; i++) 
            { 
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed)); 
            timer++; 
        } 
    } 
    
} 

//change the opacity for different browsers 
function changeOpac(opacity, id) { 
    var object = document.getElementById(id).style; 
    object.opacity = (opacity / 100); 
    object.MozOpacity = (opacity / 100); 
    object.KhtmlOpacity = (opacity / 100); 
    object.filter = "alpha(opacity=" + opacity + ")"; 
    if (opacity <= 0) object.display = "none";
    else object.display = "block";
}

getOpac = function (object) {
	opc = new Array(3);
	opc[0] = object.KhtmlOpacity;
	opc[1] = object.opacity;
	opc[2] = object.MozOpacity;
	for(i=0;i<=2;i++) {
		if (opc[i] != "") return opc[i];
	}
}

error = function () {
	error_div = "error";
	setTimeout("opacity('" + error_div + "', 100, 0, 500)",2000);
	return true;
}

var colorPickerFaded = 1;
colorPickerFade = function () {
	opc = getOpac('colorDiv');
	if (colorPickerFaded == false) {
		document.getElementById('color_preview').style.width = '20px';
		document.getElementById('color_preview').style.height = '20px';
		opacity('colorDiv', 100, 0, 300);
		colorPickerFaded = true;
		document.style.background = document.getElementById('ctxt').value;
	}
	else {
		document.getElementById('color_preview').style.width = '10px';
		document.getElementById('color_preview').style.height = '10px';
		opacity('colorDiv', 0, 100, 300);
		colorPickerFaded = false;
	}
	return true;
}

var HelpBoxFaded = 1;
HelpBoxFade = function () {
	opc = getOpac('help_box_main');
	if (HelpBoxFaded == true) {
		div_obj = document.getElementById('help_box_main');
		div_obj.className = 'help_box';
		div_obj.style.top = ((screen.height/2)-screen.height*0.15) + 'px';
		div_obj.style.left = ((screen.width/2)-screen.width*0.20) + 'px';
		HelpBoxFaded = false;
		opacity('help_box_main', 0, 100, 300);
	}
	else {
		opacity('help_box_main', 100, 0, 300);
		HelpBoxFaded = true;
	}
	return true;
}

var MoverBehaviour = {
  mo: null, // reference to the movable obj,
  x: 0, y: 0,
  
  // ----- Events -----
  onmousedown: function (evt) {
    evt = evt || window.event;
    var src = jcl.FindBehaviourElement(evt.srcElement, MoverBehaviour);
    src.MoveStart(evt);
  }, // onmousedown


  // track mouse moves. This handler will be attached to the document level !
  _onmousemove: function (evt) {
    evt = evt || window.event;
    MoverBehaviour.MoveIt(evt);
  }, // onmousemove


  // track mouse button up. This handler will be attached to the document level !
  _onmouseup: function (evt) {
    evt = evt || window.event;
    MoverBehaviour.MoveEnd(evt);
  }, // onmouseup


  // ----- Methods -----
  MoveStart: function (evt) {
    // find the moving part (position:absolute or class="VEPart")
    var mo = this;
    while ((mo != null) && (mo.className != "VEPart"))
      mo = mo.parentNode;

    if (mo == null)
      return; // don't move
    MoverBehaviour.mo = mo;
      
    // calculate mousepointer-object distance
    mo.x = mo.y = 0;
    obj = mo;
    while (obj != null) {
      mo.x += obj.offsetLeft;
      mo.y += obj.offsetTop;
      obj = obj.offsetParent;
    } // while
    mo.x = evt.clientX - mo.x;
    mo.y = evt.clientY - mo.y;

    // make the moving object globally evailable when mouse is leaving this object.
    jcl.AttachEvent(document, "onmousemove", this._onmousemove);
    jcl.AttachEvent(document, "onmouseup", this._onmouseup);
  }, // MoveStart
  

  MoveIt: function (evt) {
    var mo = MoverBehaviour.mo;
    if (mo != null) {
      var p = (evt.clientX - mo.x) + "px";
      if (p != mo.style.left) mo.style.left = p;
      p = (evt.clientY - mo.y) + "px";
      if (p != mo.style.top) mo.style.top = p;
    } // if
    // cancel selecting anything
    evt.cancelBubble = true;
    evt.returnValue = false;
  }, // MoveIt
  

  MoveEnd: function () {
    var mo = MoverBehaviour.mo;
    if (mo != null) {
      MoverBehaviour.mo = null;
      jcl.DetachEvent(document, "onmousemove", this._onmousemove);
      jcl.DetachEvent(document, "onmouseup", this._onmouseup);
    } // if
  } // MoveEnd
    
} // MoverBehaviour