1 (function ($, rf) { 2 3 rf.ui = rf.ui || {}; 4 5 rf.ui.InplaceBase = function(id, options) { 6 $super.constructor.call(this, id); 7 var mergedOptions = $.extend({}, defaultOptions, options); 8 this.editEvent = mergedOptions.editEvent; 9 this.noneCss = mergedOptions.noneCss; 10 this.changedCss = mergedOptions.changedCss; 11 this.editCss = mergedOptions.editCss; 12 this.defaultLabel = mergedOptions.defaultLabel; 13 this.state = mergedOptions.state; 14 15 this.options = mergedOptions; 16 17 this.element = $(document.getElementById(id)); 18 this.editContainer = $(document.getElementById(id + "Edit")); 19 this.element.bind(this.editEvent, $.proxy(this.__editHandler, this)); 20 this.isSaved = false; 21 this.useDefaultLabel = false; 22 this.editState = false; 23 }; 24 25 rf.ui.InputBase.extend(rf.ui.InplaceBase); 26 var $super = rf.ui.InplaceBase.$super; 27 28 var defaultOptions = { 29 editEvent: "click", 30 state: "ready" 31 }; 32 33 $.extend(rf.ui.InplaceBase.prototype, ( function () { 34 35 var STATE = { 36 READY : 'ready', 37 CHANGED: 'changed', 38 DISABLE: 'disable', 39 EDIT: 'edit' 40 }; 41 42 return { 43 44 getLabel: function() { 45 }, 46 47 setLabel: function(value) { 48 }, 49 50 onshow: function() { 51 }, 52 53 onhide: function() { 54 }, 55 56 onsave: function() { 57 }, 58 59 oncancel: function() { 60 }, 61 62 save: function() { 63 var value = this.__getValue() 64 if (value.length > 0) { 65 this.setLabel(value); 66 this.useDefaultLabel = false; 67 } else { 68 this.setLabel(this.defaultLabel); 69 this.useDefaultLabel = true; 70 } 71 72 this.isSaved = true; 73 74 this.__applyChangedStyles(); 75 this.onsave(); 76 }, 77 78 cancel: function() { 79 var text = ""; 80 if (!this.useDefaultLabel) { 81 text = this.getLabel(); 82 } 83 this.__setValue(text); 84 this.isSaved = true; 85 this.oncancel(); 86 }, 87 88 isValueSaved: function() { 89 return this.isSaved; 90 }, 91 92 isEditState: function() { 93 return this.editState; 94 }, 95 96 __applyChangedStyles: function() { 97 if (this.isValueChanged()) { 98 this.element.addClass(this.changedCss); 99 } else { 100 this.element.removeClass(this.changedCss); 101 } 102 }, 103 104 __show: function() { 105 this.scrollElements = rf.Event.bindScrollEventHandlers(this.id, this.__scrollHandler, this); 106 this.editState = true; 107 this.onshow(); 108 }, 109 110 __hide: function() { 111 if (this.scrollElements) { 112 rf.Event.unbindScrollEventHandlers(this.scrollElements, this); 113 this.scrollElements = null; 114 } 115 this.editState = false; 116 this.editContainer.addClass(this.noneCss); 117 this.element.removeClass(this.editCss); 118 this.onhide(); 119 }, 120 121 __editHandler: function(e) { 122 this.isSaved = false; 123 this.element.addClass(this.editCss); 124 this.editContainer.removeClass(this.noneCss); 125 this.__show(); 126 }, 127 __scrollHandler: function(e) { 128 this.cancel(); 129 }, 130 131 destroy: function () { 132 $super.destroy.call(this); 133 } 134 } 135 136 })()); 137 138 })(RichFaces.jQuery, window.RichFaces); 139