1 /*############################################################# |
|
2 Name: Niceforms |
|
3 Version: 2.0 |
|
4 Author: Lucian Slatineanu |
|
5 URL: http://www.emblematiq.com/projects/niceforms/ |
|
6 |
|
7 Feel free to use and modify but please keep this copyright intact. |
|
8 #################################################################*/ |
|
9 |
|
10 //Theme Variables - edit these to match your theme |
|
11 var imagesPath = "img/"; |
|
12 var selectRightWidthSimple = 19; |
|
13 var selectRightWidthScroll = 2; |
|
14 var selectMaxHeight = 200; |
|
15 var textareaTopPadding = 10; |
|
16 var textareaSidePadding = 10; |
|
17 |
|
18 //Global Variables |
|
19 var NF = new Array(); |
|
20 var isIE = false; |
|
21 var resizeTest = 1; |
|
22 |
|
23 //Initialization function |
|
24 function NFInit() { |
|
25 try { |
|
26 document.execCommand('BackgroundImageCache', false, true); |
|
27 } catch(e) {} |
|
28 if(!document.getElementById) {return false;} |
|
29 //alert("click me first"); |
|
30 NFDo('start'); |
|
31 } |
|
32 function NFDo(what) { |
|
33 var niceforms = document.getElementsByTagName('form'); |
|
34 var identifier = new RegExp('(^| )'+'niceform'+'( |$)'); |
|
35 if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) { |
|
36 var ieversion=new Number(RegExp.$1); |
|
37 if(ieversion < 7) {return false;} //exit script if IE6 |
|
38 isIE = true; |
|
39 } |
|
40 for(var q = 0; q < niceforms.length; q++) {if(identifier.test(niceforms[q].className)) { |
|
41 if(what == "start") { //Load Niceforms |
|
42 NF[q] = new niceform(niceforms[q]); |
|
43 niceforms[q].start(); |
|
44 } |
|
45 else { //Unload Niceforms |
|
46 niceforms[q].unload(); |
|
47 NF[q] = ""; |
|
48 } |
|
49 }} |
|
50 } |
|
51 function NFFix() { |
|
52 NFDo('stop'); |
|
53 NFDo('start'); |
|
54 } |
|
55 function niceform(nf) { |
|
56 nf._inputText = new Array(); nf._inputRadio = new Array(); nf._inputCheck = new Array(); nf._inputSubmit = new Array(); nf._inputFile = new Array(); nf._textarea = new Array(); nf._select = new Array(); nf._multiselect = new Array(); |
|
57 nf.add_inputText = function(obj) {this._inputText[this._inputText.length] = obj; inputText(obj);} |
|
58 nf.add_inputRadio = function(obj) {this._inputRadio[this._inputRadio.length] = obj; inputRadio(obj);} |
|
59 nf.add_inputCheck = function(obj) {this._inputCheck[this._inputCheck.length] = obj; inputCheck(obj);} |
|
60 nf.add_inputSubmit = function(obj) {this._inputSubmit[this._inputSubmit.length] = obj; inputSubmit(obj);} |
|
61 nf.add_inputFile = function(obj) {this._inputFile[this._inputFile.length] = obj; inputFile(obj);} |
|
62 nf.add_textarea = function(obj) {this._textarea[this._textarea.length] = obj; textarea(obj);} |
|
63 nf.add_select = function(obj) {this._select[this._select.length] = obj; selects(obj);} |
|
64 nf.add_multiselect = function(obj) {this._multiselect[this._multiselect.length] = obj; multiSelects(obj);} |
|
65 nf.start = function() { |
|
66 //Separate and assign elements |
|
67 var allInputs = this.getElementsByTagName('input'); |
|
68 for(var w = 0; w < allInputs.length; w++) { |
|
69 switch(allInputs[w].type) { |
|
70 case "text": case "password": {this.add_inputText(allInputs[w]); break;} |
|
71 case "radio": {this.add_inputRadio(allInputs[w]); break;} |
|
72 case "checkbox": {this.add_inputCheck(allInputs[w]); break;} |
|
73 case "submit": case "reset": case "button": {this.add_inputSubmit(allInputs[w]); break;} |
|
74 case "file": {this.add_inputFile(allInputs[w]); break;} |
|
75 } |
|
76 } |
|
77 var allButtons = this.getElementsByTagName('button'); |
|
78 for(var w = 0; w < allButtons.length; w++) { |
|
79 this.add_inputSubmit(allButtons[w]); |
|
80 } |
|
81 var allTextareas = this.getElementsByTagName('textarea'); |
|
82 for(var w = 0; w < allTextareas.length; w++) { |
|
83 this.add_textarea(allTextareas[w]); |
|
84 } |
|
85 var allSelects = this.getElementsByTagName('select'); |
|
86 for(var w = 0; w < allSelects.length; w++) { |
|
87 if(allSelects[w].size == "1") {this.add_select(allSelects[w]);} |
|
88 else {this.add_multiselect(allSelects[w]);} |
|
89 } |
|
90 //Start |
|
91 for(w = 0; w < this._inputText.length; w++) {this._inputText[w].init();} |
|
92 for(w = 0; w < this._inputRadio.length; w++) {this._inputRadio[w].init();} |
|
93 for(w = 0; w < this._inputCheck.length; w++) {this._inputCheck[w].init();} |
|
94 for(w = 0; w < this._inputSubmit.length; w++) {this._inputSubmit[w].init();} |
|
95 for(w = 0; w < this._inputFile.length; w++) {this._inputFile[w].init();} |
|
96 for(w = 0; w < this._textarea.length; w++) {this._textarea[w].init();} |
|
97 for(w = 0; w < this._select.length; w++) {this._select[w].init(w);} |
|
98 for(w = 0; w < this._multiselect.length; w++) {this._multiselect[w].init(w);} |
|
99 } |
|
100 nf.unload = function() { |
|
101 //Stop |
|
102 for(w = 0; w < this._inputText.length; w++) {this._inputText[w].unload();} |
|
103 for(w = 0; w < this._inputRadio.length; w++) {this._inputRadio[w].unload();} |
|
104 for(w = 0; w < this._inputCheck.length; w++) {this._inputCheck[w].unload();} |
|
105 for(w = 0; w < this._inputSubmit.length; w++) {this._inputSubmit[w].unload();} |
|
106 for(w = 0; w < this._inputFile.length; w++) {this._inputFile[w].unload();} |
|
107 for(w = 0; w < this._textarea.length; w++) {this._textarea[w].unload();} |
|
108 for(w = 0; w < this._select.length; w++) {this._select[w].unload();} |
|
109 for(w = 0; w < this._multiselect.length; w++) {this._multiselect[w].unload();} |
|
110 } |
|
111 } |
|
112 function inputText(el) { //extent Text inputs |
|
113 el.oldClassName = el.className; |
|
114 el.left = document.createElement('img'); |
|
115 el.left.src = imagesPath + "0.png"; |
|
116 el.left.className = "NFTextLeft"; |
|
117 el.right = document.createElement('img'); |
|
118 el.right.src = imagesPath + "0.png"; |
|
119 el.right.className = "NFTextRight"; |
|
120 el.dummy = document.createElement('div'); |
|
121 el.dummy.className = "NFTextCenter"; |
|
122 el.onfocus = function() { |
|
123 this.dummy.className = "NFTextCenter NFh"; |
|
124 this.left.className = "NFTextLeft NFh"; |
|
125 this.right.className = "NFTextRight NFh"; |
|
126 } |
|
127 el.onblur = function() { |
|
128 this.dummy.className = "NFTextCenter"; |
|
129 this.left.className = "NFTextLeft"; |
|
130 this.right.className = "NFTextRight"; |
|
131 } |
|
132 el.init = function() { |
|
133 this.parentNode.insertBefore(this.left, this); |
|
134 this.parentNode.insertBefore(this.right, this.nextSibling); |
|
135 this.dummy.appendChild(this); |
|
136 this.right.parentNode.insertBefore(this.dummy, this.right); |
|
137 this.className = "NFText"; |
|
138 } |
|
139 el.unload = function() { |
|
140 this.parentNode.parentNode.appendChild(this); |
|
141 this.parentNode.removeChild(this.left); |
|
142 this.parentNode.removeChild(this.right); |
|
143 this.parentNode.removeChild(this.dummy); |
|
144 this.className = this.oldClassName; |
|
145 } |
|
146 } |
|
147 function inputRadio(el) { //extent Radio buttons |
|
148 el.oldClassName = el.className; |
|
149 el.dummy = document.createElement('div'); |
|
150 if(el.checked) {el.dummy.className = "NFRadio NFh";} |
|
151 else {el.dummy.className = "NFRadio";} |
|
152 el.dummy.ref = el; |
|
153 if(isIE == false) {el.dummy.style.left = findPosX(el) + 'px'; el.dummy.style.top = findPosY(el) + 'px';} |
|
154 else {el.dummy.style.left = findPosX(el) + 4 + 'px'; el.dummy.style.top = findPosY(el) + 4 + 'px';} |
|
155 el.dummy.onclick = function() { |
|
156 if(!this.ref.checked) { |
|
157 var siblings = getInputsByName(this.ref.name); |
|
158 for(var q = 0; q < siblings.length; q++) { |
|
159 siblings[q].checked = false; |
|
160 siblings[q].dummy.className = "NFRadio"; |
|
161 } |
|
162 this.ref.checked = true; |
|
163 this.className = "NFRadio NFh"; |
|
164 } |
|
165 } |
|
166 el.onclick = function() { |
|
167 if(this.checked) { |
|
168 var siblings = getInputsByName(this.name); |
|
169 for(var q = 0; q < siblings.length; q++) { |
|
170 siblings[q].dummy.className = "NFRadio"; |
|
171 } |
|
172 this.dummy.className = "NFRadio NFh"; |
|
173 } |
|
174 } |
|
175 el.onfocus = function() {this.dummy.className += " NFfocused";} |
|
176 el.onblur = function() {this.dummy.className = this.dummy.className.replace(/ NFfocused/g, "");} |
|
177 el.init = function() { |
|
178 this.parentNode.insertBefore(this.dummy, this); |
|
179 el.className = "NFhidden"; |
|
180 } |
|
181 el.unload = function() { |
|
182 this.parentNode.removeChild(this.dummy); |
|
183 this.className = this.oldClassName; |
|
184 } |
|
185 } |
|
186 function inputCheck(el) { //extend Checkboxes |
|
187 el.oldClassName = el.className; |
|
188 el.dummy = document.createElement('img'); |
|
189 el.dummy.src = imagesPath + "0.png"; |
|
190 if(el.checked) {el.dummy.className = "NFCheck NFh";} |
|
191 else {el.dummy.className = "NFCheck";} |
|
192 el.dummy.ref = el; |
|
193 if(isIE == false) {el.dummy.style.left = findPosX(el) + 'px'; el.dummy.style.top = findPosY(el) + 'px';} |
|
194 else {el.dummy.style.left = findPosX(el) + 4 + 'px'; el.dummy.style.top = findPosY(el) + 4 + 'px';} |
|
195 el.dummy.onclick = function() { |
|
196 if(!this.ref.checked) { |
|
197 this.ref.checked = true; |
|
198 this.className = "NFCheck NFh"; |
|
199 } |
|
200 else { |
|
201 this.ref.checked = false; |
|
202 this.className = "NFCheck"; |
|
203 } |
|
204 } |
|
205 el.onclick = function() { |
|
206 if(this.checked) {this.dummy.className = "NFCheck NFh";} |
|
207 else {this.dummy.className = "NFCheck";} |
|
208 } |
|
209 el.onfocus = function() {this.dummy.className += " NFfocused";} |
|
210 el.onblur = function() {this.dummy.className = this.dummy.className.replace(/ NFfocused/g, "");} |
|
211 el.init = function() { |
|
212 this.parentNode.insertBefore(this.dummy, this); |
|
213 el.className = "NFhidden"; |
|
214 } |
|
215 el.unload = function() { |
|
216 this.parentNode.removeChild(this.dummy); |
|
217 this.className = this.oldClassName; |
|
218 } |
|
219 } |
|
220 function inputSubmit(el) { //extend Buttons |
|
221 el.oldClassName = el.className; |
|
222 el.left = document.createElement('img'); |
|
223 el.left.className = "NFButtonLeft"; |
|
224 el.left.src = imagesPath + "0.png"; |
|
225 el.right = document.createElement('img'); |
|
226 el.right.src = imagesPath + "0.png"; |
|
227 el.right.className = "NFButtonRight"; |
|
228 el.onmouseover = function() { |
|
229 this.className = "NFButton NFh"; |
|
230 this.left.className = "NFButtonLeft NFh"; |
|
231 this.right.className = "NFButtonRight NFh"; |
|
232 } |
|
233 el.onmouseout = function() { |
|
234 this.className = "NFButton"; |
|
235 this.left.className = "NFButtonLeft"; |
|
236 this.right.className = "NFButtonRight"; |
|
237 } |
|
238 el.init = function() { |
|
239 this.parentNode.insertBefore(this.left, this); |
|
240 this.parentNode.insertBefore(this.right, this.nextSibling); |
|
241 this.className = "NFButton"; |
|
242 } |
|
243 el.unload = function() { |
|
244 this.parentNode.removeChild(this.left); |
|
245 this.parentNode.removeChild(this.right); |
|
246 this.className = this.oldClassName; |
|
247 } |
|
248 } |
|
249 function inputFile(el) { //extend File inputs |
|
250 el.oldClassName = el.className; |
|
251 el.dummy = document.createElement('div'); |
|
252 el.dummy.className = "NFFile"; |
|
253 el.file = document.createElement('div'); |
|
254 el.file.className = "NFFileNew"; |
|
255 el.center = document.createElement('div'); |
|
256 el.center.className = "NFTextCenter"; |
|
257 el.clone = document.createElement('input'); |
|
258 el.clone.type = "text"; |
|
259 el.clone.className = "NFText"; |
|
260 el.clone.ref = el; |
|
261 el.left = document.createElement('img'); |
|
262 el.left.src = imagesPath + "0.png"; |
|
263 el.left.className = "NFTextLeft"; |
|
264 el.button = document.createElement('img'); |
|
265 el.button.src = imagesPath + "0.png"; |
|
266 el.button.className = "NFFileButton"; |
|
267 el.button.ref = el; |
|
268 el.button.onclick = function() {this.ref.click();} |
|
269 el.init = function() { |
|
270 var top = this.parentNode; |
|
271 if(this.previousSibling) {var where = this.previousSibling;} |
|
272 else {var where = top.childNodes[0];} |
|
273 top.insertBefore(this.dummy, where); |
|
274 this.dummy.appendChild(this); |
|
275 this.center.appendChild(this.clone); |
|
276 this.file.appendChild(this.center); |
|
277 this.file.insertBefore(this.left, this.center); |
|
278 this.file.appendChild(this.button); |
|
279 this.dummy.appendChild(this.file); |
|
280 this.className = "NFhidden"; |
|
281 this.relatedElement = this.clone; |
|
282 } |
|
283 el.unload = function() { |
|
284 this.parentNode.parentNode.appendChild(this); |
|
285 this.parentNode.removeChild(this.dummy); |
|
286 this.className = this.oldClassName; |
|
287 } |
|
288 el.onchange = el.onmouseout = function() {this.relatedElement.value = this.value;} |
|
289 el.onfocus = function() { |
|
290 this.left.className = "NFTextLeft NFh"; |
|
291 this.center.className = "NFTextCenter NFh"; |
|
292 this.button.className = "NFFileButton NFh"; |
|
293 } |
|
294 el.onblur = function() { |
|
295 this.left.className = "NFTextLeft"; |
|
296 this.center.className = "NFTextCenter"; |
|
297 this.button.className = "NFFileButton"; |
|
298 } |
|
299 el.onselect = function() { |
|
300 this.relatedElement.select(); |
|
301 this.value = ''; |
|
302 } |
|
303 } |
|
304 function textarea(el) { //extend Textareas |
|
305 el.oldClassName = el.className; |
|
306 el.height = el.offsetHeight - textareaTopPadding; |
|
307 el.width = el.offsetWidth - textareaSidePadding; |
|
308 el.topLeft = document.createElement('img'); |
|
309 el.topLeft.src = imagesPath + "0.png"; |
|
310 el.topLeft.className = "NFTextareaTopLeft"; |
|
311 el.topRight = document.createElement('div'); |
|
312 el.topRight.className = "NFTextareaTop"; |
|
313 el.bottomLeft = document.createElement('img'); |
|
314 el.bottomLeft.src = imagesPath + "0.png"; |
|
315 el.bottomLeft.className = "NFTextareaBottomLeft"; |
|
316 el.bottomRight = document.createElement('div'); |
|
317 el.bottomRight.className = "NFTextareaBottom"; |
|
318 el.left = document.createElement('div'); |
|
319 el.left.className = "NFTextareaLeft"; |
|
320 el.right = document.createElement('div'); |
|
321 el.right.className = "NFTextareaRight"; |
|
322 el.init = function() { |
|
323 var top = this.parentNode; |
|
324 if(this.previousSibling) {var where = this.previousSibling;} |
|
325 else {var where = top.childNodes[0];} |
|
326 top.insertBefore(el.topRight, where); |
|
327 top.insertBefore(el.right, where); |
|
328 top.insertBefore(el.bottomRight, where); |
|
329 this.topRight.appendChild(this.topLeft); |
|
330 this.right.appendChild(this.left); |
|
331 this.right.appendChild(this); |
|
332 this.bottomRight.appendChild(this.bottomLeft); |
|
333 el.style.width = el.topRight.style.width = el.bottomRight.style.width = el.width + 'px'; |
|
334 el.style.height = el.left.style.height = el.right.style.height = el.height + 'px'; |
|
335 this.className = "NFTextarea"; |
|
336 } |
|
337 el.unload = function() { |
|
338 this.parentNode.parentNode.appendChild(this); |
|
339 this.parentNode.removeChild(this.topRight); |
|
340 this.parentNode.removeChild(this.bottomRight); |
|
341 this.parentNode.removeChild(this.right); |
|
342 this.className = this.oldClassName; |
|
343 this.style.width = this.style.height = ""; |
|
344 } |
|
345 el.onfocus = function() { |
|
346 this.topLeft.className = "NFTextareaTopLeft NFh"; |
|
347 this.topRight.className = "NFTextareaTop NFhr"; |
|
348 this.left.className = "NFTextareaLeftH"; |
|
349 this.right.className = "NFTextareaRightH"; |
|
350 this.bottomLeft.className = "NFTextareaBottomLeft NFh"; |
|
351 this.bottomRight.className = "NFTextareaBottom NFhr"; |
|
352 } |
|
353 el.onblur = function() { |
|
354 this.topLeft.className = "NFTextareaTopLeft"; |
|
355 this.topRight.className = "NFTextareaTop"; |
|
356 this.left.className = "NFTextareaLeft"; |
|
357 this.right.className = "NFTextareaRight"; |
|
358 this.bottomLeft.className = "NFTextareaBottomLeft"; |
|
359 this.bottomRight.className = "NFTextareaBottom"; |
|
360 } |
|
361 } |
|
362 function selects(el) { //extend Selects |
|
363 el.oldClassName = el.className; |
|
364 el.dummy = document.createElement('div'); |
|
365 el.dummy.className = "NFSelect"; |
|
366 el.dummy.style.width = el.offsetWidth + 'px'; |
|
367 el.dummy.ref = el; |
|
368 el.left = document.createElement('img'); |
|
369 el.left.src = imagesPath + "0.png"; |
|
370 el.left.className = "NFSelectLeft"; |
|
371 el.right = document.createElement('div'); |
|
372 el.right.className = "NFSelectRight"; |
|
373 el.txt = document.createTextNode(el.options[0].text); |
|
374 el.bg = document.createElement('div'); |
|
375 el.bg.className = "NFSelectTarget"; |
|
376 el.bg.style.display = "none"; |
|
377 el.opt = document.createElement('ul'); |
|
378 el.opt.className = "NFSelectOptions"; |
|
379 el.dummy.style.left = findPosX(el) + 'px'; |
|
380 el.dummy.style.top = findPosY(el) + 'px'; |
|
381 el.opts = new Array(el.options.length); |
|
382 el.init = function(pos) { |
|
383 this.dummy.appendChild(this.left); |
|
384 this.right.appendChild(this.txt); |
|
385 this.dummy.appendChild(this.right); |
|
386 this.bg.appendChild(this.opt); |
|
387 this.dummy.appendChild(this.bg); |
|
388 for(var q = 0; q < this.options.length; q++) { |
|
389 this.opts[q] = new option(this.options[q], q); |
|
390 this.opt.appendChild(this.options[q].li); |
|
391 this.options[q].lnk.onclick = function() { |
|
392 this._onclick(); |
|
393 this.ref.dummy.getElementsByTagName('div')[0].innerHTML = this.ref.options[this.pos].text; |
|
394 this.ref.options[this.pos].selected = "selected"; |
|
395 for(var w = 0; w < this.ref.options.length; w++) {this.ref.options[w].lnk.className = "";} |
|
396 this.ref.options[this.pos].lnk.className = "NFOptionActive"; |
|
397 } |
|
398 } |
|
399 if(this.options.selectedIndex) { |
|
400 this.dummy.getElementsByTagName('div')[0].innerHTML = this.options[this.options.selectedIndex].text; |
|
401 this.options[this.options.selectedIndex].lnk.className = "NFOptionActive"; |
|
402 } |
|
403 this.dummy.style.zIndex = 999 - pos; |
|
404 this.parentNode.insertBefore(this.dummy, this); |
|
405 this.className = "NFhidden"; |
|
406 } |
|
407 el.unload = function() { |
|
408 this.parentNode.removeChild(this.dummy); |
|
409 this.className = this.oldClassName; |
|
410 } |
|
411 el.dummy.onclick = function() { |
|
412 var allDivs = document.getElementsByTagName('div'); for(var q = 0; q < allDivs.length; q++) {if((allDivs[q].className == "NFSelectTarget") && (allDivs[q] != this.ref.bg)) {allDivs[q].style.display = "none";}} |
|
413 if(this.ref.bg.style.display == "none") {this.ref.bg.style.display = "block";} |
|
414 else {this.ref.bg.style.display = "none";} |
|
415 if(this.ref.opt.offsetHeight > selectMaxHeight) { |
|
416 this.ref.bg.style.width = this.ref.offsetWidth - selectRightWidthScroll + 33 + 'px'; |
|
417 this.ref.opt.style.width = this.ref.offsetWidth - selectRightWidthScroll + 'px'; |
|
418 } |
|
419 else { |
|
420 this.ref.bg.style.width = this.ref.offsetWidth - selectRightWidthSimple + 33 + 'px'; |
|
421 this.ref.opt.style.width = this.ref.offsetWidth - selectRightWidthSimple + 'px'; |
|
422 } |
|
423 } |
|
424 el.bg.onmouseout = function(e) { |
|
425 if (!e) var e = window.event; |
|
426 e.cancelBubble = true; |
|
427 if (e.stopPropagation) e.stopPropagation(); |
|
428 var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement; |
|
429 if((reltg.nodeName == 'A') || (reltg.nodeName == 'LI') || (reltg.nodeName == 'UL')) return; |
|
430 if((reltg.nodeName == 'DIV') || (reltg.className == 'NFSelectTarget')) return; |
|
431 else{this.style.display = "none";} |
|
432 } |
|
433 el.dummy.onmouseout = function(e) { |
|
434 if (!e) var e = window.event; |
|
435 e.cancelBubble = true; |
|
436 if (e.stopPropagation) e.stopPropagation(); |
|
437 var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement; |
|
438 if((reltg.nodeName == 'A') || (reltg.nodeName == 'LI') || (reltg.nodeName == 'UL')) return; |
|
439 if((reltg.nodeName == 'DIV') || (reltg.className == 'NFSelectTarget')) return; |
|
440 else{this.ref.bg.style.display = "none";} |
|
441 } |
|
442 el.onfocus = function() {this.dummy.className += " NFfocused";} |
|
443 el.onblur = function() {this.dummy.className = this.dummy.className.replace(/ NFfocused/g, "");} |
|
444 el.onkeydown = function(e) { |
|
445 if (!e) var e = window.event; |
|
446 var thecode = e.keyCode; |
|
447 var active = this.selectedIndex; |
|
448 switch(thecode){ |
|
449 case 40: //down |
|
450 if(active < this.options.length - 1) { |
|
451 for(var w = 0; w < this.options.length; w++) {this.options[w].lnk.className = "";} |
|
452 var newOne = active + 1; |
|
453 this.options[newOne].selected = "selected"; |
|
454 this.options[newOne].lnk.className = "NFOptionActive"; |
|
455 this.dummy.getElementsByTagName('div')[0].innerHTML = this.options[newOne].text; |
|
456 } |
|
457 return false; |
|
458 break; |
|
459 case 38: //up |
|
460 if(active > 0) { |
|
461 for(var w = 0; w < this.options.length; w++) {this.options[w].lnk.className = "";} |
|
462 var newOne = active - 1; |
|
463 this.options[newOne].selected = "selected"; |
|
464 this.options[newOne].lnk.className = "NFOptionActive"; |
|
465 this.dummy.getElementsByTagName('div')[0].innerHTML = this.options[newOne].text; |
|
466 } |
|
467 return false; |
|
468 break; |
|
469 default: |
|
470 break; |
|
471 } |
|
472 } |
|
473 } |
|
474 function multiSelects(el) { //extend Multiple Selects |
|
475 el.oldClassName = el.className; |
|
476 el.height = el.offsetHeight; |
|
477 el.width = el.offsetWidth; |
|
478 el.topLeft = document.createElement('img'); |
|
479 el.topLeft.src = imagesPath + "0.png"; |
|
480 el.topLeft.className = "NFMultiSelectTopLeft"; |
|
481 el.topRight = document.createElement('div'); |
|
482 el.topRight.className = "NFMultiSelectTop"; |
|
483 el.bottomLeft = document.createElement('img'); |
|
484 el.bottomLeft.src = imagesPath + "0.png"; |
|
485 el.bottomLeft.className = "NFMultiSelectBottomLeft"; |
|
486 el.bottomRight = document.createElement('div'); |
|
487 el.bottomRight.className = "NFMultiSelectBottom"; |
|
488 el.left = document.createElement('div'); |
|
489 el.left.className = "NFMultiSelectLeft"; |
|
490 el.right = document.createElement('div'); |
|
491 el.right.className = "NFMultiSelectRight"; |
|
492 el.init = function() { |
|
493 var top = this.parentNode; |
|
494 if(this.previousSibling) {var where = this.previousSibling;} |
|
495 else {var where = top.childNodes[0];} |
|
496 top.insertBefore(el.topRight, where); |
|
497 top.insertBefore(el.right, where); |
|
498 top.insertBefore(el.bottomRight, where); |
|
499 this.topRight.appendChild(this.topLeft); |
|
500 this.right.appendChild(this.left); |
|
501 this.right.appendChild(this); |
|
502 this.bottomRight.appendChild(this.bottomLeft); |
|
503 el.style.width = el.topRight.style.width = el.bottomRight.style.width = el.width + 'px'; |
|
504 el.style.height = el.left.style.height = el.right.style.height = el.height + 'px'; |
|
505 el.className = "NFMultiSelect"; |
|
506 } |
|
507 el.unload = function() { |
|
508 this.parentNode.parentNode.appendChild(this); |
|
509 this.parentNode.removeChild(this.topRight); |
|
510 this.parentNode.removeChild(this.bottomRight); |
|
511 this.parentNode.removeChild(this.right); |
|
512 this.className = this.oldClassName; |
|
513 this.style.width = this.style.height = ""; |
|
514 } |
|
515 el.onfocus = function() { |
|
516 this.topLeft.className = "NFMultiSelectTopLeft NFh"; |
|
517 this.topRight.className = "NFMultiSelectTop NFhr"; |
|
518 this.left.className = "NFMultiSelectLeftH"; |
|
519 this.right.className = "NFMultiSelectRightH"; |
|
520 this.bottomLeft.className = "NFMultiSelectBottomLeft NFh"; |
|
521 this.bottomRight.className = "NFMultiSelectBottom NFhr"; |
|
522 } |
|
523 el.onblur = function() { |
|
524 this.topLeft.className = "NFMultiSelectTopLeft"; |
|
525 this.topRight.className = "NFMultiSelectTop"; |
|
526 this.left.className = "NFMultiSelectLeft"; |
|
527 this.right.className = "NFMultiSelectRight"; |
|
528 this.bottomLeft.className = "NFMultiSelectBottomLeft"; |
|
529 this.bottomRight.className = "NFMultiSelectBottom"; |
|
530 } |
|
531 } |
|
532 function option(el, no) { //extend Options |
|
533 el.li = document.createElement('li'); |
|
534 el.lnk = document.createElement('a'); |
|
535 el.lnk.href = "javascript:;"; |
|
536 el.lnk.ref = el.parentNode; |
|
537 el.lnk.pos = no; |
|
538 el.lnk._onclick = el.onclick || function () {}; |
|
539 el.txt = document.createTextNode(el.text); |
|
540 el.lnk.appendChild(el.txt); |
|
541 el.li.appendChild(el.lnk); |
|
542 } |
|
543 |
|
544 //Get Position |
|
545 function findPosY(obj) { |
|
546 var posTop = 0; |
|
547 do {posTop += obj.offsetTop;} while (obj = obj.offsetParent); |
|
548 return posTop; |
|
549 } |
|
550 function findPosX(obj) { |
|
551 var posLeft = 0; |
|
552 do {posLeft += obj.offsetLeft;} while (obj = obj.offsetParent); |
|
553 return posLeft; |
|
554 } |
|
555 //Get Siblings |
|
556 function getInputsByName(name) { |
|
557 var inputs = document.getElementsByTagName("input"); |
|
558 var w = 0; var results = new Array(); |
|
559 for(var q = 0; q < inputs.length; q++) {if(inputs[q].name == name) {results[w] = inputs[q]; ++w;}} |
|
560 return results; |
|
561 } |
|
562 |
|
563 //Add events |
|
564 var existingLoadEvent = window.onload || function () {}; |
|
565 var existingResizeEvent = window.onresize || function() {}; |
|
566 window.onload = function () { |
|
567 existingLoadEvent(); |
|
568 NFInit(); |
|
569 } |
|
570 window.onresize = function() { |
|
571 if(resizeTest != document.documentElement.clientHeight) { |
|
572 existingResizeEvent(); |
|
573 NFFix(); |
|
574 } |
|
575 resizeTest = document.documentElement.clientHeight; |
|
576 } |
|