romo 0.16.2 → 0.17.0

checksums.yaml

@@ -1,7 +1,7 @@
 --- 
 SHA1: 
-  metadata.gz: a9a6e3ce2613489f0aa2630a85e7846cf427c8a6
-  data.tar.gz: d2f6680786dea0ab3f5fbe8c595951d43a35fb22
+  metadata.gz: 1fe66b6570bc33ace62de2e8fd9c4346714ea4a4
+  data.tar.gz: 9cc7f175aa978376a86f4a85d005fdab750a817f
 SHA512: 
-  metadata.gz: 19f2c44434b4f3a64334447a98a6bf9821ea7976bdcbd2d74a478d16d7d00ccdc1bedfed8f241a0a27caeba5e8008c4698029f6b535778ee07f521073bcaea75
-  data.tar.gz: eb02c4703da3032e95b8f3e2ba8d5c36cd1c04b4b4f3eaa73f6859611591bc21861d211083b080d6c77bffc5597a75b5ca5c0ca122bb8e7910d40fc4f89e7f52
+  metadata.gz: 29b9803211c7b536f484844996ade3def60287dbdd6a6d06b4af646f899c35f88d9dbef95fdcc036707d6a706569fc21e74fec50c7ed09028d4ef0b9ea9ad9e6
+  data.tar.gz: e9cbde2242c2fcc0b332f6ed53081388bb750a2d9d05e919d1c1144cd53e7599371093768025d020e0c82bd1ef0e6170e1d18d4b946336034a17ff185dfa8f0e

data/assets/css/romo/indicator_text_input.scss

@@ -0,0 +1,18 @@
+@import 'css/romo/vars';
+@import 'css/romo/mixins';
+
+.romo-indicator-text-input-wrapper {
+  position: relative;
+}
+
+.romo-indicator-text-input-indicator {
+  display: inline-block;
+  position: absolute;
+  right: 6px;
+  vertical-align: middle;
+  cursor: pointer;
+}
+.romo-indicator-text-input-indicator.disabled {
+  cursor: $notAllowedCursor;
+  color: $disabledColor;
+}

data/assets/js/romo/base.js

@@ -148,6 +148,10 @@
 
   // style handling
 
+  Romo.prototype.getComputedStyle = function(node, styleName) {
+    return window.getComputedStyle(node, null).getPropertyValue(styleName);
+  }
+
   Romo.prototype.parseZIndex = function(elem) {
     // for the case where z-index is set directly on the elem
     var val = this.parseElemZIndex(elem);
@@ -156,9 +160,7 @@
     }
 
     // for the case where z-index is inherited from a parent elem
