var A_category = null;
var isLoadingInfo = false;
var loadQue = null;
var hideOtherRootCategorys = true;
var addedBackBtn = false;
var language;
var lang = new Array();
var scriptPath;

function chooseTemplate(id) {
  if (id == undefined) {
    document.pageForm.selectTemplate_arg_1.value = A_preview;
  } else {
    document.pageForm.selectTemplate_arg_1.value = id;
  }
  document.pageForm.submit();
}





/**
 *    TEMPLATE HANDLER
 */
 
 
var categorys     = new Array(); 
var templates     = new Array(); 
 
function Category(id, parentId, img, containsCategorys, containsTemplates, description) {
  this.id           = id;
  this.parent       = (parentId != "") ? parentId : "root";
  this.img          = (img != "") ? img : false;
  this.description  = description;
  this.load         = category_load;
  this.containsCategorys = containsCategorys;
  this.containsTemplates = containsTemplates;
  this.hasChildren  = false;
  this.isLoaded     = false;
  this.isOpen       = false;
} 


function Template(id, parent) {
  this.id = id;
  this.parent = parent;
  this.info = new Array();
  this.hasInfo = false;
}


function addCategory(id, parentId, img, containsCategorys, containsTemplates, description) {
  categorys.push(new Category(id, parentId, img, containsCategorys, containsTemplates, description));
}

function addTemplate(id, parentId){
  templates.push(new Template(id, parentId)); 
}

function setLanguage(lang) {
  language = lang;
}
function setPath(path) {
  scriptPath = path;
}
function setString(i, str) {
  lang[i] = str;
}


function checkChildren() {
  for (var i = 0; i < categorys.length; i++) {
    for (var j = 0; j < categorys.length; j++) {
      if (categorys[i].id == categorys[j].parent) {
        categorys[i].hasChildren = true;
        break;
      }
    }
    for (var j = 0; j < templates.length; j++) {
      if (categorys[i].id == templates[j].parent) {
        categorys[i].hasChildren = true;
        break;
      }
    }
  }
}



function DOM_generateCategorys(parent, openChildren) {
  openChildren = false;
  var container = getContainer(parent);
  cat = getCategory(parent);
  if (!container) return;
  if (parent != "root") {
    var header = getContainerHeader(parent);
    header.onclick = new Function("ev", "DOM_closeCategorys('" + parent + "')");
  }
  
  for (var i = 0; i < categorys.length; i++) {
    if (categorys[i].parent == parent && !categorys[i].isOpen) {
      var cat = categorys[i];
      var elem = createElem("div", "category_" + cat.id, "div_category");
      if (cat.img) {
        var img = createImg("/fwDocs/design/templates/" + language + "/" + cat.id + "." + cat.img);
        elem.appendChild(img);
      } else {
        elem.innerHTML = cat.description;
      }
      container.appendChild(elem);
      if (cat.containsTemplates) {
        dontDisplay("viewCategorysBtn_" + cat.parent);
        highLightHeader(cat.parent);
        elem.className = "div_category_inclTemplates";
        elem.onclick = new Function("ev", "DOM_loadTemplates('" + cat.id + "', true)");
        elem = createElem("div", "viewTemplatesBtn_" + cat.id, "viewTemplatesBtn");
        elem.innerHTML = " <img src='/fwDocs/design/images/plus.gif'/>";
        elem.onclick = new Function("ev", "DOM_loadTemplates('" + cat.id + "', true)");
        container.appendChild(elem);
        var table = createElem("table", "table_container_" + cat.id, "templateContainer");
        table.appendChild(createElem("tbody")).appendChild(createElem("tr")).appendChild(createElem("td","container_" + cat.id, null))
        table.style.visibility = "hidden";
        container.appendChild(table);
      } else if (!cat.containsTemplates && !cat.containsCategorys) {
        dontDisplay("viewCategorysBtn_" + cat.parent);
        highLightHeader(cat.parent);
        elem.onclick = new Function("ev", "onclick_emptyCategory('" + cat.id + "');");
        elem = createElem("div", "container_" + cat.id, "noContentContainer");
        elem.innerHTML = "<p>" + lang[1] + "</p>"; 
        container.appendChild(elem);
      } else {
        dontDisplay("viewCategorysBtn_" + cat.parent);
        highLightHeader(cat.parent);
        elem.onclick = new Function("ev", "DOM_generateCategorys('" + cat.id + "', true)");
        elem = createElem("div", "container_" + cat.id, "categoryContainer");
        container.appendChild(elem);
        if (openChildren) {
          DOM_generateCategorys(cat.id, openChildren);
        }
      }
    }
  }
}
function onclick_emptyCategory(id) {
  var cat = getCategory(id);
  if (!cat.isOpen) {
    display("container_" + id);
    cat.isOpen = true;
  } else {
    dontDisplay("container_" + id);
    cat.isOpen = false;
  }
}

