      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