moschino-ccss16/dev/js/views/LiveView.js

Moschino's Capsule Collection Spring Summer 2016 package

var LiveView = {
	$el : null,
	bodyClass : null,
	itemsJSON : {
		"items" : []
	},
	pages : {
		default : 'looks',
		actual : null,
		prev : null,
		sections : {
			'looks' : { 'page': '/shop-by-look', 'url': 'static/templates/shop-by-look.html', 'view': 'LiveLooksView', 'object': looksJSON },
			'items' : { 'page': '/shop-by-item', 'url': 'static/templates/shop-by-item.html', 'view': 'LiveItemsView', 'object': this.itemsJSON },
			'fashion' : { 'page': '/fashion-show', 'url': 'static/templates/fashion-show.html', 'view': 'LiveFashionView', 'object': galleryJSON },
			'social' : { 'page': '/social', 'url': 'static/templates/social-stream.html', 'view': 'LiveSocialView' }
		}
	},

	initialize : function() {
		this.$el = $('body');
		this.bodyClass = this.$el.attr('class');

		TweenMax.lagSmoothing(0);
		TweenMax.force3D = true;

		this.buildItemsJSON();
		this.registerHelperCompare();

		RouterView.initialize();

		// BIND ALL PAGE EVENT
		this.bindEvents();
	},

	buildItemsJSON : function() {
		for( i = 0; i < looksJSON.looks.length; i++ ) {
			for( z = 0; z < looksJSON.looks[i].items.length; z++ ) {
				this.itemsJSON.items.push(looksJSON.looks[i].items[z]);
				this.itemsJSON.items[this.itemsJSON.items.length-1].gender = looksJSON.looks[i].gender;
			}
		}

		this.itemsJSON.items.sort(function(a, b){
			var keyA = a.order,
			keyB = b.order;

			if(keyA < keyB) return -1;
			if(keyA > keyB) return 1;
			return 0;
		});

		this.pages.sections.items.object = this.itemsJSON;
	},

	getSection : function(callback) {
		if(this.pages.prev !== null) window[this.pages.sections[this.pages.prev].view].unbindEvents();
		var _path = this.pages.sections[this.pages.actual].url;

		this.$el.find('header#sp nav li a.active').removeClass('active');
		this.$el.find('header#sp nav li a[data-page='+this.pages.actual+']').addClass('active');

		this.$el.find('.loading').fadeIn(500).dequeue();

		_gaq.push(['_trackEvent', 'CustomTemplateEvents', 'MOSCHINO_CC_SS16', 'live_pageRequested_'+this.pages.actual ]);
		_gaq.push(['_trackEvent', 'CustomTemplateEvents', 'MOSCHINO_CC_SS16', 'live_pageRequested_'+this.pages.actual+'_fromPreviousPage_'+this.pages.prev ]);

		$.ajax( {
			url: _path,
			cache: false,
			crossDomain: true,
			contentType: 'text/html',
			type: 'GET',

			success: $.proxy( function(data) {
				this.$el.find('.loading').fadeOut(500).dequeue();

				this.$el.find('.body section').removeClass('show').addClass('hide');

				var changeView = setTimeout( function() {
					this.$el.find('.body section').remove();

					var template = Handlebars.compile(data);
					var params = this.pages.sections[this.pages.actual].object !== undefined ? this.pages.sections[this.pages.actual].object : '';

					this.$el.find('.body').append( template( params ) );

					if( callback === undefined ) {
						var fn = window[this.pages.sections[this.pages.actual].view].initialize();
						if (typeof fn === "function") fn.apply(null, fnparams);
					} else {
						callback( this );
					}

					this.preloadImage();

				}.bind(this), 500);
			}, this ),

			error: function(data) {
				_gaq.push(['_trackEvent', 'CustomTemplateEvents', 'MOSCHINO_CC_SS16', 'live_pageError_'+this.url ]);
			},

			complete: function(data) {
				_gaq.push(['_trackEvent', 'CustomTemplateEvents', 'MOSCHINO_CC_SS16', 'live_pageLoaded_'+this.url ]);
				_gaq.push(['_trackPageview', this.url]);
			}
		} );
	},

	preloadImage : function(callback, callback2) {
		this.imgCount = this.$el.find('img[data-action=preload]').length;

		this.$el.find('img[data-action=preload]').each(function() {
			$(this).one('load', function() {
				$(this).addClass('show');
				if( callback !== undefined ) callback( this );
			});
			if (this.complete) $(this).trigger('load');
		});
	},

	changePage : function(event) {
		var _page = $(event.currentTarget).data('page');
		if( _page == this.pages.actual ) event.preventDefault();
	},

	registerHelperCompare : function() {
		Handlebars.registerHelper('equal', function(lvalue, rvalue, options) {
			if (arguments.length < 3) throw new Error("Handlebars Helper equal needs 2 parameters");
			if( lvalue!=rvalue ) return options.inverse(this);
			else return options.fn(this);
		});
	},

	bindEvents : function() {
		this.$el.find('header#sp nav li a').on('click', $.proxy( this.changePage, this ) );
	}
};