(function ($, b, $i) {
	var ViweToRender = $i.Api.View.extend({
		render : function(){
			this.el = $(this.template(this.model.toJSON()));
			return this;
		}
	});
	
	/*========Post Thumbs=========*/
	$i.ThumbView = ViweToRender.extend({
		template: $("#thumb-template").length > 0 ? _.template($("#thumb-template" ).html()):"",
		getFrameClass : function() {
			var min = 1;
			var max = 5;
			var random = Math.floor(Math.random() * (max - min + 1)) + min;
			return "frame-color-" + random;
		}
	});

	$i.ThumbsView = $i.Api.View.extend({
		initialize : function(options) {
			this._columns_number = 4 ;
			this.columns = new Array();
			this.render();
		},
		events: {
		  "click #logo": "goup"
		},
		goup: function(){
			$('html,body').animate({
				scrollTop: 0
			}, 1000);
		},
		render : function() {
			for(var i = 0 ; i < this._columns_number ; i++) {
				this.columns[i] = $("<ul>");
			}
			
			this.columns[this.columns.length-1].addClass("last");
			
			var current = 0;
			var t = this;
			this.collection.each(function(post,index){
				if(current >= t._columns_number) current = 0;
				var thumbView = new $i.ThumbView({model : post});
				t.columns[current].append(thumbView.render().el);
				
				//posts for thumb only
				if(post.get("thumb_only") == 1) {
					thumbView.$(".post").addClass("thumb-only").attr("href","javascript:void(0);");
					thumbView.$(".post").parent('li').mouseover(function() {
						$(this).find("img").attr("src",post.get("title_image"));
					});
					thumbView.$(".post").parent('li').mouseout(function() {
						$(this).find("img").attr("src",post.get("post_thumb"));
					});
				}
				
				current++;
			});
				
			//add logo
			this.columns[this._columns_number-1].prepend('<div id="logo"></div>');
			this.columns[this.columns.length-1].find('li').eq(0).addClass("offset");
			
			//add columns into the view here
			for(index in this.columns) {
				this.el.append(this.columns[index]);
			}
			
			
			//adjust the size of the frame
			this.$('.frame').each(function() {
			    var t = $(this);
			    var image = t.parent().find('img');
			    image.load(function(){
			    	t.css({width: image.width()-7, height:image.height()-7})
				});
			}) 
			
			//populate the dummy post for testing, remove this later
			/*
			this.$('ul').each(function(){
				for(var i =0 ; i < 10 ; i++){
					$(this).find('li').last().clone().appendTo($(this));
				}
			});
			*/
		}
	});
	
	/*========Post Slider=========*/
	
	$i.PostView = ViweToRender.extend({
		template: $("#post-template" ).length > 0 ? _.template($("#post-template").html()):""
	});
	
	$i.PostsView = $i.Api.View.extend({
		initialize: function(options) {
			this.next = this.$('.next').click(_.bind(this.toNext, this));
			this.previous = this.$('.previous').click(_.bind(this.toPrevious, this));
			this.content = this.$('div.post');
			this.current = null;
			this.navigating = false;
		},
		toNext: function(e) {
			this.navigating = true;
			if (e instanceof $.Event) {
				target = $(e.target);
				e.preventDefault();
			}
			
			var post = this.collection.next();
			if (post != null) {
				this.current = post.get("slug");
				this.render(post);
			} 
		},
		toPrevious: function(e) {
			this.navigating = true;
			if (e instanceof $.Event) {
				target = $(e.target);
				e.preventDefault();
			}
			
			var post = this.collection.previous();
			if (post != null) {
				this.current = post.get("slug");
				this.render(post);
			}
		},
		navigateTo: function(slug) {
			if(this.current == slug) return;
			this.current = slug ;
			var post = this.collection.goTo(slug);
			if(post != null)
				this.render(post);
		}, 
		render: function(post) {
			var t = this;
			this.content.fadeOut('fast',function() {
			
				var postView = new $i.PostView({model : post});
				t.content.html(postView.render().el);
					
				//reset navigation
				location.hash =  post.get("slug");
				var nextPost = t.collection.nextPost();
				if(nextPost != null) {
					t.next.removeClass('inactive');
					t.next.attr("href","#" + nextPost.get("slug"));
				}
				else
					t.next.addClass('inactive');
				var previousPost = t.collection.previousPost();
				if(previousPost != null) {
					t.previous.removeClass('inactive');
					t.previous.attr("href","#" + previousPost.get("slug"));
				}
				else
					t.previous.addClass('inactive');
				
				//if no title img provided
				if(t.$(".post-image").attr("src") == "")
					t.$(".post-image").remove();
				
				//if the embed is set up
				if(post.get('title_embed')) {
					t.$(".post-image").remove();
					$(post.get('title_embed')).appendTo( t.$('.post-theme'));
					t.$("iframe").each(function(){
					      var ifr_source = $(this).attr('src');
					      var wmode = "wmode=transparent";
					      if(ifr_source.indexOf('?') != -1) $(this).attr('src',ifr_source+'&'+wmode);
					      else $(this).attr('src',ifr_source+'?'+wmode);
					});
				}
				
				//enable touch swipe
				$(".post .post-image").touchwipe({
				     wipeLeft: function() { 
				     	if(!t.navigating)
							t.toPrevious();
					 },
				     wipeRight: function() {
				     	if(!t.navigating) 
							t.toNext();
				     },
				     wipeUp: function() { 
				     	$('html,body').animate({scrollTop:0}, 600);
				     },
    			     wipeDown: function() { 
    			     	$('html,body').animate({scrollTop:$(document).height()}, 1000);
    			     },
				     min_move_x: 20,
				     min_move_y: 20,
				     preventDefaultEvents: true
				});
				
				
				//parse fb xfbml tag for share button
				FB.XFBML.parse();

				//register the flash player
				t.registerPlayer();		
				
				//ramdonly change title color
				var min = 1;
				var max = 5;
				var random = Math.floor(Math.random() * (max - min + 1)) + min;
				var colorSet = "title-color-" + random;
				t.$(".post-title").addClass(colorSet); 
				
				//render
				t.content.fadeIn('fast',function(){
					t.navigating = false;
				});	
				
			
			});
		},
		registerPlayer: function() {
			$("object[id^=svdo]").each(function(){
				swfobject.registerObject(this.id, "9.0.115");
				$(this).css("visibility","visible");
			});
		}
	});
})(jQuery, Backbone, Insurge);