27 var mb_current_obj; |
27 var mb_current_obj; |
28 var mb_previously_had_darkener = false; |
28 var mb_previously_had_darkener = false; |
29 |
29 |
30 function MessageBox(type, title, message) |
30 function MessageBox(type, title, message) |
31 { |
31 { |
32 if ( !aclDisableTransitionFX ) |
32 if ( !aclDisableTransitionFX ) |
33 { |
33 { |
34 load_component('flyin'); |
34 load_component('flyin'); |
35 } |
35 } |
36 |
36 |
37 var y = getScrollOffset(); |
37 var y = getScrollOffset(); |
38 |
38 |
39 // Prevent multiple instances |
39 // Prevent multiple instances |
40 if ( document.getElementById('messageBox') ) |
40 if ( document.getElementById('messageBox') ) |
41 return; |
41 return; |
42 |
42 |
43 if ( document.getElementById('specialLayer_darkener') ) |
43 if ( document.getElementById('specialLayer_darkener') ) |
44 if ( document.getElementById('specialLayer_darkener').style.display == 'block' ) |
44 if ( document.getElementById('specialLayer_darkener').style.display == 'block' ) |
45 mb_previously_had_darkener = true; |
45 mb_previously_had_darkener = true; |
46 if ( !mb_previously_had_darkener ) |
46 if ( !mb_previously_had_darkener ) |
47 darken(true); |
47 darken(true); |
48 if ( aclDisableTransitionFX ) |
48 if ( aclDisableTransitionFX ) |
49 { |
49 { |
50 document.getElementById('specialLayer_darkener').style.zIndex = '5'; |
50 document.getElementById('specialLayer_darkener').style.zIndex = '5'; |
51 } |
51 } |
52 var master_div = document.createElement('div'); |
52 var master_div = document.createElement('div'); |
53 master_div.style.zIndex = getHighestZ() + 1; |
53 master_div.style.zIndex = getHighestZ() + 1; |
54 var mydiv = document.createElement('div'); |
54 var mydiv = document.createElement('div'); |
55 mydiv.style.height = '200px'; |
55 mydiv.style.height = '200px'; |
56 w = getWidth(); |
56 w = getWidth(); |
57 h = getHeight(); |
57 h = getHeight(); |
58 if ( aclDisableTransitionFX ) |
58 if ( aclDisableTransitionFX ) |
59 { |
59 { |
60 master_div.style.left = ((w / 2) - 200)+'px'; |
60 master_div.style.left = ((w / 2) - 200)+'px'; |
61 master_div.style.top = ((h / 2) + y - 120)+'px'; |
61 master_div.style.top = ((h / 2) + y - 120)+'px'; |
62 master_div.style.position = 'absolute'; |
62 master_div.style.position = 'absolute'; |
63 } |
63 } |
64 else |
64 else |
65 { |
65 { |
66 master_div.style.top = '-10000px'; |
66 master_div.style.top = '-10000px'; |
67 master_div.style.position = ( IE ) ? 'absolute' : 'fixed'; |
67 master_div.style.position = ( IE ) ? 'absolute' : 'fixed'; |
68 } |
68 } |
69 z = ( aclDisableTransitionFX ) ? document.getElementById('specialLayer_darkener').style.zIndex + 1: getHighestZ() + 1; |
69 z = ( aclDisableTransitionFX ) ? document.getElementById('specialLayer_darkener').style.zIndex + 1: getHighestZ() + 1; |
70 mydiv.style.backgroundColor = '#FFFFFF'; |
70 mydiv.style.backgroundColor = '#FFFFFF'; |
71 mydiv.style.padding = '10px'; |
71 mydiv.style.padding = '10px'; |
72 mydiv.style.marginBottom = '1px'; |
72 mydiv.style.marginBottom = '1px'; |
73 mydiv.id = 'messageBox'; |
73 mydiv.id = 'messageBox'; |
74 mydiv.style.overflow = 'auto'; |
74 mydiv.style.overflow = 'auto'; |
75 |
75 |
76 var buttondiv = document.createElement('div'); |
76 var buttondiv = document.createElement('div'); |
77 |
77 |
78 mydiv.style.width = '400px'; |
78 mydiv.style.width = '400px'; |
79 buttondiv.style.width = '400px'; |
79 buttondiv.style.width = '400px'; |
80 |
80 |
81 w = getWidth(); |
81 w = getWidth(); |
82 h = getHeight(); |
82 h = getHeight(); |
83 if ( aclDisableTransitionFX ) |
83 if ( aclDisableTransitionFX ) |
84 { |
84 { |
85 //buttondiv.style.left = ((w / 2) - 200)+'px'; |
85 //buttondiv.style.left = ((w / 2) - 200)+'px'; |
86 //buttondiv.style.top = ((h / 2) + y + 101)+'px'; |
86 //buttondiv.style.top = ((h / 2) + y + 101)+'px'; |
87 } |
87 } |
88 //buttondiv.style.position = ( IE ) ? 'absolute' : 'fixed'; |
88 //buttondiv.style.position = ( IE ) ? 'absolute' : 'fixed'; |
89 z = ( aclDisableTransitionFX ) ? document.getElementById('specialLayer_darkener').style.zIndex : getHighestZ(); |
89 z = ( aclDisableTransitionFX ) ? document.getElementById('specialLayer_darkener').style.zIndex : getHighestZ(); |
90 buttondiv.style.backgroundColor = '#C0C0C0'; |
90 buttondiv.style.backgroundColor = '#C0C0C0'; |
91 buttondiv.style.padding = '10px'; |
91 buttondiv.style.padding = '10px'; |
92 buttondiv.style.textAlign = 'right'; |
92 buttondiv.style.textAlign = 'right'; |
93 buttondiv.style.verticalAlign = 'middle'; |
93 buttondiv.style.verticalAlign = 'middle'; |
94 buttondiv.id = 'messageBoxButtons'; |
94 buttondiv.id = 'messageBoxButtons'; |
95 |
95 |
96 this.clickHandler = function() { messagebox_click(this, mb_current_obj); }; |
96 this.clickHandler = function() { messagebox_click(this, mb_current_obj); }; |
97 |
97 |
98 if( ( type & MB_ICONINFORMATION || type & MB_ICONSTOP || type & MB_ICONQUESTION || type & MB_ICONEXCLAMATION ) && !(type & MB_ICONLOCK) ) |
98 if( ( type & MB_ICONINFORMATION || type & MB_ICONSTOP || type & MB_ICONQUESTION || type & MB_ICONEXCLAMATION ) && !(type & MB_ICONLOCK) ) |
99 { |
99 { |
100 mydiv.style.paddingLeft = '50px'; |
100 mydiv.style.paddingLeft = '50px'; |
101 mydiv.style.width = '360px'; |
101 mydiv.style.width = '360px'; |
102 mydiv.style.backgroundRepeat = 'no-repeat'; |
102 mydiv.style.backgroundRepeat = 'no-repeat'; |
103 mydiv.style.backgroundPosition = '8px 8px'; |
103 mydiv.style.backgroundPosition = '8px 8px'; |
104 } |
104 } |
105 else if ( type & MB_ICONLOCK ) |
105 else if ( type & MB_ICONLOCK ) |
106 { |
106 { |
107 mydiv.style.paddingLeft = '50px'; |
107 mydiv.style.paddingLeft = '50px'; |
108 mydiv.style.width = '360px'; |
108 mydiv.style.width = '360px'; |
109 mydiv.style.backgroundRepeat = 'no-repeat'; |
109 mydiv.style.backgroundRepeat = 'no-repeat'; |
110 } |
110 } |
111 |
111 |
112 if(type & MB_ICONINFORMATION) |
112 if(type & MB_ICONINFORMATION) |
113 { |
113 { |
114 mydiv.style.backgroundImage = 'url(\''+scriptPath+'/images/info.png\')'; |
114 mydiv.style.backgroundImage = 'url(\''+scriptPath+'/images/info.png\')'; |
115 } |
115 } |
116 |
116 |
117 if(type & MB_ICONQUESTION) |
117 if(type & MB_ICONQUESTION) |
118 { |
118 { |
119 mydiv.style.backgroundImage = 'url(\''+scriptPath+'/images/question.png\')'; |
119 mydiv.style.backgroundImage = 'url(\''+scriptPath+'/images/question.png\')'; |
120 } |
120 } |
121 |
121 |
122 if(type & MB_ICONSTOP) |
122 if(type & MB_ICONSTOP) |
123 { |
123 { |
124 mydiv.style.backgroundImage = 'url(\''+scriptPath+'/images/error.png\')'; |
124 mydiv.style.backgroundImage = 'url(\''+scriptPath+'/images/error.png\')'; |
125 } |
125 } |
126 |
126 |
127 if(type & MB_ICONEXCLAMATION) |
127 if(type & MB_ICONEXCLAMATION) |
128 { |
128 { |
129 mydiv.style.backgroundImage = 'url(\''+scriptPath+'/images/warning.png\')'; |
129 mydiv.style.backgroundImage = 'url(\''+scriptPath+'/images/warning.png\')'; |
130 } |
130 } |
131 |
131 |
132 if(type & MB_ICONLOCK) |
132 if(type & MB_ICONLOCK) |
133 { |
133 { |
134 mydiv.style.backgroundImage = 'url(\''+scriptPath+'/images/lock.png\')'; |
134 mydiv.style.backgroundImage = 'url(\''+scriptPath+'/images/lock.png\')'; |
135 } |
135 } |
136 |
136 |
137 if(type & MB_OK) |
137 if(type & MB_OK) |
138 { |
138 { |
139 btn = document.createElement('input'); |
139 btn = document.createElement('input'); |
140 btn.type = 'button'; |
140 btn.type = 'button'; |
141 btn.value = $lang.get('etc_ok'); |
141 btn.value = $lang.get('etc_ok'); |
142 btn._GenericName = 'OK'; |
142 btn._GenericName = 'OK'; |
143 btn.onclick = this.clickHandler; |
143 btn.onclick = this.clickHandler; |
144 btn.style.margin = '0 3px'; |
144 btn.style.margin = '0 3px'; |
145 buttondiv.appendChild(btn); |
145 buttondiv.appendChild(btn); |
146 } |
146 } |
147 |
147 |
148 if(type & MB_OKCANCEL) |
148 if(type & MB_OKCANCEL) |
149 { |
149 { |
150 btn = document.createElement('input'); |
150 btn = document.createElement('input'); |
151 btn.type = 'button'; |
151 btn.type = 'button'; |
152 btn.value = $lang.get('etc_ok'); |
152 btn.value = $lang.get('etc_ok'); |
153 btn._GenericName = 'OK'; |
153 btn._GenericName = 'OK'; |
154 btn.onclick = this.clickHandler; |
154 btn.onclick = this.clickHandler; |
155 btn.style.margin = '0 3px'; |
155 btn.style.margin = '0 3px'; |
156 buttondiv.appendChild(btn); |
156 buttondiv.appendChild(btn); |
157 |
157 |
158 btn = document.createElement('input'); |
158 btn = document.createElement('input'); |
159 btn.type = 'button'; |
159 btn.type = 'button'; |
160 btn.value = $lang.get('etc_cancel'); |
160 btn.value = $lang.get('etc_cancel'); |
161 btn._GenericName = 'Cancel'; |
161 btn._GenericName = 'Cancel'; |
162 btn.onclick = this.clickHandler; |
162 btn.onclick = this.clickHandler; |
163 btn.style.margin = '0 3px'; |
163 btn.style.margin = '0 3px'; |
164 buttondiv.appendChild(btn); |
164 buttondiv.appendChild(btn); |
165 } |
165 } |
166 |
166 |
167 if(type & MB_YESNO) |
167 if(type & MB_YESNO) |
168 { |
168 { |
169 btn = document.createElement('input'); |
169 btn = document.createElement('input'); |
170 btn.type = 'button'; |
170 btn.type = 'button'; |
171 btn.value = $lang.get('etc_yes'); |
171 btn.value = $lang.get('etc_yes'); |
172 btn._GenericName = 'Yes'; |
172 btn._GenericName = 'Yes'; |
173 btn.onclick = this.clickHandler; |
173 btn.onclick = this.clickHandler; |
174 btn.style.margin = '0 3px'; |
174 btn.style.margin = '0 3px'; |
175 buttondiv.appendChild(btn); |
175 buttondiv.appendChild(btn); |
176 |
176 |
177 btn = document.createElement('input'); |
177 btn = document.createElement('input'); |
178 btn.type = 'button'; |
178 btn.type = 'button'; |
179 btn.value = $lang.get('etc_no'); |
179 btn.value = $lang.get('etc_no'); |
180 btn._GenericName = 'No'; |
180 btn._GenericName = 'No'; |
181 btn.onclick = this.clickHandler; |
181 btn.onclick = this.clickHandler; |
182 btn.style.margin = '0 3px'; |
182 btn.style.margin = '0 3px'; |
183 buttondiv.appendChild(btn); |
183 buttondiv.appendChild(btn); |
184 } |
184 } |
185 |
185 |
186 if(type & MB_YESNOCANCEL) |
186 if(type & MB_YESNOCANCEL) |
187 { |
187 { |
188 btn = document.createElement('input'); |
188 btn = document.createElement('input'); |
189 btn.type = 'button'; |
189 btn.type = 'button'; |
190 btn.value = $lang.get('etc_yes'); |
190 btn.value = $lang.get('etc_yes'); |
191 btn._GenericName = 'Yes'; |
191 btn._GenericName = 'Yes'; |
192 btn.onclick = this.clickHandler; |
192 btn.onclick = this.clickHandler; |
193 btn.style.margin = '0 3px'; |
193 btn.style.margin = '0 3px'; |
194 buttondiv.appendChild(btn); |
194 buttondiv.appendChild(btn); |
195 |
195 |
196 btn = document.createElement('input'); |
196 btn = document.createElement('input'); |
197 btn.type = 'button'; |
197 btn.type = 'button'; |
198 btn.value = $lang.get('etc_no'); |
198 btn.value = $lang.get('etc_no'); |
199 btn._GenericName = 'No'; |
199 btn._GenericName = 'No'; |
200 btn.onclick = this.clickHandler; |
200 btn.onclick = this.clickHandler; |
201 btn.style.margin = '0 3px'; |
201 btn.style.margin = '0 3px'; |
202 buttondiv.appendChild(btn); |
202 buttondiv.appendChild(btn); |
203 |
203 |
204 btn = document.createElement('input'); |
204 btn = document.createElement('input'); |
205 btn.type = 'button'; |
205 btn.type = 'button'; |
206 btn.value = $lang.get('etc_cancel'); |
206 btn.value = $lang.get('etc_cancel'); |
207 btn._GenericName = 'Cancel'; |
207 btn._GenericName = 'Cancel'; |
208 btn.onclick = this.clickHandler; |
208 btn.onclick = this.clickHandler; |
209 btn.style.margin = '0 3px'; |
209 btn.style.margin = '0 3px'; |
210 buttondiv.appendChild(btn); |
210 buttondiv.appendChild(btn); |
211 } |
211 } |
212 |
212 |
213 heading = document.createElement('h2'); |
213 heading = document.createElement('h2'); |
214 heading.innerHTML = title; |
214 heading.innerHTML = title; |
215 heading.style.color = '#50A0D0'; |
215 heading.style.color = '#50A0D0'; |
216 heading.style.fontFamily = 'trebuchet ms, verdana, arial, helvetica, sans-serif'; |
216 heading.style.fontFamily = 'trebuchet ms, verdana, arial, helvetica, sans-serif'; |
217 heading.style.fontSize = '12pt'; |
217 heading.style.fontSize = '12pt'; |
218 heading.style.fontWeight = 'lighter'; |
218 heading.style.fontWeight = 'lighter'; |
219 heading.style.textTransform = 'lowercase'; |
219 heading.style.textTransform = 'lowercase'; |
220 heading.style.marginTop = '0'; |
220 heading.style.marginTop = '0'; |
221 mydiv.appendChild(heading); |
221 mydiv.appendChild(heading); |
222 |
222 |
223 var text = document.createElement('div'); |
223 var text = document.createElement('div'); |
224 text.innerHTML = String(message); |
224 text.innerHTML = String(message); |
225 this.text_area = text; |
225 this.text_area = text; |
226 mydiv.appendChild(text); |
226 mydiv.appendChild(text); |
227 |
227 |
228 this.updateContent = function(text) |
228 this.updateContent = function(text) |
229 { |
229 { |
230 this.text_area.innerHTML = text; |
230 this.text_area.innerHTML = text; |
231 }; |
231 }; |
232 |
232 |
233 this.destroy = function() |
233 this.destroy = function() |
234 { |
234 { |
235 var mbdiv = document.getElementById('messageBox'); |
235 var mbdiv = document.getElementById('messageBox'); |
236 mbdiv.parentNode.parentNode.removeChild(mbdiv.parentNode); |
236 mbdiv.parentNode.parentNode.removeChild(mbdiv.parentNode); |
237 if ( !mb_previously_had_darkener ) |
237 if ( !mb_previously_had_darkener ) |
238 enlighten(true); |
238 enlighten(true); |
239 }; |
239 }; |
240 |
240 |
241 //domObjChangeOpac(0, mydiv); |
241 //domObjChangeOpac(0, mydiv); |
242 //domObjChangeOpac(0, master_div); |
242 //domObjChangeOpac(0, master_div); |
243 |
243 |
244 body = document.getElementsByTagName('body'); |
244 body = document.getElementsByTagName('body'); |
245 body = body[0]; |
245 body = body[0]; |
246 master_div.appendChild(mydiv); |
246 master_div.appendChild(mydiv); |
247 master_div.appendChild(buttondiv); |
247 master_div.appendChild(buttondiv); |
248 |
248 |
249 body.appendChild(master_div); |
249 body.appendChild(master_div); |
250 |
250 |
251 if ( !aclDisableTransitionFX ) |
251 if ( !aclDisableTransitionFX ) |
252 setTimeout('mb_runFlyIn();', 100); |
252 setTimeout('mb_runFlyIn();', 100); |
253 |
253 |
254 this.onclick = new Array(); |
254 this.onclick = new Array(); |
255 this.onbeforeclick = new Array(); |
255 this.onbeforeclick = new Array(); |
256 mb_current_obj = this; |
256 mb_current_obj = this; |
257 } |
257 } |
258 |
258 |
259 var messagebox = MessageBox; |
259 var messagebox = MessageBox; |
260 |
260 |
261 function mb_runFlyIn() |
261 function mb_runFlyIn() |
262 { |
262 { |
263 var mydiv = document.getElementById('messageBox'); |
263 var mydiv = document.getElementById('messageBox'); |
264 var maindiv = mydiv.parentNode; |
264 var maindiv = mydiv.parentNode; |
265 fly_in_top(maindiv, true, false); |
265 fly_in_top(maindiv, true, false); |
266 } |
266 } |
267 |
267 |
268 function messagebox_click(obj, mb) |
268 function messagebox_click(obj, mb) |
269 { |
269 { |
270 val = ( typeof ( obj._GenericName ) == 'string' ) ? obj._GenericName : obj.value; |
270 val = ( typeof ( obj._GenericName ) == 'string' ) ? obj._GenericName : obj.value; |
271 if(typeof mb.onbeforeclick[val] == 'function') |
271 if(typeof mb.onbeforeclick[val] == 'function') |
272 { |
272 { |
273 var o = mb.onbeforeclick[val]; |
273 var o = mb.onbeforeclick[val]; |
274 var resp = o(); |
274 var resp = o(); |
275 if ( resp ) |
275 if ( resp ) |
276 return false; |
276 return false; |
277 o = false; |
277 o = false; |
278 } |
278 } |
279 |
279 |
280 var mydiv = document.getElementById('messageBox'); |
280 var mydiv = document.getElementById('messageBox'); |
281 var maindiv = mydiv.parentNode; |
281 var maindiv = mydiv.parentNode; |
282 |
282 |
283 if ( aclDisableTransitionFX ) |
283 if ( aclDisableTransitionFX ) |
284 { |
284 { |
285 var mbdiv = document.getElementById('messageBox'); |
285 var mbdiv = document.getElementById('messageBox'); |
286 mbdiv.parentNode.removeChild(mbdiv.nextSibling); |
286 mbdiv.parentNode.removeChild(mbdiv.nextSibling); |
287 mbdiv.parentNode.removeChild(mbdiv); |
287 mbdiv.parentNode.removeChild(mbdiv); |
288 if ( !mb_previously_had_darkener ) |
288 if ( !mb_previously_had_darkener ) |
289 enlighten(true); |
289 enlighten(true); |
290 } |
290 } |
291 else |
291 else |
292 { |
292 { |
293 var to = fly_out_top(maindiv, true, false); |
293 var to = fly_out_top(maindiv, true, false); |
294 setTimeout("var mbdiv = document.getElementById('messageBox'); mbdiv.parentNode.parentNode.removeChild(mbdiv.parentNode); if ( !mb_previously_had_darkener ) enlighten(true);", to); |
294 setTimeout("var mbdiv = document.getElementById('messageBox'); mbdiv.parentNode.parentNode.removeChild(mbdiv.parentNode); if ( !mb_previously_had_darkener ) enlighten(true);", to); |
295 } |
295 } |
296 if(typeof mb.onclick[val] == 'function') |
296 if(typeof mb.onclick[val] == 'function') |
297 { |
297 { |
298 (mb.onclick[val])(); |
298 (mb.onclick[val])(); |
299 } |
299 } |
300 } |
300 } |
301 |
301 |
302 function testMessageBox() |
302 function testMessageBox() |
303 { |
303 { |
304 mb = new MessageBox(MB_OKCANCEL|MB_ICONINFORMATION, 'Javascripted dynamic message boxes', 'This is soooooo coool, now if only document.createElement() worked in IE!<br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text'); |
304 mb = new MessageBox(MB_OKCANCEL|MB_ICONINFORMATION, 'Javascripted dynamic message boxes', 'This is soooooo coool, now if only document.createElement() worked in IE!<br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text<br /><br /><br /><br /><br />this is some more text'); |
305 mb.onclick['OK'] = function() |
305 mb.onclick['OK'] = function() |
306 { |
306 { |
307 alert('You clicked OK!'); |
307 alert('You clicked OK!'); |
308 } |
308 } |
309 mb.onbeforeclick['Cancel'] = function() |
309 mb.onbeforeclick['Cancel'] = function() |
310 { |
310 { |
311 alert('You clicked Cancel!'); |
311 alert('You clicked Cancel!'); |
312 } |
312 } |
313 } |
313 } |
314 |
314 |
315 /** |
315 /** |
316 * The miniPrompt function, for creating small prompts and dialogs. The window will be flown in and the window darkened with opac=0.4. |
316 * The miniPrompt function, for creating small prompts and dialogs. The window will be flown in and the window darkened with opac=0.4. |
317 * @param function Will be passed an HTMLElement that is the body of the prompt window; the function can do with this as it pleases |
317 * @param function Will be passed an HTMLElement that is the body of the prompt window; the function can do with this as it pleases |
318 */ |
318 */ |
319 |
319 |
320 function miniPrompt(call_on_create) |
320 function miniPrompt(call_on_create) |
321 { |
321 { |
322 if ( !aclDisableTransitionFX ) |
322 if ( !aclDisableTransitionFX ) |
323 { |
323 { |
324 load_component(['flyin', 'jquery', 'jquery-ui', 'fadefilter']); |
324 load_component(['flyin', 'jquery', 'jquery-ui', 'fadefilter']); |
325 } |
325 } |
326 else |
326 else |
327 { |
327 { |
328 load_component(['fadefilter']); |
328 load_component(['fadefilter']); |
329 } |
329 } |
330 var darkener = darken(aclDisableTransitionFX, 40, 'miniprompt_darkener'); |
330 var darkener = darken(aclDisableTransitionFX, 40, 'miniprompt_darkener'); |
331 |
331 |
332 var wrapper = document.createElement('div'); |
332 var wrapper = document.createElement('div'); |
333 wrapper.className = 'miniprompt'; |
333 wrapper.className = 'miniprompt'; |
334 var top = document.createElement('div'); |
334 var top = document.createElement('div'); |
335 top.className = 'mp-top'; |
335 top.className = 'mp-top'; |
336 var body = document.createElement('div'); |
336 var body = document.createElement('div'); |
337 body.className = 'mp-body'; |
337 body.className = 'mp-body'; |
338 var bottom = document.createElement('div'); |
338 var bottom = document.createElement('div'); |
339 bottom.className = 'mp-bottom'; |
339 bottom.className = 'mp-bottom'; |
340 if ( typeof(call_on_create) == 'function' ) |
340 if ( typeof(call_on_create) == 'function' ) |
341 { |
341 { |
342 call_on_create(body); |
342 call_on_create(body); |
343 } |
343 } |
344 wrapper.appendChild(top); |
344 wrapper.appendChild(top); |
345 wrapper.appendChild(body); |
345 wrapper.appendChild(body); |
346 wrapper.appendChild(bottom); |
346 wrapper.appendChild(bottom); |
347 var left = ( getWidth() / 2 ) - ( 388 / 2 ); |
347 var left = ( getWidth() / 2 ) - ( 388 / 2 ); |
348 wrapper.style.left = left + 'px'; |
348 wrapper.style.left = left + 'px'; |
349 var top = getScrollOffset() - 27; |
349 var top = getScrollOffset() - 27; |
350 wrapper.style.top = top + 'px'; |
350 wrapper.style.top = top + 'px'; |
351 domObjChangeOpac(0, wrapper); |
351 domObjChangeOpac(0, wrapper); |
352 var realbody = document.getElementsByTagName('body')[0]; |
352 var realbody = document.getElementsByTagName('body')[0]; |
353 realbody.appendChild(wrapper); |
353 realbody.appendChild(wrapper); |
354 |
354 |
355 if ( aclDisableTransitionFX ) |
355 if ( aclDisableTransitionFX ) |
356 { |
356 { |
357 domObjChangeOpac(100, wrapper); |
357 domObjChangeOpac(100, wrapper); |
358 } |
358 } |
359 else |
359 else |
360 { |
360 { |
361 fly_in_top(wrapper, true, true); |
361 fly_in_top(wrapper, true, true); |
362 |
362 |
363 setTimeout(function() |
363 setTimeout(function() |
364 { |
364 { |
365 domObjChangeOpac(100, wrapper); |
365 domObjChangeOpac(100, wrapper); |
366 }, 40); |
366 }, 40); |
367 } |
367 } |
368 |
368 |
369 // set the darkener's onclick to refocus/shake the miniprompt |
369 // set the darkener's onclick to refocus/shake the miniprompt |
370 darkener.miniprompt = wrapper; |
370 darkener.miniprompt = wrapper; |
371 darkener.onclick = function() |
371 darkener.onclick = function() |
372 { |
372 { |
373 if ( !aclDisableTransitionFX ) |
373 if ( !aclDisableTransitionFX ) |
374 { |
374 { |
375 $(this.miniprompt).effect("pulsate", { times: 2 }, 200); |
375 $(this.miniprompt).effect("pulsate", { times: 2 }, 200); |
376 } |
376 } |
377 } |
377 } |
378 |
378 |
379 return wrapper; |
379 return wrapper; |
380 } |
380 } |
381 |
381 |
382 /** |
382 /** |
383 * For a given element, loops through the element and all of its ancestors looking for a miniPrompt div, and returns it. Returns false on failure. |
383 * For a given element, loops through the element and all of its ancestors looking for a miniPrompt div, and returns it. Returns false on failure. |
384 * @param object:HTMLElement Child node to scan |
384 * @param object:HTMLElement Child node to scan |
385 * @return object |
385 * @return object |
386 */ |
386 */ |
387 |
387 |
388 function miniPromptGetParent(obj) |
388 function miniPromptGetParent(obj) |
389 { |
389 { |
390 while ( true ) |
390 while ( true ) |
391 { |
391 { |
392 // prevent infinite loops |
392 // prevent infinite loops |
393 if ( !obj || obj.tagName == 'BODY' ) |
393 if ( !obj || obj.tagName == 'BODY' ) |
394 return false; |
394 return false; |
395 |
395 |
396 if ( $dynano(obj).hasClass('miniprompt') ) |
396 if ( $dynano(obj).hasClass('miniprompt') ) |
397 { |
397 { |
398 return obj; |
398 return obj; |
399 } |
399 } |
400 obj = obj.parentNode; |
400 obj = obj.parentNode; |
401 } |
401 } |
402 return false; |
402 return false; |
403 } |
403 } |
404 |
404 |
405 /** |
405 /** |
406 * Destroys the first miniPrompt div encountered by recursively checking all parent nodes. |
406 * Destroys the first miniPrompt div encountered by recursively checking all parent nodes. |
407 * Usage: <a href="javascript:miniPromptDestroy(this);">click</a> |
407 * Usage: <a href="javascript:miniPromptDestroy(this);">click</a> |
409 * @param bool (DEPRECATED) If true, does not call enlighten(). |
409 * @param bool (DEPRECATED) If true, does not call enlighten(). |
410 */ |
410 */ |
411 |
411 |
412 function miniPromptDestroy(obj, nofade) |
412 function miniPromptDestroy(obj, nofade) |
413 { |
413 { |
414 obj = miniPromptGetParent(obj); |
414 obj = miniPromptGetParent(obj); |
415 if ( !obj ) |
415 if ( !obj ) |
416 return false; |
416 return false; |
417 |
417 |
418 // found it |
418 // found it |
419 var parent = obj.parentNode; |
419 var parent = obj.parentNode; |
420 // if ( !nofade ) |
420 // if ( !nofade ) |
421 // enlighten(aclDisableTransitionFX); |
421 // enlighten(aclDisableTransitionFX); |
422 enlighten((aclDisableTransitionFX || nofade), 'miniprompt_darkener'); |
422 enlighten((aclDisableTransitionFX || nofade), 'miniprompt_darkener'); |
423 if ( aclDisableTransitionFX || nofade ) |
423 if ( aclDisableTransitionFX || nofade ) |
424 { |
424 { |
425 parent.removeChild(obj); |
425 parent.removeChild(obj); |
426 } |
426 } |
427 else |
427 else |
428 { |
428 { |
429 var timeout = fly_out_top(obj, true, true); |
429 var timeout = fly_out_top(obj, true, true); |
430 setTimeout(function() |
430 setTimeout(function() |
431 { |
431 { |
432 parent.removeChild(obj); |
432 parent.removeChild(obj); |
433 }, timeout); |
433 }, timeout); |
434 } |
434 } |
435 } |
435 } |
436 |
436 |
437 /** |
437 /** |
438 * Simple test case |
438 * Simple test case |
439 */ |
439 */ |
440 |
440 |
441 function miniPromptTest() |
441 function miniPromptTest() |
442 { |
442 { |
443 miniPrompt(function(div) { div.innerHTML = 'hello world! <a href="#" onclick="miniPromptDestroy(this); return false;">destroy me</a>'; }); |
443 miniPrompt(function(div) { div.innerHTML = 'hello world! <a href="#" onclick="miniPromptDestroy(this); return false;">destroy me</a>'; }); |
444 } |
444 } |
445 |
445 |
446 /** |
446 /** |
447 * Message box system for miniPrompts. Less customization but easier to scale than the regular messageBox framework. |
447 * Message box system for miniPrompts. Less customization but easier to scale than the regular messageBox framework. |
448 * @example |
448 * @example |
449 <code> |
449 <code> |
450 miniPromptMessage({ |
450 miniPromptMessage({ |
451 title: 'Delete page', |
451 title: 'Delete page', |
452 message: 'Do you really want to delete this page? This is reversible unless you clear the page logs.', |
452 message: 'Do you really want to delete this page? This is reversible unless you clear the page logs.', |
453 buttons: [ |
453 buttons: [ |
454 { |
454 { |
455 text: 'Delete', |
455 text: 'Delete', |
456 color: 'red', |
456 color: 'red', |
457 style: { |
457 style: { |
458 fontWeight: 'bold' |
458 fontWeight: 'bold' |
459 }, |
459 }, |
460 onclick: function() { |
460 onclick: function() { |
461 ajaxDeletePage(); |
461 ajaxDeletePage(); |
462 miniPromptDestroy(this); |
462 miniPromptDestroy(this); |
463 } |
463 } |
464 }, |
464 }, |
465 { |
465 { |
466 text: 'cancel', |
466 text: 'cancel', |
467 onclick: function() { |
467 onclick: function() { |
468 miniPromptDestroy(this); |
468 miniPromptDestroy(this); |
469 } |
469 } |
470 } |
470 } |
471 ] |
471 ] |
472 }); |
472 }); |
473 </code> |
473 </code> |
474 */ |
474 */ |
475 |
475 |
476 function miniPromptMessage(parms) |
476 function miniPromptMessage(parms) |
477 { |
477 { |
478 if ( ( !parms.title && !parms.message ) || !parms.buttons ) |
478 if ( ( !parms.title && !parms.message ) || !parms.buttons ) |
479 return false; |
479 return false; |
480 |
480 |
481 return miniPrompt(function(parent) |
481 return miniPrompt(function(parent) |
482 { |
482 { |
483 try |
483 try |
484 { |
484 { |
485 if ( parms.title ) |
485 if ( parms.title ) |
486 { |
486 { |
487 var h3 = document.createElement('h3'); |
487 var h3 = document.createElement('h3'); |
488 h3.appendChild(document.createTextNode(parms.title)); |
488 h3.appendChild(document.createTextNode(parms.title)); |
489 } |
489 } |
490 if ( parms.message ) |
490 if ( parms.message ) |
491 { |
491 { |
492 var body = document.createElement('p'); |
492 var body = document.createElement('p'); |
493 var message = parms.message.split(unescape('%0A')); |
493 var message = parms.message.split(unescape('%0A')); |
494 for ( var i = 0; i < message.length; i++ ) |
494 for ( var i = 0; i < message.length; i++ ) |
495 { |
495 { |
496 body.appendChild(document.createTextNode(message[i])); |
496 body.appendChild(document.createTextNode(message[i])); |
497 if ( i + 1 < message.length ) |
497 if ( i + 1 < message.length ) |
498 body.appendChild(document.createElement('br')); |
498 body.appendChild(document.createElement('br')); |
499 } |
499 } |
500 } |
500 } |
501 |
501 |
502 parent.style.textAlign = 'center'; |
502 parent.style.textAlign = 'center'; |
503 |
503 |
504 if ( parms.title ) |
504 if ( parms.title ) |
505 parent.appendChild(h3); |
505 parent.appendChild(h3); |
506 if ( parms.message ) |
506 if ( parms.message ) |
507 parent.appendChild(body); |
507 parent.appendChild(body); |
508 parent.appendChild(document.createElement('br')); |
508 parent.appendChild(document.createElement('br')); |
509 |
509 |
510 // construct buttons |
510 // construct buttons |
511 for ( var i = 0; i < parms.buttons.length; i++ ) |
511 for ( var i = 0; i < parms.buttons.length; i++ ) |
512 { |
512 { |
513 var button = parms.buttons[i]; |
513 var button = parms.buttons[i]; |
514 button.input = document.createElement('a'); |
514 button.input = document.createElement('a'); |
515 button.input.href = '#'; |
515 button.input.href = '#'; |
516 button.input.clickAction = button.onclick; |
516 button.input.clickAction = button.onclick; |
517 button.input.className = 'abutton'; |
517 button.input.className = 'abutton'; |
518 if ( button.color ) |
518 if ( button.color ) |
519 { |
519 { |
520 button.input.className += ' abutton_' + button.color; |
520 button.input.className += ' abutton_' + button.color; |
521 } |
521 } |
522 button.input.appendChild(document.createTextNode(button.text)); |
522 button.input.appendChild(document.createTextNode(button.text)); |
523 if ( button.style ) |
523 if ( button.style ) |
524 { |
524 { |
525 for ( var j in button.style ) |
525 for ( var j in button.style ) |
526 { |
526 { |
527 button.input.style[j] = button.style[j]; |
527 button.input.style[j] = button.style[j]; |
528 } |
528 } |
529 } |
529 } |
530 if ( button.sprite ) |
530 if ( button.sprite ) |
531 { |
531 { |
532 var sprite = gen_sprite(button.sprite[0], button.sprite[1], button.sprite[2], button.sprite[3], button.sprite[4]); |
532 var sprite = gen_sprite(button.sprite[0], button.sprite[1], button.sprite[2], button.sprite[3], button.sprite[4]); |
533 sprite.style.position = 'relative'; |
533 sprite.style.position = 'relative'; |
534 sprite.style.top = '3px'; |
534 sprite.style.top = '3px'; |
535 button.input.insertBefore(sprite, button.input.firstChild); |
535 button.input.insertBefore(sprite, button.input.firstChild); |
536 insertAfter(button.input, document.createTextNode(' '), sprite); |
536 insertAfter(button.input, document.createTextNode(' '), sprite); |
537 } |
537 } |
538 else if ( button.image ) |
538 else if ( button.image ) |
539 { |
539 { |
540 button.input.className += ' icon'; |
540 button.input.className += ' icon'; |
541 button.input.style.backgroundImage = 'url(' + button.image + ')'; |
541 button.input.style.backgroundImage = 'url(' + button.image + ')'; |
542 } |
542 } |
543 button.input.onclick = function(e) |
543 button.input.onclick = function(e) |
544 { |
544 { |
545 try |
545 try |
546 { |
546 { |
547 this.clickAction(e); |
547 this.clickAction(e); |
548 } |
548 } |
549 catch(e) |
549 catch(e) |
550 { |
550 { |
551 console.error(e); |
551 console.error(e); |
552 } |
552 } |
553 return false; |
553 return false; |
554 } |
554 } |
555 parent.appendChild(button.input); |
555 parent.appendChild(button.input); |
556 } |
556 } |
557 // don't focus this in opera - it looks kinda ugly |
557 // don't focus this in opera - it looks kinda ugly |
558 if ( parms.buttons[0] && !window.opera ) |
558 if ( parms.buttons[0] && !window.opera ) |
559 { |
559 { |
560 var timeout = ( aclDisableTransitionFX ) ? 10 : 1000; |
560 var timeout = ( aclDisableTransitionFX ) ? 10 : 1000; |
561 setTimeout(function() |
561 setTimeout(function() |
562 { |
562 { |
563 parms.buttons[0].input.focus(); |
563 parms.buttons[0].input.focus(); |
564 }, timeout); |
564 }, timeout); |
565 } |
565 } |
566 } |
566 } |
567 catch ( e ) |
567 catch ( e ) |
568 { |
568 { |
569 console.error(e); |
569 console.error(e); |
570 } |
570 } |
571 }); |
571 }); |
572 } |
572 } |
573 |
573 |
574 /** |
574 /** |
575 * Identical to whiteOutElement(), but safe to call on miniPrompt divs. |
575 * Identical to whiteOutElement(), but safe to call on miniPrompt divs. |
576 */ |
576 */ |
577 |
577 |
578 function whiteOutMiniPrompt(el) |
578 function whiteOutMiniPrompt(el) |
579 { |
579 { |
580 el = miniPromptGetParent(el); |
580 el = miniPromptGetParent(el); |
581 var width = 320; |
581 var width = 320; |
582 var height = $dynano(el).Height() - 58; |
582 var height = $dynano(el).Height() - 58; |
583 var topoffset = 27; |
583 var topoffset = 27; |
584 |
584 |
585 var container = document.createElement('div'); |
585 var container = document.createElement('div'); |
586 container.style.padding = topoffset + 'px 0 0 0'; |
586 container.style.padding = topoffset + 'px 0 0 0'; |
587 |
587 |
588 var top = getScrollOffset(); |
588 var top = getScrollOffset(); |
589 var left = getWidth() / 2 - width / 2; |
589 var left = getWidth() / 2 - width / 2; |
590 |
590 |
591 // using fixed here allows modal windows to be blacked out |
591 // using fixed here allows modal windows to be blacked out |
592 container.style.position = 'absolute'; |
592 container.style.position = 'absolute'; |
593 container.style.top = ( top - topoffset ) + 'px'; |
593 container.style.top = ( top - topoffset ) + 'px'; |
594 container.style.left = left + 'px'; |
594 container.style.left = left + 'px'; |
595 container.style.zIndex = 1000; |
595 container.style.zIndex = 1000; |
596 |
596 |
597 var blackout = document.createElement('div'); |
597 var blackout = document.createElement('div'); |
598 blackout.style.backgroundColor = '#ffffff'; |
598 blackout.style.backgroundColor = '#ffffff'; |
599 blackout.style.width = width + 'px'; |
599 blackout.style.width = width + 'px'; |
600 blackout.style.height = height + 'px'; |
600 blackout.style.height = height + 'px'; |
601 domObjChangeOpac(60, blackout); |
601 domObjChangeOpac(60, blackout); |
602 var background = ( $dynano(el).Height() < 48 ) ? 'url(' + scriptPath + '/images/loading.gif)' : 'url(' + scriptPath + '/includes/clientside/tinymce/themes/advanced/skins/default/img/progress.gif)'; |
602 var background = ( $dynano(el).Height() < 48 ) ? 'url(' + scriptPath + '/images/loading.gif)' : 'url(' + scriptPath + '/includes/clientside/tinymce/themes/advanced/skins/default/img/progress.gif)'; |
603 blackout.style.backgroundImage = background; |
603 blackout.style.backgroundImage = background; |
604 blackout.style.backgroundPosition = 'center center'; |
604 blackout.style.backgroundPosition = 'center center'; |
605 blackout.style.backgroundRepeat = 'no-repeat'; |
605 blackout.style.backgroundRepeat = 'no-repeat'; |
606 blackout.isMiniPrompt = true; |
606 blackout.isMiniPrompt = true; |
607 blackout.miniPromptObj = el; |
607 blackout.miniPromptObj = el; |
608 |
608 |
609 container.appendChild(blackout); |
609 container.appendChild(blackout); |
610 var body = document.getElementsByTagName('body')[0]; |
610 var body = document.getElementsByTagName('body')[0]; |
611 body.appendChild(container); |
611 body.appendChild(container); |
612 |
612 |
613 return blackout; |
613 return blackout; |
614 } |
614 } |
615 |
615 |
616 function whiteOutDestroyOnMiniPrompt(whitey) |
616 function whiteOutDestroyOnMiniPrompt(whitey) |
617 { |
617 { |
618 var body = document.getElementsByTagName('body')[0]; |
618 var body = document.getElementsByTagName('body')[0]; |
619 var parent = whitey.miniPromptObj; |
619 var parent = whitey.miniPromptObj; |
620 fly_out_top([parent, whitey.parentNode], true, true); |
620 fly_out_top([parent, whitey.parentNode], true, true); |
621 setTimeout(function() |
621 setTimeout(function() |
622 { |
622 { |
623 body.removeChild(parent); |
623 body.removeChild(parent); |
624 body.removeChild(whitey.parentNode); |
624 body.removeChild(whitey.parentNode); |
625 }, 1000 * FI_MULTIPLIER); |
625 }, 1000 * FI_MULTIPLIER); |
626 enlighten(true, 'miniprompt_darkener'); |
626 enlighten(true, 'miniprompt_darkener'); |
627 } |
627 } |
628 |
628 |
629 function testMPMessageBox() |
629 function testMPMessageBox() |
630 { |
630 { |
631 miniPromptMessage({ |
631 miniPromptMessage({ |
632 title: 'The Game of LIFE question #73', |
632 title: 'The Game of LIFE question #73', |
633 message: 'You just got your girlfriend pregnant. Please select an option:', |
633 message: 'You just got your girlfriend pregnant. Please select an option:', |
634 buttons: [ |
634 buttons: [ |
635 { |
635 { |
636 text: 'Abort', |
636 text: 'Abort', |
637 color: 'red', |
637 color: 'red', |
638 style: { |
638 style: { |
639 fontWeight: 'bold' |
639 fontWeight: 'bold' |
640 }, |
640 }, |
641 sprite: [ cdnPath + '/images/icons/abortretryignore-sprite.png', 16, 16, 0, 0 ], |
641 sprite: [ cdnPath + '/images/icons/abortretryignore-sprite.png', 16, 16, 0, 0 ], |
642 onclick: function() { |
642 onclick: function() { |
643 var w = whiteOutMiniPrompt(this); |
643 var w = whiteOutMiniPrompt(this); |
644 var me = this; |
644 var me = this; |
645 setTimeout(function() |
645 setTimeout(function() |
646 { |
646 { |
647 whiteOutReportSuccess(w, true); |
647 whiteOutReportSuccess(w, true); |
648 void(me); |
648 void(me); |
649 setTimeout(function() |
649 setTimeout(function() |
650 { |
650 { |
651 miniPromptDestroy(me); |
651 miniPromptDestroy(me); |
652 }, 1250); |
652 }, 1250); |
653 }, 500); |
653 }, 500); |
654 return false; |
654 return false; |
655 } |
655 } |
656 }, |
656 }, |
657 { |
657 { |
658 text: 'Retry', |
658 text: 'Retry', |
659 color: 'blue', |
659 color: 'blue', |
660 sprite: [ cdnPath + '/images/icons/abortretryignore-sprite.png', 16, 16, 0, 16 ], |
660 sprite: [ cdnPath + '/images/icons/abortretryignore-sprite.png', 16, 16, 0, 16 ], |
661 onclick: function() { |
661 onclick: function() { |
662 var w = whiteOutMiniPrompt(this); |
662 var w = whiteOutMiniPrompt(this); |
663 setTimeout(function() |
663 setTimeout(function() |
664 { |
664 { |
665 whiteOutReportSuccess(w); |
665 whiteOutReportSuccess(w); |
666 }, 1500); |
666 }, 1500); |
667 return false; |
667 return false; |
668 } |
668 } |
669 }, |
669 }, |
670 { |
670 { |
671 text: 'Ignore', |
671 text: 'Ignore', |
672 color: 'green', |
672 color: 'green', |
673 sprite: [ cdnPath + '/images/icons/abortretryignore-sprite.png', 16, 16, 0, 32 ], |
673 sprite: [ cdnPath + '/images/icons/abortretryignore-sprite.png', 16, 16, 0, 32 ], |
674 onclick: function() { |
674 onclick: function() { |
675 miniPromptDestroy(this); |
675 miniPromptDestroy(this); |
676 } |
676 } |
677 } |
677 } |
678 ] |
678 ] |
679 }); |
679 }); |
680 } |
680 } |
681 |
681 |