https://rixc.org/js_/drag.js

1//*****************************************************************************
2// Do not remove this notice.
3//
4// Copyright 2001 by Mike Hall.
5// See http://www.brainjar.com for terms of use.
6//*****************************************************************************
7
8// Determine browser and version.
9
10function Browser() {
11
12  var ua, s, i;
13
14  this.isIE    = false;
15  this.isNS    = false;
16  this.version = null;
17
18  ua = navigator.userAgent;
19
20  s = "MSIE";
21  if ((i = ua.indexOf(s)) >= 0) {
22    this.isIE = true;
23    this.version = parseFloat(ua.substr(i + s.length));
24    return;
25  }
26
27  s = "Netscape6/";
28  if ((i = ua.indexOf(s)) >= 0) {
29    this.isNS = true;
30    this.version = parseFloat(ua.substr(i + s.length));
31    return;
32  }
33
34  // Treat any other "Gecko" browser as NS 6.1.
35
36  s = "Gecko";
37  if ((i = ua.indexOf(s)) >= 0) {
38    this.isNS = true;
39    this.version = 6.1;
40    return;
41  }
42}
43
44var browser = new Browser();
45
46// Global object to hold drag information.
47
48var dragObj = new Object();
49dragObj.zIndex = 999;
50
51function dragStart(event, id) {
52
53  var el;
54  var x, y;
55
56  // If an element id was given, find it. Otherwise use the element being
57  // clicked on.
58
59  if (id){
60    dragObj.id = id;
61    dragObj.elNode = document.getElementById(id);
62  } else {
63    if (browser.isIE)
64      dragObj.elNode = window.event.srcElement;
65    if (browser.isNS)
66      dragObj.elNode = event.target;
67
68    // If this is a text node, use its parent element.
69
70    if (dragObj.elNode.nodeType == 3)
71      dragObj.elNode = dragObj.elNode.parentNode;
72  }
73
74  // Get cursor position with respect to the page.
75
76  if (browser.isIE) {
77    x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
78    y = window.event.clientY + document.documentElement.scrollTop  + document.body.scrollTop;
79  }
80  if (browser.isNS) {
81    x = event.clientX + window.scrollX;
82    y = event.clientY + window.scrollY;
83  }
84
85  // Save starting positions of cursor and element.
86
87  dragObj.cursorStartX = x;
88  dragObj.cursorStartY = y;
89  dragObj.elStartLeft  = parseInt(dragObj.elNode.style.left, 10);
90  dragObj.elStartTop   = parseInt(dragObj.elNode.style.top,  10);
91
92  if (isNaN(dragObj.elStartLeft)) dragObj.elStartLeft = 0;
93  if (isNaN(dragObj.elStartTop))  dragObj.elStartTop  = 0;
94
95  // Update element's z-index.
96
97  dragObj.elNode.style.zIndex = ++dragObj.zIndex;
98
99  // Capture mousemove and mouseup events on the page.
100
101  if (browser.isIE) {
102    document.attachEvent("onmousemove", dragGo);
103    document.attachEvent("onmouseup",   dragStop);
104    window.event.cancelBubble = true;
105    window.event.returnValue = false;
106  }
107  if (browser.isNS) {
108    document.addEventListener("mousemove", dragGo,   true);
109    document.addEventListener("mouseup",   dragStop, true);
110    event.preventDefault();
111  }
112}
113
114function dragGo(event) {
115
116  var x, y;
117
118  // Get cursor position with respect to the page.
119
120  if (browser.isIE) {
121    x = window.event.clientX + document.documentElement.scrollLeft
122      + document.body.scrollLeft;
123    y = window.event.clientY + document.documentElement.scrollTop
124      + document.body.scrollTop;
125  }
126  if (browser.isNS) {
127    x = event.clientX + window.scrollX;
128    y = event.clientY + window.scrollY;
129  }
130
131  // Move drag element by the same amount the cursor has moved.
132
133  dragObj.elNode.style.left = (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
134  dragObj.elNode.style.top  = (dragObj.elStartTop  + y - dragObj.cursorStartY) + "px";
135
136  if (browser.isIE) {
137    window.event.cancelBubble = true;
138    window.event.returnValue = false;
139  }
140  if (browser.isNS)
141    event.preventDefault();
142}
143
144function dragStop(event) {
145
146  // Stop capturing mousemove and mouseup events.
147
148  if (browser.isIE) {
149    document.detachEvent("onmousemove", dragGo);
150    document.detachEvent("onmouseup",   dragStop);
151  }
152  if (browser.isNS) {
153    document.removeEventListener("mousemove", dragGo,   true);
154    document.removeEventListener("mouseup",   dragStop, true);
155  }
156  
157  Set_Cookie("admin_"+dragObj.id+"_x", parseInt(dragObj.elNode.style.left, 10), 30, '/');
158  Set_Cookie("admin_"+dragObj.id+"_y", parseInt(dragObj.elNode.style.top, 10), 30, '/');
159  
160}