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