|
1 var canvas_mousemove_temp; |
|
2 var canvas_keyup_temp; |
|
3 var CANVAS_KEY_ESC = 27; |
|
4 |
|
5 function canvas_click(obj) |
|
6 { |
|
7 var click_x = mouseX - $(obj).Left(); |
|
8 var click_y = mouseY - $(obj).Top() + getScrollOffset(); |
|
9 |
|
10 if ( obj.canvas_in_draw ) |
|
11 { |
|
12 canvas_close_draw(obj, click_x, click_y); |
|
13 } |
|
14 else |
|
15 { |
|
16 canvas_open_draw(obj, click_x, click_y); |
|
17 } |
|
18 } |
|
19 |
|
20 function canvas_open_draw(obj, x, y) |
|
21 { |
|
22 obj.canvas_box_obj = canvas_create_box(obj, x, y, 1, 1); |
|
23 obj.canvas_in_draw = true; |
|
24 obj.onclick = function(e) |
|
25 { |
|
26 canvas_click(this); |
|
27 var onclose = this.getAttribute('canvas:oncomplete'); |
|
28 if ( onclose ) |
|
29 { |
|
30 eval(onclose); |
|
31 } |
|
32 } |
|
33 canvas_replace_mousemove(obj); |
|
34 } |
|
35 |
|
36 function canvas_replace_mousemove(obj) |
|
37 { |
|
38 canvas_mousemove_temp = document.onmousemove; |
|
39 canvas_mousemove_temp.box_obj = obj; |
|
40 canvas_keyup_temp = document.onkeyup; |
|
41 document.onmousemove = function(e) |
|
42 { |
|
43 canvas_mousemove_temp(e); |
|
44 canvas_redraw_box(canvas_mousemove_temp.box_obj); |
|
45 } |
|
46 document.onkeyup = function(e) |
|
47 { |
|
48 if ( typeof(canvas_keyup_temp) == 'function' ) |
|
49 canvas_keyup_temp(e); |
|
50 |
|
51 if ( e.keyCode == CANVAS_KEY_ESC ) |
|
52 canvas_cancel_draw(canvas_mousemove_temp.box_obj); |
|
53 } |
|
54 } |
|
55 |
|
56 function canvas_restore_mousemove() |
|
57 { |
|
58 document.onmousemove = canvas_mousemove_temp; |
|
59 document.onkeyup = canvas_keyup_temp; |
|
60 } |
|
61 |
|
62 function canvas_create_box(obj, x, y, width, height) |
|
63 { |
|
64 var inner_width = width - 2; |
|
65 var inner_height = height - 2; |
|
66 var top = $(obj).Top() + y; |
|
67 var left = $(obj).Left() + x; |
|
68 |
|
69 // draw outer box |
|
70 var div_outer = document.createElement('div'); |
|
71 div_outer.className = 'canvasbox'; |
|
72 div_outer.style.border = '1px solid #000000'; |
|
73 div_outer.style.position = 'absolute'; |
|
74 div_outer.style.width = String(width) + 'px'; |
|
75 div_outer.style.height = String(height) + 'px'; |
|
76 div_outer.style.top = String(top) + 'px'; |
|
77 div_outer.style.left = String(left) + 'px'; |
|
78 |
|
79 div_outer.rootY = y; |
|
80 div_outer.rootX = x; |
|
81 |
|
82 var div_inner = document.createElement('div'); |
|
83 div_inner.style.border = '1px solid #FFFFFF'; |
|
84 if ( IE ) |
|
85 { |
|
86 div_inner.style.width = '1px'; |
|
87 div_inner.style.height = '1px'; |
|
88 } |
|
89 else |
|
90 { |
|
91 div_inner.style.width = String(inner_width) + 'px'; |
|
92 div_inner.style.height = String(inner_height) + 'px'; |
|
93 } |
|
94 |
|
95 div_outer.appendChild(div_inner); |
|
96 |
|
97 obj.appendChild(div_outer); |
|
98 return div_outer; |
|
99 } |
|
100 |
|
101 function canvas_redraw_box(obj) |
|
102 { |
|
103 if ( !obj.canvas_box_obj ) |
|
104 return false; |
|
105 var rel_x = mouseX - $(obj).Left(); |
|
106 var rel_y = mouseY - $(obj).Top() + getScrollOffset(); |
|
107 var new_width = rel_x - obj.canvas_box_obj.rootX; |
|
108 var new_height = rel_y - obj.canvas_box_obj.rootY; |
|
109 var rootX = obj.canvas_box_obj.rootX; |
|
110 var rootY = obj.canvas_box_obj.rootY; |
|
111 // Limit dimensions to width - origin_x and height - origin_y |
|
112 if ( new_width + rootX > $(obj).Width() ) |
|
113 new_width = $(obj).Width() - rootX; |
|
114 if ( new_height + rootY > $(obj).Height() ) |
|
115 new_height = $(obj).Height() - rootY; |
|
116 // If going to the top or left of the origin, avoid negative width/height by moving the box |
|
117 if ( new_width < 1 ) |
|
118 { |
|
119 new_width = rootX - rel_x; |
|
120 obj.canvas_box_obj.style.left = String(mouseX + 2) + 'px'; |
|
121 } |
|
122 if ( new_height < 1 ) |
|
123 { |
|
124 new_height = rootY - rel_y; |
|
125 obj.canvas_box_obj.style.top = String(mouseY + getScrollOffset() + 2) + 'px'; |
|
126 } |
|
127 obj.canvas_box_obj.style.width = String(new_width) + 'px'; |
|
128 obj.canvas_box_obj.style.height = String(new_height) + 'px'; |
|
129 new_width = new_width - 2; |
|
130 new_height = new_height - 2; |
|
131 if ( IE ) |
|
132 { |
|
133 var nw = new_width; |
|
134 var nh = new_height; |
|
135 obj.canvas_box_obj.firstChild.style.width = String(nw) + 'px'; |
|
136 obj.canvas_box_obj.firstChild.style.height = String(nh) + 'px'; |
|
137 } |
|
138 else |
|
139 { |
|
140 obj.canvas_box_obj.firstChild.style.width = String(new_width) + 'px'; |
|
141 obj.canvas_box_obj.firstChild.style.height = String(new_height) + 'px'; |
|
142 } |
|
143 } |
|
144 |
|
145 function canvas_close_draw(obj, x, y) |
|
146 { |
|
147 canvas_restore_mousemove(); |
|
148 obj.canvas_in_draw = false; |
|
149 obj.canvas = { |
|
150 top: $(obj.canvas_box_obj).Top() - $(obj).Top(), |
|
151 left: $(obj.canvas_box_obj).Left() - $(obj).Left(), |
|
152 width: $(obj.canvas_box_obj).Width(), |
|
153 height: $(obj.canvas_box_obj).Height() |
|
154 } |
|
155 obj.onclick = function(e) |
|
156 { |
|
157 canvas_click(this); |
|
158 } |
|
159 } |
|
160 |
|
161 function canvas_cancel_draw(obj) |
|
162 { |
|
163 canvas_restore_mousemove(); |
|
164 obj.canvas_in_draw = false; |
|
165 obj.removeChild(obj.canvas_box_obj); |
|
166 obj.canvas_box_obj = null; |
|
167 obj.onclick = function(e) |
|
168 { |
|
169 canvas_click(this); |
|
170 } |
|
171 var ga = obj.getAttribute('canvas:oncancel'); |
|
172 if ( ga ) |
|
173 { |
|
174 eval(ga); |
|
175 } |
|
176 } |
|
177 |