romo 0.16.2 → 0.17.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/assets/css/romo/indicator_text_input.scss +18 -0
- data/assets/js/romo/base.js +13 -4
- data/assets/js/romo/datepicker.js +1 -1
- data/assets/js/romo/form.js +7 -7
- data/assets/js/romo/indicator_text_input.js +123 -0
- data/assets/js/romo/word_boundary_filter.js +44 -0
- data/lib/romo/dassets.rb +3 -0
- data/lib/romo/version.rb +1 -1
- data/test/unit/dassets_tests.rb +3 -0
- metadata +5 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 1fe66b6570bc33ace62de2e8fd9c4346714ea4a4
|
4
|
+
data.tar.gz: 9cc7f175aa978376a86f4a85d005fdab750a817f
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 29b9803211c7b536f484844996ade3def60287dbdd6a6d06b4af646f899c35f88d9dbef95fdcc036707d6a706569fc21e74fec50c7ed09028d4ef0b9ea9ad9e6
|
7
|
+
data.tar.gz: e9cbde2242c2fcc0b332f6ed53081388bb750a2d9d05e919d1c1144cd53e7599371093768025d020e0c82bd1ef0e6170e1d18d4b946336034a17ff185dfa8f0e
|
@@ -0,0 +1,18 @@
|
|
1
|
+
@import 'css/romo/vars';
|
2
|
+
@import 'css/romo/mixins';
|
3
|
+
|
4
|
+
.romo-indicator-text-input-wrapper {
|
5
|
+
position: relative;
|
6
|
+
}
|
7
|
+
|
8
|
+
.romo-indicator-text-input-indicator {
|
9
|
+
display: inline-block;
|
10
|
+
position: absolute;
|
11
|
+
right: 6px;
|
12
|
+
vertical-align: middle;
|
13
|
+
cursor: pointer;
|
14
|
+
}
|
15
|
+
.romo-indicator-text-input-indicator.disabled {
|
16
|
+
cursor: $notAllowedCursor;
|
17
|
+
color: $disabledColor;
|
18
|
+
}
|
data/assets/js/romo/base.js
CHANGED
@@ -148,6 +148,10 @@
|
|
148
148
|
|
149
149
|
// style handling
|
150
150
|
|
151
|
+
Romo.prototype.getComputedStyle = function(node, styleName) {
|
152
|
+
return window.getComputedStyle(node, null).getPropertyValue(styleName);
|
153
|
+
}
|
154
|
+
|
151
155
|
Romo.prototype.parseZIndex = function(elem) {
|
152
156
|
// for the case where z-index is set directly on the elem
|
153
157
|
var val = this.parseElemZIndex(elem);
|
@@ -156,9 +160,7 @@
|
|
156
160
|
}
|
157
161
|
|
158
162
|
// for the case where z-index is inherited from a parent elem
|
159
|
-
var parentIndexes =
|
160
|
-
return item; // converts the collection to an array
|
161
|
-
}).reduce($.proxy(function(prev, curr) {
|
163
|
+
var parentIndexes = this.toArray(elem.parents()).reduce($.proxy(function(prev, curr) {
|
162
164
|
var pval = this.parseElemZIndex($(curr));
|
163
165
|
if (pval !== 0) {
|
164
166
|
prev.push(pval);
|
@@ -170,13 +172,20 @@
|
|
170
172
|
}
|
171
173
|
|
172
174
|
Romo.prototype.parseElemZIndex = function(elem) {
|
173
|
-
var val = parseInt(
|
175
|
+
var val = parseInt(this.getComputedStyle(elem[0], "z-index"));
|
174
176
|
if (!isNaN(val)) {
|
175
177
|
return val;
|
176
178
|
}
|
177
179
|
return 0;
|
178
180
|
}
|
179
181
|
|
182
|
+
// elem handling
|
183
|
+
|
184
|
+
Romo.prototype.toArray = function(elems) {
|
185
|
+
// converts a collection of elements (`$()`) to an array of nodes
|
186
|
+
return $.map(elems, function(node){ return node; })
|
187
|
+
}
|
188
|
+
|
180
189
|
// private
|
181
190
|
|
182
191
|
Romo.prototype._addEventCallback = function(name, callback) {
|
@@ -49,7 +49,7 @@ RomoDatepicker.prototype.doBindElem = function() {
|
|
49
49
|
// parent-child elems so it will be removed when the elem (input) is removed.
|
50
50
|
// delay adding it b/c the `append` statement above is not a "move", it is
|
51
51
|
// a "remove" and "add" so if added immediately the "remove" part will
|
52
|
-
// incorrectly remove the wrapper. Any value will do - I chose
|
52
|
+
// incorrectly remove the wrapper. Any value will do - I chose 1 arbitrarily.
|
53
53
|
setTimeout($.proxy(function() {
|
54
54
|
Romo.parentChildElems.add(this.elem, [elemWrapper]);
|
55
55
|
}, this), 1);
|
data/assets/js/romo/form.js
CHANGED
@@ -66,11 +66,13 @@ RomoForm.prototype.doBindForm = function() {
|
|
66
66
|
|
67
67
|
RomoForm.prototype.onFormKeyPress = function(e) {
|
68
68
|
if (this.elem.data('romo-form-disable-keypress') !== true) {
|
69
|
-
var
|
70
|
-
|
71
|
-
if (target.is(':not(TEXTAREA)') && e.keyCode === 13 /* Enter */) {
|
69
|
+
var targetElem = $(e.target);
|
70
|
+
if (targetElem.is(':not(TEXTAREA)') && e.keyCode === 13 /* Enter */) {
|
72
71
|
e.preventDefault();
|
73
|
-
this.
|
72
|
+
if (this.elem.data('romo-form-disable-enter-submit') !== true &&
|
73
|
+
targetElem.data('romo-form-disable-enter-submit') !== true) {
|
74
|
+
this.onSubmitClick();
|
75
|
+
}
|
74
76
|
}
|
75
77
|
}
|
76
78
|
}
|
@@ -209,9 +211,7 @@ RomoForm.prototype._getSerializeObj = function() {
|
|
209
211
|
}
|
210
212
|
|
211
213
|
RomoForm.prototype._getListValueInputNamesDelims = function() {
|
212
|
-
return
|
213
|
-
return item; // converts the collection to an array
|
214
|
-
}).reduce($.proxy(function(prev, curr) {
|
214
|
+
return Romo.toArray(this.elem.find('[data-romo-form-list-values="true"]')).reduce($.proxy(function(prev, curr) {
|
215
215
|
prev[$(curr).attr('name')] = $(curr).data('romo-form-list-values-delim') || this.defaultListValuesDelim;
|
216
216
|
return prev;
|
217
217
|
}, this), {});
|
@@ -0,0 +1,123 @@
|
|
1
|
+
$.fn.romoIndicatorTextInput = function() {
|
2
|
+
return $.map(this, function(element) {
|
3
|
+
return new RomoIndicatorTextInput(element);
|
4
|
+
});
|
5
|
+
}
|
6
|
+
|
7
|
+
var RomoIndicatorTextInput = function(element) {
|
8
|
+
this.elem = $(element);
|
9
|
+
this.defaultIndicatorClass = undefined;
|
10
|
+
this.defaultIndicatorWidthPx = 0;
|
11
|
+
|
12
|
+
this.doInit();
|
13
|
+
this.doBindElem();
|
14
|
+
|
15
|
+
this.elem.trigger('indicatorTextInput:ready', [this]);
|
16
|
+
}
|
17
|
+
|
18
|
+
RomoIndicatorTextInput.prototype.doInit = function() {
|
19
|
+
// override as needed
|
20
|
+
}
|
21
|
+
|
22
|
+
RomoIndicatorTextInput.prototype.doBindElem = function() {
|
23
|
+
var elemWrapper = $('<div class="romo-indicator-text-input-wrapper"></div>');
|
24
|
+
elemWrapper.css({'display': (this.elem.data('romo-indicator-text-input-elem-display') || 'inline-block')});
|
25
|
+
if (this.elem.data('romo-indicator-text-input-btn-group') === true) {
|
26
|
+
elemWrapper.addClass('romo-btn-group');
|
27
|
+
}
|
28
|
+
|
29
|
+
this.elem.before(elemWrapper);
|
30
|
+
elemWrapper.append(this.elem);
|
31
|
+
|
32
|
+
// the elem wrapper should be treated like a child elem. add it to Romo's
|
33
|
+
// parent-child elems so it will be removed when the elem (input) is removed.
|
34
|
+
// delay adding it b/c the `append` statement above is not a "move", it is
|
35
|
+
// a "remove" and "add" so if added immediately the "remove" part will
|
36
|
+
// incorrectly remove the wrapper. Any value will do - I chose 1 arbitrarily.
|
37
|
+
setTimeout($.proxy(function() {
|
38
|
+
Romo.parentChildElems.add(this.elem, [elemWrapper]);
|
39
|
+
}, this), 1);
|
40
|
+
|
41
|
+
this.elem.attr('autocomplete', 'off');
|
42
|
+
|
43
|
+
this.indicatorElem = $();
|
44
|
+
var indicatorClass = this.elem.data('romo-indicator-text-input-indicator') || this.defaultIndicatorClass;
|
45
|
+
if (indicatorClass !== undefined && indicatorClass !== 'none') {
|
46
|
+
this.indicatorElem = $('<i class="romo-indicator-text-input-indicator '+indicatorClass+'"></i>');
|
47
|
+
this.indicatorElem.css({'line-height': this.elem.css('height')});
|
48
|
+
if (this.elem.prop('disabled') === true) {
|
49
|
+
this.indicatorElem.addClass('disabled');
|
50
|
+
}
|
51
|
+
if (this.elem.css('display') === 'none') {
|
52
|
+
this._hide(this.indicatorElem);
|
53
|
+
}
|
54
|
+
this.indicatorElem.on('click', $.proxy(this.onIndicatorClick, this));
|
55
|
+
|
56
|
+
var indicatorWidthPx = this.elem.data('romo-indicator-text-input-indicator-width-px') || this.defaultIndicatorWidthPx;
|
57
|
+
// left-side spacing
|
58
|
+
// + indicator width
|
59
|
+
// + right-side spacing
|
60
|
+
var indicatorPaddingPx = 4 + indicatorWidthPx + 4;
|
61
|
+
this.elem.css({'padding-right': indicatorPaddingPx + 'px'});
|
62
|
+
this.elem.after(this.indicatorElem);
|
63
|
+
}
|
64
|
+
|
65
|
+
this.elem.on('indicatorTextInput:triggerEnable', $.proxy(function(e) {
|
66
|
+
this.doEnable();
|
67
|
+
}, this));
|
68
|
+
this.elem.on('indicatorTextInput:triggerDisable', $.proxy(function(e) {
|
69
|
+
this.doDisable();
|
70
|
+
}, this));
|
71
|
+
this.elem.on('indicatorTextInput:triggerShow', $.proxy(function(e) {
|
72
|
+
this.doShow();
|
73
|
+
}, this));
|
74
|
+
this.elem.on('indicatorTextInput:triggerHide', $.proxy(function(e) {
|
75
|
+
this.doHide();
|
76
|
+
}, this));
|
77
|
+
}
|
78
|
+
|
79
|
+
RomoIndicatorTextInput.prototype.doEnable = function() {
|
80
|
+
this.elem.prop('disabled', false);
|
81
|
+
this.elem.removeClass('disabled');
|
82
|
+
this.indicatorElem.removeClass('disabled');
|
83
|
+
}
|
84
|
+
|
85
|
+
RomoIndicatorTextInput.prototype.doDisable = function() {
|
86
|
+
this.elem.prop('disabled', true);
|
87
|
+
this.elem.addClass('disabled');
|
88
|
+
this.indicatorElem.addClass('disabled');
|
89
|
+
}
|
90
|
+
|
91
|
+
RomoIndicatorTextInput.prototype.doShow = function() {
|
92
|
+
this._show(this.elem);
|
93
|
+
this._show(this.indicatorElem);
|
94
|
+
}
|
95
|
+
|
96
|
+
RomoIndicatorTextInput.prototype.doHide = function() {
|
97
|
+
this._hide(this.elem);
|
98
|
+
this._hide(this.indicatorElem);
|
99
|
+
}
|
100
|
+
|
101
|
+
RomoIndicatorTextInput.prototype.onIndicatorClick = function(e) {
|
102
|
+
if (e !== undefined) {
|
103
|
+
e.preventDefault();
|
104
|
+
e.stopPropagation();
|
105
|
+
}
|
106
|
+
if (this.elem.prop('disabled') === false) {
|
107
|
+
this.elem.focus();
|
108
|
+
}
|
109
|
+
}
|
110
|
+
|
111
|
+
// private
|
112
|
+
|
113
|
+
RomoIndicatorTextInput.prototype._show = function(elem) {
|
114
|
+
elem.css('display', '');
|
115
|
+
}
|
116
|
+
|
117
|
+
RomoIndicatorTextInput.prototype._hide = function(elem) {
|
118
|
+
elem.css('display', 'none');
|
119
|
+
}
|
120
|
+
|
121
|
+
Romo.onInitUI(function(e) {
|
122
|
+
Romo.initUIElems(e, '[data-romo-indicator-text-input-auto="true"]').romoIndicatorTextInput();
|
123
|
+
});
|
@@ -0,0 +1,44 @@
|
|
1
|
+
var RomoWordBoundaryFilter = function(filterString, setElems, getElemTextContentCallback) {
|
2
|
+
this.boundaryCharsRegex = /[\s-_]+/;
|
3
|
+
this.matchingNodes = [];
|
4
|
+
this.notMatchingNodes = [];
|
5
|
+
this.filters = filterString
|
6
|
+
.trim()
|
7
|
+
.toLowerCase()
|
8
|
+
.split(this.boundaryCharsRegex);
|
9
|
+
|
10
|
+
Romo.toArray(setElems).forEach($.proxy(function(node) {
|
11
|
+
var contentStack = getElemTextContentCallback($(node))
|
12
|
+
.trim()
|
13
|
+
.toLowerCase()
|
14
|
+
.split(this.boundaryCharsRegex).reverse();
|
15
|
+
|
16
|
+
var match = this.filters.reduce($.proxy(function(filterMatch, filter) {
|
17
|
+
if (filterMatch === false) {
|
18
|
+
// short-circuit the reduce
|
19
|
+
return false;
|
20
|
+
} else {
|
21
|
+
var contentMatch = false;
|
22
|
+
do {
|
23
|
+
var content = contentStack.pop();
|
24
|
+
if (content !== undefined && content.indexOf(filter) === 0) {
|
25
|
+
contentMatch = true;
|
26
|
+
// we found a match for this filter so we need to
|
27
|
+
// break out of this do...while and go to next filter
|
28
|
+
content = undefined;
|
29
|
+
}
|
30
|
+
} while(content !== undefined);
|
31
|
+
return contentMatch;
|
32
|
+
}
|
33
|
+
}, this), true);
|
34
|
+
|
35
|
+
if (match === true) {
|
36
|
+
this.matchingNodes.push(node);
|
37
|
+
} else {
|
38
|
+
this.notMatchingNodes.push(node);
|
39
|
+
}
|
40
|
+
}, this));
|
41
|
+
|
42
|
+
this.matchingElems = $(this.matchingNodes);
|
43
|
+
this.notMatchingElems = $(this.notMatchingNodes);
|
44
|
+
}
|
data/lib/romo/dassets.rb
CHANGED
@@ -34,6 +34,7 @@ module Romo::Dassets
|
|
34
34
|
'css/romo/grid_table.css',
|
35
35
|
'css/romo/dropdown.css',
|
36
36
|
'css/romo/modal.css',
|
37
|
+
'css/romo/indicator_text_input.css',
|
37
38
|
'css/romo/select.css',
|
38
39
|
'css/romo/datepicker.css',
|
39
40
|
'css/romo/tooltip.css',
|
@@ -42,11 +43,13 @@ module Romo::Dassets
|
|
42
43
|
]
|
43
44
|
c.combination "js/romo.js", [
|
44
45
|
'js/romo/base.js',
|
46
|
+
'js/romo/word_boundary_filter.js',
|
45
47
|
'js/romo/invoke.js',
|
46
48
|
'js/romo/onkey.js',
|
47
49
|
'js/romo/form.js',
|
48
50
|
'js/romo/dropdown.js',
|
49
51
|
'js/romo/dropdown_form.js',
|
52
|
+
'js/romo/indicator_text_input.js',
|
50
53
|
'js/romo/select_dropdown.js',
|
51
54
|
'js/romo/select.js',
|
52
55
|
'js/romo/datepicker.js',
|
data/lib/romo/version.rb
CHANGED
data/test/unit/dassets_tests.rb
CHANGED
@@ -34,6 +34,7 @@ module Romo::Dassets
|
|
34
34
|
'css/romo/grid_table.css',
|
35
35
|
'css/romo/dropdown.css',
|
36
36
|
'css/romo/modal.css',
|
37
|
+
'css/romo/indicator_text_input.css',
|
37
38
|
'css/romo/select.css',
|
38
39
|
'css/romo/datepicker.css',
|
39
40
|
'css/romo/tooltip.css',
|
@@ -44,11 +45,13 @@ module Romo::Dassets
|
|
44
45
|
|
45
46
|
exp_js_sources = [
|
46
47
|
'js/romo/base.js',
|
48
|
+
'js/romo/word_boundary_filter.js',
|
47
49
|
'js/romo/invoke.js',
|
48
50
|
'js/romo/onkey.js',
|
49
51
|
'js/romo/form.js',
|
50
52
|
'js/romo/dropdown.js',
|
51
53
|
'js/romo/dropdown_form.js',
|
54
|
+
'js/romo/indicator_text_input.js',
|
52
55
|
'js/romo/select_dropdown.js',
|
53
56
|
'js/romo/select.js',
|
54
57
|
'js/romo/datepicker.js',
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: romo
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.17.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Kelly Redding
|
@@ -10,7 +10,7 @@ autorequire:
|
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
12
|
|
13
|
-
date: 2016-
|
13
|
+
date: 2016-11-01 00:00:00 Z
|
14
14
|
dependencies:
|
15
15
|
- !ruby/object:Gem::Dependency
|
16
16
|
name: assert
|
@@ -66,6 +66,7 @@ files:
|
|
66
66
|
- assets/css/romo/forms.scss
|
67
67
|
- assets/css/romo/grid.scss
|
68
68
|
- assets/css/romo/grid_table.scss
|
69
|
+
- assets/css/romo/indicator_text_input.scss
|
69
70
|
- assets/css/romo/labels.scss
|
70
71
|
- assets/css/romo/lists.scss
|
71
72
|
- assets/css/romo/modal.scss
|
@@ -82,6 +83,7 @@ files:
|
|
82
83
|
- assets/js/romo/dropdown_form.js
|
83
84
|
- assets/js/romo/form.js
|
84
85
|
- assets/js/romo/indicator.js
|
86
|
+
- assets/js/romo/indicator_text_input.js
|
85
87
|
- assets/js/romo/inline.js
|
86
88
|
- assets/js/romo/inline_form.js
|
87
89
|
- assets/js/romo/invoke.js
|
@@ -92,6 +94,7 @@ files:
|
|
92
94
|
- assets/js/romo/select_dropdown.js
|
93
95
|
- assets/js/romo/sortable.js
|
94
96
|
- assets/js/romo/tooltip.js
|
97
|
+
- assets/js/romo/word_boundary_filter.js
|
95
98
|
- lib/romo.rb
|
96
99
|
- lib/romo/dassets.rb
|
97
100
|
- lib/romo/version.rb
|