Sorting?

[jackmarketon]

Is there a way to sort elements (hiding all but sorted for) and resetting the grid based on those?

Thanks! Otherwise the plugin is kickass

[AshesOfOwls]

Definitely, but it is all going to have to be done manually. Shapeshift works by always starting with the first child element of the container and working its way down to the last item. You can add in sorting by manually moving the childrens index position within the container and then doing $(".container").trigger("ss-event-arrange").

Since shapeshift manually sets the absolute position of the children, changing their index positions won't affect their actual positions until the arrange event is called again on the container.

Also, shapeshift automatically ignores any children that have display: none, so that is another way of filtering if you are just concerned about hide/show and not the physical position its in.

[kaiuhl]

I do this at http://christycassanomeyer.com/ if you're interesting in seeing an implementation @jackmarketon.

[jackmarketon]

Sweetness thanks guys!

[gabhart]

I am trying to implement the sorting logic and I am having difficulty. I can't seem to locate exactly how to "manually move the childrens index position within the container". I tried looking at kaihul's site, but his javascript was minimized and I couldn't read it. If someone could supply a code snippet for manually adjusting the index, that would be super.

Thanks so much.

[ebp1]

Yes, please provide as much detailed documentation as possible on this wonderful plugin as possible! Would like to try and experiment with some type of draggable cart soon...one thing thought it'd be worth mentioning in the initial honeymoon demo/github documentation is getting the plugin to initialize. Seemed to have trouble getting it to initialize until reading something in the masonry docs (something on the lines of this would be good):

If you’re using a PHP-based CMS, you can use the getimagesize function.

$(window).load()

Another solution is to initialize Masonry inside $(window).load() instead of $(document).ready(). This will trigger Masonry after all the media on the page has loaded – images, fonts, external scripts and stylesheets, etc. This method is not recommended as it can cause ugly wait times.

Or, maybe instructions or re-writing the demo generator to join containers to selectors, similar to fitvids.js

[cauli]

I am trying to randomize the position of the elements. In masonry, I just shuffle the elements positions in the DOM and call $('#myGrid').masonry( 'reload' );

However, with shapeshift, if I try to " $(".myGrid").trigger("ss-rearrange"); ", they rearrange BUT I get an error when I try to Drag them after that:

Uncaught TypeError: Cannot read property 'left' of undefined AT LINE 426

• ui.position.left = e.pageX - $selected.parent().offset().left - selected_offset_x;