git.sur5r.net Git - bacula/bacula/blob - gui/baculum/debian/missing-sources/framework/Web/Javascripts/source/tinymce-405/classes/ui/ComboBox.js

   1 /**
   2  * ComboBox.js
   3  *
   4  * Copyright, Moxiecode Systems AB
   5  * Released under LGPL License.
   6  *
   7  * License: http://www.tinymce.com/license
   8  * Contributing: http://www.tinymce.com/contributing
   9  */
  10
  11 /**
  12  * This class creates a combobox control. Select box that you select a value from or
  13  * type a value into.
  14  *
  15  * @-x-less ComboBox.less
  16  * @class tinymce.ui.ComboBox
  17  * @extends tinymce.ui.Widget
  18  */
  19 define("tinymce/ui/ComboBox", [
  20         "tinymce/ui/Widget",
  21         "tinymce/ui/DomUtils"
  22 ], function(Widget, DomUtils) {
  23         "use strict";
  24
  25         return Widget.extend({
  26                 /**
  27                  * Constructs a new control instance with the specified settings.
  28                  *
  29                  * @constructor
  30                  * @param {Object} settings Name/value object with settings.
  31                  * @setting {String} placeholder Placeholder text to display.
  32                  */
  33                 init: function(settings) {
  34                         var self = this;
  35
  36                         self._super(settings);
  37                         self.addClass('combobox');
  38
  39                         self.on('click', function(e) {
  40                                 var elm = e.target;
  41
  42                                 while (elm) {
  43                                         if (elm.id && elm.id.indexOf('-open') != -1) {
  44                                                 self.fire('action');
  45                                         }
  46
  47                                         elm = elm.parentNode;
  48                                 }
  49                         });
  50
  51                         // TODO: Rework this
  52                         self.on('keydown', function(e) {
  53                                 if (e.target.nodeName == "INPUT" && e.keyCode == 13) {
  54                                         self.parents().reverse().each(function(ctrl) {
  55                                                 e.preventDefault();
  56                                                 self.fire('change');
  57
  58                                                 if (ctrl.submit) {
  59                                                         ctrl.submit();
  60                                                         return false;
  61                                                 }
  62                                         });
  63                                 }
  64                         });
  65
  66                         if (settings.placeholder) {
  67                                 self.addClass('placeholder');
  68
  69                                 self.on('focusin', function() {
  70                                         if (!self._hasOnChange) {
  71                                                 DomUtils.on(self.getEl('inp'), 'change', function() {
  72                                                         self.fire('change');
  73                                                 });
  74
  75                                                 self._hasOnChange = true;
  76                                         }
  77
  78                                         if (self.hasClass('placeholder')) {
  79                                                 self.getEl('inp').value = '';
  80                                                 self.removeClass('placeholder');
  81                                         }
  82                                 });
  83
  84                                 self.on('focusout', function() {
  85                                         if (self.value().length === 0) {
  86                                                 self.getEl('inp').value = settings.placeholder;
  87                                                 self.addClass('placeholder');
  88                                         }
  89                                 });
  90                         }
  91                 },
  92
  93                 /**
  94                  * Getter/setter function for the control value.
  95                  *
  96                  * @method value
  97                  * @param {String} [value] Value to be set.
  98                  * @return {String|tinymce.ui.ComboBox} Value or self if it's a set operation.
  99                  */
 100                 value: function(value) {
 101                         var self = this;
 102
 103                         if (typeof(value) != "undefined") {
 104                                 self._value = value;
 105                                 self.removeClass('placeholder');
 106
 107                                 if (self._rendered) {
 108                                         self.getEl('inp').value = value;
 109                                 }
 110
 111                                 return self;
 112                         }
 113
 114                         if (self._rendered) {
 115                                 value = self.getEl('inp').value;
 116
 117                                 if (value != self.settings.placeholder) {
 118                                         return value;
 119                                 }
 120
 121                                 return '';
 122                         }
 123
 124                         return self._value;
 125                 },
 126
 127                 /**
 128                  * Getter/setter function for the disabled state.
 129                  *
 130                  * @method value
 131                  * @param {Boolean} [state] State to be set.
 132                  * @return {Boolean|tinymce.ui.ComboBox} True/false or self if it's a set operation.
 133                  */
 134                 disabled: function(state) {
 135                         var self = this;
 136
 137                         self._super(state);
 138
 139                         if (self._rendered) {
 140                                 self.getEl('inp').disabled = state;
 141                         }
 142                 },
 143
 144                 /**
 145                  * Focuses the input area of the control.
 146                  *
 147                  * @method focus
 148                  */
 149                 focus: function() {
 150                         this.getEl('inp').focus();
 151                 },
 152
 153                 /**
 154                  * Repaints the control after a layout operation.
 155                  *
 156                  * @method repaint
 157                  */
 158                 repaint: function() {
 159                         var self = this, elm = self.getEl(), openElm = self.getEl('open'), rect = self.layoutRect();
 160                         var width, lineHeight;
 161
 162                         if (openElm) {
 163                                 width = rect.w - openElm.offsetWidth - 10;
 164                         } else {
 165                                 width = rect.w - 10;
 166                         }
 167
 168                         // Detect old IE 7+8 add lineHeight to align caret vertically in the middle
 169                         var doc = document;
 170                         if (doc.all && (!doc.documentMode || doc.documentMode <= 8)) {
 171                                 lineHeight = (self.layoutRect().h - 2) + 'px';
 172                         }
 173
 174                         DomUtils.css(elm.firstChild, {
 175                                 width: width,
 176                                 lineHeight: lineHeight
 177                         });
 178
 179                         self._super();
 180
 181                         return self;
 182                 },
 183
 184                 /**
 185                  * Post render method. Called after the control has been rendered to the target.
 186                  *
 187                  * @method postRender
 188                  * @return {tinymce.ui.ComboBox} Current combobox instance.
 189                  */
 190                 postRender: function() {
 191                         var self = this;
 192
 193                         DomUtils.on(this.getEl('inp'), 'change', function() {
 194                                 self.fire('change');
 195                         });
 196
 197                         return self._super();
 198                 },
 199
 200                 /**
 201                  * Renders the control as a HTML string.
 202                  *
 203                  * @method renderHtml
 204                  * @return {String} HTML representing the control.
 205                  */
 206                 renderHtml: function() {
 207                         var self = this, id = self._id, settings = self.settings, prefix = self.classPrefix;
 208                         var value = settings.value || settings.placeholder || '';
 209                         var icon, text, openBtnHtml = '';
 210
 211                         icon = settings.icon ? prefix + 'ico ' + prefix + 'i-' + settings.icon : '';
 212                         text = self._text;
 213
 214                         if (icon || text) {
 215                                 openBtnHtml = (
 216                                         '<div id="' + id + '-open" class="' + prefix + 'btn ' + prefix + 'open" tabIndex="-1">' +
 217                                                 '<button id="' + id + '-action" type="button" hidefocus tabindex="-1">' +
 218                                                         (icon ? '<i class="' + icon + '"></i>' : '<i class="' + prefix + 'caret"></i>') +
 219                                                         (text ? (icon ? ' ' : '') + text : '') +
 220                                                 '</button>' +
 221                                         '</div>'
 222                                 );
 223
 224                                 self.addClass('has-open');
 225                         }
 226
 227                         return (
 228                                 '<div id="' + id + '" class="' + self.classes() + '">' +
 229                                         '<input id="' + id + '-inp" class="' + prefix + 'textbox ' + prefix + 'placeholder" value="' +
 230                                         value + '" hidefocus="true">' +
 231                                         openBtnHtml +
 232                                 '</div>'
 233                         );
 234                 }
 235         });
 236 });