-    var parentIndexes = $.map(elem.parents(), function(item) {
-      return item; // converts the collection to an array
-    }).reduce($.proxy(function(prev, curr) {
+    var parentIndexes = this.toArray(elem.parents()).reduce($.proxy(function(prev, curr) {
       var pval = this.parseElemZIndex($(curr));
       if (pval !== 0) {
         prev.push(pval);
@@ -170,13 +172,20 @@
   }
 
   Romo.prototype.parseElemZIndex = function(elem) {
-    var val = parseInt(document.defaultView.getComputedStyle(elem[0], null).getPropertyValue("z-index"));
+    var val = parseInt(this.getComputedStyle(elem[0], "z-index"));
     if (!isNaN(val)) {
       return val;
     }
     return 0;
   }
 
+  // elem handling
+
+  Romo.prototype.toArray = function(elems) {
+    // converts a collection of elements (`$()`) to an array of nodes
+    return $.map(elems, function(node){ return node; })
+  }
+
   // private
 
   Romo.prototype._addEventCallback = function(name, callback) {

data/assets/js/romo/datepicker.js

@@ -49,7 +49,7 @@ RomoDatepicker.prototype.doBindElem = function() {
   // parent-child elems so it will be removed when the elem (input) is removed.
   // delay adding it b/c the `append` statement above is not a "move", it is
   // a "remove" and "add" so if added immediately the "remove" part will
-  // incorrectly remove the wrapper.  Any value will do - I chose 100 arbitrarily.
+  // incorrectly remove the wrapper.  Any value will do - I chose 1 arbitrarily.
   setTimeout($.proxy(function() {
     Romo.parentChildElems.add(this.elem, [elemWrapper]);
   }, this), 1);

data/assets/js/romo/form.js

@@ -66,11 +66,13 @@ RomoForm.prototype.doBindForm = function() {
 
 RomoForm.prototype.onFormKeyPress = function(e) {
   if (this.elem.data('romo-form-disable-keypress') !== true) {
-    var target = $(e.target);
-
-    if (target.is(':not(TEXTAREA)') && e.keyCode === 13 /* Enter */) {
+    var targetElem = $(e.target);
+    if (targetElem.is(':not(TEXTAREA)') && e.keyCode === 13 /* Enter */) {
       e.preventDefault();
-      this.onSubmitClick();
+      if (this.elem.data('romo-form-disable-enter-submit') !== true &&
+          targetElem.data('romo-form-disable-enter-submit') !== true) {
+        this.onSubmitClick();
+      }
     }
   }
 }
@@ -209,9 +211,7 @@ RomoForm.prototype._getSerializeObj = function() {
 }
 
 RomoForm.prototype._getListValueInputNamesDelims = function() {
-  return $.map(this.elem.find('[data-romo-form-list-values="true"]'), function(item){
-    return item; // converts the collection to an array
-  }).reduce($.proxy(function(prev, curr) {
+  return Romo.toArray(this.elem.find('[data-romo-form-list-values="true"]')).reduce($.proxy(function(prev, curr) {
     prev[$(curr).attr('name')] = $(curr).data('romo-form-list-values-delim') || this.defaultListValuesDelim;
     return prev;
   }, this), {});

data/assets/js/romo/indicator_text_input.js

@@ -0,0 +1,123 @@
+$.fn.romoIndicatorTextInput = function() {
+  return $.map(this, function(element) {
+    return new RomoIndicatorTextInput(element);
+  });
+}
+
+var RomoIndicatorTextInput = function(element) {
+  this.elem = $(element);
+  this.defaultIndicatorClass   = undefined;
+  this.defaultIndicatorWidthPx = 0;
+
+  this.doInit();
+  this.doBindElem();
+
+  this.elem.trigger('indicatorTextInput:ready', [this]);
+}
+
+RomoIndicatorTextInput.prototype.doInit = function() {
+  // override as needed
+}
+
+RomoIndicatorTextInput.prototype.doBindElem = function() {
+  var elemWrapper = $('<div class="romo-indicator-text-input-wrapper"></div>');
+  elemWrapper.css({'display': (this.elem.data('romo-indicator-text-input-elem-display') || 'inline-block')});
+  if (this.elem.data('romo-indicator-text-input-btn-group') === true) {
+    elemWrapper.addClass('romo-btn-group');
+  }
+
+  this.elem.before(elemWrapper);
+  elemWrapper.append(this.elem);
+
+  // the elem wrapper should be treated like a child elem.  add it to Romo's
+  // parent-child elems so it will be removed when the elem (input) is removed.
+  // delay adding it b/c the `append` statement above is not a "move", it is
+  // a "remove" and "add" so if added immediately the "remove" part will
+  // incorrectly remove the wrapper.  Any value will do - I chose 1 arbitrarily.
+  setTimeout($.proxy(function() {
+    Romo.parentChildElems.add(this.elem, [elemWrapper]);
+  }, this), 1);
+
+  this.elem.attr('autocomplete', 'off');
+
+  this.indicatorElem = $();
+  var indicatorClass = this.elem.data('romo-indicator-text-input-indicator') || this.defaultIndicatorClass;
+  if (indicatorClass !== undefined && indicatorClass !== 'none') {
+    this.indicatorElem = $('<i class="romo-indicator-text-input-indicator '+indicatorClass+'"></i>');
+    this.indicatorElem.css({'line-height': this.elem.css('height')});
+    if (this.elem.prop('disabled') === true) {
+      this.indicatorElem.addClass('disabled');
+    }
+    if (this.elem.css('display') === 'none') {
+      this._hide(this.indicatorElem);
+    }
+    this.indicatorElem.on('click', $.proxy(this.onIndicatorClick, this));
+
+    var indicatorWidthPx = this.elem.data('romo-indicator-text-input-indicator-width-px') || this.defaultIndicatorWidthPx;
+    // left-side spacing
+    // + indicator width
+    // + right-side spacing
+    var indicatorPaddingPx = 4 + indicatorWidthPx + 4;
+    this.elem.css({'padding-right': indicatorPaddingPx + 'px'});
+    this.elem.after(this.indicatorElem);
+  }
+
+  this.elem.on('indicatorTextInput:triggerEnable', $.proxy(function(e) {
+    this.doEnable();
+  }, this));
+  this.elem.on('indicatorTextInput:triggerDisable', $.proxy(function(e) {
+    this.doDisable();
+  }, this));
+  this.elem.on('indicatorTextInput:triggerShow', $.proxy(function(e) {
+    this.doShow();
+  }, this));
+  this.elem.on('indicatorTextInput:triggerHide', $.proxy(function(e) {
+    this.doHide();
+  }, this));
+}
+
+RomoIndicatorTextInput.prototype.doEnable = function() {
+  this.elem.prop('disabled', false);
+  this.elem.removeClass('disabled');
+  this.indicatorElem.removeClass('disabled');
+}
+
+RomoIndicatorTextInput.prototype.doDisable = function() {
+  this.elem.prop('disabled', true);
+  this.elem.addClass('disabled');
+  this.indicatorElem.addClass('disabled');
+}
+
+RomoIndicatorTextInput.prototype.doShow = function() {
+  this._show(this.elem);
+  this._show(this.indicatorElem);
+}
+
+RomoIndicatorTextInput.prototype.doHide = function() {
+  this._hide(this.elem);
+  this._hide(this.indicatorElem);
+}
+
+RomoIndicatorTextInput.prototype.onIndicatorClick = function(e) {
+  if (e !== undefined) {
+    e.preventDefault();
+    e.stopPropagation();
+  }
+  if (this.elem.prop('disabled') === false) {
+    this.elem.focus();
+  }
+}
+
+// private
+
+RomoIndicatorTextInput.prototype._show = function(elem) {
+  elem.css('display', '');
+}
+
+RomoIndicatorTextInput.prototype._hide = function(elem) {
+  elem.css('display', 'none');
+}
+
+Romo.onInitUI(function(e) {
+  Romo.initUIElems(e, '[data-romo-indicator-text-input-auto="true"]').romoIndicatorTextInput();
+});

data/assets/js/romo/word_boundary_filter.js

@@ -0,0 +1,44 @@
+var RomoWordBoundaryFilter = function(filterString, setElems, getElemTextContentCallback) {
+  this.boundaryCharsRegex = /[\s-_]+/;
+  this.matchingNodes      = [];
+  this.notMatchingNodes   = [];
+  this.filters            = filterString
+                              .trim()
+                              .toLowerCase()
+                              .split(this.boundaryCharsRegex);
+
+  Romo.toArray(setElems).forEach($.proxy(function(node) {
+    var contentStack = getElemTextContentCallback($(node))
+                         .trim()
+                         .toLowerCase()
+                         .split(this.boundaryCharsRegex).reverse();
+
+    var match = this.filters.reduce($.proxy(function(filterMatch, filter) {
+      if (filterMatch === false) {
+        // short-circuit the reduce
+        return false;
+      } else {
+        var contentMatch = false;
+        do {
+          var content = contentStack.pop();
+          if (content !== undefined && content.indexOf(filter) === 0) {
+            contentMatch = true;
+            // we found a match for this filter so we need to
+            // break out of this do...while and go to next filter
+            content = undefined;
+          }
+        } while(content !== undefined);
+        return contentMatch;
+      }
+    }, this), true);
+
+    if (match === true) {
+      this.matchingNodes.push(node);
+    } else {
+      this.notMatchingNodes.push(node);
+    }
+  }, this));
+
+  this.matchingElems    = $(this.matchingNodes);
+  this.notMatchingElems = $(this.notMatchingNodes);
+}

data/lib/romo/dassets.rb

@@ -34,6 +34,7 @@ module Romo::Dassets
         'css/romo/grid_table.css',
         'css/romo/dropdown.css',
         'css/romo/modal.css',
+        'css/romo/indicator_text_input.css',
         'css/romo/select.css',
         'css/romo/datepicker.css',
         'css/romo/tooltip.css',
@@ -42,11 +43,13 @@ module Romo::Dassets
       ]
       c.combination "js/romo.js", [
         'js/romo/base.js',
+        'js/romo/word_boundary_filter.js',
         'js/romo/invoke.js',
         'js/romo/onkey.js',
         'js/romo/form.js',
         'js/romo/dropdown.js',
         'js/romo/dropdown_form.js',
+        'js/romo/indicator_text_input.js',
         'js/romo/select_dropdown.js',
         'js/romo/select.js',
         'js/romo/datepicker.js',

data/lib/romo/version.rb

@@ -1,3 +1,3 @@
 module Romo
-  VERSION = "0.16.2"
+  VERSION = "0.17.0"
 end

data/test/unit/dassets_tests.rb

@@ -34,6 +34,7 @@ module Romo::Dassets
         'css/romo/grid_table.css',
         'css/romo/dropdown.css',
         'css/romo/modal.css',
+        'css/romo/indicator_text_input.css',
         'css/romo/select.css',
         'css/romo/datepicker.css',
         'css/romo/tooltip.css',
@@ -44,11 +45,13 @@ module Romo::Dassets
 
       exp_js_sources = [
         'js/romo/base.js',
+        'js/romo/word_boundary_filter.js',
         'js/romo/invoke.js',
         'js/romo/onkey.js',
         'js/romo/form.js',
         'js/romo/dropdown.js',
         'js/romo/dropdown_form.js',
+        'js/romo/indicator_text_input.js',
         'js/romo/select_dropdown.js',
         'js/romo/select.js',
         'js/romo/datepicker.js',

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification 
 name: romo
 version: !ruby/object:Gem::Version 
-  version: 0.16.2
+  version: 0.17.0
 platform: ruby
 authors: 
 - Kelly Redding
@@ -10,7 +10,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2016-10-26 00:00:00 Z
+date: 2016-11-01 00:00:00 Z
 dependencies: 
 - !ruby/object:Gem::Dependency 
   name: assert
@@ -66,6 +66,7 @@ files:
 - assets/css/romo/forms.scss
 - assets/css/romo/grid.scss
 - assets/css/romo/grid_table.scss
+- assets/css/romo/indicator_text_input.scss
 - assets/css/romo/labels.scss
 - assets/css/romo/lists.scss
 - assets/css/romo/modal.scss
@@ -82,6 +83,7 @@ files:
 - assets/js/romo/dropdown_form.js
 - assets/js/romo/form.js
 - assets/js/romo/indicator.js
+- assets/js/romo/indicator_text_input.js
 - assets/js/romo/inline.js
 - assets/js/romo/inline_form.js
 - assets/js/romo/invoke.js
@@ -92,6 +94,7 @@ files:
 - assets/js/romo/select_dropdown.js
 - assets/js/romo/sortable.js
 - assets/js/romo/tooltip.js
+- assets/js/romo/word_boundary_filter.js
 - lib/romo.rb
 - lib/romo/dassets.rb
 - lib/romo/version.rb