function DOM_closeCategorys(id) {
  for (var i = 0; i < categorys.length; i++) {
    if (categorys[i].parent == id) {
      DOM_closeCategorys(categorys[i].id);
      categorys[i].isOpen = false;
    }
  }
  var container = getContainer(id);
  if (container) { 
    container.innerHTML = "";
  }
  var header = getContainerHeader(id);
  if (header) {
    header.onclick = new Function("ev", "DOM_generateCategorys('" + id + "', true)");
    lowLightHeader(id);
  }
  display("viewCategorysBtn_" + id);
  var cat = getCategory(id);
  if (cat.parent == "root" && hideOtherRootCategorys) {
    for (var ii in categorys) {
      if (categorys[ii].parent == "root" && categorys[ii].id != id) {
        DOM_displayCategorys(categorys[ii].id);
      }
    }
  }
}

function DOM_hideCategorys(id) {
  var container = getContainer(id);
  if (container) { 
    container.style.display = "none";
  }
  var header = getContainerHeader(id);
  if (header) {
    header.style.display = "none";
  }
  dontDisplay("viewCategorysBtn_" + id);
}

function DOM_displayCategorys(id) {
    for (var i = 0; i < categorys.length; i++) {
      categorys[i].isOpen = false;
    }
    var container = getContainer("root");
    container.innerHTML = "";
    addedBackBtn = false;
    DOM_generateCategorys("root", false); 
}

function highLightHeader(id) {
  var cat = getCategory(id);
  if (cat.parent == "root") {
    if (hideOtherRootCategorys && !addedBackBtn) {
      var container = getContainer("root");
      container.appendChild(DOM_createBackBtn());
      addedBackBtn = true;
    }
    for (var i in categorys) {
      if (categorys[i].parent == "root" && categorys[i].id != id) {
        if (hideOtherRootCategorys) {
          DOM_hideCategorys(categorys[i].id);
        } else {
          if (categorys[i].isOpen) {
            DOM_closeCategorys(categorys[i].id);
          }
        }
      }
    }
    //getId("category_" + id).style.backgroundColor = "#555599";
  }
}
function lowLightHeader(id)  {
//  var cat = getCategory(id);
//  if (cat.parent == "root") {
//    getId("category_" + id).style.backgroundColor = "#dddddd";
//  }
}

function DOM_createBackBtn() {
  var elem = createElem("div", null, "backCategorys");
  elem.onclick = function() {
    for (var i = 0; i < categorys.length; i++) {
      categorys[i].isOpen = false;
    }
    var container = getContainer("root");
    container.innerHTML = "";
    addedBackBtn = false;
    DOM_generateCategorys("root", false); 
  }
  elem.innerHTML = "<br/><br/><img src='/fwDocs/design/images/"+ language + "/back.gif'/>";
  return elem;
}

function getContainer(parent) {
  return getId("container_" + parent);
}
  
function getContainerHeader(parent) {
  return getId("category_" + parent);
}


function createCloseBtn(parent) {
  var elem = createElem("div", "closeBtn_" + parent, "closeBtn");
  elem.appendChild(createImg("/fwDocs/design/images/close.gif"));
  elem.onclick = new Function("ev", "closeCategory('" + parent + "')");
  return elem;
}
function closeCategory(parent) {
  container = getContainer(parent);
  var t = getId("table_container_" + parent);
  if (t) t.style.visibility = "hidden";
  
  if (container) {
    container.innerHTML = "";
  }
  display("viewTemplatesBtn_" + parent);
  var header = getContainerHeader(parent);
  if (header) {
    header.style.backgroundColor = "#dddddd";
    header.style.color = "#000000";
    header.onclick = new Function("ev", "DOM_loadTemplates('" + parent + "', true)");
  }
  remove("closeBtn_" + parent);
  A_category = null;
}

