From: dsc Date: Mon, 9 Apr 2012 03:27:12 +0000 (-0700) Subject: Adds isotope custom layout modes. X-Git-Url: http://git.less.ly:3516/?a=commitdiff_plain;h=01501b751649d8284368196427781718337a82c5;p=limn.git Adds isotope custom layout modes. --- diff --git a/static/vendor/jquery.isotope.category-cols.js b/static/vendor/jquery.isotope.category-cols.js new file mode 100644 index 0000000..fe512fa --- /dev/null +++ b/static/vendor/jquery.isotope.category-cols.js @@ -0,0 +1,117 @@ +/* Category Columns -- Isotop custom layout mode */ +// +// See: http://isotope.metafizzy.co/custom-layout-modes/big-graph.html +// Usage: +// $container.isotope({ +// itemSelector: '.element', +// layoutMode: 'categoryCols', +// categoryCols: { +// columnWidth: 45, // size of item +// rowHeight: 45, // size of item +// maxRows: 11, // max number of items vertically +// gutterWidth: { // width of gutter, needs to match getSortData names +// year: 0, +// scale: 0, +// program: 35, +// status: 80, +// title: 0 +// } +// }, +// sortBy: 'year', +// getSortData: { +// year: function( $elem ) { +// return $elem.attr('data-year'); +// }, +// scale: function( $elem ) { +// return $elem.attr('data-scale'); +// }, +// program: function( $elem ) { +// return $elem.attr('data-program'); +// }, +// status: function( $elem ) { +// return $elem.attr('data-status'); +// }, +// title: function( $elem ) { +// var chara = $elem.find('p').text()[0]; +// return isNaN( parseInt( chara ) ) ? chara : '0'; +// } +// } +// }); + +$.extend($.Isotope.prototype, { + + _categoryColsReset: function() { + this.categoryCols = { + x : 0, + y : 0, + height : 0, + column : 0, + row : 0, + gutter : 0, + currentCategory : null + }; + }, + + _categoryColsLayout: function($elems) { + var instance = this, + containerWidth = this.element.width(), + opts = this.options.categoryCols, + sortBy = this.options.sortBy, + elemsGroup = {}, + props = this.categoryCols; + + // group item elements into categories based on their sorting data + $elems.each(function() { + var category = $.data(this, 'isotope-sort-data')[sortBy]; + elemsGroup[category] = elemsGroup[category] || []; + elemsGroup[category].push(this); + }); + + var group, groupName, groupMaxRows, groupLen, + gutterWidth = opts.gutterWidth[sortBy], + x, y; + // for each group... + for (groupName in elemsGroup) { + group = elemsGroup[groupName]; + groupLen = group.length; + // make groups look nice, by limiting rows, makes for blockier blocks + groupMaxRows = groupLen / Math.ceil(groupLen / opts.maxRows); + + $.each(group, function(i, elem) { + x = props.column * opts.columnWidth + props.gutter * gutterWidth; + y = (opts.maxRows - props.row - 1) * opts.rowHeight; + instance._pushPosition($(elem), x, y); + + if (props.row >= groupMaxRows - 1) { + // start a new column + props.row = 0; + props.column++; + } else { + props.row++; + } + }); + // start a new group + if (props.row > 0) { + props.row = 0; + props.column++; + } + props.gutter++; + } + props.gutter--; + props.width = props.column * opts.columnWidth + props.gutter * gutterWidth; + }, + + _categoryColsGetContainerSize: function() { + opts = this.options.categoryCols; + this.categoryCols.column++; + return { + width: this.categoryCols.width, + height: opts.maxRows * opts.rowHeight + }; + }, + + _categoryColsResizeChanged: function() { + return false; + } + +}); diff --git a/static/vendor/jquery.isotope.category-cols.min.js b/static/vendor/jquery.isotope.category-cols.min.js new file mode 100644 index 0000000..3c72fa9 --- /dev/null +++ b/static/vendor/jquery.isotope.category-cols.min.js @@ -0,0 +1,39 @@ +/* Category Columns -- Isotop custom layout mode */// +// See: http://isotope.metafizzy.co/custom-layout-modes/big-graph.html +// Usage: +// $container.isotope({ +// itemSelector: '.element', +// layoutMode: 'categoryCols', +// categoryCols: { +// columnWidth: 45, // size of item +// rowHeight: 45, // size of item +// maxRows: 11, // max number of items vertically +// gutterWidth: { // width of gutter, needs to match getSortData names +// year: 0, +// scale: 0, +// program: 35, +// status: 80, +// title: 0 +// } +// }, +// sortBy: 'year', +// getSortData: { +// year: function( $elem ) { +// return $elem.attr('data-year'); +// }, +// scale: function( $elem ) { +// return $elem.attr('data-scale'); +// }, +// program: function( $elem ) { +// return $elem.attr('data-program'); +// }, +// status: function( $elem ) { +// return $elem.attr('data-status'); +// }, +// title: function( $elem ) { +// var chara = $elem.find('p').text()[0]; +// return isNaN( parseInt( chara ) ) ? chara : '0'; +// } +// } +// }); +$.extend($.Isotope.prototype,{_categoryColsReset:function(){this.categoryCols={x:0,y:0,height:0,column:0,row:0,gutter:0,currentCategory:null}},_categoryColsLayout:function(a){var b=this,c=this.element.width(),d=this.options.categoryCols,e=this.options.sortBy,f={},g=this.categoryCols;a.each(function(){var a=$.data(this,"isotope-sort-data")[e];f[a]=f[a]||[],f[a].push(this)});var h,i,j,k,l=d.gutterWidth[e],m,n;for(i in f)h=f[i],k=h.length,j=k/Math.ceil(k/d.maxRows),$.each(h,function(a,c){m=g.column*d.columnWidth+g.gutter*l,n=(d.maxRows-g.row-1)*d.rowHeight,b._pushPosition($(c),m,n),g.row>=j-1?(g.row=0,g.column++):g.row++}),g.row>0&&(g.row=0,g.column++),g.gutter++;g.gutter--,g.width=g.column*d.columnWidth+g.gutter*l},_categoryColsGetContainerSize:function(){return opts=this.options.categoryCols,this.categoryCols.column++,{width:this.categoryCols.width,height:opts.maxRows*opts.rowHeight}},_categoryColsResizeChanged:function(){return!1}}); \ No newline at end of file diff --git a/static/vendor/jquery.isotope.category-rows.js b/static/vendor/jquery.isotope.category-rows.js new file mode 100644 index 0000000..7e9d514 --- /dev/null +++ b/static/vendor/jquery.isotope.category-rows.js @@ -0,0 +1,73 @@ +/* Category Rows -- Isotope custom layout mode */ +// +// See: http://isotope.metafizzy.co/custom-layout-modes/category-rows.html +// Usage: +// $container.isotope({ +// itemSelector : '.element', +// layoutMode : 'categoryRows', +// categoryRows : { +// gutter : 20 +// }, +// getSortData : { +// category : function( $elem ) { +// return $elem.attr('data-category'); +// } +// }, +// sortBy: 'category' +// }); + +$.extend($.Isotope.prototype, { + + _categoryRowsReset: function() { + this.categoryRows = { + x: 0, + y: 0, + height: 0, + currentCategory: null + }; + }, + + _categoryRowsLayout: function($elems) { + var instance = this, + containerWidth = this.element.width(), + sortBy = this.options.sortBy, + props = this.categoryRows; + + $elems.each(function() { + var $this = $(this), + atomW = $this.outerWidth(true), + atomH = $this.outerHeight(true), + category = $.data(this, 'isotope-sort-data')[sortBy], + x, y; + + if (category !== props.currentCategory) { + // new category, new row + props.x = 0; + props.height += props.currentCategory ? instance.options.categoryRows.gutter : 0; + props.y = props.height; + props.currentCategory = category; + } else if (props.x !== 0 && atomW + props.x > containerWidth) { + // if this element cannot fit in the current row + props.x = 0; + props.y = props.height; + } + + // position the atom + instance._pushPosition($this, props.x, props.y); + + props.height = Math.max(props.y + atomH, props.height); + props.x += atomW; + }); + }, + + _categoryRowsGetContainerSize: function() { + return { + height: this.categoryRows.height + }; + }, + + _categoryRowsResizeChanged: function() { + return true; + } + +}); diff --git a/static/vendor/jquery.isotope.category-rows.min.js b/static/vendor/jquery.isotope.category-rows.min.js new file mode 100644 index 0000000..e06ffe4 --- /dev/null +++ b/static/vendor/jquery.isotope.category-rows.min.js @@ -0,0 +1,17 @@ +/* Category Rows -- Isotope custom layout mode */// +// Example: +// +// $container.isotope({ +// itemSelector : '.element', +// layoutMode : 'categoryRows', +// categoryRows : { +// gutter : 20 +// }, +// getSortData : { +// category : function( $elem ) { +// return $elem.attr('data-category'); +// } +// }, +// sortBy: 'category' +// }); +$.extend($.Isotope.prototype,{_categoryRowsReset:function(){this.categoryRows={x:0,y:0,height:0,currentCategory:null}},_categoryRowsLayout:function(a){var b=this,c=this.element.width(),d=this.options.sortBy,e=this.categoryRows;a.each(function(){var a=$(this),f=a.outerWidth(!0),g=a.outerHeight(!0),h=$.data(this,"isotope-sort-data")[d],i,j;h!==e.currentCategory?(e.x=0,e.height+=e.currentCategory?b.options.categoryRows.gutter:0,e.y=e.height,e.currentCategory=h):e.x!==0&&f+e.x>c&&(e.x=0,e.y=e.height),b._pushPosition(a,e.x,e.y),e.height=Math.max(e.y+g,e.height),e.x+=f})},_categoryRowsGetContainerSize:function(){return{height:this.categoryRows.height}},_categoryRowsResizeChanged:function(){return!0}}); \ No newline at end of file