ManifestWebDesign / angular-gridster

An implementation of gridster-like widgets for Angular JS
http://manifestwebdesign.github.io/angular-gridster/
MIT License
964 stars 394 forks source link

Draggable item push moves column down #141

Open jaskaye17 opened 10 years ago

jaskaye17 commented 10 years ago

I am trying to 'switch' items in a row by moving from left to right. Rather than adjacent items switching place, the items in the adjacent column are all pushed down.

danomatic commented 10 years ago

Yes, we don't have a horizontal swap behavior, but I think that would be a nice enhancement. We should add that feature and create an option for enabling and disabling it.

jaskaye17 commented 10 years ago

Yeah that would be an awesome feature to have. I might try to look through/understand the code myself to see if I can implement it myself. It may be a bit out of my coding league for the moment though.

danomatic commented 10 years ago

I think it's tricky unless both items are the same size. There are other gotchas, but I don't remember what they are.

jaskaye17 commented 10 years ago

Yeah I can see the difficulty in that. My specific use case is with an ng-repeat grid where all of the elements are the same size. In my case it would be helpful to move the items left and right in addition to up and down.

simplesmiler commented 10 years ago

There's a lot of room for improvement, but it will make angular-gridster behave differently from the original gridster, which may not be desirable.

danomatic commented 10 years ago

Anyone who implements this should make it a config option to enable, rather than forcing it for everyone.

kumaravnish commented 10 years ago

One of the requirements we are trying to fulfill is that the widgets maintain the order during move and only the widget being moved is reordered and all others just swap by one position.

danomatic commented 10 years ago

Pseudocode for drag is currently:

-convert position pixels to rows/cols -if pushing is enabled or the space is empty, set the rows/cols on the widget to the new position

We could possibly update it to be:

-convert position pixels to rows/cols -if (new) swap mode is enabled, only set rows/cols if the space is empty or if the dragged widget's new rows/cols would allow it to be directly swapped with the widget occupying the new position -elseif pushing is enabled or the space is empty, set the rows/cols on the widget to the new position

danomatic commented 10 years ago

I made an attempt and it's in current master. It works best with gridster items that are 1x1. If they are larger the swapping only works vertically. You must set "swapping: true" in the gridster options. Let me know what you think.