var portfolio_img_path = "/portfolio/";

function mycarousel_itemLoadCallback(carousel, state)
{
  if (state != 'init') return;

  jQuery.get('/p/portfolio_top_ajax_tpl/', function(data) {
    mycarousel_itemAddCallback(carousel, carousel.first, carousel.last, data);
  });
};

function mycarousel_itemAddCallback(carousel, first, last, data)
{
  var items = data.split('|');

  for (i = 0; i < items.length; i++) {
    carousel.add(i+1, mycarousel_getItemHTML(items[i]));
  }
  carousel.size(items.length);
};

function mycarousel_getItemHTML(i)
{
  var item = i.split(':'); //prod_id:tpl_id:folder
  return '<' + 'a href="/template/' + item[0] + '" title="Template for Sale #' + item[1] + '"><img src="/website_templates/' + item[2] + '/' + item[1] + '/home_' + item[1] + '.jpg" width="134" height="96" alt="Template for Sale #' + item[1] + '" border="0" ' + '/' + '>' + '<' + '/' + 'a>';
};

jQuery(document).ready(function() {
  jQuery('#mycarousel').jcarousel({
    start: 1,
    itemLoadCallback: mycarousel_itemLoadCallback
  });
});

/* -------------------- jCarousel for portfolio ---------------------- */

function mycarousel2_itemLoadCallback(carousel, state)
{
    // Since we get all URLs in one file, we simply add all items
    // at once and set the size accordingly.
    if (state != 'init')
        return;

    var curl = location.href;
    var section = 's_website';
    if (curl.match('s_graphic'))   section = 's_graphic';
    else if (curl.match('s_logo')) section = 's_logo';

    jQuery.get('/p/portfolio_small_ajax/'+section, function(data) {
        mycarousel2_itemAddCallback(carousel, carousel.first, carousel.last, data);
    });
};

// portfolio URLs
var a_portfolio = new Array();

var a_cache_img = new Array();

// default preload (caching)
var def_img_url = "default/default_grayscale.jpg";
a_cache_img[def_img_url] = new Image();
a_cache_img[def_img_url].src = portfolio_img_path + def_img_url;
var def_img_act = def_img_url.replace("_grayscale", "");
a_cache_img[def_img_act] = new Image();
a_cache_img[def_img_act].src = portfolio_img_path + def_img_act;

function mycarousel2_itemAddCallback(carousel, first, last, data)
{
    // Simply add all items at once and set the size accordingly.
    var items = data.split('|');
    var a_part = new Array();

    for (i = 0; i < items.length; i++) {
       a_part = items[i].split(";");

       // trim
       a_part[0] = a_part[0].replace(/\s/,"");
       a_part[1] = a_part[1].replace(/\s/,"");

       a_portfolio[a_part[0]] = a_part[1];

       carousel.add(i+1, mycarousel2_getItemHTML(a_part[0]));
    }

    carousel.size(items.length);
};

/**
 * Item html creation helper.
 */
function mycarousel2_getItemHTML(url)
{

    var colored_img = url.replace("_grayscale", "");

    // preload images
    a_cache_img[url] = new Image();
    a_cache_img[url].src = portfolio_img_path + url;
    a_cache_img[colored_img] = new Image();
    a_cache_img[colored_img].src = portfolio_img_path + colored_img;

    return '<img src="' + portfolio_img_path + url + '" width="65" height="45" alt="" border="0" onmouseover="rollOver(this, true);" onmouseout="rollOver(this, false);" onclick="getPortfolio(this);" alt="' + url + '" />';
};

jQuery(document).ready(function() {
    jQuery('#mycarousel2').jcarousel({
        vertical: true,
        scroll: 4,
        itemLoadCallback: mycarousel2_itemLoadCallback
    });
});

function rollOver(img, over) {
  var url = img.src;
  var a_url = url.split(portfolio_img_path);
  a_url.shift();
  url = a_url.join(portfolio_img_path);

  if (over) {
    url = url.replace("_grayscale", "");
  }
  else {
    a_url = url.split(".");
    var ext = a_url.pop();
    url = a_url.join(".") + "_grayscale." + ext;
  }

  if (a_cache_img[url]) img.src = a_cache_img[url].src;
}

function getPortfolio(img) {
  var url = img.src;
  var a_url = url.split(portfolio_img_path);
  a_url.shift();
  url = a_url.join(portfolio_img_path);

  a_url = url.split(".");
  var ext = a_url.pop();
  url = a_url.join(".") + "_grayscale." + ext;

  if (a_portfolio[url]) {
    cur_portfolio_img = url;
    jQuery.get('/p/portfolio_details_ajax/'+escape(a_portfolio[url]), function(data) {
       mycarousel2_PortfolioDetails(data);
    });
  }
}

var portfolio_img = new Image();
var cur_portfolio_img = ""; // current
var width = 0;
var height = 0;
var portfolio_load = false;
var a_images = new Array();

function trim(str, chars) {
    return ltrim(rtrim(str, chars), chars);
}

function ltrim(str, chars) {
    chars = chars || "\\s";
    return str.replace(new RegExp("^[" + chars + "]+", "g"), "");
}