function DOM_loadTemplates(parent) {
  if (A_category != null) {
    closeCategory(A_category);
  }
  var cat = getCategory(parent);
  
  dontDisplay("viewTemplatesBtn_" + parent);
  var header = getContainerHeader(parent);
  header.style.backgroundColor = "#555599";
  header.style.color = "#ffffff";
  header.appendChild(createCloseBtn(parent));
  header.onclick = new Function("ev", "closeCategory('" + parent + "')");
  var container = getContainer(parent);
  getId("table_container_" + parent).style.visibility = "visible";
  
  
  for (var i = 0; i < templates.length; i++) {
    if (templates[i].parent == parent) {
      var template = templates[i];
      var elem = createElem("div", "template_" + template.id, "div_template");
      var img = createImg(scriptPath + "/s9XNsPi5knqdTg/templates/preview/80/" + template.id);
      img.style.verticalAlign = "middle";
      elem.appendChild(img);
      var img = createVAlignImg();
      elem.appendChild(img);
      
      elem.onmouseover = new Function("ev", "onmouseover_divTemplate(ev, '" + template.id + "')"); 
      elem.onmousemove = new Function("ev", "onmousemove_divTemplate(ev, '" + template.id + "')"); 
      elem.onmouseout  = new Function("ev", "onmouseout_divTemplate(ev, '" + template.id + "')"); 
      elem.onclick     = new Function("ev", "onclick_divTemplate('"+ scriptPath +"/s9XNsPi5knqdTg/templates/preview/400/', '" + template.id + "')");
      container.appendChild(elem);
      container.appendChild(DOM_createInfoBlock(template));
    }
  }
  container.appendChild(createBR(true));
  A_category = parent;
}

function DOM_createInfoBlock(template) {
  var elem = createElem("div", "templateInfo_" + template.id, "templateInfoBlock");
  elem.innerHTML = writeInfo(template);
//  elem.onmouseover = function() {
//    this.style.display = "none";
//  }; 
  return elem;
}

function onmouseover_divTemplate(ev, id) {
  var infoBlock = getId("templateInfo_" + id)
  infoBlock.style.display = "block";
}

function onmousemove_divTemplate(ev, id) {
  ev = ev || window.event;
  var scrollComp = document.getElementsByTagName("html").item(0).scrollTop;
  var infoBlock = getId("templateInfo_" + id)
  infoBlock.style.top  = ev.clientY + scrollComp + "px";
  infoBlock.style.left = ev.clientX + 10 + "px";
}
function onmouseout_divTemplate(ev, id) {
  var infoBlock = getId("templateInfo_" + id)
  infoBlock.style.display = "none";
}

function loadTemplatesInfo(parent) {
  isLoadingInfo = parent;
  getId("categoryHiddenFld").value = parent;
  getId("templateInfoForm").submit();
}

function clearLoadQue(cat) {
  if (loadQue != cat && loadQue != null) {
    setTimeout("loadTemplatesInfo('" + loadQue + "')", 500);
  } else {
    isLoadingInfo = false;  
  }
  loadQue = null;
}

function setTemplateInfo(id, name, value) {
  var template = getTemplate(id);
  if (name == "name") {
      template.name = value;
  } else if (name == "originalPrice") {
      template.campain = true;
      template.originalPrice = value;
  } else if (name == "price") {
      template.price = value;
  } else if (name == "startFee") {
      template.startFee = value;
  } else {
      template.info[name] = value;
  }
  template.hasInfo = true;
  //alert(name + " : " + template.info[name])
  var infoBlock = getId("templateInfo_" + id)
  if (infoBlock) {
    infoBlock.innerHTML = writeInfo(template);
  }
  if (id == A_preview) {
    if (name == "name") {
    	getId("previewCategoryHeader").innerHTML = writePreviewCategoryHeader(template);
    }
	getId("previewInfoContainer").innerHTML = writeInfo(template);
	
  }
}

function writePreviewCategoryHeader(template) {
  var html = "";
  var cat = getCategory(template.parent);
  while (cat) {
    html = " » " + cat.description + html;
    cat = getCategory(cat.parent);
  }
  if (template.name) {
    html +=  " » " + template.name;
  }
  return html;
}


function writeInfo(template) {
    var html;
    html = "<table class='infoFld'><tr><td valign='top' style='text-align: right; width: 40px'><img src='/fwDocs/design/images/i.gif'/></td><td valign='top'><table>";
    if (template.hasInfo) {
        for (var name in template.info) {
            html += "<tr><td>" + name + ":</td><td>" + template.info[name] + "</td></tr>";
        }
        if (template.campain) {
            html += "<tr><td>" + lang[2] + ": </td><td><span style='color: black; text-decoration: line-through;'>" + lang[3] + "" + formatAsMoney(template.originalPrice) + "" + lang[4] + "</span>";
            html += " <span style='color: red; font-weight: bold;'>" + lang[3] + "" + formatAsMoney(template.price) + "" + lang[4] + " " + lang[6] + "</span></td></tr>";
        } else {
            html += "<tr><td>" + lang[2] + ": </td><td>" + lang[3] + "" + formatAsMoney(template.price) + "" + lang[4] + "</td></tr>";
        }
        if (template.startFee) {
            html += "<tr><td>" + lang[7] + ": </td><td>" + lang[3] + "" + formatAsMoney(template.startFee) + "" + lang[4] + "</td></tr>";
        }

    } else {
        if (isLoadingInfo) {
            loadQue = template.parent;
        } else {
            loadTemplatesInfo(template.parent);
        }
        html += "<tr><td colspan='2'>" + lang[5] + "</td></tr>";
    }
    html += "</table></td></tr></table>";
    return html;
}

