/*
 * jQuery Topstory for NBA.de site 
 * Copyright 2010
 *
 * Author : Nicholas Ortenzio
 * Created : 2010/03/01
 * Last Modified : 2010/04/01
 *
 * Requires jQuery
 *
 * Dual licensed under the MIT and GPL licenses:
 *   http://www.opensource.org/licenses/mit-license.php
 *   http://www.gnu.org/licenses/gpl.html
 */


(function($){

  $.fn.TopStory = function(options) {

    /*
     * SET DEFAULTS
     */

    var defaults = $.extend({ initial:1 }, options);

    var selectors = { 
      panel:'.panel', 
      navPrev:'.nav-prev', 
      navNext:'.nav-next', 
      banner:'.banner', 
      playbutton : '.playbutton, .followlink',
      playbuttonLink : '.playbutton a', 
      overlayParent:'#hp-main', 
      overlayClose:'#ts_overlay_close'
    };

    var styles = [
      [ { left:'3%',  right:'',    zIndex:3, top:135 }, {width:168}],
      [ { left:'10%', right:'',    zIndex:5, top:100 }, {width:280}],
      [ { left:'',    right:'',    zIndex:7, top:15  }, {width:560}],
      [ { left:'',    right:'10%', zIndex:5, top:100 }, {width:280}],
      [ { left:'',    right:'3%',  zIndex:3, top:135 }, {width:168}]
    ];

    /*
     * INIT FUNCTION
     */

    var init = function() {

      // Alias self
      var $this = $(this);

      $this.find(selectors.panel).each(function(){createWatchButton($(this))});

      // Create event handlers
      var onPanelHover   = function() { $(this).toggleClass('ui-topstory-panel-hover') };
      var onNavHover     = function() { $(this).toggleClass('ui-topstory-nav-hover') };
      var onPanelClick   = function() { navigateTo($this, $.inArray(this, $(selectors.panel)))   };
      var onNavNextClick = function() { navigateTo($this, $this.data('currIndex')+1) };
      var onNavPrevClick = function() { navigateTo($this, $this.data('currIndex')-1) };
      var onWindowResize = function() { centerCurrent($this) };
      var onPlayClick    = function() { createVideoOverlay($this, this.href); };
      var onCloseClick   = function() { closeVideoOverlay($this)};

      // Set Panel Events
      $this.find(selectors.navPrev).click(function(){onNavPrevClick.apply(this)}).hover(function(){onNavHover.apply(this)});
      $this.find(selectors.navNext).click(function(){onNavNextClick.apply(this)}).hover(function(){onNavHover.apply(this)});
      $this.find(selectors.panel).click(function(){onPanelClick.apply(this)}).hover(function(){onPanelHover.apply(this)});
      $this.find(selectors.playbuttonLink).click(function(event){event.stopPropagation(); event.preventDefault(); onPlayClick.apply(this); })
		$this.find('.watch a').click(function(event){event.stopPropagation(); event.preventDefault(); onPlayClick.apply(this); })

      // Set Global Events
      $(selectors.overlayClose).click(function(){onCloseClick.apply(this)});
      $(window).resize(function(){onWindowResize.apply(this)});
      
      // Set some widget data 
      $this.data('panels', $this.find(selectors.panel));
      $this.data('currIndex', defaults.initial-1);
      $this.data('animationSpeed', defaults.speed);

      // Init panel layout
      navigateTo($this, $this.data('currIndex'));

    }
  
    /*
     *  METHODS
     */

    var getPanelFromCurrent = function(index, length, offset) { return ((index+length)+offset)%length; }
    var centerCurrent = function($this) { $this.find('.ui-topstory-current').css({left:($this.width()/2 - 280)}); };
    var navigateTo = function($this, navIndex) { setPositions($this, getPanelArray($this, navIndex)); };
    var getPlayerIdFromVideoUrl = function(videoUrl) { return "" };

    var getPanelArray = function($this, index) {
      var panels = $this.data('panels');
      $this.data('currIndex', getPanelFromCurrent(index, panels.length, 0))
      panels.removeClass('ui-topstory-current ui-topstory-visible')
      $this.find(selectors.banner).hide();
      $this.find(selectors.playbutton).hide();

      return [
        $(panels[getPanelFromCurrent(index, panels.length, -2)]),
        $(panels[getPanelFromCurrent(index, panels.length, -1)]),
        $(panels[getPanelFromCurrent(index, panels.length, 0)]),
        $(panels[getPanelFromCurrent(index, panels.length, 1)]),
        $(panels[getPanelFromCurrent(index, panels.length, 2)])
      ];  
    }

    var setPositions = function($this, pVis) {
      for (var x=0; x<pVis.length; ++x) { pVis[x].css(styles[x][0]).addClass('ui-topstory-visible').find('.image').css(styles[x][1]); }

      // Center current and display 
      pVis[2].css({top:5}).addClass('ui-topstory-current');
      pVis[2].find(selectors.banner).show();
      pVis[2].find(selectors.playbutton).show();
      centerCurrent($this);
    }



    /*
     *
     */

    var createWatchButton = function($this) {
      var href = $this.find(selectors.playbuttonLink).attr('href');
      if (href) {
        var $watch = $('<ul class="watch"><li class="left"></li><li class="middle"><a href="' + href + '">ANSEHEN</a></li><li class="right"></li></ul>');
        $this.find('.banner').prepend($watch);
      } else {
        return;
      }
    }


    /*
     * OVERLAY METHODS
     */

    var createVideoOverlay = function($this, url) { 
      $("#ts_overlay").show();
      ksd.init("ts_overlay_player", url.substring(url.lastIndexOf("/")+1));
    };

    var closeVideoOverlay = function($this) {
      ksd.close();
      $("#ts_overlay").hide();
    }

    /*
     * EXECUTE FOR EACH jQuery Object
     */
 
    return this.each(init).addClass('topstory module');

  };

})(jQuery);