Mercurial > public > madeira

annotate media/django/js/admin/ordering.js @ 1:0dcfcdf50c62

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Initial import of Madeira project from the private repository.
author Brian Neal <bgneal@gmail.com>
date Mon, 06 Apr 2009 03:10:59 +0000
parents
children
rev   line source
bgneal@1 1 addEvent(window, 'load', reorder_init);
bgneal@1 2
bgneal@1 3 var lis;
bgneal@1 4 var top = 0;
bgneal@1 5 var left = 0;
bgneal@1 6 var height = 30;
bgneal@1 7
bgneal@1 8 function reorder_init() {
bgneal@1 9 lis = document.getElementsBySelector('ul#orderthese li');
bgneal@1 10 var input = document.getElementsBySelector('input[name=order_]')[0];
bgneal@1 11 setOrder(input.value.split(','));
bgneal@1 12 input.disabled = true;
bgneal@1 13 draw();
bgneal@1 14 // Now initialise the dragging behaviour
bgneal@1 15 var limit = (lis.length - 1) * height;
bgneal@1 16 for (var i = 0; i < lis.length; i++) {
bgneal@1 17 var li = lis[i];
bgneal@1 18 var img = document.getElementById('handle'+li.id);
bgneal@1 19 li.style.zIndex = 1;
bgneal@1 20 Drag.init(img, li, left + 10, left + 10, top + 10, top + 10 + limit);
bgneal@1 21 li.onDragStart = startDrag;
bgneal@1 22 li.onDragEnd = endDrag;
bgneal@1 23 img.style.cursor = 'move';
bgneal@1 24 }
bgneal@1 25 }
bgneal@1 26
bgneal@1 27 function submitOrderForm() {
bgneal@1 28 var inputOrder = document.getElementsBySelector('input[name=order_]')[0];
bgneal@1 29 inputOrder.value = getOrder();
bgneal@1 30 inputOrder.disabled=false;
bgneal@1 31 }
bgneal@1 32
bgneal@1 33 function startDrag() {
bgneal@1 34 this.style.zIndex = '10';
bgneal@1 35 this.className = 'dragging';
bgneal@1 36 }
bgneal@1 37
bgneal@1 38 function endDrag(x, y) {
bgneal@1 39 this.style.zIndex = '1';
bgneal@1 40 this.className = '';
bgneal@1 41 // Work out how far along it has been dropped, using x co-ordinate
bgneal@1 42 var oldIndex = this.index;
bgneal@1 43 var newIndex = Math.round((y - 10 - top) / height);
bgneal@1 44 // 'Snap' to the correct position
bgneal@1 45 this.style.top = (10 + top + newIndex * height) + 'px';
bgneal@1 46 this.index = newIndex;
bgneal@1 47 moveItem(oldIndex, newIndex);
bgneal@1 48 }
bgneal@1 49
bgneal@1 50 function moveItem(oldIndex, newIndex) {
bgneal@1 51 // Swaps two items, adjusts the index and left co-ord for all others
bgneal@1 52 if (oldIndex == newIndex) {
bgneal@1 53 return; // Nothing to swap;
bgneal@1 54 }
bgneal@1 55 var direction, lo, hi;
bgneal@1 56 if (newIndex > oldIndex) {
bgneal@1 57 lo = oldIndex;
bgneal@1 58 hi = newIndex;
bgneal@1 59 direction = -1;
bgneal@1 60 } else {
bgneal@1 61 direction = 1;
bgneal@1 62 hi = oldIndex;
bgneal@1 63 lo = newIndex;
bgneal@1 64 }
bgneal@1 65 var lis2 = new Array(); // We will build the new order in this array
bgneal@1 66 for (var i = 0; i < lis.length; i++) {
bgneal@1 67 if (i < lo || i > hi) {
bgneal@1 68 // Position of items not between the indexes is unaffected
bgneal@1 69 lis2[i] = lis[i];
bgneal@1 70 continue;
bgneal@1 71 } else if (i == newIndex) {
bgneal@1 72 lis2[i] = lis[oldIndex];
bgneal@1 73 continue;
bgneal@1 74 } else {
bgneal@1 75 // Item is between the two indexes - move it along 1
bgneal@1 76 lis2[i] = lis[i - direction];
bgneal@1 77 }
bgneal@1 78 }
bgneal@1 79 // Re-index everything
bgneal@1 80 reIndex(lis2);
bgneal@1 81 lis = lis2;
bgneal@1 82 draw();
bgneal@1 83 // document.getElementById('hiddenOrder').value = getOrder();
bgneal@1 84 document.getElementsBySelector('input[name=order_]')[0].value = getOrder();
bgneal@1 85 }
bgneal@1 86
bgneal@1 87 function reIndex(lis) {
bgneal@1 88 for (var i = 0; i < lis.length; i++) {
bgneal@1 89 lis[i].index = i;
bgneal@1 90 }
bgneal@1 91 }
bgneal@1 92
bgneal@1 93 function draw() {
bgneal@1 94 for (var i = 0; i < lis.length; i++) {
bgneal@1 95 var li = lis[i];
bgneal@1 96 li.index = i;
bgneal@1 97 li.style.position = 'absolute';
bgneal@1 98 li.style.left = (10 + left) + 'px';
bgneal@1 99 li.style.top = (10 + top + (i * height)) + 'px';
bgneal@1 100 }
bgneal@1 101 }
bgneal@1 102
bgneal@1 103 function getOrder() {
bgneal@1 104 var order = new Array(lis.length);
bgneal@1 105 for (var i = 0; i < lis.length; i++) {
bgneal@1 106 order[i] = lis[i].id.substring(1, 100);
bgneal@1 107 }
bgneal@1 108 return order.join(',');
bgneal@1 109 }
bgneal@1 110
bgneal@1 111 function setOrder(id_list) {
bgneal@1 112 /* Set the current order to match the lsit of IDs */
bgneal@1 113 var temp_lis = new Array();
bgneal@1 114 for (var i = 0; i < id_list.length; i++) {
bgneal@1 115 var id = 'p' + id_list[i];
bgneal@1 116 temp_lis[temp_lis.length] = document.getElementById(id);
bgneal@1 117 }
bgneal@1 118 reIndex(temp_lis);
bgneal@1 119 lis = temp_lis;
bgneal@1 120 draw();
bgneal@1 121 }
bgneal@1 122
bgneal@1 123 function addEvent(elm, evType, fn, useCapture)
bgneal@1 124 // addEvent and removeEvent
bgneal@1 125 // cross-browser event handling for IE5+, NS6 and Mozilla
bgneal@1 126 // By Scott Andrew
bgneal@1 127 {
bgneal@1 128 if (elm.addEventListener){
bgneal@1 129 elm.addEventListener(evType, fn, useCapture);
bgneal@1 130 return true;
bgneal@1 131 } else if (elm.attachEvent){
bgneal@1 132 var r = elm.attachEvent("on"+evType, fn);
bgneal@1 133 return r;
bgneal@1 134 } else {
bgneal@1 135 elm['on'+evType] = fn;
bgneal@1 136 }
bgneal@1 137 }