/*
 * JavaScript Slider v0.1-rc3
 * Copyright 2011, Gregor Mazovec <gregor.mazovec@gmail.com>
 */

(function() {

  var $ = jQuery;
  var _, _xml, _pos, width, height, size, tabWidth, tabOffset;

  var cfg = {
    randomLoad: false,
    fadeFromColor: "#fff",
    fadeDuration: "500",
    stripBackColor: "#000",
    stripOpacity: "0.5",
    thumbPosition: "bottom",
    thumbStripBackColor: "#222",
    thumbStripOpacity: "0.4",
    autoMode: true,
    autoModeTimeout: 5000,
    currentTab: null
  };


  // load configuration XML
  $.ajax({
    type: "GET",
    url: "banner/config.xml",
    async: false,
    dataType: "xml",
    success: function(xml) {
      _xml = $(xml);
    }
  });

  function displayTab (pos) {

    pos--;

    var curTab = cfg.currentTab;
    var tab = $($(".tab")[pos]);
    var fadePos = tab.data("fadePosition").toLowerCase();
    var $ly = $(".ly-"+fadePos);
    var dur = cfg.fadeDuration;

    var vpos = cfg.thumbPosition.toLowerCase();
    var hpos = (tabWidth*pos)+tabOffset;

    cfg.currentTab = pos+1;

    $(".tab.active").removeClass("active");
    tab.addClass("active");

    if (curTab > 0) {
      $(".tab:eq("+(curTab-1)+") .bd").stop(true, true).animate({
        opacity: cfg.thumbStripOpacity
      });
    }
    tab.find(".bd").animate({
      opacity: "0"
    });

    $ly.find("strong")
      .css("color", tab.data("title-color"))
      .css("font-size", tab.data("title-font-size"))
      .text(tab.data("title"));

    $ly.find("span")
      .css("color", tab.data("subtitle-color"))
      .css("font-size", tab.data("subtitle-font-size"))
      .text(tab.data("subtitle"));

    if (tab.data("icon")) {
      $ly.find("img").attr("src", tab.data("icon"));
      $ly.find("a").attr("href", tab.data("iconURL"));
    }

    $(".banner").css("background-image", "url("+tab.data("img")+")");

    // hide visible overlays
    $(".ly-fade").stop(true, true).css("opacity", "0.9").animate({
      opacity: "0"
    }, dur);

    if ($.browser.msie) {
      $(".ly-arrow")
        .css("background-position", hpos+"px "+vpos);
    } else {
      $(".ly-arrow").stop(true, true).animate({
        backgroundPosition: hpos+"px "+vpos
      }, dur/2);
    }

    $(".strip").stop(true, true).each(function() {

      var $this = $(this);

      $this.hide().css("opacity", "0");

      if ($this.hasClass("ly-right")) {
        $this
          .css("width", "0")
          .css("left", (_pos.left+width)+"px");
      } else if ($this.hasClass("ly-bottom")) {
        $this
          .css("height", "0")
          .css("top", (_pos.top+height)+"px");
      } else if ($this.hasClass("ly-left")) {
        $this.css("width", "0");
      } else if ($this.hasClass("ly-top")) {
        $this.css("height", "0px");
      }
    });

    // show active overlay
    if (fadePos == "right") {
      $ly.show().animate({
        width: "110px",
        left: (_pos.left+width-110)+"px",
        opacity: cfg.stripOpacity
      }, dur);
    } else if (fadePos == "bottom") {
      $ly.show().animate({
        height: "35px",
        top: (_pos.top+height-35)+"px",
        opacity: cfg.stripOpacity
      }, dur);
    } else if (fadePos == "left") {
      $ly.show().animate({
        width: "110px",
        opacity: cfg.stripOpacity
      }, dur);
    } else if (fadePos == "top") {
      $ly.show().animate({
        height: "35px",
        opacity: cfg.stripOpacity
      }, dur);
    }
  }

  $(document).ready(function() {

    // IE alpha channel
    $(".strip img").each(function() {
      this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(...)";
    });

    // loading config
    var _map = {
      randomLoad: "RandomLoad",
      fadeFromColor: "FadeFromColor",
      fadeDuration: "FadeTimeFrames",
      stripBackColor: "StipBackColor",
      stripOpacity: "StipAlpha",
      thumbPosition: "PreviewThumbLocation",
      thumbStripBackColor: "PreviewThumbStripBackColor",
      thumbStripOpacity: "PreviewThumbStripAlpha"
    };

    var xml_root = _xml.find("banner");
    var xtab;

    // load banner config
    $.each(_map, function(key, val) {
      cfg[key] = xml_root.attr(val);
    });
    cfg.fadeDuration = parseInt(cfg.fadeDuration);
    cfg.randomLoad = (cfg.randomLoad == "true");

    // thumb position
    if (cfg.thumbPosition == "Top") {
      $(".tabs").clone().prependTo(".slider").addClass("top");
      $($(".tabs")[1]).remove();
      $(".ly-arrow").addClass("down");
    }

    // position overlays
    _pos = $(".banner").position();
    width = $(".banner").width() - 40;
    height = $(".banner").height() - 40;

    size = $(".tab").length;
    tabWidth = parseInt((width+40-8)/size);
    tabOffset = tabWidth/2;

    $(".ly-fade")
      .css("width", width+"px")
      .css("height", height+"px");
    $(".ly-arrow")
      .css("width", width+"px")
      .css("height", height+"px")
      .show();
    $(".ly-top")
      .css("width", width+"px");
    $(".ly-left")
      .css("height", height+"px");
    $(".ly-right")
      .css("height", height+"px")
      .css("left", (_pos.left+width)+"px");
    $(".ly-bottom")
      .css("width", width+"px")
      .css("top", (_pos.top+height)+"px");

    // overlay background
    $(".strip")
      .css("background-color", cfg.stripBackColor)
      .css("opacity", "0");
    $(".ly-fade")
      .css("background-color", cfg.fadeFromColor)
      .css("opacity", "0")
      .show();
    $(".tab .bd")
      .css("background-color", cfg.thumbStripBackColor)
      .css("opacity", cfg.thumbStripOpacity);

    _map = {
      title: "Title",
      subtitle: "Subtitle",
      img: "ImgURL",
      fadePosition: "Anchor",
      URL: "URL",
      icon: "URLImage",
      iconURL: "URLOnMouseOverImage"
    };

    // load tabs config
    $(".tab").each(function(i) {

      var _ = {
        tabPos: i+1
      };

      xtab = _xml.find("tab:eq("+i+")");

      $.each(_map, function(key, val) {
          _[key.toString()] = xtab.find(val).text();
      });

      _["title-font-size"] = xtab.find("Title").attr("FontSize");
      _["title-color"] = xtab.find("Title").attr("FontColor");

      _["subtitle-font-size"] = xtab.find("Subtitle").attr("FontSize");
      _["subtitle-color"] = xtab.find("Subtitle").attr("FontColor");

      // remove icon img element
      if (!_.icon)
        $(".ly-"+_.fadePosition.toLowerCase()+" a").remove();

      $(this).data(_);

      $(this).find(".inner").css("background-image", "url("+xtab.find("ThumbImgURL").text()+")");

      $(this).find(".bd strong")
        .css("font-size", xtab.find("ThumbTitle").attr("FontSize"))
        .css("color", xtab.find("ThumbTitle").attr("FontColor"))
        .text(xtab.find("ThumbTitle").text());
      $(this).find(".bd span")
        .css("font-size", xtab.find("ThumbSubtitle").attr("FontSize"))
        .css("color", xtab.find("ThumbSubtitle").attr("FontColor"))
        .text(xtab.find("ThumbSubtitle").text());

    });

    // render tab
    displayTab(1);

    // auto-mode
    if (cfg.autoModeTimeout > 0) {
      setInterval(function() {
        var curTab = cfg.currentTab;
        if (cfg.autoMode) {
          if (cfg.randomLoad) {
            _ = (Math.floor(Math.random() * 10) + size) % size;
            if (_+1 == curTab) _ = (_+1+size) % size;
          } else {
            _ = ((curTab+size) % size);
          }
          $(".tab:eq("+_+")").click();
        }
      }, cfg.autoModeTimeout);
    }

    // slider auto-mode switch
    $(".slider").hover(function() {
      cfg.autoMode = false;
    }, function() {
      cfg.autoMode = true;
    });

    // banner click
    $(".banner").click(function() {
      var url = $(".tab.active").data("URL");
      if (url != undefined)
        window.location = url;
    });

    // tab hover effect
    $(".tab .bd").hover(function() {
      $(this).stop(true, true).animate({
        opacity : "0"
      });
    }, function() {
      if ($(this).parent().parent().hasClass("active")) return;
      $(this).stop(true, true).animate({
        opacity : cfg.thumbStripOpacity
      });
    });

    // tab click
    $(".tab").click(function() {
      if ($(this).hasClass("active")) return;
      displayTab($(this).data("tabPos"));
    });

  });

})()
// vim:expandtab:ts=2