/**************************************************************************************************************************
 * 
 * slyCMS
 * 
 * Written by Andy Loeber <andreas.loeber@slysolutions.ch>
 * (c) 2010-2011 slySOLUTIONS GmbH, Zurich, Switzerland. All rights reserved.
 * 
 * YOU MAY NOT REMOVE THIS COPYRIGHT NOTICE - SEE WWW.SLYSOLUTIONS.CH FOR LICENSE DETAILS
 *************************************************************************************************************************/

function slyContextMenu(name, x, y, parentContextMenu, tasks) {
  if (!sly.user) return;
  this.id = 'slyCMS-ContextMenu-' + (new Date()).getTime();
  this.name = name;
  this.x = x;
  this.y = y;
  this.parentContextMenu = parentContextMenu;
  this.tasks = tasks;
  this.lastTaskCallback = 0;
  if (!parentContextMenu && sly.contextMenus.length > 0) {
  	while(sly.contextMenus.length > 0) {
  		sly.contextMenus[0].hide();
  		sly.contextMenus.splice(0, 1);
  	}
  }
  sly.contextMenus.push(this);
  this.show();
}

slyContextMenu.prototype.show = function() {
  var table = document.createElement('table');
  table.id = this.id;
  table.className = 'slyContextMenu';
  table.cellSpacing = 0;
  table.cellPadding = 0;
  table.style.textAlign = 'left';
  table.style.position = 'absolute';
  table.style.overflow = 'hidden';
  table.style.zIndex = 10000;
  table.style.top = this.y + 'px';
  table.style.left = this.x + 'px';
  var tbody = document.createElement('tbody');
  var tr = document.createElement('tr');
  tr.style.height = this.parentContextMenu ? '5px' : '20px';
  tbody.appendChild(tr);
  var td = document.createElement('td');
  td.style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-topleft.png)';
  tr.appendChild(td);
  td = document.createElement('td');
  td.style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-top.png)';
  td.align = 'right';
  td.style.fontFamily = 'Verdana';
  td.style.fontSize = '9px';
  td.style.fontStyle = 'italic';
  td.style.color = '#999999';
  td.style.paddingRight = '5px';
  td.style.cursor = 'default';
  if (!this.parentContextMenu) td.appendChild(document.createTextNode(this.name));
  tr.appendChild(td);
  td = document.createElement('td');
  td.style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-topright.png)';
  tr.appendChild(td);
  for(var i = 0; i < this.tasks.length; i++) {

    tr = document.createElement('tr');
    if (this.tasks[i].cmd != '-') {
      this._hoverContextMenuCallbacks(tr, this.tasks[i], i);
      tr.style.height = '20px';
    } else tr.style.height = '7px';

    //Column 1: where the icon is placed, icons are automatically shrinked to the perfect size
    td = document.createElement('td');
    td.id = this.id + '_contextmenu-cmd-' + i + '-1';
    td.className = 'contextmenu-cmd';
    this._attachTaskCallback(td, this.tasks[i]);
    td.style.width = '27px';
    td.style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-left.png)';
    if (this.tasks[i].icon) {
      var icon = document.createElement('img');
      icon.style.marginLeft = '5px';
      icon.style.marginTop = '3px';
      icon.style.width = '16px';
      icon.style.height = '16px';
      icon.src = this.tasks[i].icon;
      td.appendChild(icon);
    }
    tr.appendChild(td);

    //Column 2: where the link text is placed
    td = document.createElement('td');
    td.id = this.id + '_contextmenu-cmd-' + i + '-2';
    if (this.tasks[i].cmd != '-') {
      td.className = 'contextmenu-cmd';
      td.style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-center.png)';

      var div = document.createElement('div');
      div.style.position = 'relative';

      if (this.tasks[i].cmd == 'Bild ersetzen...') {
	      var slyAjaxUploadForm = document.createElement('form');
	      slyAjaxUploadForm.id = 'slyAjaxUpload';
	      slyAjaxUploadForm.method = 'post';
	      slyAjaxUploadForm.enctype = 'multipart/form-data';
	      slyAjaxUploadForm.style.position = 'absolute';
	      slyAjaxUploadForm.style.left = '-27px';
	      slyAjaxUploadForm.style.top = '-4px';
	      var slyAjaxUploadInput = document.createElement('input');
	      slyAjaxUploadInput.id = 'slyAjaxUploadFile';
	      slyAjaxUploadInput.name = 'slyAjaxUploadFile';
	      slyAjaxUploadInput.type = 'file';
	      slyAjaxUploadInput.style.position = 'absolute';
	      slyAjaxUploadInput.style.zIndex = 99999;
	      slyAjaxUploadInput.style.height = '20px';
	      slyAjaxUploadInput.style.opacity = 0;
	      slyAjaxUploadInput.style.filter = 'Alpha(Opacity=0)';
	      slyAjaxUploadForm.appendChild(slyAjaxUploadInput);
	      slyAjaxUploadInput.style.width = table.offsetWidth + 'px';
	      slyAjaxUploadInput.onchange = function() {
	        ajaxUpload(document.getElementById('slyAjaxUpload'), 'ajaxupload.php', widget.id);
	      };
	      slyAjaxUploadInput.onmouseover = function() {
	        if (document.getElementById('contextmenu-cmd-' + i + '-1')) document.getElementById('contextmenu-cmd-' + i + '-1').style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-left-active.png)';
	        if (document.getElementById('contextmenu-cmd-' + i + '-2')) document.getElementById('contextmenu-cmd-' + i + '-2').style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-center-active.png)';
	      }; 
	      slyAjaxUploadInput.onmouseout = function() {
	        if (document.getElementById('contextmenu-cmd-' + i + '-1')) document.getElementById('contextmenu-cmd-' + i + '-1').style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-left.png)';
	        if (document.getElementById('contextmenu-cmd-' + i + '-2')) document.getElementById('contextmenu-cmd-' + i + '-2').style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-center.png)';
	      };
	      div.appendChild(slyAjaxUploadForm);
      } else this._attachTaskCallback(td, this.tasks[i]);

      var link = document.createElement('div');
      sly.disableSelection(link);
      link.style.whiteSpace = 'nowrap';
      link.style.cursor = 'default';
      link.style.padding = '0px 8px';
      link.style.fontFamily = 'Arial';
      link.style.fontSize = '11px';
      link.style.color = '#000066';
      link.appendChild(document.createTextNode(this.tasks[i].cmd));
      div.appendChild(link);
      td.appendChild(div);
    } else td.style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-divider.png)';
    tr.appendChild(td);

    //Column 3: where the shadow of the box is
    td = document.createElement('td');
    td.style.width = '8px';
    td.style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-right.png)';
    tr.appendChild(td);
    tbody.appendChild(tr);
  }

  tr = document.createElement('tr');
  tr.style.height = '8px';
  td = document.createElement('td');
  td.style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-bottomleft.png)';
  tr.appendChild(td);
  td = document.createElement('td');
  td.style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-bottom.png)';
  tr.appendChild(td);
  td = document.createElement('td');
  td.style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-bottomright.png)';
  tr.appendChild(td);
  tbody.appendChild(tr);

  table.appendChild(tbody);
  document.body.appendChild(table);
};

