0469: // AJAX in-place editor and collection editor
0470: // Full rewrite by Christophe Porteneuve <tdd@tddsworld.com> (April 2007).
0471: 
0472: // Use this if you notice weird scrolling problems on some browsers,
0473: // the DOM might be a bit confused when this gets called so do this
0474: // waits 1 ms (with setTimeout) until it does the activation
0475: Field.scrollFreeActivate = function(field) {
0476:   setTimeout(function() {
0477:     Field.activate(field);
0478:   }, 1);
0479: }
0480:

0481: Ajax.InPlaceEditor = Class.create({
0482:   initialize: function(element, url, options) {
0483:     this.url = url;
0484:     this.element = element = $(element);
0485:     this.prepareOptions();
0486:     this._controls = { };
0487:     arguments.callee.dealWithDeprecatedOptions(options); // DEPRECATION LAYER!!!
0488:     Object.extend(this.options, options || { });
0489:     if (!this.options.formId && this.element.id) {
0490:       this.options.formId = this.element.id + '-inplaceeditor';
0491:       if ($(this.options.formId))
0492:         this.options.formId = '';
0493:     }
0494:     if (this.options.externalControl)
0495:       this.options.externalControl = $(this.options.externalControl);
0496:     if (!this.options.externalControl)
0497:       this.options.externalControlOnly = false;
0498:     this._originalBackground = this.element.getStyle('background-color') || 'transparent';
0499:     this.element.title = this.options.clickToEditText;
0500:     this._boundCancelHandler = this.handleFormCancellation.bind(this);
0501:     this._boundComplete = (this.options.onComplete || Prototype.emptyFunction).bind(this);
0502:     this._boundFailureHandler = this.handleAJAXFailure.bind(this);
0503:     this._boundSubmitHandler = this.handleFormSubmission.bind(this);
0504:     this._boundWrapperHandler = this.wrapUp.bind(this);
0505:     this.registerListeners();
0506:   },

0507: checkForEscapeOrReturn: function(e) {
0508:   if (!this._editing || e.ctrlKey || e.altKey || e.shiftKey) return;
0509:   if (Event.KEY_ESC == e.keyCode)
0510:     this.handleFormCancellation(e);
0511:   else if (Event.KEY_RETURN == e.keyCode)
0512:     this.handleFormSubmission(e);
0513: },

0514: createControl: function(mode, handler, extraClasses) {
0515:   var control = this.options[mode + 'Control'];
0516:   var text = this.options[mode + 'Text'];
0517:   if ('button' == control) {
0518:     var btn = document.createElement('input');
0519:     btn.type = 'submit';
0520:     btn.value = text;
0521:     btn.className = 'editor_' + mode + '_button';
0522:     if ('cancel' == mode)
0523:       btn.onclick = this._boundCancelHandler;
0524:     this._form.appendChild(btn);
0525:     this._controls[mode] = btn;
0526:   } else if ('link' == control) {
0527:     var link = document.createElement('a');
0528:     link.href = '#';
0529:     link.appendChild(document.createTextNode(text));
0530:     link.onclick = 'cancel' == mode ? this._boundCancelHandler: this._boundSubmitHandler;
0531:     link.className = 'editor_' + mode + '_link';
0532:     if (extraClasses)
0533:       link.className += ' ' + extraClasses;
0534:     this._form.appendChild(link);
0535:     this._controls[mode] = link;
0536:   }
0537: },

0538: createEditField: function() {
0539:   var text = (this.options.loadTextURL ? this.options.loadingText: this.getText());
0540:   var fld;
0541:   if (1 >= this.options.rows && !/\r|\n/.test(this.getText())) {
0542:     fld = document.createElement('input');
0543:     fld.type = 'text';
0544:     var size = this.options.size || this.options.cols || 0;
0545:     if (0 < size) fld.size = size;
0546:   } else {
0547:     fld = document.createElement('textarea');
0548:     fld.rows = (1 >= this.options.rows ? this.options.autoRows: this.options.rows);
0549:     fld.cols = this.options.cols || 40;
0550:   }
0551:   fld.name = this.options.paramName;
0552:   fld.value = text; // No HTML breaks conversion anymore
0553:   fld.className = 'editor_field';
0554:   if (this.options.submitOnBlur)
0555:     fld.onblur = this._boundSubmitHandler;
0556:   this._controls.editor = fld;
0557:   if (this.options.loadTextURL)
0558:     this.loadExternalText();
0559:   this._form.appendChild(this._controls.editor);
0560: },

0561: createForm: function() {
0562:   var ipe = this;

0563:   function addText(mode, condition) {
0564:     var text = ipe.options['text' + mode + 'Controls'];
0565:     if (!text || condition === false) return;
0566:     ipe._form.appendChild(document.createTextNode(text));
0567:   };
0568:   this._form = $(document.createElement('form'));
0569:   this._form.id = this.options.formId;
0570:   this._form.addClassName(this.options.formClassName);
0571:   this._form.onsubmit = this._boundSubmitHandler;
0572:   this.createEditField();
0573:   if ('textarea' == this._controls.editor.tagName.toLowerCase())
0574:     this._form.appendChild(document.createElement('br'));
0575:   if (this.options.onFormCustomization)
0576:     this.options.onFormCustomization(this, this._form);
0577:   addText('Before', this.options.okControl || this.options.cancelControl);
0578:   this.createControl('ok', this._boundSubmitHandler);
0579:   addText('Between', this.options.okControl && this.options.cancelControl);
0580:   this.createControl('cancel', this._boundCancelHandler, 'editor_cancel');
05>0581:   addText('After', this.options.okControl || this.options.cancelControl);
0582: },

<form id=options.formId className=options.formClassName onsubmit=_boundSubmitHandler>
  createEditField() ここに入力エリアが入る
  入力エリアがtextarea要素なら <br> を挿入
  options.textBeforeControls 文字列が入る
  createControl('ok'); 'ok'ボタンやリンクが入る
  options.textBetweenControls 文字列が入る
  createControl('cancel'); 'cancel'リンクやボタンが入る
  options.textAfterControls 文字列が入る
</form>

0583: destroy: function() {
0584:   if (this._oldInnerHTML)
0585:   this.element.innerHTML = this._oldInnerHTML;
0586:   this.leaveEditMode();
0587:   this.unregisterListeners();
0588: },