romo 0.1.0 → 0.2.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.
- data/assets/css/romo/base.scss +3 -2
- data/assets/css/romo/grid_table.scss +16 -13
- data/assets/css/romo/table.scss +12 -9
- data/assets/js/romo/dropdown.js +56 -13
- data/assets/js/romo/dropdown_form.js +4 -0
- data/assets/js/romo/form.js +3 -1
- data/assets/js/romo/indicator.js +2 -6
- data/assets/js/romo/modal.js +5 -0
- data/assets/js/romo/modal_form.js +4 -0
- data/lib/romo/version.rb +1 -1
- metadata +4 -4
data/assets/css/romo/base.scss
CHANGED
@@ -415,8 +415,9 @@ h3 { @include text1; }
|
|
415
415
|
|
416
416
|
.romo-match-line-height { line-height: 1 !important; }
|
417
417
|
|
418
|
-
.romo-nowrap
|
419
|
-
.romo-crop
|
418
|
+
.romo-nowrap { white-space: nowrap !important; }
|
419
|
+
.romo-crop { white-space: nowrap !important; overflow: hidden !important; }
|
420
|
+
.romo-crop-ellipsis { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
|
420
421
|
|
421
422
|
.romo-inline { display: inline !important; }
|
422
423
|
.romo-inline-block { display: inline-block !important; }
|
@@ -57,19 +57,22 @@ ol.romo-grid-table { @include list-unstyled(!important); }
|
|
57
57
|
.romo-grid-table-hover.romo-grid-table-header > .romo-row.romo-inverse:not(:first-child):hover { @include bg-inverse-hover; }
|
58
58
|
|
59
59
|
.romo-grid-table-border,
|
60
|
-
.romo-grid-table-border1
|
61
|
-
.romo-grid-table-border0
|
62
|
-
.romo-grid-table-border2
|
63
|
-
|
64
|
-
|
65
|
-
.romo-grid-table.romo-grid-table-
|
66
|
-
.romo-grid-table.romo-grid-table-
|
67
|
-
.romo-grid-table.romo-grid-table-
|
68
|
-
|
69
|
-
.romo-grid-table.romo-grid-table-border
|
70
|
-
|
71
|
-
.romo-grid-table.romo-grid-table-
|
72
|
-
.romo-grid-table.romo-grid-table-
|
60
|
+
.romo-grid-table-border1 { @include border1; }
|
61
|
+
.romo-grid-table-border0 { @include border0; }
|
62
|
+
.romo-grid-table-border2 { @include border2; }
|
63
|
+
.romo-grid-table-border-none { @include border-style(none); }
|
64
|
+
|
65
|
+
.romo-grid-table.romo-grid-table-border > .romo-row,
|
66
|
+
.romo-grid-table.romo-grid-table-border1 > .romo-row { @include border1-bottom; }
|
67
|
+
.romo-grid-table.romo-grid-table-border0 > .romo-row { @include border0-bottom; }
|
68
|
+
.romo-grid-table.romo-grid-table-border2 > .romo-row { @include border2-bottom; }
|
69
|
+
.romo-grid-table.romo-grid-table-border-none > .romo-row { @include border-style(none); }
|
70
|
+
|
71
|
+
.romo-grid-table.romo-grid-table-border > .romo-row > .romo-span,
|
72
|
+
.romo-grid-table.romo-grid-table-border1 > .romo-row > .romo-span { @include border1-right; white-space: nowrap; overflow: hidden; }
|
73
|
+
.romo-grid-table.romo-grid-table-border0 > .romo-row > .romo-span { @include border0-right; white-space: nowrap; overflow: hidden; }
|
74
|
+
.romo-grid-table.romo-grid-table-border2 > .romo-row > .romo-span { @include border2-right; white-space: nowrap; overflow: hidden; }
|
75
|
+
.romo-grid-table.romo-grid-table-border-none > .romo-row > .romo-span { @include border-style(none); white-space: nowrap; overflow: hidden; }
|
73
76
|
|
74
77
|
.romo-grid-table[class*="romo-grid-table-border"] > .romo-row > .romo-span:last-child { @include rm-border-right; }
|
75
78
|
.romo-grid-table[class*="romo-grid-table-border"] > .romo-row:last-child { @include rm-border-bottom; }
|
data/assets/css/romo/table.scss
CHANGED
@@ -40,17 +40,20 @@
|
|
40
40
|
.romo-table-border,
|
41
41
|
.romo-table-border0,
|
42
42
|
.romo-table-border1,
|
43
|
-
.romo-table-border2
|
43
|
+
.romo-table-border2,
|
44
|
+
.romo-table-border-none { border-collapse: collapse; *border-collapse: collapse; }
|
44
45
|
|
45
46
|
.romo-table-border,
|
46
|
-
.romo-table-border1
|
47
|
-
.romo-table-border0
|
48
|
-
.romo-table-border2
|
49
|
-
|
50
|
-
|
51
|
-
.romo-table-
|
52
|
-
.romo-table-
|
53
|
-
.romo-table-
|
47
|
+
.romo-table-border1 { @include border1-top; @include border1-left; }
|
48
|
+
.romo-table-border0 { @include border0-top; @include border0-left; }
|
49
|
+
.romo-table-border2 { @include border2-top; @include border2-left; }
|
50
|
+
.romo-table-border-none { @include border-style(none); }
|
51
|
+
|
52
|
+
.romo-table-border th, .romo-table-border td,
|
53
|
+
.romo-table-border1 th, .romo-table-border1 td { @include border1-bottom; @include border1-right; }
|
54
|
+
.romo-table-border0 th, .romo-table-border0 td { @include border0-bottom; @include border0-right; }
|
55
|
+
.romo-table-border2 th, .romo-table-border2 td { @include border2-bottom; @include border2-right; }
|
56
|
+
.romo-table-border-none th, .romo-table-border-none td { @include border-style(none); }
|
54
57
|
|
55
58
|
.romo-table-border-muted { @include border-muted; }
|
56
59
|
.romo-table-border-warning { @include border-warning; }
|
data/assets/js/romo/dropdown.js
CHANGED
@@ -210,6 +210,11 @@ RomoDropdown.prototype.doPopupClose = function() {
|
|
210
210
|
$('body').off('keyup', $.proxy(this.onWindowBodyKeyUp, this));
|
211
211
|
$(window).off('resize', $.proxy(this.onResizeWindow, this));
|
212
212
|
|
213
|
+
// clear the content elem markup if configured to
|
214
|
+
if (this.elem.data('romo-dropdown-clear-content') === true) {
|
215
|
+
this.contentElem.html('');
|
216
|
+
}
|
217
|
+
|
213
218
|
this.elem.trigger('dropdown:popupClose', [this]);
|
214
219
|
}
|
215
220
|
|
@@ -255,19 +260,47 @@ RomoDropdown.prototype.onResizeWindow = function(e) {
|
|
255
260
|
RomoDropdown.prototype.doPlacePopupElem = function() {
|
256
261
|
if (this.elem.parents('.romo-modal-popup').size() !== 0) {
|
257
262
|
this.popupElem.css({'position': 'fixed'});
|
263
|
+
this.popupElem.offset(this.elem.offset());
|
258
264
|
}
|
259
265
|
|
260
266
|
var pos = $.extend({}, this.elem[0].getBoundingClientRect(), this.elem.offset());
|
261
267
|
var w = this.popupElem[0].offsetWidth;
|
262
268
|
var h = this.popupElem[0].offsetHeight;
|
263
|
-
var pad = 2;
|
264
269
|
var offset = {};
|
265
270
|
|
266
|
-
|
271
|
+
var configHeight = this.elem.data('romo-dropdown-height') || this.elem.data('romo-dropdown-max-height');
|
272
|
+
var configPosition = this.popupPosition;
|
273
|
+
|
274
|
+
if (configHeight === 'detect') {
|
275
|
+
var popupHeight = this.popupElem.height();
|
276
|
+
var topAvailHeight = this._getPopupMaxAvailableHeight('top');
|
277
|
+
var bottomAvailHeight = this._getPopupMaxAvailableHeight('bottom');
|
278
|
+
|
279
|
+
if (popupHeight < topAvailHeight && popupHeight < bottomAvailHeight) {
|
280
|
+
// if it fits both ways, use the config position way
|
281
|
+
configHeight = this._getPopupMaxAvailableHeight(configPosition);
|
282
|
+
} else if (topAvailHeight > bottomAvailHeight) {
|
283
|
+
configPosition = 'top';
|
284
|
+
configHeight = topAvailHeight;
|
285
|
+
} else {
|
286
|
+
configPosition = 'bottom';
|
287
|
+
configHeight = bottomAvailHeight;
|
288
|
+
}
|
289
|
+
|
290
|
+
this.contentElem.css({'max-height': configHeight.toString() + 'px'});
|
291
|
+
}
|
292
|
+
|
293
|
+
if(h > configHeight) {
|
294
|
+
h = configHeight;
|
295
|
+
}
|
296
|
+
|
297
|
+
switch (configPosition) {
|
267
298
|
case 'top':
|
299
|
+
var pad = 2;
|
268
300
|
$.extend(offset, { top: pos.top - h - pad });
|
269
301
|
break;
|
270
302
|
case 'bottom':
|
303
|
+
var pad = 2;
|
271
304
|
$.extend(offset, { top: pos.top + pos.height + pad });
|
272
305
|
break;
|
273
306
|
}
|
@@ -281,17 +314,6 @@ RomoDropdown.prototype.doPlacePopupElem = function() {
|
|
281
314
|
}
|
282
315
|
|
283
316
|
this.popupElem.offset(offset);
|
284
|
-
|
285
|
-
if (this.elem.data('romo-dropdown-max-height') === 'detect') {
|
286
|
-
var pad = this.elem.data('romo-dropdown-max-height-detect-pad') || 10;
|
287
|
-
var contentTop = this.contentElem[0].getBoundingClientRect().top;
|
288
|
-
var contentBottom = this.contentElem[0].getBoundingClientRect().bottom;
|
289
|
-
var bodyBottom = this.bodyElem[0].getBoundingClientRect().bottom;
|
290
|
-
var padBottom = bodyBottom - contentBottom;
|
291
|
-
|
292
|
-
var maxHeight = $(window).height() - contentTop - padBottom - pad;
|
293
|
-
this.contentElem.css({'max-height': maxHeight.toString() + 'px'});
|
294
|
-
}
|
295
317
|
}
|
296
318
|
|
297
319
|
RomoDropdown.prototype.doSetPopupZIndex = function(relativeElem) {
|
@@ -304,6 +326,27 @@ RomoDropdown.prototype._parsePositionData = function(posString) {
|
|
304
326
|
return { position: posData[0], alignment: posData[1] };
|
305
327
|
}
|
306
328
|
|
329
|
+
RomoDropdown.prototype._getPopupMaxAvailableHeight = function(position) {
|
330
|
+
var maxHeight = undefined;
|
331
|
+
|
332
|
+
switch (position) {
|
333
|
+
case 'top':
|
334
|
+
var elemTop = this.elem[0].getBoundingClientRect().top;
|
335
|
+
maxHeight = elemTop - this._getPopupMaxHeightDetectPad(position);
|
336
|
+
break;
|
337
|
+
case 'bottom':
|
338
|
+
var elemBottom = this.elem[0].getBoundingClientRect().bottom;
|
339
|
+
maxHeight = $(window).height() - elemBottom - this._getPopupMaxHeightDetectPad(position);
|
340
|
+
break;
|
341
|
+
}
|
342
|
+
|
343
|
+
return maxHeight;
|
344
|
+
}
|
345
|
+
|
346
|
+
RomoDropdown.prototype._getPopupMaxHeightDetectPad = function(position) {
|
347
|
+
return this.elem.data('romo-dropdown-max-height-detect-pad-'+position) || this.elem.data('romo-dropdown-max-height-detect-pad') || 10;
|
348
|
+
}
|
349
|
+
|
307
350
|
Romo.onInitUI(function(e) {
|
308
351
|
Romo.initUIElems(e, '[data-romo-dropdown-auto="true"]').romoDropdown();
|
309
352
|
});
|
@@ -30,6 +30,10 @@ RomoDropdownForm.prototype.doInit = function() {
|
|
30
30
|
}
|
31
31
|
|
32
32
|
RomoDropdownForm.prototype.doBindDropdown = function() {
|
33
|
+
if (this.elem.data('romo-dropdown-clear-content') === undefined) {
|
34
|
+
this.elem.attr('data-romo-dropdown-clear-content', 'true');
|
35
|
+
}
|
36
|
+
|
33
37
|
this.elem.on('dropdown:ready', $.proxy(function(e, dropdown) {
|
34
38
|
this.elem.trigger('dropdownForm:dropdown:ready', [dropdown, this]);
|
35
39
|
}, this));
|
data/assets/js/romo/form.js
CHANGED
@@ -68,8 +68,8 @@ RomoForm.prototype.onSubmitClick = function(e) {
|
|
68
68
|
}
|
69
69
|
|
70
70
|
RomoForm.prototype.doSubmit = function() {
|
71
|
-
this.elem.trigger('form:beforeSubmit', [this]);
|
72
71
|
this.indicatorElems.trigger('indicator:triggerStart');
|
72
|
+
this.elem.trigger('form:beforeSubmit', [this]);
|
73
73
|
|
74
74
|
if (this.elem.attr('method').toUpperCase() === 'GET') {
|
75
75
|
this._doGetSubmit();
|
@@ -81,6 +81,7 @@ RomoForm.prototype.doSubmit = function() {
|
|
81
81
|
RomoForm.prototype.onSubmitSuccess = function(data, status, xhr) {
|
82
82
|
this.elem.trigger('form:clearMsgs');
|
83
83
|
this.elem.trigger('form:submitSuccess', [data, this]);
|
84
|
+
this.elem.trigger('form:submitComplete', [this]);
|
84
85
|
}
|
85
86
|
|
86
87
|
RomoForm.prototype.onSubmitError = function(xhr, errorType, error) {
|
@@ -92,6 +93,7 @@ RomoForm.prototype.onSubmitError = function(xhr, errorType, error) {
|
|
92
93
|
this.elem.trigger('form:submitXhrError', [xhr, this]);
|
93
94
|
}
|
94
95
|
this.elem.trigger('form:submitError', [xhr, this]);
|
96
|
+
this.elem.trigger('form:submitComplete', [this]);
|
95
97
|
this.indicatorElems.trigger('indicator:triggerStop');
|
96
98
|
}
|
97
99
|
|
data/assets/js/romo/indicator.js
CHANGED
@@ -56,9 +56,7 @@ RomoIndicator.prototype.onStart = function(e) {
|
|
56
56
|
e.preventDefault();
|
57
57
|
}
|
58
58
|
|
59
|
-
|
60
|
-
this.doStart();
|
61
|
-
}
|
59
|
+
this.doStart();
|
62
60
|
}
|
63
61
|
|
64
62
|
RomoIndicator.prototype.onStop = function(e) {
|
@@ -66,9 +64,7 @@ RomoIndicator.prototype.onStop = function(e) {
|
|
66
64
|
e.preventDefault();
|
67
65
|
}
|
68
66
|
|
69
|
-
|
70
|
-
this.doStop();
|
71
|
-
}
|
67
|
+
this.doStop();
|
72
68
|
}
|
73
69
|
|
74
70
|
RomoIndicator.prototype.doStart = function() {
|
data/assets/js/romo/modal.js
CHANGED
@@ -195,6 +195,11 @@ RomoModal.prototype.doPopupClose = function() {
|
|
195
195
|
// unbind window resizes reposition modal
|
196
196
|
$(window).off('resize', $.proxy(this.onResizeWindow, this));
|
197
197
|
|
198
|
+
// clear the content elem markup if configured to
|
199
|
+
if (this.elem.data('romo-modal-clear-content') === true) {
|
200
|
+
this.contentElem.html('');
|
201
|
+
}
|
202
|
+
|
198
203
|
this.elem.trigger('modal:popupClose', [this]);
|
199
204
|
}
|
200
205
|
|
@@ -30,6 +30,10 @@ RomoModalForm.prototype.doInit = function() {
|
|
30
30
|
}
|
31
31
|
|
32
32
|
RomoModalForm.prototype.doBindModal = function() {
|
33
|
+
if (this.elem.data('romo-modal-clear-content') === undefined) {
|
34
|
+
this.elem.attr('data-romo-modal-clear-content', 'true');
|
35
|
+
}
|
36
|
+
|
33
37
|
this.elem.on('modal:ready', $.proxy(function(e, modal) {
|
34
38
|
this.elem.trigger('modalForm:modal:ready', [modal, this]);
|
35
39
|
}, this));
|
data/lib/romo/version.rb
CHANGED
metadata
CHANGED
@@ -1,13 +1,13 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: romo
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
hash:
|
4
|
+
hash: 23
|
5
5
|
prerelease:
|
6
6
|
segments:
|
7
7
|
- 0
|
8
|
-
-
|
8
|
+
- 2
|
9
9
|
- 0
|
10
|
-
version: 0.
|
10
|
+
version: 0.2.0
|
11
11
|
platform: ruby
|
12
12
|
authors:
|
13
13
|
- Kelly Redding
|
@@ -16,7 +16,7 @@ autorequire:
|
|
16
16
|
bindir: bin
|
17
17
|
cert_chain: []
|
18
18
|
|
19
|
-
date:
|
19
|
+
date: 2015-01-28 00:00:00 Z
|
20
20
|
dependencies:
|
21
21
|
- !ruby/object:Gem::Dependency
|
22
22
|
requirement: &id001 !ruby/object:Gem::Requirement
|