VodpodWidget = {

 vp_div: null,
 vp_videos_div: null,
 page: 1,
 per_page: 0,
 videos: {},
 resize_timeout: null,

 fetchVideos: function () {
  var obj = this;
  $.getJSON('http://api.vodpod.com/api/pod/videos.js?callback=?',
   {'api_key':'143db4682a01cc8d',
    'pod_id':'buzzflash',
    'page':this.page,
    'per_page':this.per_page},
   function (data) {
    obj.videos = data.videos;
    obj.showVideos();
   } 
  ); 
 },

 calculatePerPage: function () {
  var thumb_width = 160 + 2 + 3 + 2 + 3; // thumbnail + l&r border + l&r margin
  var div_padding = 33 + 33; // left and right arrows
  return Math.max(1, Math.floor((this.vp_div.width() - div_padding) / thumb_width)); 
 },

 resize: function () {
  var new_per_page = this.calculatePerPage();
  if (new_per_page == this.per_page) {
	return;
  }
  var new_page = Math.max(1, Math.floor((this.per_page/new_per_page)*(this.page-1)+1));
  this.per_page = new_per_page;
  this.page = new_page;
  this.fetchVideos();
 },

 showVideos: function () {

  if (this.page == 1) {
   $('#vodpod_arrow_left').css('display', 'none');
  } else {
   $('#vodpod_arrow_left').css('display', 'block');
  }

  if (this.page*this.per_page > this.videos.total) {
   $('#vodpod_arrow_right').css('display', 'none');
  } else {
   $('#vodpod_arrow_right').css('display', 'block');
  }

  $('.vodpod_video_td').remove();

  var obj = this;

  $.each(this.videos.items, function (i, item) {
   var vodpod_video = $('<div class="vodpod_video"></div>').hover(
    function () {
     $('.vodpod_video_title', this).css('display', 'none');
     $('.vodpod_video_views', this).css('display', 'block');
    },
    function () {
     $('.vodpod_video_title', this).css('display', 'block');
     $('.vodpod_video_views', this).css('display', 'none');
    }
   ).click(
    function () {
     obj.showVideoPlayer(item.video.title, item.video.autoplay_embed_tag);
    }
   );
   $('<img/>').attr('src', item.video.thumbnails.medium).attr('title', item.video.title).attr('width', '160').appendTo(vodpod_video);
   $('<div class="vodpod_video_title"/>').html(item.video.title).appendTo(vodpod_video);
   $('<div class="vodpod_video_views"/>').html(item.video.stats.total_views + ' views').appendTo(vodpod_video);
   td_box = $('<td class="vodpod_video_td"/>');
   vodpod_video.appendTo(td_box);
   td_box.appendTo('#vodpod_video_container');
  });
 },

 showVideoPlayer: function (title, embed) {
  $('.vodpod_video_player').remove();
  var video_player = $('<div class="vodpod_video_player"/>');
  $('<div class="vodpod_video_player_title"/>').html(title).bind('dragstart', function () {
    return video_player;}).bind('drag', function (event) {
     $(event.dragProxy).css({top: event.offsetY, left: event.offsetX}); }).appendTo(video_player);
  $('<div class="vodpod_video_player_embed"/>').html(embed).appendTo(video_player);
  $('<a href="http://vodpod.com/buzzflash" target="_blank" class="vodpod_video_player_vodpod_logo"></a>').appendTo(video_player);
  $('<div class="vodpod_video_player_close"/>').text("CLOSE").click(
   function () {
    $('.vodpod_video_player').remove();
   }
  ).appendTo(video_player); 
  video_player.appendTo('body');
  video_player.css({
   left: ($(window).width() - video_player.width())/2 + $(window).scrollLeft(),
   top: ($(window).height() - video_player.height())/2 + $(window).scrollTop()
  }); 
 },

 showPreviousPage: function () {
  if (this.page > 1) {
   this.page--;
   this.fetchVideos();
  }
 },

 showNextPage: function () {
  if (this.page*this.per_page < this.videos.total) {
   this.page++;
   this.fetchVideos();
  }
 },

 init: function () {
  var obj = this;
  this.vp_div = $('#vodpod_videos_widget');
  $('<div id="vodpod_balloon">').appendTo(this.vp_div);
  $('<div id="vodpod_arrow_left">').click(function () { obj.showPreviousPage(); }).appendTo(this.vp_div);
  $('<div id="vodpod_arrow_right">').click(function () { obj.showNextPage(); $('#vodpod_balloon').hide(); }).appendTo(this.vp_div);
  this.vp_videos_div = $('<table><tr id="vodpod_video_container"></tr></table>').appendTo(this.vp_div);
  this.resize();  
 }

};

$(document).ready(function () {
  VodpodWidget.init();
});

$(window).resize(function () {
  VodpodWidget.resize();
});