/**
 * jQuery Masonry v2.0.110517 beta
 * The flip-side of CSS Floats.
 * jQuery plugin that rearranges item elements to a grid.
 * http://masonry.desandro.com
 *
 * Licensed under the MIT license.
 * Copyright 2011 David DeSandro
 */
(function( window, $, undefined ){

 /*
 * smartresize: debounced resize event for jQuery
 *
 * latest version and complete README available on Github:
 * https://github.com/louisremi/jquery.smartresize.js
 *
 * Copyright 2011 @louis_remi
 * Licensed under the MIT license.
 */

 var $event = $.event,
 resizeTimeout;

 $event.special.smartresize = {
 setup: function() {
 $(this).bind( "resize", $event.special.smartresize.handler );
 },
 teardown: function() {
 $(this).unbind( "resize", $event.special.smartresize.handler );
 },
 handler: function( event, execAsap ) {
 // Save the context
 var context = this,
 args = arguments;

 // set correct event type
 event.type = "smartresize";

 if ( resizeTimeout ) { clearTimeout( resizeTimeout ); }
 resizeTimeout = setTimeout(function() {
 jQuery.event.handle.apply( context, args );
 }, execAsap === "execAsap"? 0 : 100 );
 }
 };

 $.fn.smartresize = function( fn ) {
 return fn ? this.bind( "smartresize", fn ) : this.trigger( "smartresize", ["execAsap"] );
 };



// ========================= Masonry ===============================


 // our "Widget" object constructor
 $.Mason = function( options, element ){
 this.element = $( element );

 this._create( options );
 this._init();
 };
 
 // styles of container element we want to keep track of
 var masonryContainerStyles = [ 'position', 'height' ];
 
 $.Mason.settings = {
 isResizable: true,
 isAnimated: false,
 animationOptions: {
 queue: false,
 duration: 500
 },
 gutterWidth: 0,
 isRTL: false,
 isFitWidth: false
 };

 $.Mason.prototype = {

 _getBricks: function( $elems ) {
 var selector = this.options.itemSelector,
 // if there is a selector
 // filter/find appropriate item elements
 $bricks = !selector ? $elems : 
 $elems.filter( selector ).add( $elems.find( selector ) );
 $bricks
 .css({ position: 'absolute' })
 .addClass('masonry-brick');
 return $bricks;
 },
 
 // sets up widget
 _create : function( options ) {
 
 this.options = $.extend( true, {}, $.Mason.settings, options );
 
 this.styleQueue = [];
 // need to get bricks
 this.reloadItems();


 // get original styles in case we re-apply them in .destroy()
 var elemStyle = this.element[0].style;
 this.originalStyle = {};
 for ( var i=0, len = masonryContainerStyles.length; i < len; i++ ) {
 var prop = masonryContainerStyles[i];
 this.originalStyle[ prop ] = elemStyle[ prop ] || null;
 }

 this.element.css({
 position : 'relative'
 });
 
 this.horizontalDirection = this.options.isRTL ? 'right' : 'left';
 this.offset = {};
 
 // get top left position of where the bricks should be
 var $cursor = $( document.createElement('div') );
 this.element.prepend( $cursor );
 this.offset.y = Math.round( $cursor.position().top );
 // get horizontal offset
 if ( this.options.isRTL ) {
 this.offset.x = Math.round( $cursor.position().left );
 } else {
 $cursor.css({ 'float': 'right', display: 'inline-block'});
 this.offset.x = Math.round( this.element.outerWidth() - $cursor.position().left );
 }
 $cursor.remove();

 // add masonry class first time around
 var instance = this;
 setTimeout( function() {
 instance.element.addClass('masonry');
 }, 0 );
 
 // bind resize method
 if ( this.options.isResizable ) {
 $(window).bind( 'smartresize.masonry', function() { 
 instance.resize();
 });
 }
 
 },
 
 // _init fires when your instance is first created
 // (from the constructor above), and when you
 // attempt to initialize the widget again (by the bridge)
 // after it has already been initialized.
 _init : function( callback ) {
 
 this.reLayout( callback );

 },

 option: function( key, value ){
 
 // get/change options AFTER initialization:
 // you don't have to support all these cases,
 // but here's how:
 
 // signature: $('#foo').bar({ cool:false });
 if ( $.isPlainObject( key ) ){
 this.options = $.extend(true, this.options, key);
 
 // signature: $('#foo').option('cool'); - getter
 } else if ( key && typeof value === "undefined" ){
 return this.options[ key ];
 
 // signature: $('#foo').bar('option', 'baz', false);
 } else {
 this.options[ key ] = value;
 }
 
 return this; // make sure to return the instance!
 },
 
 // ====================== General Layout ======================

 // used on collection of atoms (should be filtered, and sorted before )
 // accepts atoms-to-be-laid-out to start with
 layout : function( $bricks, callback ) {

 // layout logic
 var $brick, colSpan, groupCount, groupY, groupColY, j;
 
 for (var i=0, len = $bricks.length; i < len; i++) {
 $brick = $( $bricks[i] );
 //how many columns does this brick span
 colSpan = Math.ceil( $brick.outerWidth(true) / this.columnWidth );
 colSpan = Math.min( colSpan, this.cols );

 if ( colSpan === 1 ) {
 // if brick spans only one column, just like singleMode
 this._placeBrick( $brick, this.cols, this.colYs );
 } else {
 // brick spans more than one column
 // how many different places could this brick fit horizontally
 groupCount = this.cols + 1 - colSpan;
 groupY = [];

 // for each group potential horizontal position
 for ( j=0; j < groupCount; j++ ) {
 // make an array of colY values for that one group
 groupColY = this.colYs.slice( j, j+colSpan );
 // and get the max value of the array
 groupY[j] = Math.max.apply( Math, groupColY );
 }
 
 this._placeBrick( $brick, groupCount, groupY );
 }
 }
 
 // set the size of the container
 var containerSize = {};
 containerSize.height = Math.max.apply( Math, this.colYs ) - this.offset.y;
 if ( this.options.isFitWidth ) {
 containerSize.width = this.cols * this.columnWidth - this.options.gutterWidth;
 }
 this.styleQueue.push({ $el: this.element, style: containerSize });

 // are we animating the layout arrangement?
 // use plugin-ish syntax for css or animate
 var styleFn = !this.isLaidOut ? 'css' : (
 this.options.isAnimated ? 'animate' : 'css'
 ),
 animOpts = this.options.animationOptions;

 // process styleQueue
 var obj;
 for (i=0, len = this.styleQueue.length; i < len; i++) {
 obj = this.styleQueue[i];
 obj.$el[ styleFn ]( obj.style, animOpts );
 }

 // clear out queue for next time
 this.styleQueue = [];

 // provide $elems as context for the callback
 if ( callback ) {
 callback.call( $bricks );
 }
 
 this.isLaidOut = true;

 return this;
 },
 
 // calculates number of columns
 // i.e. this.columnWidth = 200
 _getColumns : function() {
 var container = this.options.isFitWidth ? this.element.parent() : this.element,
 containerWidth = container.width();
 
 this.columnWidth = this.options.columnWidth ||
 // or use the size of the first item
 this.$bricks.outerWidth(true) ||
 // if there's no items, use size of container
 containerWidth;

 this.columnWidth += this.options.gutterWidth;

 this.cols = Math.floor( ( containerWidth + this.options.gutterWidth ) / this.columnWidth );
 this.cols = Math.max( this.cols, 1 );

 return this;

 },

 _placeBrick : function( $brick, setCount, setY ) {
 // get the minimum Y value from the columns
 var minimumY = Math.min.apply( Math, setY ),
 setHeight = minimumY + $brick.outerHeight(true),
 i = setY.length,
 shortCol = i,
 setSpan = this.cols + 1 - i,
 position = {};
 // Which column has the minY value, closest to the left
 while (i--) {
 if ( setY[i] === minimumY ) {
 shortCol = i;
 }
 }

 // position the brick
 position.top = minimumY;
 // position.left or position.right
 position[ this.horizontalDirection ] = this.columnWidth * shortCol + this.offset.x;
 this.styleQueue.push({ $el: $brick, style: position });

 // apply setHeight to necessary columns
 for ( i=0; i < setSpan; i++ ) {
 this.colYs[ shortCol + i ] = setHeight;
 }

 },
 
 
 resize : function() {
 var prevColCount = this.cols;
 // get updated colCount
 this._getColumns('masonry');
 if ( this.cols !== prevColCount ) {
 // if column count has changed, do a new column cound
 this._reloadLayout();
 }
 },
 
 
 reLayout : function( callback ) {
 this._getColumns('masonry');
 this._reloadLayout( callback );
 },
 
 _reloadLayout : function( callback ) {
 // reset columns
 var i = this.cols;
 this.colYs = [];
 while (i--) {
 this.colYs.push( this.offset.y );
 }
 // apply layout logic to all bricks
 this.layout( this.$bricks, callback );
 },
 
 // ====================== Convenience methods ======================
 
 // goes through all children again and gets bricks in proper order
 reloadItems : function() {
 this.$bricks = this._getBricks( this.element.children() );
 },
 
 
 reload : function( callback ) {
 this.reloadItems();
 this.reLayout( callback );
 },
 

 // convienence method for working with Infinite Scroll
 appended : function( $content, callback ) {
 var $newBricks = this._getBricks( $content );
 // add new bricks to brick pool
 this.$bricks = this.$bricks.add( $newBricks );
 this.layout( $newBricks, callback );
 },
 
 // removes elements from Masonry widget
 remove : function( $content ) {
 this.$bricks = this.$bricks.not( $content );
 $content.remove();
 },
 
 // destroys widget, returns elements and container back (close) to original style
 destroy : function() {

 this.$bricks
 .removeClass('masonry-brick')
 .each(function(){
 this.style.position = null;
 this.style.top = null;
 this.style.left = null;
 });
 
 // re-apply saved container styles
 var elemStyle = this.element[0].style;
 for ( var i=0, len = masonryContainerStyles.length; i < len; i++ ) {
 var prop = masonryContainerStyles[i];
 elemStyle[ prop ] = this.originalStyle[ prop ];
 }
 
 this.element
 .unbind('.masonry')
 .removeClass('masonry')
 .removeData('masonry');
 
 $(window).unbind('.masonry');

 }
 
 };
 
 
 // ======================= imagesLoaded Plugin ===============================
 // A fork of http://gist.github.com/268257 by Paul Irish

 // mit license. paul irish. 2010.
 // webkit fix from Oren Solomianik. thx!

 $.fn.imagesLoaded = function(callback){
 var elems = this.find('img'),
 len = elems.length,
 blank = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==",
 _this = this;

 // if no images, trigger immediately
 if ( !len ) {
 callback.call( this );
 return this;
 }
 
 elems.bind('load', function() {
 if ( --len <= 0 && this.src !== blank ) {
 callback.call( _this ); 
 }
 }).each(function(){
 // cached images don't fire load sometimes, so we reset src.
 if (this.complete || this.complete === undefined){
 var src = this.src;
 // webkit hack from http://groups.google.com/group/jquery-dev/browse_thread/thread/eee6ab7b2da50e1f
 // data uri bypasses webkit log warning (thx doug jones)
 this.src = blank;
 this.src = src;
 } 
 }); 

 return this;
 };

 
 // ======================= Plugin bridge ===============================
 // leverages data method to either create or return $.Mason constructor
 // A bit from jQuery UI
 // https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.widget.js
 // A bit from jcarousel 
 // https://github.com/jsor/jcarousel/blob/master/lib/jquery.jcarousel.js

	$.fn.masonry = function( options ) {
		if ( typeof options === 'string' ) {
			// call method
			var args = Array.prototype.slice.call( arguments, 1 );
			return this.each(function(){
				var instance = $.data( this, 'masonry' );
				if ( !instance ) {
					return $.error( "cannot call methods on masonry prior to initialization; " +
						"attempted to call method '" + options + "'" );
				}
				if ( !$.isFunction( instance[options] ) || options.charAt(0) === "_" ) {
					return $.error( "no such method '" + options + "' for masonry instance" );
				}
				// apply method
				instance[ options ].apply( instance, args );
			});
		} else {
			return this.each(function() {
				var instance = $.data( this, 'masonry' );
				if ( instance ) {
					// apply options & init
					instance.option( options || {} )._init();
				} else {
					// initialize new instance
					$.data( this, 'masonry', new $.Mason( options, this ) );
				}
			});
		}
	};

	$.fn.Masonrys = function(options){
		var dom = this, config = {
			itemSelector : '.masonryBox', // selector for all items you'll retrieve
			imagesLoaded: false,
			infinitescroll: false
		};
		$.extend(config, options);
		if(config.imagesLoaded){
			$(dom).imagesLoaded(function(){
				$(dom).masonry(config);
			});
		}else{
			$(dom).masonry(config);
		}
		if(config.infinitescroll){
			function successfullyLoadedCallback(newElements){
				var $newElems = $(newElements);
				$newElems.css({
					left: $(dom).width() / 2,
					top: $(dom).height()
				})
				setTimeout( function(){
					if(config.imagesLoaded){
						$(dom).imagesLoaded(function(){
							$(dom).masonry('appended', $newElems);
						});
					}else{
						$(dom).masonry('appended', $newElems);
					}
				},10);
			}
			$(dom).InfiniteScrolls(config, successfullyLoadedCallback);
		}
	}

})( window, jQuery );