| function Drag_n_Drop() |
| { |
| return '<script type="text/javascript"> |
| jQuery(document).ready(function(){ |
| |
| /** |
| * Add our toolbar |
| */ |
| jQuery( ".ivg_dragndrop").prepend("<div class=\"ivg_toolbar\"><span class=\"ivg_close\" onclick=\"jQuery(this).parent().parent().remove();ivgRecalc();\">X</span></div>" ); |
| |
| |
| /** |
| * Make images draggable |
| */ |
| jQuery(".ivg_dragndrop").draggable({ |
| helper: "clone", // use a copy of the image |
| scroll: true, // scroll the window during dragging |
| scrollSensitivity: 100, // distance from edge before scoll occurs |
| zIndex: 999, // zindex whilst dragging |
| opacity: .5, // opacity whilst dragging |
| distance: 10, // min distance to move mouse before drag starts |
| handle: ".ivg_toolbar", // makes toolbar the dragable part |
| stop:function(ev, ui) { // called on drop action |
| window.setTimeout( "ivgRecalc()", 100 ); // add a delay whilst the objects are replaced |
| }, |
| }); |
| |
| |
| /** |
| * Action to take after dropping image on target |
| */ |
| jQuery(".ivg_dragndrop").droppable({ |
| accept: ".ivg_dragndrop", // classname of objects that can be dropped |
| hoverClass: "droppable-hover", // classname when object is over this one |
| drop: function(ev, ui) { // function called when object dropped |
| jQuery(ui.draggable).insertBefore( this ); // insert the dragged image before this image |
| } |
| }); |
| }); |
| |
| |
| /** |
| * Re-calculates the image order after drop |
| */ |
| function ivgRecalc() |
| { |
| jQuery( ".iv_image_order" ).attr( "value", function( pos ){ |
| return pos; |
| }); |
| } |
| </script>'."\n"; |
| } |
