1 (function ($, rf) {
  2 
  3     rf.ui = rf.ui || {};
  4 
  5     rf.ui.InplaceSelect = function(id, options) {
  6         var mergedOptions = $.extend({}, defaultOptions, options);
  7         $super.constructor.call(this, id, mergedOptions);
  8         this.getInput().bind("click", $.proxy(this.__clickHandler, this));
  9         mergedOptions['attachTo'] = id;
 10         mergedOptions['scrollContainer'] = $(document.getElementById(id + "Items")).parent()[0];
 11         mergedOptions['focusKeeperEnabled'] = false;
 12         this.popupList = new rf.ui.PopupList(id + "List", this, mergedOptions);
 13         this.list = this.popupList.__getList();
 14         this.clientSelectItems = mergedOptions.clientSelectItems;
 15         this.selValueInput = $(document.getElementById(id + "selValue"));
 16         this.initialValue = this.selValueInput.val();
 17         this.listHandler = $(document.getElementById(id + "List"));
 18         this.listHandler.bind("mousedown", $.proxy(this.__onListMouseDown, this));
 19         this.listHandler.bind("mouseup", $.proxy(this.__onListMouseUp, this));
 20         this.openOnEdit = mergedOptions.openOnEdit;
 21         this.saveOnSelect = mergedOptions.saveOnSelect;
 22         this.savedIndex = -1;
 23 
 24         this.inputItem = $(document.getElementById(id + "Input"));
 25         this.inputItemWidth = this.inputItem.width();
 26         this.inputWidthDefined = options.inputWidth !== undefined;
 27     };
 28     rf.ui.InplaceInput.extend(rf.ui.InplaceSelect);
 29     var $super = rf.ui.InplaceSelect.$super;
 30 
 31     var defaultOptions = {
 32         defaultLabel: "",
 33         saveOnSelect: true,
 34         openOnEdit: true,
 35         showControl: false,
 36         itemCss: "rf-is-opt",
 37         selectItemCss: "rf-is-sel",
 38         listCss: "rf-is-lst-cord",
 39         noneCss: "rf-is-none",
 40         editCss: "rf-is-fld-cntr",
 41         changedCss: "rf-is-chng"
 42     };
 43 
 44     $.extend(rf.ui.InplaceSelect.prototype, (function () {
 45 
 46         return{
 47             name : "inplaceSelect",
 48             defaultLabelClass : "rf-is-dflt-lbl",
 49 
 50             getName: function() {
 51                 return this.name;
 52             },
 53             getNamespace: function() {
 54                 return this.namespace;
 55             },
 56             onshow: function() {
 57                 $super.onshow.call(this);
 58                 if (this.openOnEdit) {
 59                     this.__showPopup();
 60                 }
 61             },
 62             onhide: function() {
 63                 this.__hidePopup();
 64             },
 65 
 66             showPopup: function() {
 67                 $super.__show.call(this);
 68 
 69             },
 70             __showPopup: function() {
 71                 this.popupList.show();
 72                 this.__hideLabel();
 73             },
 74             hidePopup: function() {
 75             	$super.__hide.call(this);
 76             },
 77             __hidePopup: function() {
 78                 this.popupList.hide();
 79                 this.__showLabel();
 80             },
 81 
 82             onsave: function() {
 83                 var item = this.list.currentSelectItem();
 84                 if (item) {
 85                     var index = this.list.getSelectedItemIndex();
 86                     var clientSelectItem = this.list.getClientSelectItemByIndex(index);
 87                     var label = clientSelectItem.label;
 88                     if (label == this.__getValue()) {
 89                         this.savedIndex = index;
 90                         this.saveItemValue(clientSelectItem.value);
 91                         this.list.__selectByIndex(this.savedIndex);
 92                     } else {
 93                         this.list.__selectItemByValue(this.getValue());
 94                     }
 95                 }
 96             },
 97             oncancel: function() {
 98                 var item = this.list.getClientSelectItemByIndex(this.savedIndex);
 99                 var value = item && item.value ? item.value : this.initialValue;
100                 this.saveItemValue(value);
101                 this.list.__selectItemByValue(value);
102             },
103             onblur: function(e) {
104                 this.__hidePopup();
105                 $super.onblur.call(this);
106             },
107             onfocus: function(e) {
108                 if (!this.__isFocused()) {
109                     this.__setFocused(true);
110                     this.focusValue = this.selValueInput.val();
111                     this.invokeEvent.call(this, "focus", document.getElementById(this.id), e);
112                 }
113             },
114             processItem: function(item) {
115                 var label = $(item).data('clientSelectItem').label;
116                 this.__setValue(label);
117 
118                 this.__setInputFocus();
119                 this.__hidePopup();
120 
121                 if (this.saveOnSelect) {
122                     this.save();
123                 }
124 
125                 this.invokeEvent.call(this, "selectitem", document.getElementById(this.id));
126             },
127             saveItemValue: function(value) {
128                 this.selValueInput.val(value);
129 
130             },
131             __isValueChanged: function() {
132                 return (this.focusValue != this.selValueInput.val());
133             },
134             __keydownHandler: function(e) {
135 
136                 var code;
137 
138                 if (e.keyCode) {
139                     code = e.keyCode;
140                 } else if (e.which) {
141                     code = e.which;
142                 }
143 
144                 if (this.popupList.isVisible()) {
145                     switch (code) {
146                         case rf.KEYS.DOWN:
147                             e.preventDefault();
148                             this.list.__selectNext();
149                             this.__setInputFocus();
150                             break;
151 
152                         case rf.KEYS.UP:
153                             e.preventDefault();
154                             this.list.__selectPrev();
155                             this.__setInputFocus();
156                             break;
157 
158                         case rf.KEYS.RETURN:
159                             e.preventDefault();
160                             this.list.__selectCurrent();
161                             this.__setInputFocus();
162                             return false;
163                             break;
164                     }
165                 }
166 
167                 $super.__keydownHandler.call(this, e);
168             },
169             __blurHandler: function(e) {
170                 if (this.saveOnSelect || !this.isMouseDown) {
171                     if (this.isEditState()) {
172                         this.timeoutId = window.setTimeout($.proxy(function() {
173                             this.onblur(e);
174                         }, this), 200);
175                     }
176                 } else {
177                     this.__setInputFocus();
178                     this.isMouseDown = false;
179                 }
180             },
181             __clickHandler: function(e) {
182                 this.__showPopup();
183             },
184             __onListMouseDown: function(e) {
185                 this.isMouseDown = true;
186             },
187             __onListMouseUp: function(e) {
188                 this.isMouseDown = false;
189                 this.__setInputFocus();
190             },
191             __showLabel: function(e) {
192                 this.label.show();
193                 this.editContainer.css("position", "absolute");
194                 this.inputItem.width(this.inputItemWidth);
195             },
196             __hideLabel: function(e) {
197                 this.label.hide();
198                 this.editContainer.css("position", "static");
199                 if (!this.inputWidthDefined) {
200                     this.inputItem.width(this.label.width());
201                 }
202             },
203             getValue: function() {
204                 return this.selValueInput.val();
205             },
206             setValue: function(value) {
207                 var item = this.list.__selectItemByValue(value);
208                 var clientSelectItem = item.data('clientSelectItem');
209                 this.__setValue(clientSelectItem.label);
210                 if (this.__isValueChanged()) {
211                     this.save();
212                     this.invokeEvent.call(this, "change", document.getElementById(this.id));
213                 }
214             },
215             destroy: function() {
216                 this.popupList.destroy();
217                 this.popupList = null;
218                 $super.destroy.call(this);
219             }
220         };
221 
222     })());
223 })(RichFaces.jQuery, window.RichFaces);
224