Page 1 of 1
User image sort
Posted: Wed Dec 13, 2006 6:45 am
by jamie85
I currently have a site which displays a long row of images.
I want to be able to add and delete images.
The deletion is simply. Addition would be simply, however i want to be able to add images at a certain point, and also swap images if necessary. The images are stored in a folder, and the information for each image is stored in a MySQL table.
Whats the best way to accomplish this? Dragging the iamges around using AJAX drag and drop? Using check boxes to swap the images?
Much appreciated.
Jamie.
Posted: Wed Dec 13, 2006 7:54 am
by feyd
What do you qualify as "the best way to accomplish this?"
Posted: Wed Dec 13, 2006 8:02 am
by jamie85
feyd wrote:What do you qualify as "the best way to accomplish this?"
The easiest way for the user to swap images.
Posted: Wed Dec 13, 2006 8:09 am
by feyd
The most intuitive would likely be drag'n'drop. However I would like to impress upon you that Ajax should not be the sole solution for this you implement. I would suggest that you build your system to be able to work without any Javascript first and foremost before prettying it up with Ajax.
Posted: Wed Dec 13, 2006 8:22 am
by jamie85
feyd wrote:The most intuitive would likely be drag'n'drop. However I would like to impress upon you that Ajax should not be the sole solution for this you implement. I would suggest that you build your system to be able to work without any Javascript first and foremost before prettying it up with Ajax.
Indeed. I would prefer to steer clear of using javascript. But AJAX does is so lovely im quite drawn to it. I've done something similar before using check boxes. The user would check 2 boxes corresponding with the images they wish to swap, and then hit a submit button to swap them.
Posted: Wed Dec 13, 2006 9:43 am
by bokehman
jamie85 wrote:The user would check 2 boxes corresponding with the images they wish to swap, and then hit a submit button to swap them.
Swap them where? On the current page? On the client? On the server? Reorder the database? What?
Posted: Wed Dec 13, 2006 11:08 am
by jamie85
bokehman wrote:jamie85 wrote:The user would check 2 boxes corresponding with the images they wish to swap, and then hit a submit button to swap them.
Swap them where? On the current page? On the client? On the server? Reorder the database? What?
Re-order the database.
Posted: Wed Dec 13, 2006 11:21 am
by Begby
You can do this by creating a list with up/down links next to each image. Maybe use some arrows or something.
Each link would include the id of the database record and the direction to move, the logic is as follows
Up
If this has the order of '1' then don't do anything, otherwise take the record that has a value of order-1 and increment it, then decrement the order of the image you are moving.
Down
If this has the order of max(order) (i.e. its the last image) don't do anything. Otherwise increment its value and decrement the value of the record with order+1.
Record deletion
Update the database to have order=order-1 on all records where order is greater than the record you are deleting
Record insert
Set the order to max(order) + 1
After you get that working so that you can move images up and down one spot at a time, then you are ready to tackle drag and drop with ajax or moving an image more than one spot at a time.