function getTemplate(id) {
  for (var i = 0; i < templates.length; i++) {
    if (templates[i].id == id) {
      return templates[i];
    }
  }
}
function getCategory(id) {
  for (var i = 0; i < categorys.length; i++) {
    if (categorys[i].id == id) {
      return categorys[i];
    }
  }
  return false;
}
function dontDisplay(id) {
  var obj = getId(id);
  if(obj) {
    getId(id).style.display = "none";  
  }
}
function display(id) {
  var obj = getId(id);
  if(obj) {
    getId(id).style.display = "block";  
  }
}

















var transp_openElem, transp_closeElem;
var openingId;

function openUp() {
}




function category_load() {
  getId("loading_" + this.id).style.display = "block";
  document.categoryLoaderForm.save_category.value = this.id;
  document.categoryLoaderForm.container.value = "category_" + this.id;
  document.categoryLoaderForm.submit();
}
 


var A_category;


function swapCategory(id, templates) {
  for (i = 0; i < categorys.length; i++) {
    if (categorys[i].id == id) {
      cat = categorys[i];
    }
  }
  if (cat.isOpen) {
    cat.close();
  } else {
    showCategory(id, templates);
  }

}




var A_preview;
var templatesInCategory; // Array;
var previewPath;
var index;
function onclick_divTemplate(path, id) {
  previewPath = path;
  setPreviewImg(id);  
}
var showShadowTbl = false;

function setPreviewImg(id) {
  //document.pageForm.selectTemplate_arg_1.value = id;
  var scrollComp = document.getElementsByTagName("html").item(0).scrollTop;
  A_preview = id;
  
  for (i = 0; i < templates.length; i++) {
    if (templates[i].id == id) {
      index = i;
      template = templates[i];
      break;      
    }
  }
  if (getId("previewBlock")) {
	if (templates[index - 1]) {
	  getId("prePreviewBtn").style.visibility = "visible";
	} else {
	  getId("prePreviewBtn").style.visibility = "hidden";
	}
	if (templates[index +  1]) {
	  getId("nextPreviewBtn").style.visibility = "visible";
	} else {
	  getId("nextPreviewBtn").style.visibility = "hidden";
	}
    getId("shadowTable").style.visibility = "hidden";
	var divBlock = getId("previewBlock");
	divBlock.style.visibility = "visible";
	divBlock.style.top = (scrollComp + 80) + "px";
	getId("previewImage").src = previewPath + id;
	getId("previewInfoContainer").innerHTML = writeInfo(template);
	getId("previewCategoryHeader").innerHTML = writePreviewCategoryHeader(template);
	//alert(previewPath + id);
	refNr = getRandomInt();
    showShadowTbl = true;
    getId("previewImage").onload = showShadowTable;
    setTimeout("adjustShadowTable(" + refNr + ")", 2000);
	showPageDimmer();
  }
}

var refNr;



function previewStep(step) {
  index += step;
  setPreviewImg(templates[index].id);
}



function closePreview() {
  showShadowTbl = false;
  getId("shadowTable").style.visibility = "hidden";
	getId("previewBlock").style.visibility = "hidden";
  getId("nextPreviewBtn").style.visibility = "hidden";
  getId("prePreviewBtn").style.visibility = "hidden";
	if (getId("pageDimmer")) {
		var dimBlock = getId("pageDimmer");
		dimBlock.style.visibility = "hidden";
	}
	
}

function adjustShadowTable(key) {
  if (showShadowTbl && key == refNr) {
    getId("shadowTable").style.visibility = "visible";
    w        = getId("previewImage").width - 28;
    h        = getId("previewImage").height - 28;
    //alert("debug kafjla: w: " + w + " h: " + h);
    getId("shadowTop").width        = w;
    getId("shadowBottom").width     = w;
    getId("shadowLeft").height      = h;
    getId("shadowRight").height     = h;
    setTimeout("adjustShadowTable(" + key + ")", 2000);
  }
}


function showShadowTable() {
  getId("shadowTable").style.visibility = "visible";
  w        = getId("previewImage").width - 28;
  h        = getId("previewImage").height - 28;
  //alert("debug kafjla: w: " + w + " h: " + h);
  getId("shadowTop").width        = w;
  getId("shadowBottom").width     = w;
  getId("shadowLeft").height      = h;
  getId("shadowRight").height     = h;
  showShadowTbl = false;
}