slyContextMenu.prototype._hoverContextMenuCallbacks = function(tr, task, pos) {
  var _this = this;
  tr.onmouseover = function(event) {
    document.getElementById(_this.id + '_contextmenu-cmd-' + pos + '-1').style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-left-active.png)';
    document.getElementById(_this.id + '_contextmenu-cmd-' + pos + '-2').style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-center-active.png)';
    while (sly.contextMenus.length > 0 && sly.contextMenus[sly.contextMenus.length - 1] != _this) {
		sly.contextMenus[sly.contextMenus.length - 1].hide();
		sly.contextMenus.splice(sly.contextMenus.length - 1, 1);
	}
    if (task.tasks) {	
    	if (sly.contextMenus[sly.contextMenus.length - 1] == _this) {
    		if (event == null) event = window.event;
    		var target = event.target != null ? event.target : event.srcElement;
    		var mousePos = sly.getMousePosition(event);
    		var targetPos = sly.getNodePosition(document.getElementById(_this.id + '_contextmenu-cmd-' + pos + '-2'));
    		var x = targetPos.x + document.getElementById(_this.id + '_contextmenu-cmd-' + pos + '-2').offsetWidth;
    		var y = targetPos.y;
    		new slyContextMenu(_this.widget, x, y, _this, task.tasks);
    		var div = document.getElementById(sly.contextMenus[sly.contextMenus.length - 1].id);
    	    if (div.offsetLeft + div.offsetWidth > sly.page.width) {
    	    	var parent = sly.contextMenus[sly.contextMenus.length - 1];
    	    	var w = document.getElementById(parent.id).offsetWidth + document.getElementById(parent.parentContextMenu.id).offsetWidth;
    	    	div.style.left = div.offsetLeft - w + 15 + 'px';
    	    }
    	    if (div.offsetTop + div.offsetHeight > sly.page.height) {
    	    	div.style.top = targetPos.y - document.getElementById(sly.contextMenus[sly.contextMenus.length - 1].id).offsetHeight + 25 + 'px';
    	    }
    	}
    }
  }; 
  tr.onmouseout = function() {
    document.getElementById(_this.id + '_contextmenu-cmd-' + pos + '-1').style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-left.png)';
    document.getElementById(_this.id + '_contextmenu-cmd-' + pos + '-2').style.background = 'url(res/scripts/slycms/images/contextmenu/contextmenu-center.png)';
  };
};

