blob: 53c42f36093dfdbc712a8f573002ab87812a2771 [file] [log] [blame]
addEvent(window, 'load', reorder_init);
var lis;
var top = 0;
var left = 0;
var height = 30;
function reorder_init() {
lis = document.getElementsBySelector('ul#orderthese li');
var input = document.getElementsBySelector('input[name=order_]')[0];
setOrder(input.value.split(','));
input.disabled = true;
draw();
// Now initialise the dragging behaviour
var limit = (lis.length - 1) * height;
for (var i = 0; i < lis.length; i++) {
var li = lis[i];
var img = document.getElementById('handle'+li.id);
li.style.zIndex = 1;
Drag.init(img, li, left + 10, left + 10, top + 10, top + 10 + limit);
li.onDragStart = startDrag;
li.onDragEnd = endDrag;
img.style.cursor = 'move';
}
}
function submitOrderForm() {
var inputOrder = document.getElementsBySelector('input[name=order_]')[0];
inputOrder.value = getOrder();
inputOrder.disabled=false;
}
function startDrag() {
this.style.zIndex = '10';
this.className = 'dragging';
}
function endDrag(x, y) {
this.style.zIndex = '1';
this.className = '';
// Work out how far along it has been dropped, using x co-ordinate
var oldIndex = this.index;
var newIndex = Math.round((y - 10 - top) / height);
// 'Snap' to the correct position
this.style.top = (10 + top + newIndex * height) + 'px';
this.index = newIndex;
moveItem(oldIndex, newIndex);
}
function moveItem(oldIndex, newIndex) {
// Swaps two items, adjusts the index and left co-ord for all others
if (oldIndex == newIndex) {
return; // Nothing to swap;
}
var direction, lo, hi;
if (newIndex > oldIndex) {
lo = oldIndex;
hi = newIndex;
direction = -1;
} else {
direction = 1;
hi = oldIndex;
lo = newIndex;
}
var lis2 = new Array(); // We will build the new order in this array
for (var i = 0; i < lis.length; i++) {
if (i < lo || i > hi) {
// Position of items not between the indexes is unaffected
lis2[i] = lis[i];
continue;
} else if (i == newIndex) {
lis2[i] = lis[oldIndex];
continue;
} else {
// Item is between the two indexes - move it along 1
lis2[i] = lis[i - direction];
}
}
// Re-index everything
reIndex(lis2);
lis = lis2;
draw();
// document.getElementById('hiddenOrder').value = getOrder();
document.getElementsBySelector('input[name=order_]')[0].value = getOrder();
}
function reIndex(lis) {
for (var i = 0; i < lis.length; i++) {
lis[i].index = i;
}
}
function draw() {
for (var i = 0; i < lis.length; i++) {
var li = lis[i];
li.index = i;
li.style.position = 'absolute';
li.style.left = (10 + left) + 'px';
li.style.top = (10 + top + (i * height)) + 'px';
}
}
function getOrder() {
var order = new Array(lis.length);
for (var i = 0; i < lis.length; i++) {
order[i] = lis[i].id.substring(1, 100);
}
return order.join(',');
}
function setOrder(id_list) {
/* Set the current order to match the lsit of IDs */
var temp_lis = new Array();
for (var i = 0; i < id_list.length; i++) {
var id = 'p' + id_list[i];
temp_lis[temp_lis.length] = document.getElementById(id);
}
reIndex(temp_lis);
lis = temp_lis;
draw();
}
function addEvent(elm, evType, fn, useCapture)
// addEvent and removeEvent
// cross-browser event handling for IE5+, NS6 and Mozilla
// By Scott Andrew
{
if (elm.addEventListener){
elm.addEventListener(evType, fn, useCapture);
return true;
} else if (elm.attachEvent){
var r = elm.attachEvent("on"+evType, fn);
return r;
} else {
elm['on'+evType] = fn;
}
}