1 (function ($, rf) {
  2 
  3     rf.ui = rf.ui || {};
  4 
  5     rf.ui.InplaceInput = function(id, options) {
  6         var mergedOptions = $.extend({}, defaultOptions, options);
  7         $super.constructor.call(this, id, mergedOptions);
  8         this.label = $(document.getElementById(id + "Label"));
  9         var labelText = this.label.text();
 10         var inputLabel = this.__getValue();
 11         this.initialLabel = (labelText == inputLabel) ? labelText : "";
 12         this.useDefaultLabel = labelText != inputLabel
 13         this.saveOnBlur = mergedOptions.saveOnBlur;
 14         this.showControls = mergedOptions.showControls;
 15         this.getInput().bind("focus", $.proxy(this.__editHandler, this));
 16         if (this.showControls) {
 17             var btnContainer = document.getElementById(id + "Btn");
 18             if (btnContainer) {
 19                 btnContainer.tabIndex = -1;
 20             }
 21             this.okbtn = $(document.getElementById(id + "Okbtn"));
 22             this.cancelbtn = $(document.getElementById(id + "Cancelbtn"));
 23             this.okbtn.bind("mousedown", $.proxy(this.__saveBtnHandler, this));
 24             this.cancelbtn.bind("mousedown", $.proxy(this.__cancelBtnHandler, this));
 25         }
 26     };
 27 
 28     rf.ui.InplaceBase.extend(rf.ui.InplaceInput);
 29     var $super = rf.ui.InplaceInput.$super;
 30 
 31     var defaultOptions = {
 32         defaultLabel: "",
 33         saveOnBlur: true,
 34         showControl: true,
 35         noneCss: "rf-ii-none",
 36         readyCss: "rf-ii",
 37         editCss: "rf-ii-act",
 38         changedCss: "rf-ii-chng"
 39     };
 40 
 41     $.extend(rf.ui.InplaceInput.prototype, ( function () {
 42 
 43         return {
 44 
 45             name : "inplaceInput",
 46             defaultLabelClass : "rf-ii-dflt-lbl",
 47 
 48             getName: function() {
 49                 return this.name;
 50             },
 51 
 52             getNamespace: function() {
 53                 return this.namespace;
 54             },
 55 
 56             __keydownHandler: function(e) {
 57                 this.tabBlur = false;
 58                 switch (e.keyCode || e.which) {
 59                     case rf.KEYS.ESC:
 60                         e.preventDefault();
 61                         this.cancel();
 62                         this.onblur(e);
 63                         break;
 64                     case rf.KEYS.RETURN:
 65                         e.preventDefault();
 66                         this.save();
 67                         this.onblur(e);
 68                         break;
 69                     case rf.KEYS.TAB:
 70                         this.tabBlur = true;
 71                         break;
 72                 }
 73             },
 74 
 75             __blurHandler: function(e) {
 76                 this.onblur(e);
 77             },
 78 
 79             __isSaveOnBlur: function() {
 80                 return this.saveOnBlur;
 81             },
 82 
 83             __setInputFocus: function() {
 84                 this.getInput().unbind("focus", this.__editHandler);
 85                 this.getInput().focus();
 86             },
 87 
 88             __saveBtnHandler: function(e) {
 89                 this.cancelButton = false;
 90                 this.save();
 91                 this.onblur(e);
 92             },
 93 
 94             __cancelBtnHandler: function(e) {
 95                 this.cancelButton = true;
 96                 this.cancel();
 97                 this.onblur(e);
 98             },
 99 
100             __editHandler: function(e) {
101                 $super.__editHandler.call(this, e);
102                 this.onfocus(e);
103             },
104 
105             getLabel: function() {
106                 return this.label.text();
107             },
108 
109             setLabel: function(value) {
110                 this.label.text(value);
111                 if (value == this.defaultLabel) {
112                     this.label.addClass(this.defaultLabelClass);
113                 } else {
114                     this.label.removeClass(this.defaultLabelClass);
115                 }
116             },
117 
118             isValueChanged: function () {
119                 return (this.__getValue() != this.initialLabel);
120             },
121 
122             onshow: function() {
123                 this.__setInputFocus();
124             },
125 
126             onhide: function() {
127                 if (this.tabBlur) {
128                     this.tabBlur = false;
129                 } else {
130                     this.getInput().focus();
131                 }
132             },
133 
134             onfocus: function(e) {
135                 if (!this.__isFocused()) {
136                     this.__setFocused(true);
137                     this.focusValue = this.__getValue();
138                     this.invokeEvent.call(this, "focus", document.getElementById(this.id), e);
139                 }
140             },
141 
142             onblur: function(e) {
143                 if (this.__isFocused()) {
144                     this.__setFocused(false);
145                     this.invokeEvent.call(this, "blur", document.getElementById(this.id), e);
146 
147                     if (this.isValueSaved() || this.__isSaveOnBlur()) {
148                         this.save();
149                     } else {
150                         this.cancel();
151                     }
152 
153                     this.__hide();
154 
155                     if (!this.cancelButton) {
156                         if (this.__isValueChanged()) {
157                             this.invokeEvent.call(this, "change", document.getElementById(this.id), e);
158                         }
159                     }
160                     var _this = this;
161                     window.setTimeout(function() {
162                         _this.getInput().bind("focus", $.proxy(_this.__editHandler, _this));
163                     }, 1);
164                 }
165             },
166 
167             __isValueChanged: function() {
168                 return (this.focusValue != this.__getValue());
169             },
170 
171             __setFocused: function(focused) {
172                 this.focused = focused;
173             },
174 
175             __isFocused: function() {
176                 return this.focused;
177             },
178             setValue: function(value) {
179                 this.__setValue(value);
180                 this.save();
181             }
182         }
183     })());
184 
185 })(RichFaces.jQuery, window.RichFaces);
186