(function($) {
	
	FeatureView = Backbone.View.extend({
		el: $('#shellWrapper')

		,initialize: function initialize () {
			_.bindAll(this, 'render');

			this.render();
		}
		
		,events: {
		    'click .featured_product': 'followFeatureAnchor'
		    ,'click .featured_product a': 'preventDefaultAnchorCLick'
		    ,'hover .featured_product': 'toggleFeatureAnchorState'
		}

		,render: function render () {
			var self = this
			,vars = {
				title : this.model.get('title')
				,subTitle : this.model.get('subTitle')
				,linkText : this.model.get('linkText')
				,linkHref : this.model.get('linkHref')
			}
			,template = _.template( $('#feature_template').html(), vars );

			$(this.el).append( template );	

   			pubsub.subscribe('ryerson/windowResize', function () {
   				self.reposition();
   			});

   			self.reposition();
		}

		,reposition: function reposition () {
			var windowWidth = $(window).width()
				,contentOffset = $('.shellContent').offset()
				,target = $('.featured_product')
				,targetWidth = target.width()
				,targetPadding = parseInt( target.css('padding-left') ) + parseInt( target.css('padding-right') );

			if ( $('#shellWrapper').hasClass('large') ) {
				target.css('top', 650);
			} else if ( $('#shellWrapper').hasClass('medium') ) {
				target.css('top', 440);
			} else {
				// Do nothing
			}

			target.css('left', ( windowWidth - contentOffset.left - ( target.width() + targetPadding ) - 2 ) );
		}
		
		,followFeatureAnchor: function followFeatureAnchor(ev) {
		    window.location = $(ev.currentTarget).find('a')[0].href;
		}
		
		,preventDefaultAnchorCLick: function preventDefaultAnchorCLick(ev) {
		    ev.preventDefault();
		}
		
		,toggleFeatureAnchorState: function toggleFeatureAnchorState(ev) {
		    $(ev.currentTarget).toggleClass('featured_product_wrap_hover');
		}
	});

}(jQuery));