slyContextMenu.prototype._attachTaskCallback = function(link, task) {
  var _this = this;
  if (task && task.callback) link.onclick = function() {
    if ((new Date()).getTime() - _this.lastTaskCallback > 1000) { //Bugfix for Chrome: otherwise sometimes there occur multiple clicks ?!?!
      _this.lastTaskCallback = (new Date()).getTime();
	  var parent = _this;
	  while(parent.parentContextMenu) {
		  parent.hide();
		  parent = parent.parentContextMenu;
	  }
	  parent.hide();
      task.callback();
      
    };
  };
};

slyContextMenu.prototype.hide = function() {
  if (document.getElementById(this.id)) {
    try {
      document.body.removeChild(document.getElementById(this.id));
    } catch (err) {}
  }
};














function ajaxUpload(form, url_action, id_element){
  var iframe = document.createElement("iframe");
  iframe.setAttribute("id","ajax-temp");
  iframe.setAttribute("name","ajax-temp");
  iframe.setAttribute("width","0");
  iframe.setAttribute("height","0");
  iframe.setAttribute("border","0");
  iframe.setAttribute("style","width: 0; height: 0; border: none;");
  form.parentNode.appendChild(iframe);
  window.frames['ajax-temp'].name="ajax-temp";
  var doUpload = function(){
    var detectWebKit = RegExp(" AppleWebKit/").test(navigator.userAgent);
    if(document.getElementById('ajax-temp').detachEvent) {
      document.getElementById('ajax-temp').detachEvent('onload', doUpload);
    } else {
      document.getElementById('ajax-temp').removeEventListener("load", doUpload, false);
    }
    var cross = "javascript: ";
    cross += "window.parent.document.getElementById('"+id_element+"').innerHTML = document.body.innerHTML; void(0);";
    document.getElementById('ajax-temp').src = cross;
    if(detectWebKit) {
      document.getElementById('ajax-temp').parentNode.removeChild(document.getElementById('ajax-temp'));
    } else {
      setTimeout(function(){ document.getElementById('ajax-temp').parentNode.removeChild(document.getElementById('ajax-temp'));}, 250);
    }
  };
  if(document.getElementById('ajax-temp').addEventListener) document.getElementById('ajax-temp').addEventListener("load", doUpload, true);
  if(document.getElementById('ajax-temp').attachEvent) document.getElementById('ajax-temp').attachEvent("onload", doUpload);
  form.setAttribute("target","ajax-temp");
  form.setAttribute("action",url_action);
  form.setAttribute("method","post");
  form.setAttribute("enctype","multipart/form-data");
  form.setAttribute("encoding","multipart/form-data");
  //document.getElementById(id_element).innerHTML = '<img src="images/loader.gif" />';
  form.submit();
}