function rtrim(str, chars) {
    chars = chars || "\\s";
    return str.replace(new RegExp("[" + chars + "]+$", "g"), "");
}

function mycarousel2_PortfolioDetails(data) {

  if (!document.images) return false;

  var details = data.split("|");

  var images = details[0];

  a_images = new Array();
  document.getElementById("views").innerHTML = "";
  document.getElementById("link_next").href = "#portfolio_content";
  document.getElementById("link_prev").href = "#portfolio_content";

  if (images.indexOf(";")!=-1) {
    document.getElementById("navigator").style.display = "block";
    document.getElementById("background_work").style.backgroundImage = "url(/themes/phpfaber/img_eng/background_work.jpg)";
    a_images = images.split(";");
    var a_img = a_images[0].split(":");
    document.getElementById("link_next").href = "javascript:getPage(1);";
    for (var i=0; i<a_images.length; i++) {
      document.getElementById("views").innerHTML += '<' + 'a href="javascript:getPage(' + i + ');"><img src="/themes/phpfaber/img/btn_views_' + (i==0?'on':'off') + '.gif" width="14" height="14" hspace="1" border="0" alt="Views ' + (i==0?'On':'Off') + '" alt="Views ' + (i==0?'On':'Off') + '" /' + '>' + '<' + '/' + 'a>';
    }
  }
  else {
    document.getElementById("navigator").style.display = "none";
    document.getElementById("background_work").style.backgroundImage = "url(/themes/phpfaber/img_eng/background_work_simple.jpg)";
    var a_img = images.split(":");
  }

  renderPortfolioImage(a_img);

  document.getElementById("text_name").innerHTML = details[1];
  document.getElementById("text_work").innerHTML = details[2] + '<p>&nbsp;<' + '/p>';
  details[3] = trim(details[3]);
  document.getElementById("text_url").innerHTML = details[3]!='n/a' && details[3]!='' ? details[3] : 'n/a';
  document.getElementById("text_url").href = details[3]!='n/a' && details[3]!='' ? details[3] : '#';
}

function renderPortfolioImage(a_img) {
  var img_src = a_img[0];
  var a_size = a_img[1].split("x");
  width = a_size[0];
  height = a_size[1];

  var a_url = cur_portfolio_img.split("/");
  a_url.pop();
  var portfolio_cat_path = a_url.join("/");
  img_src = portfolio_cat_path + "/" + img_src;

  // Layout zoom in
  if (a_img[2]) {
    document.getElementById("link_zoomin").href = portfolio_img_path + portfolio_cat_path + "/" + a_img[2];
  }
  else {
    document.getElementById("link_zoomin").href = portfolio_img_path + img_src.replace("_grayscale", ""); //"#portfolio_content";
  }

  portfolio_img.src = portfolio_img_path + img_src;

  if (!a_cache_img[img_src]) {
    a_cache_img[img_src] = new Image();
    a_cache_img[img_src].src = portfolio_img.src;
  }

  var img_act = img_src.replace("_grayscale", "");
  if (!a_cache_img[img_act]) {
    a_cache_img[img_act] = new Image();
    a_cache_img[img_act].src = portfolio_img_path + img_act;
  }

  portfolio_img.onload = displayPorfolioImage;
  document.getElementById("pik_portfolio").src = "/themes/phpfaber/img/_.gif";
  portfolio_load = false;
  setTimeout("displayPorfolioImage()", 500); // if onload fails in IE
}

function getPage(num) {
  if (a_images.length) {
    var a_img = a_images[num].split(":");
    renderPortfolioImage(a_img);
    document.getElementById("views").innerHTML = "";
    for (var i=0; i<a_images.length; i++) {
      document.getElementById("views").innerHTML += '<' + 'a href="javascript:getPage(' + i + ');"><img src="/themes/phpfaber/img/btn_views_' + (i==num?'on':'off') + '.gif" width="14" height="14" hspace="1" border="0" alt="Views ' + (i==num?'On':'Off') + '" /' + '>' + '<' + '/' + 'a>';
    }
    document.getElementById("link_next").href = "#portfolio_content";
    document.getElementById("link_prev").href = "#portfolio_content";
    if (num<(a_images.length-1)) document.getElementById("link_next").href = "javascript:getPage(" + (num+1) + ");";
    if (num>0) document.getElementById("link_prev").href = "javascript:getPage(" + (num-1) + ");";
  }
}

function displayPorfolioImage() {
  if (portfolio_load) return false;
  document.getElementById("pik_portfolio").width = width;
  document.getElementById("pik_portfolio").height = height;
  document.getElementById("pik_portfolio").src = portfolio_img.src;
  alignPortfolio();
  portfolio_load = true;
}

$(document).ready(function(){
  $(document).pngFix();
  update_cart();
});

function update_cart()
{
  $('#cart_element').load('/cart/index/cart_element');
}

jQuery(document).ready(function() {
  $("a.tooltip").wTooltip({
    style: {
        border: "1px solid gray",
        background: "#edeef0",
        color: "#000",
        padding: "10px",
        zIndex: "1000",
        textAlign: "left",
        width: "400px"
    },
    fadeIn: 600,
    fadeOut: 600
  });
});