From 27163e3bdb5136b457d64a6622bcacd1064502f1 Mon Sep 17 00:00:00 2001 From: David DeSandro Date: Thu, 16 Dec 2010 23:28:23 -0500 Subject: [PATCH] Adding cellsByRow layout logic --- _layouts/elements.html | 6 +++++- src/jquery.molequul.js | 34 ++++++++++++++++++++++++++++++++-- 2 files changed, 37 insertions(+), 3 deletions(-) diff --git a/_layouts/elements.html b/_layouts/elements.html index a49cf2b..974174d 100644 --- a/_layouts/elements.html +++ b/_layouts/elements.html @@ -251,7 +251,7 @@

Etc

@@ -302,6 +302,10 @@ masonry : { columnWidth : 120 }, + cellsByRow : { + columnWidth : 240, + rowHeight : 240 + }, animationEngine : $.browser.opera ? 'jquery' : 'best-available', // animationEngine : 'jquery', getSortData : { diff --git a/src/jquery.molequul.js b/src/jquery.molequul.js index 280bd08..a92551d 100755 --- a/src/jquery.molequul.js +++ b/src/jquery.molequul.js @@ -459,6 +459,8 @@ this[ namespace ].cols = Math.floor( this.width / this[ namespace ].columnWidth ) ; this[ namespace ].cols = Math.max( this[ namespace ].cols, 1 ); + console.log( 'cols for ' + namespace, this[ namespace ].cols ) + return this; } @@ -565,7 +567,7 @@ }; - // ====================== rows ====================== + // ====================== clearFloat ====================== $.Molequul.prototype._clearFloatLayout = function( $elems ) { var instance = this; @@ -609,7 +611,35 @@ this.width = this.element.width(); return this.reLayout() }; - + + + // ====================== cellsByRow ====================== + + $.Molequul.prototype._cellsByRowReset = function() { + this.cellsByRow = {}; + this._getCols('cellsByRow'); + this.cellsByRow.rowHeight = this.options.cellsByRow.rowHeight || this.$allAtoms.outerHeight(true); + return this; + }; + + $.Molequul.prototype._cellsByRowLayout = function( $elems ) { + var instance = this; + this.cellsByRow.atomsLen = $elems.length; + $elems.each( function( i ){ + var $this = $(this), + x = ( i % instance.cellsByRow.cols ) * instance.cellsByRow.columnWidth + instance.posLeft, + y = ~~( i / instance.cellsByRow.cols ) * instance.cellsByRow.rowHeight + instance.posTop; + console.log( x, y ) + + instance._pushPosition( $this, x, y ); + + }); + }; + + $.Molequul.prototype._cellsByRowGetContainerSize = function() { + console.log( Math.ceil( this.cellsByRow.atomsLen / this.cellsByRow.cols ) ) + return { height : Math.ceil( this.cellsByRow.atomsLen / this.cellsByRow.cols ) * this.cellsByRow.rowHeight + this.posTop }; + };