1 | $(function(){ |
---|
2 | // start masonry on news |
---|
3 | news_container = $("ul.news-feed"); |
---|
4 | news_container.removeClass("news-ng").addClass("news-masonry"); |
---|
5 | |
---|
6 | /*msnry = new Masonry( news_container[0], { |
---|
7 | // columnWidth: 200, |
---|
8 | itemSelector: 'li' |
---|
9 | });*/ |
---|
10 | news_container.masonry({ |
---|
11 | itemSelector: 'li' |
---|
12 | }); |
---|
13 | }); |
---|
14 | |
---|
15 | // EIN ALTES MASONRY zusammen mit der Ordered-Extension |
---|
16 | |
---|
17 | /** |
---|
18 | * jQuery Masonry v2.0.110524 |
---|
19 | * A dynamic layout plugin for jQuery |
---|
20 | * The flip-side of CSS Floats |
---|
21 | * http://masonry.desandro.com |
---|
22 | * |
---|
23 | * Licensed under the MIT license. |
---|
24 | * Copyright 2011 David DeSandro |
---|
25 | */ |
---|
26 | (function(a,b,c){var d=b.event,e;d.special.smartresize={setup:function(){b(this).bind("resize",d.special.smartresize.handler)},teardown:function(){b(this).unbind("resize",d.special.smartresize.handler)},handler:function(a,b){var c=this,d=arguments;a.type="smartresize",e&&clearTimeout(e),e=setTimeout(function(){jQuery.event.handle.apply(c,d)},b==="execAsap"?0:100)}},b.fn.smartresize=function(a){return a?this.bind("smartresize",a):this.trigger("smartresize",["execAsap"])},b.Mason=function(a,c){this.element=b(c),this._create(a),this._init()};var f=["position","height"];b.Mason.settings={isResizable:!0,isAnimated:!1,animationOptions:{queue:!1,duration:500},gutterWidth:0,isRTL:!1,isFitWidth:!1},b.Mason.prototype={_filterFindBricks:function(a){var b=this.options.itemSelector;return b?a.filter(b).add(a.find(b)):a},_getBricks:function(a){var b=this._filterFindBricks(a).css({position:"absolute"}).addClass("masonry-brick");return b},_create:function(c){this.options=b.extend(!0,{},b.Mason.settings,c),this.styleQueue=[],this.reloadItems();var d=this.element[0].style;this.originalStyle={};for(var e=0,g=f.length;e<g;e++){var h=f[e];this.originalStyle[h]=d[h]||null}this.element.css({position:"relative"}),this.horizontalDirection=this.options.isRTL?"right":"left",this.offset={};var i=b(document.createElement("div"));this.element.prepend(i),this.offset.y=Math.round(i.position().top),this.options.isRTL?(i.css({"float":"right",display:"inline-block"}),this.offset.x=Math.round(this.element.outerWidth()-i.position().left)):this.offset.x=Math.round(i.position().left),i.remove();var j=this;setTimeout(function(){j.element.addClass("masonry")},0),this.options.isResizable&&b(a).bind("smartresize.masonry",function(){j.resize()})},_init:function(a){this._getColumns("masonry"),this._reLayout(a)},option:function(a,c){b.isPlainObject(a)&&(this.options=b.extend(!0,this.options,a))},layout:function(a,c){var d,e,f,g,h,i;for(var j=0,k=a.length;j<k;j++){d=b(a[j]),e=Math.ceil(d.outerWidth(!0)/this.columnWidth),e=Math.min(e,this.cols);if(e===1)this._placeBrick(d,this.colYs);else{f=this.cols+1-e,g=[];for(i=0;i<f;i++)h=this.colYs.slice(i,i+e),g[i]=Math.max.apply(Math,h);this._placeBrick(d,g)}}var l={};l.height=Math.max.apply(Math,this.colYs)-this.offset.y,this.options.isFitWidth&&(l.width=this.cols*this.columnWidth-this.options.gutterWidth),this.styleQueue.push({$el:this.element,style:l});var m=this.isLaidOut?this.options.isAnimated?"animate":"css":"css",n=this.options.animationOptions,o;for(j=0,k=this.styleQueue.length;j<k;j++)o=this.styleQueue[j],o.$el[m](o.style,n);this.styleQueue=[],c&&c.call(a),this.isLaidOut=!0},_getColumns:function(){var a=this.options.isFitWidth?this.element.parent():this.element,b=a.width();this.columnWidth=this.options.columnWidth||this.$bricks.outerWidth(!0)||b,this.columnWidth+=this.options.gutterWidth,this.cols=Math.floor((b+this.options.gutterWidth)/this.columnWidth),this.cols=Math.max(this.cols,1)},_placeBrick:function(a,b){var c=Math.min.apply(Math,b),d=0;for(var e=0,f=b.length;e<f;e++)if(b[e]===c){d=e;break}var g={top:c};g[this.horizontalDirection]=this.columnWidth*d+this.offset.x,this.styleQueue.push({$el:a,style:g});var h=c+a.outerHeight(!0),i=this.cols+1-f;for(e=0;e<i;e++)this.colYs[d+e]=h},resize:function(){var a=this.cols;this._getColumns("masonry"),this.cols!==a&&this._reLayout()},_reLayout:function(a){var b=this.cols;this.colYs=[];while(b--)this.colYs.push(this.offset.y);this.layout(this.$bricks,a)},reloadItems:function(){this.$bricks=this._getBricks(this.element.children())},reload:function(a){this.reloadItems(),this._init(a)},appended:function(a,b,c){if(b){this._filterFindBricks(a).css({top:this.element.height()});var d=this;setTimeout(function(){d._appended(a,c)},1)}else this._appended(a,c)},_appended:function(a,b){var c=this._getBricks(a);this.$bricks=this.$bricks.add(c),this.layout(c,b)},remove:function(a){this.$bricks=this.$bricks.not(a),a.remove()},destroy:function(){this.$bricks.removeClass("masonry-brick").each(function(){this.style.position=null,this.style.top=null,this.style.left=null});var c=this.element[0].style;for(var d=0,e=f.length;d<e;d++){var g=f[d];c[g]=this.originalStyle[g]}this.element.unbind(".masonry").removeClass("masonry").removeData("masonry"),b(a).unbind(".masonry")}},b.fn.imagesLoaded=function(a){var b=this.find("img"),d=b.length,e="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==",f=this;if(!d){a.call(this);return this}b.bind("load",function(){--d<=0&&this.src!==e&&a.call(f)}).each(function(){if(this.complete||this.complete===c){var a=this.src;this.src=e,this.src=a}});return this},b.fn.masonry=function(a){if(typeof a=="string"){var c=Array.prototype.slice.call(arguments,1);this.each(function(){var d=b.data(this,"masonry");if(!d)return b.error("cannot call methods on masonry prior to initialization; attempted to call method '"+a+"'");if(!b.isFunction(d[a])||a.charAt(0)==="_")return b.error("no such method '"+a+"' for masonry instance");d[a].apply(d,c)})}else this.each(function(){var c=b.data(this,"masonry");c?(c.option(a||{}),c._init()):b.data(this,"masonry",new b.Mason(a,this))});return this}})(window,jQuery); |
---|
27 | |
---|
28 | |
---|
29 | /** |
---|
30 | * jQuery Masonry Ordered 2.1-beta2 |
---|
31 | * http://masonry-ordered.tasuki.org/ |
---|
32 | * |
---|
33 | * Enhanced layout strategy for jQuery Masonry: |
---|
34 | * http://masonry.desandro.com/ |
---|
35 | * |
---|
36 | * Licensed under the MIT license. |
---|
37 | * Copyleft 2012 Vit 'tasuki' Brunner |
---|
38 | */ |
---|
39 | |
---|
40 | (function( window, $, undefined ) { |
---|
41 | |
---|
42 | $.extend(true, $.Mason.settings, { |
---|
43 | layoutPriorities: { |
---|
44 | // Masonry default: Try to occupy highest available position. |
---|
45 | // Weight: Pixels of vertical distance from most upper spot. |
---|
46 | upperPosition: 1, |
---|
47 | // Shelf order: Try to display bricks in original order. |
---|
48 | // (increases ordered-ness, decreases space-efficiency) |
---|
49 | // Weight: Pixels of distance of current brick's top left corner |
---|
50 | // from previous brick's top right corner. |
---|
51 | shelfOrder: 1 |
---|
52 | } |
---|
53 | }); |
---|
54 | |
---|
55 | // layout logic |
---|
56 | $.Mason.prototype._placeBrick = function( brick ) { |
---|
57 | var $brick = $(brick), |
---|
58 | dir = this.horizontalDirection, |
---|
59 | colSpan, groupCount, groupY, groupColY; |
---|
60 | |
---|
61 | //how many columns does this brick span |
---|
62 | colSpan = Math.ceil( $brick.outerWidth(true) / |
---|
63 | ( this.columnWidth + this.options.gutterWidth ) ); |
---|
64 | colSpan = Math.min( colSpan, this.cols ); |
---|
65 | |
---|
66 | if ( colSpan === 1 ) { |
---|
67 | // if brick spans only one column, just like singleMode |
---|
68 | groupY = this.colYs |
---|
69 | } else { |
---|
70 | // brick spans more than one column |
---|
71 | // how many different places could this brick fit horizontally |
---|
72 | groupCount = this.cols + 1 - colSpan; |
---|
73 | groupY = []; |
---|
74 | |
---|
75 | // for each group potential horizontal position |
---|
76 | for ( var j=0; j < groupCount; j++ ) { |
---|
77 | // make an array of colY values for that one group |
---|
78 | groupColY = this.colYs.slice( j, j+colSpan ); |
---|
79 | // and get the max value of the array |
---|
80 | groupY[j] = Math.max.apply( Math, groupColY ); |
---|
81 | } |
---|
82 | } |
---|
83 | |
---|
84 | // get the minimum Y value from the columns |
---|
85 | var minimumY = Math.min.apply( Math, groupY ); |
---|
86 | |
---|
87 | // point near which the next brick should be |
---|
88 | var anchorPoint = { top: 0 } |
---|
89 | anchorPoint[ dir ] = 0; |
---|
90 | |
---|
91 | // get previous brick details |
---|
92 | var prevBrick = this.styleQueue.slice(-1)[0]; |
---|
93 | if ( prevBrick != undefined ) { |
---|
94 | var width = prevBrick.$el.outerWidth(true); |
---|
95 | // subtract container's horizontal offset to prevent overflow |
---|
96 | var offset = prevBrick.style[ dir ] - this.offset.x; |
---|
97 | |
---|
98 | // align anchor point with previous brick |
---|
99 | anchorPoint[ dir ] = offset + width; |
---|
100 | anchorPoint.top = prevBrick.style.top; |
---|
101 | |
---|
102 | // check if brick fits in row |
---|
103 | var spaceForBrick = anchorPoint[ dir ] + colSpan * this.columnWidth; |
---|
104 | var availableSpace = this.cols * this.columnWidth; |
---|
105 | if ( spaceForBrick > availableSpace ) { |
---|
106 | // brick doesn't fit in row - reset horizontal position |
---|
107 | anchorPoint[ dir ] = 0; |
---|
108 | } |
---|
109 | } |
---|
110 | |
---|
111 | // priorities weights for brick laying |
---|
112 | var priorities = this.options.layoutPriorities; |
---|
113 | // total penalty for given position |
---|
114 | var penalty = []; |
---|
115 | |
---|
116 | // calculate penalty of each position |
---|
117 | for ( var i=0, len = groupY.length; i < len; i++ ) { |
---|
118 | // distance of upper left corner from anchor point |
---|
119 | var horizontal = Math.abs( anchorPoint[ dir ] - this.columnWidth * i ); |
---|
120 | var vertical = Math.abs( anchorPoint.top - groupY[i] ); |
---|
121 | var sum_of_powers = Math.pow( horizontal, 2 ) + Math.pow( vertical, 2 ); |
---|
122 | var distance = Math.round( Math.sqrt( sum_of_powers ) ); |
---|
123 | var shelfPenalty = priorities.shelfOrder * distance; |
---|
124 | |
---|
125 | // vertical distance from the most top available spot |
---|
126 | var upperPenalty = priorities.upperPosition * ( groupY[i] - minimumY ); |
---|
127 | |
---|
128 | // total penalty for column |
---|
129 | penalty[i] = upperPenalty + shelfPenalty; |
---|
130 | } |
---|
131 | |
---|
132 | // get minimum penalty |
---|
133 | var minPenalty = Math.min.apply( null, penalty ); |
---|
134 | |
---|
135 | // find column with minimum penalty |
---|
136 | for ( i=0, len = penalty.length; i < len; i++ ) { |
---|
137 | if ( penalty[i] === minPenalty ) { |
---|
138 | shortCol = i; |
---|
139 | break; |
---|
140 | } |
---|
141 | } |
---|
142 | |
---|
143 | // position the brick |
---|
144 | var position = { |
---|
145 | top: groupY[shortCol] + this.offset.y |
---|
146 | }; |
---|
147 | // position.left or position.right |
---|
148 | position[ dir ] = this.columnWidth * shortCol + this.offset.x; |
---|
149 | this.styleQueue.push({ $el: $brick, style: position }); |
---|
150 | |
---|
151 | // apply setHeight to necessary columns |
---|
152 | var setHeight = groupY[ shortCol ] + $brick.outerHeight(true), |
---|
153 | setSpan = this.cols + 1 - len; |
---|
154 | for ( i=0; i < setSpan; i++ ) { |
---|
155 | this.colYs[ shortCol + i ] = setHeight; |
---|
156 | } |
---|
157 | } |
---|
158 | })( window, jQuery ); |
---|
159 | |
---|
160 | /* vi: set ts=2 sw=2 expandtab: */ |
---|
161 | |
---|