| [ Index ] |
|
Code source de Mantis 1.1.0rc3 |
1 // script.aculo.us controls.js v1.6.4, Wed Sep 06 11:30:58 CEST 2006 2 3 // Copyright (c) 2005 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us) 4 // (c) 2005 Ivan Krstic (http://blogs.law.harvard.edu/ivan) 5 // (c) 2005 Jon Tirsen (http://www.tirsen.com) 6 // Contributors: 7 // Richard Livsey 8 // Rahul Bhargava 9 // Rob Wills 10 // 11 // See scriptaculous.js for full license. 12 13 // Autocompleter.Base handles all the autocompletion functionality 14 // that's independent of the data source for autocompletion. This 15 // includes drawing the autocompletion menu, observing keyboard 16 // and mouse events, and similar. 17 // 18 // Specific autocompleters need to provide, at the very least, 19 // a getUpdatedChoices function that will be invoked every time 20 // the text inside the monitored textbox changes. This method 21 // should get the text for which to provide autocompletion by 22 // invoking this.getToken(), NOT by directly accessing 23 // this.element.value. This is to allow incremental tokenized 24 // autocompletion. Specific auto-completion logic (AJAX, etc) 25 // belongs in getUpdatedChoices. 26 // 27 // Tokenized incremental autocompletion is enabled automatically 28 // when an autocompleter is instantiated with the 'tokens' option 29 // in the options parameter, e.g.: 30 // new Ajax.Autocompleter('id','upd', '/url/', { tokens: ',' }); 31 // will incrementally autocomplete with a comma as the token. 32 // Additionally, ',' in the above example can be replaced with 33 // a token array, e.g. { tokens: [',', '\n'] } which 34 // enables autocompletion on multiple tokens. This is most 35 // useful when one of the tokens is \n (a newline), as it 36 // allows smart autocompletion after linebreaks. 37 38 if(typeof Effect == 'undefined') 39 throw("controls.js requires including script.aculo.us' effects.js library"); 40 41 var Autocompleter = {} 42 Autocompleter.Base = function() {}; 43 Autocompleter.Base.prototype = { 44 baseInitialize: function(element, update, options) { 45 this.element = $(element); 46 this.update = $(update); 47 this.hasFocus = false; 48 this.changed = false; 49 this.active = false; 50 this.index = 0; 51 this.entryCount = 0; 52 53 if(this.setOptions) 54 this.setOptions(options); 55 else 56 this.options = options || {}; 57 58 this.options.paramName = this.options.paramName || this.element.name; 59 this.options.tokens = this.options.tokens || []; 60 this.options.frequency = this.options.frequency || 0.4; 61 this.options.minChars = this.options.minChars || 1; 62 this.options.onShow = this.options.onShow || 63 function(element, update){ 64 if(!update.style.position || update.style.position=='absolute') { 65 update.style.position = 'absolute'; 66 Position.clone(element, update, { 67 setHeight: false, 68 offsetTop: element.offsetHeight 69 }); 70 } 71 Effect.Appear(update,{duration:0.15}); 72 }; 73 this.options.onHide = this.options.onHide || 74 function(element, update){ new Effect.Fade(update,{duration:0.15}) }; 75 76 if(typeof(this.options.tokens) == 'string') 77 this.options.tokens = new Array(this.options.tokens); 78 79 this.observer = null; 80 81 this.element.setAttribute('autocomplete','off'); 82 83 Element.hide(this.update); 84 85 Event.observe(this.element, "blur", this.onBlur.bindAsEventListener(this)); 86 Event.observe(this.element, "keypress", this.onKeyPress.bindAsEventListener(this)); 87 }, 88 89 show: function() { 90 if(Element.getStyle(this.update, 'display')=='none') this.options.onShow(this.element, this.update); 91 if(!this.iefix && 92 (navigator.appVersion.indexOf('MSIE')>0) && 93 (navigator.userAgent.indexOf('Opera')<0) && 94 (Element.getStyle(this.update, 'position')=='absolute')) { 95 new Insertion.After(this.update, 96 '<iframe id="' + this.update.id + '_iefix" '+ 97 'style="display:none;position:absolute;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);" ' + 98 'src="javascript:false;" frameborder="0" scrolling="no"></iframe>'); 99 this.iefix = $(this.update.id+'_iefix'); 100 } 101 if(this.iefix) setTimeout(this.fixIEOverlapping.bind(this), 50); 102 }, 103 104 fixIEOverlapping: function() { 105 Position.clone(this.update, this.iefix, {setTop:(!this.update.style.height)}); 106 this.iefix.style.zIndex = 1; 107 this.update.style.zIndex = 2; 108 Element.show(this.iefix); 109 }, 110 111 hide: function() { 112 this.stopIndicator(); 113 if(Element.getStyle(this.update, 'display')!='none') this.options.onHide(this.element, this.update); 114 if(this.iefix) Element.hide(this.iefix); 115 }, 116 117 startIndicator: function() { 118 if(this.options.indicator) Element.show(this.options.indicator); 119 }, 120 121 stopIndicator: function() { 122 if(this.options.indicator) Element.hide(this.options.indicator); 123 }, 124 125 onKeyPress: function(event) { 126 if(this.active) 127 switch(event.keyCode) { 128 case Event.KEY_TAB: 129 case Event.KEY_RETURN: 130 this.selectEntry(); 131 Event.stop(event); 132 case Event.KEY_ESC: 133 this.hide(); 134 this.active = false; 135 Event.stop(event); 136 return; 137 case Event.KEY_LEFT: 138 case Event.KEY_RIGHT: 139 return; 140 case Event.KEY_UP: 141 this.markPrevious(); 142 this.render(); 143 if(navigator.appVersion.indexOf('AppleWebKit')>0) Event.stop(event); 144 return; 145 case Event.KEY_DOWN: 146 this.markNext(); 147 this.render(); 148 if(navigator.appVersion.indexOf('AppleWebKit')>0) Event.stop(event); 149 return; 150 } 151 else 152 if(event.keyCode==Event.KEY_TAB || event.keyCode==Event.KEY_RETURN || 153 (navigator.appVersion.indexOf('AppleWebKit') > 0 && event.keyCode == 0)) return; 154 155 this.changed = true; 156 this.hasFocus = true; 157 158 if(this.observer) clearTimeout(this.observer); 159 this.observer = 160 setTimeout(this.onObserverEvent.bind(this), this.options.frequency*1000); 161 }, 162 163 activate: function() { 164 this.changed = false; 165 this.hasFocus = true; 166 this.getUpdatedChoices(); 167 }, 168 169 onHover: function(event) { 170 var element = Event.findElement(event, 'LI'); 171 if(this.index != element.autocompleteIndex) 172 { 173 this.index = element.autocompleteIndex; 174 this.render(); 175 } 176 Event.stop(event); 177 }, 178 179 onClick: function(event) { 180 var element = Event.findElement(event, 'LI'); 181 this.index = element.autocompleteIndex; 182 this.selectEntry(); 183 this.hide(); 184 }, 185 186 onBlur: function(event) { 187 // needed to make click events working 188 setTimeout(this.hide.bind(this), 250); 189 this.hasFocus = false; 190 this.active = false; 191 }, 192 193 render: function() { 194 if(this.entryCount > 0) { 195 for (var i = 0; i < this.entryCount; i++) 196 this.index==i ? 197 Element.addClassName(this.getEntry(i),"selected") : 198 Element.removeClassName(this.getEntry(i),"selected"); 199 200 if(this.hasFocus) { 201 this.show(); 202 this.active = true; 203 } 204 } else { 205 this.active = false; 206 this.hide(); 207 } 208 }, 209 210 markPrevious: function() { 211 if(this.index > 0) this.index-- 212 else this.index = this.entryCount-1; 213 this.getEntry(this.index).scrollIntoView(true); 214 }, 215 216 markNext: function() { 217 if(this.index < this.entryCount-1) this.index++ 218 else this.index = 0; 219 this.getEntry(this.index).scrollIntoView(false); 220 }, 221 222 getEntry: function(index) { 223 return this.update.firstChild.childNodes[index]; 224 }, 225 226 getCurrentEntry: function() { 227 return this.getEntry(this.index); 228 }, 229 230 selectEntry: function() { 231 this.active = false; 232 this.updateElement(this.getCurrentEntry()); 233 }, 234 235 updateElement: function(selectedElement) { 236 if (this.options.updateElement) { 237 this.options.updateElement(selectedElement); 238 return; 239 } 240 var value = ''; 241 if (this.options.select) { 242 var nodes = document.getElementsByClassName(this.options.select, selectedElement) || []; 243 if(nodes.length>0) value = Element.collectTextNodes(nodes[0], this.options.select); 244 } else 245 value = Element.collectTextNodesIgnoreClass(selectedElement, 'informal'); 246 247 var lastTokenPos = this.findLastToken(); 248 if (lastTokenPos != -1) { 249 var newValue = this.element.value.substr(0, lastTokenPos + 1); 250 var whitespace = this.element.value.substr(lastTokenPos + 1).match(/^\s+/); 251 if (whitespace) 252 newValue += whitespace[0]; 253 this.element.value = newValue + value; 254 } else { 255 this.element.value = value; 256 } 257 this.element.focus(); 258 259 if (this.options.afterUpdateElement) 260 this.options.afterUpdateElement(this.element, selectedElement); 261 }, 262 263 updateChoices: function(choices) { 264 if(!this.changed && this.hasFocus) { 265 this.update.innerHTML = choices; 266 Element.cleanWhitespace(this.update); 267 Element.cleanWhitespace(this.update.firstChild); 268 269 if(this.update.firstChild && this.update.firstChild.childNodes) { 270 this.entryCount = 271 this.update.firstChild.childNodes.length; 272 for (var i = 0; i < this.entryCount; i++) { 273 var entry = this.getEntry(i); 274 entry.autocompleteIndex = i; 275 this.addObservers(entry); 276 } 277 } else { 278 this.entryCount = 0; 279 } 280 281 this.stopIndicator(); 282 this.index = 0; 283 284 if(this.entryCount==1 && this.options.autoSelect) { 285 this.selectEntry(); 286 this.hide(); 287 } else { 288 this.render(); 289 } 290 } 291 }, 292 293 addObservers: function(element) { 294 Event.observe(element, "mouseover", this.onHover.bindAsEventListener(this)); 295 Event.observe(element, "click", this.onClick.bindAsEventListener(this)); 296 }, 297 298 onObserverEvent: function() { 299 this.changed = false; 300 if(this.getToken().length>=this.options.minChars) { 301 this.startIndicator(); 302 this.getUpdatedChoices(); 303 } else { 304 this.active = false; 305 this.hide(); 306 } 307 }, 308 309 getToken: function() { 310 var tokenPos = this.findLastToken(); 311 if (tokenPos != -1) 312 var ret = this.element.value.substr(tokenPos + 1).replace(/^\s+/,'').replace(/\s+$/,''); 313 else 314 var ret = this.element.value; 315 316 return /\n/.test(ret) ? '' : ret; 317 }, 318 319 findLastToken: function() { 320 var lastTokenPos = -1; 321 322 for (var i=0; i<this.options.tokens.length; i++) { 323 var thisTokenPos = this.element.value.lastIndexOf(this.options.tokens[i]); 324 if (thisTokenPos > lastTokenPos) 325 lastTokenPos = thisTokenPos; 326 } 327 return lastTokenPos; 328 } 329 } 330 331 Ajax.Autocompleter = Class.create(); 332 Object.extend(Object.extend(Ajax.Autocompleter.prototype, Autocompleter.Base.prototype), { 333 initialize: function(element, update, url, options) { 334 this.baseInitialize(element, update, options); 335 this.options.asynchronous = true; 336 this.options.onComplete = this.onComplete.bind(this); 337 this.options.defaultParams = this.options.parameters || null; 338 this.url = url; 339 }, 340 341 getUpdatedChoices: function() { 342 entry = encodeURIComponent(this.options.paramName) + '=' + 343 encodeURIComponent(this.getToken()); 344 345 this.options.parameters = this.options.callback ? 346 this.options.callback(this.element, entry) : entry; 347 348 if(this.options.defaultParams) 349 this.options.parameters += '&' + this.options.defaultParams; 350 351 new Ajax.Request(this.url, this.options); 352 }, 353 354 onComplete: function(request) { 355 this.updateChoices(request.responseText); 356 } 357 358 }); 359 360 // The local array autocompleter. Used when you'd prefer to 361 // inject an array of autocompletion options into the page, rather 362 // than sending out Ajax queries, which can be quite slow sometimes. 363 // 364 // The constructor takes four parameters. The first two are, as usual, 365 // the id of the monitored textbox, and id of the autocompletion menu. 366 // The third is the array you want to autocomplete from, and the fourth 367 // is the options block. 368 // 369 // Extra local autocompletion options: 370 // - choices - How many autocompletion choices to offer 371 // 372 // - partialSearch - If false, the autocompleter will match entered 373 // text only at the beginning of strings in the 374 // autocomplete array. Defaults to true, which will 375 // match text at the beginning of any *word* in the 376 // strings in the autocomplete array. If you want to 377 // search anywhere in the string, additionally set 378 // the option fullSearch to true (default: off). 379 // 380 // - fullSsearch - Search anywhere in autocomplete array strings. 381 // 382 // - partialChars - How many characters to enter before triggering 383 // a partial match (unlike minChars, which defines 384 // how many characters are required to do any match 385 // at all). Defaults to 2. 386 // 387 // - ignoreCase - Whether to ignore case when autocompleting. 388 // Defaults to true. 389 // 390 // It's possible to pass in a custom function as the 'selector' 391 // option, if you prefer to write your own autocompletion logic. 392 // In that case, the other options above will not apply unless 393 // you support them. 394 395 Autocompleter.Local = Class.create(); 396 Autocompleter.Local.prototype = Object.extend(new Autocompleter.Base(), { 397 initialize: function(element, update, array, options) { 398 this.baseInitialize(element, update, options); 399 this.options.array = array; 400 }, 401 402 getUpdatedChoices: function() { 403 this.updateChoices(this.options.selector(this)); 404 }, 405 406 setOptions: function(options) { 407 this.options = Object.extend({ 408 choices: 10, 409 partialSearch: true, 410 partialChars: 2, 411 ignoreCase: true, 412 fullSearch: false, 413 selector: function(instance) { 414 var ret = []; // Beginning matches 415 var partial = []; // Inside matches 416 var entry = instance.getToken(); 417 var count = 0; 418 419 for (var i = 0; i < instance.options.array.length && 420 ret.length < instance.options.choices ; i++) { 421 422 var elem = instance.options.array[i]; 423 var foundPos = instance.options.ignoreCase ? 424 elem.toLowerCase().indexOf(entry.toLowerCase()) : 425 elem.indexOf(entry); 426 427 while (foundPos != -1) { 428 if (foundPos == 0 && elem.length != entry.length) { 429 ret.push("<li><strong>" + elem.substr(0, entry.length) + "</strong>" + 430 elem.substr(entry.length) + "</li>"); 431 break; 432 } else if (entry.length >= instance.options.partialChars && 433 instance.options.partialSearch && foundPos != -1) { 434 if (instance.options.fullSearch || /\s/.test(elem.substr(foundPos-1,1))) { 435 partial.push("<li>" + elem.substr(0, foundPos) + "<strong>" + 436 elem.substr(foundPos, entry.length) + "</strong>" + elem.substr( 437 foundPos + entry.length) + "</li>"); 438 break; 439 } 440 } 441 442 foundPos = instance.options.ignoreCase ? 443 elem.toLowerCase().indexOf(entry.toLowerCase(), foundPos + 1) : 444 elem.indexOf(entry, foundPos + 1); 445 446 } 447 } 448 if (partial.length) 449 ret = ret.concat(partial.slice(0, instance.options.choices - ret.length)) 450 return "<ul>" + ret.join('') + "</ul>"; 451 } 452 }, options || {}); 453 } 454 }); 455 456 // AJAX in-place editor 457 // 458 // see documentation on http://wiki.script.aculo.us/scriptaculous/show/Ajax.InPlaceEditor 459 460 // Use this if you notice weird scrolling problems on some browsers, 461 // the DOM might be a bit confused when this gets called so do this 462 // waits 1 ms (with setTimeout) until it does the activation 463 Field.scrollFreeActivate = function(field) { 464 setTimeout(function() { 465 Field.activate(field); 466 }, 1); 467 } 468 469 Ajax.InPlaceEditor = Class.create(); 470 Ajax.InPlaceEditor.defaultHighlightColor = "#FFFF99"; 471 Ajax.InPlaceEditor.prototype = { 472 initialize: function(element, url, options) { 473 this.url = url; 474 this.element = $(element); 475 476 this.options = Object.extend({ 477 okButton: true, 478 okText: "ok", 479 cancelLink: true, 480 cancelText: "cancel", 481 savingText: "Saving...", 482 clickToEditText: "Click to edit", 483 okText: "ok", 484 rows: 1, 485 onComplete: function(transport, element) { 486 new Effect.Highlight(element, {startcolor: this.options.highlightcolor}); 487 }, 488 onFailure: function(transport) { 489 alert("Error communicating with the server: " + transport.responseText.stripTags()); 490 }, 491 callback: function(form) { 492 return Form.serialize(form); 493 }, 494 handleLineBreaks: true, 495 loadingText: 'Loading...', 496 savingClassName: 'inplaceeditor-saving', 497 loadingClassName: 'inplaceeditor-loading', 498 formClassName: 'inplaceeditor-form', 499 highlightcolor: Ajax.InPlaceEditor.defaultHighlightColor, 500 highlightendcolor: "#FFFFFF", 501 externalControl: null, 502 submitOnBlur: false, 503 ajaxOptions: {}, 504 evalScripts: false 505 }, options || {}); 506 507 if(!this.options.formId && this.element.id) { 508 this.options.formId = this.element.id + "-inplaceeditor"; 509 if ($(this.options.formId)) { 510 // there's already a form with that name, don't specify an id 511 this.options.formId = null; 512 } 513 } 514 515 if (this.options.externalControl) { 516 this.options.externalControl = $(this.options.externalControl); 517 } 518 519 this.originalBackground = Element.getStyle(this.element, 'background-color'); 520 if (!this.originalBackground) { 521 this.originalBackground = "transparent"; 522 } 523 524 this.element.title = this.options.clickToEditText; 525 526 this.onclickListener = this.enterEditMode.bindAsEventListener(this); 527 this.mouseoverListener = this.enterHover.bindAsEventListener(this); 528 this.mouseoutListener = this.leaveHover.bindAsEventListener(this); 529 Event.observe(this.element, 'click', this.onclickListener); 530 Event.observe(this.element, 'mouseover', this.mouseoverListener); 531 Event.observe(this.element, 'mouseout', this.mouseoutListener); 532 if (this.options.externalControl) { 533 Event.observe(this.options.externalControl, 'click', this.onclickListener); 534 Event.observe(this.options.externalControl, 'mouseover', this.mouseoverListener); 535 Event.observe(this.options.externalControl, 'mouseout', this.mouseoutListener); 536 } 537 }, 538 enterEditMode: function(evt) { 539 if (this.saving) return; 540 if (this.editing) return; 541 this.editing = true; 542 this.onEnterEditMode(); 543 if (this.options.externalControl) { 544 Element.hide(this.options.externalControl); 545 } 546 Element.hide(this.element); 547 this.createForm(); 548 this.element.parentNode.insertBefore(this.form, this.element); 549 if (!this.options.loadTextURL) Field.scrollFreeActivate(this.editField); 550 // stop the event to avoid a page refresh in Safari 551 if (evt) { 552 Event.stop(evt); 553 } 554 return false; 555 }, 556 createForm: function() { 557 this.form = document.createElement("form"); 558 this.form.id = this.options.formId; 559 Element.addClassName(this.form, this.options.formClassName) 560 this.form.onsubmit = this.onSubmit.bind(this); 561 562 this.createEditField(); 563 564 if (this.options.textarea) { 565 var br = document.createElement("br"); 566 this.form.appendChild(br); 567 } 568 569 if (this.options.okButton) { 570 okButton = document.createElement("input"); 571 okButton.type = "submit"; 572 okButton.value = this.options.okText; 573 okButton.className = 'editor_ok_button'; 574 this.form.appendChild(okButton); 575 } 576 577 if (this.options.cancelLink) { 578 cancelLink = document.createElement("a"); 579 cancelLink.href = "#"; 580 cancelLink.appendChild(document.createTextNode(this.options.cancelText)); 581 cancelLink.onclick = this.onclickCancel.bind(this); 582 cancelLink.className = 'editor_cancel'; 583 this.form.appendChild(cancelLink); 584 } 585 }, 586 hasHTMLLineBreaks: function(string) { 587 if (!this.options.handleLineBreaks) return false; 588 return string.match(/<br/i) || string.match(/<p>/i); 589 }, 590 convertHTMLLineBreaks: function(string) { 591 return string.replace(/<br>/gi, "\n").replace(/<br\/>/gi, "\n").replace(/<\/p>/gi, "\n").replace(/<p>/gi, ""); 592 }, 593 createEditField: function() { 594 var text; 595 if(this.options.loadTextURL) { 596 text = this.options.loadingText; 597 } else { 598 text = this.getText(); 599 } 600 601 var obj = this; 602 603 if (this.options.rows == 1 && !this.hasHTMLLineBreaks(text)) { 604 this.options.textarea = false; 605 var textField = document.createElement("input"); 606 textField.obj = this; 607 textField.type = "text"; 608 textField.name = "value"; 609 textField.value = text; 610 textField.style.backgroundColor = this.options.highlightcolor; 611 textField.className = 'editor_field'; 612 var size = this.options.size || this.options.cols || 0; 613 if (size != 0) textField.size = size; 614 if (this.options.submitOnBlur) 615 textField.onblur = this.onSubmit.bind(this); 616 this.editField = textField; 617 } else { 618 this.options.textarea = true; 619 var textArea = document.createElement("textarea"); 620 textArea.obj = this; 621 textArea.name = "value"; 622 textArea.value = this.convertHTMLLineBreaks(text); 623 textArea.rows = this.options.rows; 624 textArea.cols = this.options.cols || 40; 625 textArea.className = 'editor_field'; 626 if (this.options.submitOnBlur) 627 textArea.onblur = this.onSubmit.bind(this); 628 this.editField = textArea; 629 } 630 631 if(this.options.loadTextURL) { 632 this.loadExternalText(); 633 } 634 this.form.appendChild(this.editField); 635 }, 636 getText: function() { 637 return this.element.innerHTML; 638 }, 639 loadExternalText: function() { 640 Element.addClassName(this.form, this.options.loadingClassName); 641 this.editField.disabled = true; 642 new Ajax.Request( 643 this.options.loadTextURL, 644 Object.extend({ 645 asynchronous: true, 646 onComplete: this.onLoadedExternalText.bind(this) 647 }, this.options.ajaxOptions) 648 ); 649 }, 650 onLoadedExternalText: function(transport) { 651 Element.removeClassName(this.form, this.options.loadingClassName); 652 this.editField.disabled = false; 653 this.editField.value = transport.responseText.stripTags(); 654 Field.scrollFreeActivate(this.editField); 655 }, 656 onclickCancel: function() { 657 this.onComplete(); 658 this.leaveEditMode(); 659 return false; 660 }, 661 onFailure: function(transport) { 662 this.options.onFailure(transport); 663 if (this.oldInnerHTML) { 664 this.element.innerHTML = this.oldInnerHTML; 665 this.oldInnerHTML = null; 666 } 667 return false; 668 }, 669 onSubmit: function() { 670 // onLoading resets these so we need to save them away for the Ajax call 671 var form = this.form; 672 var value = this.editField.value; 673 674 // do this first, sometimes the ajax call returns before we get a chance to switch on Saving... 675 // which means this will actually switch on Saving... *after* we've left edit mode causing Saving... 676 // to be displayed indefinitely 677 this.onLoading(); 678 679 if (this.options.evalScripts) { 680 new Ajax.Request( 681 this.url, Object.extend({ 682 parameters: this.options.callback(form, value), 683 onComplete: this.onComplete.bind(this), 684 onFailure: this.onFailure.bind(this), 685 asynchronous:true, 686 evalScripts:true 687 }, this.options.ajaxOptions)); 688 } else { 689 new Ajax.Updater( 690 { success: this.element, 691 // don't update on failure (this could be an option) 692 failure: null }, 693 this.url, Object.extend({ 694 parameters: this.options.callback(form, value), 695 onComplete: this.onComplete.bind(this), 696 onFailure: this.onFailure.bind(this) 697 }, this.options.ajaxOptions)); 698 } 699 // stop the event to avoid a page refresh in Safari 700 if (arguments.length > 1) { 701 Event.stop(arguments[0]); 702 } 703 return false; 704 }, 705 onLoading: function() { 706 this.saving = true; 707 this.removeForm(); 708 this.leaveHover(); 709 this.showSaving(); 710 }, 711 showSaving: function() { 712 this.oldInnerHTML = this.element.innerHTML; 713 this.element.innerHTML = this.options.savingText; 714 Element.addClassName(this.element, this.options.savingClassName); 715 this.element.style.backgroundColor = this.originalBackground; 716 Element.show(this.element); 717 }, 718 removeForm: function() { 719 if(this.form) { 720 if (this.form.parentNode) Element.remove(this.form); 721 this.form = null; 722 } 723 }, 724 enterHover: function() { 725 if (this.saving) return; 726 this.element.style.backgroundColor = this.options.highlightcolor; 727 if (this.effect) { 728 this.effect.cancel(); 729 } 730 Element.addClassName(this.element, this.options.hoverClassName) 731 }, 732 leaveHover: function() { 733 if (this.options.backgroundColor) { 734 this.element.style.backgroundColor = this.oldBackground; 735 } 736 Element.removeClassName(this.element, this.options.hoverClassName) 737 if (this.saving) return; 738 this.effect = new Effect.Highlight(this.element, { 739 startcolor: this.options.highlightcolor, 740 endcolor: this.options.highlightendcolor, 741 restorecolor: this.originalBackground 742 }); 743 }, 744 leaveEditMode: function() { 745 Element.removeClassName(this.element, this.options.savingClassName); 746 this.removeForm(); 747 this.leaveHover(); 748 this.element.style.backgroundColor = this.originalBackground; 749 Element.show(this.element); 750 if (this.options.externalControl) { 751 Element.show(this.options.externalControl); 752 } 753 this.editing = false; 754 this.saving = false; 755 this.oldInnerHTML = null; 756 this.onLeaveEditMode(); 757 }, 758 onComplete: function(transport) { 759 this.leaveEditMode(); 760 this.options.onComplete.bind(this)(transport, this.element); 761 }, 762 onEnterEditMode: function() {}, 763 onLeaveEditMode: function() {}, 764 dispose: function() { 765 if (this.oldInnerHTML) { 766 this.element.innerHTML = this.oldInnerHTML; 767 } 768 this.leaveEditMode(); 769 Event.stopObserving(this.element, 'click', this.onclickListener); 770 Event.stopObserving(this.element, 'mouseover', this.mouseoverListener); 771 Event.stopObserving(this.element, 'mouseout', this.mouseoutListener); 772 if (this.options.externalControl) { 773 Event.stopObserving(this.options.externalControl, 'click', this.onclickListener); 774 Event.stopObserving(this.options.externalControl, 'mouseover', this.mouseoverListener); 775 Event.stopObserving(this.options.externalControl, 'mouseout', this.mouseoutListener); 776 } 777 } 778 }; 779 780 Ajax.InPlaceCollectionEditor = Class.create(); 781 Object.extend(Ajax.InPlaceCollectionEditor.prototype, Ajax.InPlaceEditor.prototype); 782 Object.extend(Ajax.InPlaceCollectionEditor.prototype, { 783 createEditField: function() { 784 if (!this.cached_selectTag) { 785 var selectTag = document.createElement("select"); 786 var collection = this.options.collection || []; 787 var optionTag; 788 collection.each(function(e,i) { 789 optionTag = document.createElement("option"); 790 optionTag.value = (e instanceof Array) ? e[0] : e; 791 if((typeof this.options.value == 'undefined') && 792 ((e instanceof Array) ? this.element.innerHTML == e[1] : e == optionTag.value)) optionTag.selected = true; 793 if(this.options.value==optionTag.value) optionTag.selected = true; 794 optionTag.appendChild(document.createTextNode((e instanceof Array) ? e[1] : e)); 795 selectTag.appendChild(optionTag); 796 }.bind(this)); 797 this.cached_selectTag = selectTag; 798 } 799 800 this.editField = this.cached_selectTag; 801 if(this.options.loadTextURL) this.loadExternalText(); 802 this.form.appendChild(this.editField); 803 this.options.callback = function(form, value) { 804 return "value=" + encodeURIComponent(value); 805 } 806 } 807 }); 808 809 // Delayed observer, like Form.Element.Observer, 810 // but waits for delay after last key input 811 // Ideal for live-search fields 812 813 Form.Element.DelayedObserver = Class.create(); 814 Form.Element.DelayedObserver.prototype = { 815 initialize: function(element, delay, callback) { 816 this.delay = delay || 0.5; 817 this.element = $(element); 818 this.callback = callback; 819 this.timer = null; 820 this.lastValue = $F(this.element); 821 Event.observe(this.element,'keyup',this.delayedListener.bindAsEventListener(this)); 822 }, 823 delayedListener: function(event) { 824 if(this.lastValue == $F(this.element)) return; 825 if(this.timer) clearTimeout(this.timer); 826 this.timer = setTimeout(this.onTimerEvent.bind(this), this.delay * 1000); 827 this.lastValue = $F(this.element); 828 }, 829 onTimerEvent: function() { 830 this.timer = null; 831 this.callback(this.element, $F(this.element)); 832 } 833 };
titre
Description
Corps
titre
Description
Corps
titre
Description
Corps
titre
Corps
| Généré le : Thu Nov 29 09:42:17 2007 | par Balluche grâce à PHPXref 0.7 |
|
|