metro-ui-rails 0.15.8.14 → 0.15.8.15

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.
@@ -1,7 +1,7 @@
1
1
  module Metro
2
2
  module Ui
3
3
  module Rails
4
- VERSION = "0.15.8.14"
4
+ VERSION = "0.15.8.15"
5
5
  end
6
6
  end
7
7
  end
@@ -15,6 +15,6 @@ Gem::Specification.new do |gem|
15
15
  gem.files = `git ls-files`.split($/)
16
16
  gem.require_paths = ["lib"]
17
17
 
18
- gem.add_runtime_dependency 'less-rails', '~> 2.2.3'
18
+ gem.add_runtime_dependency 'less-rails', '> 2.2.3'
19
19
  gem.add_development_dependency 'rails', '>= 3.1'
20
20
  end
@@ -1,14 +1,16 @@
1
1
  //= require jquery.mousewheel.min.js
2
- //= require metro-ui/pagecontrol
3
2
  //= require metro-ui/accordion
3
+ //= require metro-ui/buttonset
4
4
  //= require metro-ui/calendar
5
- //= require metro-ui/tile-drag
6
- //= require metro-ui/dropdown
7
- //= require metro-ui/start-menu
8
- //= require metro-ui/dialog
9
- //= require metro-ui/tile-slider
10
5
  //= require metro-ui/carousel
11
- //= require metro-ui/buttonset
6
+ //= require metro-ui/contextmenu
7
+ //= require metro-ui/dialog
8
+ //= require metro-ui/dropdown
12
9
  //= require metro-ui/input-control
10
+ //= require metro-ui/pagecontrol
11
+ //= require metro-ui/pagelist
13
12
  //= require metro-ui/rating
14
13
  //= require metro-ui/slider
14
+ //= require metro-ui/start-menu
15
+ //= require metro-ui/tile-drag
16
+ //= require metro-ui/tile-slider
@@ -0,0 +1,11 @@
1
+ $(function(){
2
+ $(".contextmenu").hide();
3
+ $(document).on("contextmenu", function(event) {
4
+ event.preventDefault();
5
+ $(".contextmenu")
6
+ .show()
7
+ .css({top: event.pageY + "px", left: event.pageX + "px"});
8
+ }).on("click", function(event) {
9
+ $(".contextmenu").hide();
10
+ });
11
+ });
@@ -1,6 +1,6 @@
1
1
  /* Author: Valerio Battaglia (vabatta)
2
2
  * Description: Function to create dialog box. You can have a dialog box open at once.
3
- * Version: 1.0a
3
+ * Version: 1.1b
4
4
  *
5
5
  * Params:
6
6
  * title - Title of the dialog box (HTML format)
@@ -9,6 +9,7 @@
9
9
  * overlay - Set the overlay of the page, available: true, false (default: true)
10
10
  * closeButton - Enable or disable the close button, available: true, false (default: false)
11
11
  * buttonsAlign - Align of the buttons, available: left, center, right (default: center)
12
+ * keepOpened - Keep the window opened after buttons click, available: true, false (default: false)
12
13
  * buttons - Set buttons in the action bar (JSON format)
13
14
  * name - Text of the button (JSON format)
14
15
  * action - Function to bind to the button
@@ -17,20 +18,29 @@
17
18
  * offsetY - Top offset pixels
18
19
  * offsetX - Left offset pixels
19
20
  *
21
+ * API:
22
+ * $.Dialog.content() - Getter or setter for the content of opened dialog (HTML format)
23
+ * $.Dialog.title() - Getter or setter for the title of opened dialog (HTML format)
24
+ * $.Dialog.buttons() - Setter for the buttons of opened dialog (JSON Format)
25
+ * $.Dialog.close() - Close, if any, current dialog box
26
+ *
20
27
  * Goal for next versions:
21
28
  * Add style param to set custom css to the dialog box controls
22
29
  * Add possibility to resize window
30
+ * Create setup with steps
23
31
  */
24
32
 
25
33
  (function($) {
26
34
  $.Dialog = function(params) {
27
- if(!$.DialogOpened) {
28
- $.DialogOpened = true;
35
+ if(!$.Dialog.opened) {
36
+ $.Dialog.opened = true;
29
37
  } else {
30
38
  return false;
31
39
  }
32
40
 
33
- params = $.extend({'position':{'zone':'center'},'overlay':true}, params);
41
+ $.Dialog.settings = params;
42
+
43
+ params = $.extend({ 'position': {'zone': 'center'}, 'overlay': true }, params);
34
44
 
35
45
  var buttonsHTML = '<div';
36
46
 
@@ -42,7 +52,7 @@
42
52
  buttonsHTML += '>';
43
53
  }
44
54
 
45
- $.each(params.buttons, function(name,obj) {
55
+ $.each(params.buttons, function(name, obj) {
46
56
  // Generating the markup for the buttons
47
57
 
48
58
  buttonsHTML += '<button>' + name + '</button>';
@@ -60,9 +70,9 @@
60
70
 
61
71
  '<div id="dialogOverlay">',
62
72
  '<div id="dialogBox" class="dialog">',
63
- '<div class="header">',
64
- params.title,
65
- (params.closeButton)?('<div><button class="tool-button"><i class="icon-cancel-2"></i></button></div>'):(''),
73
+ '<div class="header"><span>',
74
+ params.title,'</span>',
75
+ (params.closeButton)?('<div><button><i class="icon-cancel-2"></i></button></div>'):(''),
66
76
  '</div>',
67
77
  '<div class="content">', params.content, '</div>',
68
78
  '<div class="action" id="dialogButtons">',
@@ -109,44 +119,134 @@
109
119
  drg_w = $drag.outerWidth(),
110
120
  pos_y = $drag.offset().top + drg_h - e.pageY,
111
121
  pos_x = $drag.offset().left + drg_w - e.pageX;
122
+
112
123
  $drag.css('z-index', 99999).parents().on("mousemove", function(e) {
113
- $('.draggable').offset({
114
- top:e.pageY + pos_y - drg_h,
115
- left:e.pageX + pos_x - drg_w
116
- }).on("mouseup", function() {
124
+ var t = (e.pageY > 0)?(e.pageY + pos_y - drg_h):(0);
125
+ var l = (e.pageX > 0)?(e.pageX + pos_x - drg_w):(0);
126
+
127
+ if(t >= 0 && t <= window.innerHeight) {
128
+ $('.draggable').offset({top: t});
129
+ }
130
+ if(l >= 0 && l <= window.innerWidth) {
131
+ $('.draggable').offset({left: l});
132
+ }
133
+
134
+ $('.draggable').on("mouseup", function() {
117
135
  $(this).removeClass('draggable').css('z-index', z_idx);
118
136
  });
119
137
  });
120
- e.preventDefault(); // disable selection
138
+ // disable selection
139
+
140
+ e.preventDefault();
121
141
  }).on("mouseup", function() {
122
142
  $(this).removeClass('active-handle').parent().removeClass('draggable');
123
143
  });
124
144
  }
125
145
 
126
146
  $('#dialogBox .header button').click(function() {
127
- // Bind close button to hide dialog
147
+ // Bind close button to close dialog
128
148
 
129
- $.Dialog.hide();
149
+ $.Dialog.close();
130
150
  return false;
131
151
  });
132
152
 
133
153
  var buttons = $('#dialogBox .action button'),
134
154
  i = 0;
135
155
 
136
- $.each(params.buttons,function(name,obj){
137
- buttons.eq(i++).click(function(){
138
- // Calling function and hide the dialog
156
+ $.each(params.buttons, function(name, obj) {
157
+ buttons.eq(i++).click(function() {
158
+ // Calling function and close the dialog
159
+
160
+ var result = obj.action();
161
+ if(!params.keepOpened || result != false) {
162
+ $.Dialog.close();
163
+ return false;
164
+ }
165
+ });
166
+ });
167
+ }
168
+
169
+ $.Dialog.content = function(newContent) {
170
+ // Prevent using function without dialog opened
171
+ if(!$.Dialog.opened) {
172
+ return false;
173
+ }
174
+
175
+ if(newContent) {
176
+ $('#dialogBox .content').html(newContent);
177
+ } else {
178
+ return $('#dialogBox .content').html();
179
+ }
180
+ }
181
+
182
+ $.Dialog.title = function(newTitle) {
183
+ // Prevent using function without dialog opened
184
+ if(!$.Dialog.opened) {
185
+ return false;
186
+ }
187
+
188
+ if(newTitle) {
189
+ $('#dialogBox .header span').html(newTitle);
190
+ } else {
191
+ return $('#dialogBox .header span').html();
192
+ }
193
+ }
194
+
195
+ $.Dialog.buttons = function(newButtons) {
196
+ // Prevent using function without dialog opened or no params
197
+ if(!$.Dialog.opened || !newButtons) {
198
+ return false;
199
+ }
200
+
201
+ var buttonsHTML = '<div';
202
+
203
+ // Buttons position
204
+ if($.Dialog.settings.buttonsAlign)
205
+ {
206
+ buttonsHTML += ' style=" float: ' + $.Dialog.settings.buttonsAlign + ';">';
207
+ } else {
208
+ buttonsHTML += '>';
209
+ }
210
+
211
+ $.each(newButtons, function(name, obj) {
212
+ // Generating the markup for the buttons
213
+
214
+ buttonsHTML += '<button>' + name + '</button>';
215
+
216
+ if(!obj.action)
217
+ {
218
+ obj.action = function() {};
219
+ }
220
+ });
221
+
222
+ buttonsHTML += '</div>';
223
+
224
+ $('#dialogButtons').html(buttonsHTML);
225
+
226
+ var buttons = $('#dialogBox .action button'),
227
+ i = 0;
228
+
229
+ $.each(newButtons, function(name, obj) {
230
+ buttons.eq(i++).click(function() {
231
+ // Calling function and close the dialog
139
232
 
140
233
  obj.action();
141
- $.Dialog.hide();
234
+ if(!$.Dialog.settings.keepOpened) {
235
+ $.Dialog.close();
236
+ }
142
237
  return false;
143
238
  });
144
239
  });
145
240
  }
146
241
 
147
- $.Dialog.hide = function(){
148
- $('#dialogOverlay').fadeOut(function(){
149
- $.DialogOpened = false;
242
+ $.Dialog.close = function() {
243
+ // Prevent using function without dialog opened
244
+ if(!$.Dialog.opened) {
245
+ return false;
246
+ }
247
+
248
+ $('#dialogOverlay').fadeOut(function() {
249
+ $.Dialog.opened = false;
150
250
  $(this).remove();
151
251
  });
152
252
  }
@@ -12,17 +12,26 @@
12
12
  $(this).slideUp('fast', function(){});
13
13
  $(this).parent().removeClass("active");
14
14
  });
15
- }
15
+ };
16
16
 
17
17
  var initSelectors = function(selectors){
18
- selectors.on('click', function(e){
19
- e.stopPropagation();
18
+ selectors.off("click.dropdown");
19
+ selectors.on('click.dropdown', function(e){
20
+ //e.stopPropagation();
20
21
  //$("[data-role=dropdown]").removeClass("active");
22
+ if($(e.originalEvent.target).parent().is("[data-role]")) e.stopPropagation();
21
23
 
22
24
  clearDropdown();
23
25
  $(this).parents("ul").css("overflow", "visible");
24
26
 
25
27
  var $m = $(this).children(".dropdown-menu, .sidebar-dropdown-menu");
28
+ $(this).parents("ul").children(".dropdown").children(".dropdown-menu, .sidebar-dropdown-menu").each(function(){
29
+ if(!$(this).hasClass("keep-opened") && !$m.hasClass("keep-opened")) {
30
+ $(this).slideUp('fast');
31
+ $(this).parents("li").removeClass("active");
32
+ }
33
+ });
34
+
26
35
  if ($m.css('display') == "block") {
27
36
  $m.slideUp('fast');
28
37
  $(this).removeClass("active");
@@ -34,24 +43,25 @@
34
43
  //$(this).children(".dropdown-menu").hide();
35
44
  });
36
45
  $('html').on("click", function(e){
37
- clearDropdown();
46
+ if(e.originalEvent && $(e.originalEvent.target).parents('[data-role="dropdown"]').length == 0)
47
+ clearDropdown();
38
48
  });
39
- }
49
+ };
40
50
 
41
51
  return this.each(function(){
42
52
  if ( options ) {
43
- $.extend(defaults, options)
53
+ $.extend(defaults, options);
44
54
  }
45
55
 
46
56
  initSelectors($this);
47
57
  });
48
- }
58
+ };
49
59
 
50
60
  $(function () {
51
61
  $('[data-role="dropdown"]').each(function () {
52
62
  $(this).Dropdown();
53
- })
54
- })
63
+ });
64
+ });
55
65
  })(window.jQuery);
56
66
 
57
67
 
@@ -76,20 +86,20 @@
76
86
  }
77
87
  //$(this).toggleClass("active");
78
88
  });
79
- }
89
+ };
80
90
 
81
91
  return this.each(function(){
82
92
  if ( options ) {
83
- $.extend(defaults, options)
93
+ $.extend(defaults, options);
84
94
  }
85
95
 
86
96
  initSelectors($this);
87
97
  });
88
- }
98
+ };
89
99
 
90
100
  $(function () {
91
101
  $('.pull-menu, .menu-pull').each(function () {
92
102
  $(this).PullDown();
93
- })
94
- })
95
- })(window.jQuery);
103
+ });
104
+ });
105
+ })(window.jQuery);
@@ -12,6 +12,13 @@
12
12
  ;
13
13
 
14
14
  var initSelectors = function(selectors){
15
+ $.each(selectors, function(i, s){
16
+ if ($(s).parent("li").hasClass("active")) {
17
+ var target = $(s).attr("href");
18
+ $(target).show();
19
+ }
20
+ })
21
+
15
22
  selectors.on('click', function(e){
16
23
  e.preventDefault();
17
24
  var $a = $(this);
@@ -0,0 +1,243 @@
1
+ /* Author: Kation
2
+ * Description: Function to create page list.
3
+ * Version: 0.1.1
4
+ *
5
+ * Tutorial:
6
+ * var page = $("#page").pagelist();
7
+ * page.total = 10; //Total pages
8
+ * page.current = 5; //Current page
9
+ * page.showcount = 2; //Default is 2
10
+ * page.url = "/List?page={page}"; //Jump url
11
+ * page.ajax = "#contnet"; //if you want to use ajax, set value to target element, defaul is null
12
+ * //If you want to use your own template
13
+ * //page.pageTemplate = '...';
14
+ * //page.pageSideTemplate = '...';
15
+ * //page.pageItemTemplate = '...';
16
+ * //page.pageCurrentTemplate = '...';
17
+ * //page.pageMoreTemplate = '...';
18
+ * //page.pageJumpTemplate = '...';
19
+ * page.create(); //Create page list
20
+ */
21
+
22
+ (function ($) {
23
+ $.extend($.fn, {
24
+ pagelist: function () {
25
+ //Invoke element
26
+ this.element = $(this);
27
+ //Total Page
28
+ this.total = 1;
29
+ //Current Page
30
+ this.current = 1;
31
+ //Url with {page} parameter
32
+ //Example : /List?page={page}
33
+ this.url = '';
34
+ //If showcount = 2, current = 5, total = 10
35
+ //You will see like this
36
+ //1 ... 3 4 5 6 7 ... 10
37
+ //Show 3 to 7
38
+ this.showcount = 2;
39
+ //Page list Template
40
+ //Must have {previous},{content},{next}
41
+ //Optional {jump}
42
+ this.pageTemplate = '<div class="pagelist"><div class="pagePrevious">{previous}</div><div class="pageContent">{content}</div><div class="pageNext">{next}</div><div class="pageJump">{jump}</div></div>';
43
+ //Previous, Next Button Template
44
+ this.pageSideTemplate = '<a class="button">{page}</a>';
45
+ //Each Page Item Template, 1,2,3,4...
46
+ this.pageItemTemplate = '<a class="tool-button">{page}</a>';
47
+ //Current Page Item Template
48
+ this.pageCurrentTemplate = '<a class="pageCurrent tool-button">{page}</a>';
49
+ //'...' Template
50
+ this.pageMoreTemplate = '<span>...</span>';
51
+ //Jump Template
52
+ //Must have id="pageGoValue", id="pageGo"
53
+ this.pageJumpTemplate = '<input type="text" id="pageGoValue" /><button class="tool-button" id="pageGo"></button>';
54
+ //Ajax target , example : '#content'
55
+ this.ajax = null;
56
+ //Ajax success execute function
57
+ this.ajaxResult = function (pageList, result) {
58
+ $(pageList.ajax).html(result);
59
+ };
60
+ //Display text of buttons
61
+ this.text = {
62
+ previous: 'Previous',
63
+ next: 'Next',
64
+ go: 'Go'
65
+ };
66
+ //Execute when navigate to a page
67
+ this.click = function (pageList, page) {
68
+ var url = pageList.url.replace('{page}', page);
69
+ if (pageList.ajax != null) {
70
+ $.ajax({
71
+ url: url,
72
+ async: true,
73
+ success: function (result, status) {
74
+ pageList.ajaxResult(pageList, result);
75
+ }
76
+ });
77
+ }
78
+ else {
79
+ location.href = url;
80
+ }
81
+ };
82
+
83
+ var pageContent = null;
84
+ var previousContent = null;
85
+ var nextContent = null;
86
+ var jumpContent = null;
87
+ //Create page list elements.
88
+ this.create = function () {
89
+ var pageDivString = this.pageTemplate.replace('{content}', '<div id="pageContent"/>');
90
+ pageDivString = pageDivString.replace('{previous}', '<div id="pagePrevious"/>');
91
+ pageDivString = pageDivString.replace('{next}', '<div id="pageNext"/>');
92
+ pageDivString = pageDivString.replace('{jump}', '<div id="pageJump"/>');
93
+ var pageDiv = $(pageDivString);
94
+ pageContent = pageDiv.find('#pageContent').parent();
95
+ previousContent = pageDiv.find('#pagePrevious').parent();
96
+ nextContent = pageDiv.find('#pageNext').parent();
97
+ if (pageDiv.find('#pageJump').length != 0)
98
+ jumpContent = pageDiv.find('#pageJump').parent();
99
+ rebuildPage(pageContent, previousContent, nextContent, jumpContent, this);
100
+ this.element.append(pageDiv);
101
+ }
102
+
103
+ //Navigate function
104
+ this.navigateTo = function (page) {
105
+ if (page == '-1') {
106
+ if (this.current == 1) {
107
+ return false;
108
+ }
109
+ this.current--;
110
+ }
111
+ else if (page == '+1') {
112
+ if (this.current == this.total) {
113
+ return false;
114
+ }
115
+ this.current++;
116
+ }
117
+ else {
118
+ try
119
+ {
120
+ var val = Math.round(new Number(page));
121
+ if (val < 1 || val > this.total || isNaN(val))
122
+ return false;
123
+ this.current = val;
124
+ }
125
+ catch (err) {
126
+
127
+ }
128
+ }
129
+ if (this.ajax != null) {
130
+ rebuildPage(pageContent, previousContent, nextContent, jumpContent, this);
131
+ }
132
+ this.click(this, this.current);
133
+ return true;
134
+ }
135
+
136
+ return this;
137
+ }
138
+ });
139
+
140
+ function rebuildPage(pageContent, previousContent, nextContent, jumpContent, pagelist) {
141
+ var previous = createPage('-1', pagelist.text.previous, pagelist.pageSideTemplate);
142
+ previous.click(function () {
143
+ var page = $(this).attr('data-page');
144
+ pagelist.navigateTo(page);
145
+ });
146
+ var next = createPage('+1', pagelist.text.next, pagelist.pageSideTemplate);
147
+ next.click(function () {
148
+ var page = $(this).attr('data-page');
149
+ pagelist.navigateTo(page);
150
+ });
151
+ pageContent.html('');
152
+ previousContent.html('');
153
+ nextContent.html('');
154
+ if (jumpContent != null)
155
+ jumpContent.html('');
156
+
157
+ previousContent.append(previous);
158
+
159
+ if (pagelist.current - pagelist.showcount > 1) {
160
+ var first = createPage('1', '1', pagelist.pageItemTemplate);
161
+ first.click(function () {
162
+ var page = $(this).attr('data-page');
163
+ pagelist.navigateTo(page);
164
+ });
165
+ pageContent.append(first);
166
+ pageContent.append($(pagelist.pageMoreTemplate));
167
+ }
168
+
169
+ var start = pagelist.current - pagelist.showcount;
170
+ var stop = pagelist.current + pagelist.showcount;
171
+ if (start < 1) {
172
+ stop += 1 - start;
173
+ start = 1;
174
+ }
175
+ if (stop > pagelist.total) {
176
+ start -= stop - pagelist.total;
177
+ stop = pagelist.total;
178
+ }
179
+ for (var i = start; i <= stop; i++) {
180
+ if (i < 1 || i > pagelist.total) {
181
+ continue;
182
+ }
183
+ var page
184
+ if (i == pagelist.current) {
185
+ page = createPage(i, i, pagelist.pageCurrentTemplate);
186
+ } else {
187
+ page = createPage(i, i, pagelist.pageItemTemplate);
188
+ }
189
+ page.click(function () {
190
+ var page = $(this).attr('data-page');
191
+ pagelist.navigateTo(page);
192
+ });
193
+ pageContent.append(page);
194
+ }
195
+
196
+ if (pagelist.current + pagelist.showcount < pagelist.total) {
197
+ var last = createPage(pagelist.total, pagelist.total, pagelist.pageItemTemplate);
198
+ last.click(function () {
199
+ var page = $(this).attr('data-page');
200
+ pagelist.navigateTo(page);
201
+ });
202
+ pageContent.append($(pagelist.pageMoreTemplate));
203
+ pageContent.append(last);
204
+ }
205
+ nextContent.append(next);
206
+ if (jumpContent != null) {
207
+ jumpContent.html(pagelist.pageJumpTemplate);
208
+ var pageGoValue = jumpContent.find("#pageGoValue");
209
+ var pageGo = jumpContent.find("#pageGo");
210
+ pageGo.html(pagelist.text.go);
211
+ pageGo.click(function () {
212
+ var result = pagelist.navigateTo(pageGoValue.val());
213
+ if (result == false) {
214
+ $.Dialog({
215
+ 'title': 'Jump Page',
216
+ 'content': 'Your input a invalid value.',
217
+ 'draggable': true,
218
+ 'overlay': true,
219
+ 'closeButton': false,
220
+ 'buttonsAlign': 'right',
221
+ 'position': {
222
+ 'zone': 'center'
223
+ },
224
+ 'buttons': {
225
+ 'OK': {
226
+ 'action': function () {
227
+ pageGoValue.val('');
228
+ }
229
+ }
230
+ }
231
+ });
232
+ }
233
+ });
234
+ }
235
+ }
236
+
237
+ function createPage(page, name, template) {
238
+ var content = template.replace('{page}', name);
239
+ var a = $(content);
240
+ a.attr('data-page', page);
241
+ return a;
242
+ }
243
+ }(jQuery));
@@ -23,7 +23,7 @@ $('.slider').data('value')
23
23
 
24
24
  (function($) {
25
25
 
26
- var pluginName = 'slider',
26
+ var pluginName = 'Slider',
27
27
  initAllSelector = '[data-role=slider], .slider',
28
28
  paramKeys = ['InitValue', 'Accuracy'];
29
29
 
@@ -267,4 +267,4 @@ $('.slider').data('value')
267
267
  $()[pluginName]({initAll: true});
268
268
  });
269
269
 
270
- })(jQuery);
270
+ })(jQuery);
@@ -52,7 +52,8 @@
52
52
  targetType, // 'new' or 'existing' group
53
53
  groupsMaxHeight,
54
54
  mouseMoved,
55
- tileDragTimer;
55
+ tileDragTimer,
56
+ tileStartDragTimer;
56
57
 
57
58
  plugin.init = function() {
58
59
  settings = plugin.settings = $.extend({}, defaults, options);
@@ -65,11 +66,21 @@
65
66
  // select all tiles within group
66
67
  tiles = $groups.children('.tile');
67
68
 
68
- tiles.on('mousedown', startDrag);
69
+ tiles.on('mousedown', function(event) {
70
+ event.preventDefault();
71
+ clearTimeout(tileStartDragTimer);
72
+ var el = $(this);
73
+ tileStartDragTimer = setTimeout(function() {
74
+ startDrag(el, event);
75
+ }, 1000);
76
+ }).on('mouseup mouseout', function() {
77
+ clearTimeout(tileStartDragTimer);
78
+ });
69
79
 
80
+ //tiles.on('mousedown', startDrag);
70
81
  };
71
82
 
72
- var startDrag = function(event) {
83
+ var startDrag = function(el, event) {
73
84
  var $tile,
74
85
  tilePosition,
75
86
  tilePositionX,
@@ -78,7 +89,8 @@
78
89
  event.preventDefault();
79
90
 
80
91
  // currently dragging tile
81
- $tile = $draggingTile = $(this);
92
+ $tile = $draggingTile = el;
93
+ //$tile.animate({"width": "-=20px", "height": "-=20px"}, "fast").animate({"width": "+=20px", "height": "+=20px"}, "fast");
82
94
 
83
95
  // dragging tile dimentions
84
96
  draggingTileWidth = $tile.outerWidth();
@@ -104,11 +116,11 @@
104
116
  } else if ($tile.hasClass('quadro-vertical')) {
105
117
  $phantomTile.addClass('quadro-vertical');
106
118
  }
107
-
119
+
108
120
  // place phantom tile instead dragging one
109
121
  $phantomTile.insertAfter($tile);
110
122
  targetType = 'existing';
111
-
123
+
112
124
  // search parent group
113
125
  $parentGroup = $tile.parents('.tile-group');
114
126
 
@@ -192,7 +204,7 @@
192
204
  */
193
205
  var dragStop = function (event) {
194
206
  var targetGroup;
195
-
207
+
196
208
  if (!mouseMoved) {
197
209
  // emulate default click behavior
198
210
  if ($draggingTile.is('a')) {
@@ -245,7 +257,7 @@
245
257
 
246
258
  $groups = $('[data-role=tile-group], .tile-group');
247
259
  $groups.trigger('drop', [$draggingTile, targetGroup]);
248
-
260
+
249
261
  $startMenu.trigger('changed');
250
262
  };
251
263
 
@@ -411,7 +423,7 @@
411
423
  });
412
424
  }
413
425
  }
414
-
426
+
415
427
  $startMenu.trigger('changed');
416
428
  storeAllNecessaryCoordinates();
417
429
  };
@@ -485,4 +497,4 @@ $(function(){
485
497
  if (allTileGroups.length > 0) {
486
498
  $(allTileGroups).TileDrag({});
487
499
  }
488
- });
500
+ });
@@ -65,11 +65,14 @@ button, .button {
65
65
  color: #353535;
66
66
  margin-right: 10px;
67
67
  margin-bottom: 10px;
68
- border-raduis: 0;
68
+ border-radius: 0;
69
+ display: inline-block;
70
+ text-align: center;
71
+ vertical-align: middle;
69
72
  cursor: pointer;
70
- width: auto;
71
-
72
- .clearfix;
73
+ padding: 4px 10px;
74
+ position: relative;
75
+ outline: none;
73
76
 
74
77
  &.standart {
75
78
  min-width: 90px;
@@ -77,6 +80,8 @@ button, .button {
77
80
  }
78
81
 
79
82
  &:active, &.default:active {
83
+ //background: inherit;
84
+ //color: inherit;
80
85
  top: 1px;
81
86
  left: 1px;
82
87
  }
@@ -92,6 +97,10 @@ button, .button {
92
97
  color: #fff;
93
98
  }
94
99
 
100
+ &:hover, &.default:hover {
101
+ color: inherit;
102
+ }
103
+
95
104
  &:focus {
96
105
  outline: 0;
97
106
  border: 1px #353535 dotted;
@@ -106,6 +115,9 @@ a.button {
106
115
  &.big {
107
116
  padding: 14px 10px;
108
117
  }
118
+ &.disabled:hover {
119
+ color: #bebebe;
120
+ }
109
121
  }
110
122
 
111
123
  button, .button, .tool-button {
@@ -172,7 +184,9 @@ button, .button, .tool-button {
172
184
  img {
173
185
  width: 16px;
174
186
  height: 16px;
187
+ position: absolute;
175
188
  top: 8px;
189
+ left: 8px;
176
190
  }
177
191
  }
178
192
 
@@ -286,6 +300,7 @@ button, .button, .tool-button {
286
300
  & > .icon {
287
301
  margin-top: .25em;
288
302
  margin-bottom: .25em;
303
+ font-size: 32px;
289
304
  color: #888;
290
305
  display: block;
291
306
  float: none;
@@ -294,6 +309,7 @@ button, .button, .tool-button {
294
309
  display: block;
295
310
  font-weight: 400;
296
311
  color: #666;
312
+ background: transparent !important;
297
313
  }
298
314
 
299
315
  & > .badge {
@@ -440,4 +456,4 @@ a.shortcut {
440
456
  }
441
457
  }
442
458
  }
443
- }
459
+ }
@@ -0,0 +1,29 @@
1
+ .contextmenu {
2
+ -webkit-touch-callout: none;
3
+ -webkit-user-select: none;
4
+ -khtml-user-select: none;
5
+ -moz-user-select: none;
6
+ -ms-user-select: none;
7
+ user-select: none;
8
+ z-index:1000;
9
+ position: absolute;
10
+ background-color:#FFFFFF;
11
+ border-radius:2px;
12
+ border: 2.5px solid rgb(42,42,42);
13
+ padding: 2px;
14
+ }
15
+ .item:active {
16
+ background-color:rgb(0,0,0);
17
+ color:rgb(255,255,255);
18
+ }
19
+ .item:hover {
20
+ background-color:rgb(222,222,222);
21
+ }
22
+ .item {
23
+ background-color:#FFFFFF;
24
+ padding-right:50px;
25
+ padding-left:5px;
26
+ width:auto;
27
+ padding: 12px;
28
+ margin:-2px;
29
+ }
@@ -14,7 +14,7 @@
14
14
  left: 40%;
15
15
  min-width: 150px;
16
16
  min-height: 155px;
17
- z-index: 1000;
17
+ z-index: 1002;
18
18
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
19
19
 
20
20
  .header
@@ -48,6 +48,13 @@
48
48
  [class^="icon-"], [class*=" icon-"] {
49
49
  font-size: 11px;
50
50
  }
51
+
52
+ i
53
+ {
54
+ position: absolute;
55
+ left: 5px;
56
+ top: 6px;
57
+ }
51
58
  }
52
59
  }
53
60
 
@@ -67,6 +74,7 @@
67
74
  bottom: 0;
68
75
  width: auto;
69
76
  height: 40px;
77
+ padding: 0 10px;
70
78
  font-size: 18px;
71
79
  text-align: center;
72
80
  white-space: nowrap;
@@ -75,6 +83,16 @@
75
83
  border-left: 1px solid rgba(0, 0, 0, 0.2);
76
84
  border-right: 1px solid rgba(0, 0, 0, 0.2);
77
85
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
86
+
87
+ button
88
+ {
89
+ margin: 0 10px 0 0;
90
+ }
91
+
92
+ button:last-child
93
+ {
94
+ margin: 0;
95
+ }
78
96
  }
79
97
  }
80
98
 
@@ -86,5 +104,5 @@
86
104
  top: 0;
87
105
  left: 0;
88
106
  background-color: rgba(235, 235, 235, 0.5);
89
- z-index: 1;
107
+ z-index: 1002;
90
108
  }
@@ -277,6 +277,7 @@
277
277
  .input-control > input[type=email],
278
278
  .input-control > input[type=url],
279
279
  .input-control > input[type=phone],
280
+ .input-control > input[type=tel],
280
281
  .input-control > input[type=password],
281
282
  .input-control > input[type=number],
282
283
  .input-control > input[type=time],
@@ -308,6 +309,7 @@
308
309
  .input-control > input[type=email]::-ms-clear,
309
310
  .input-control > input[type=url]::-ms-clear,
310
311
  .input-control > input[type=phone]::-ms-clear,
312
+ .input-control > input[type=tel]::-ms-clear,
311
313
  .input-control > input[type=number]::-ms-clear,
312
314
  .input-control > input[type=time]::-ms-clear {
313
315
  display: none;
@@ -331,6 +333,7 @@
331
333
  input[type=password]:not(:focus),
332
334
  input[type=email]:not(:focus),
333
335
  input[type=phone]:not(:focus),
336
+ input[type=tel]:not(:focus),
334
337
  input[type=number]:not(:focus),
335
338
  input[type=time]:not(:focus),
336
339
  input[type=url]:not(:focus) {
@@ -343,6 +346,7 @@
343
346
  input[type=password]:focus,
344
347
  input[type=email]:focus,
345
348
  input[type=phone]:focus,
349
+ input[type=tel]:focus,
346
350
  input[type=number]:focus,
347
351
  input[type=time]:focus,
348
352
  input[type=url]:focus {
@@ -356,6 +360,7 @@
356
360
  input[type=password]:not(:focus),
357
361
  input[type=email]:not(:focus),
358
362
  input[type=phone]:not(:focus),
363
+ input[type=tel]:not(:focus),
359
364
  input[type=number]:not(:focus),
360
365
  input[type=time]:not(:focus),
361
366
  input[type=url]:not(:focus) {
@@ -180,7 +180,7 @@ a, button, .button, .page-control > ul > li {
180
180
  font-size: 32px;
181
181
  line-height: 32px;
182
182
  height: 32px;
183
- margin: 0 !important;
183
+ margin: 10px 0 0 0 !important;
184
184
  }
185
185
  }
186
186
  }
@@ -1,12 +1,3 @@
1
- /*
2
- * Metro UI CSS
3
- * (c) 2012-2013 by Sergey Pimenov
4
- * Licensed under the MIT License and Commercial
5
- *
6
- * Layout.less
7
- *
8
- */
9
-
10
1
  *, *:after, *:before {
11
2
  -webkit-box-sizing: border-box;
12
3
  -moz-box-sizing: border-box;
@@ -48,7 +39,7 @@
48
39
  height: 100%;
49
40
  min-height: 100%;
50
41
  width: 100%;
51
- .clearfix();
42
+ .clearfix;
52
43
 
53
44
  .page-header {
54
45
  width: 100%;
@@ -208,6 +199,7 @@
208
199
  top: 0;
209
200
  left: 0;
210
201
  right: 0;
202
+ z-index: 10000;
211
203
  }
212
204
 
213
205
  .page-region {
@@ -146,5 +146,12 @@
146
146
  max-width: 400px;
147
147
  float: none;
148
148
  }
149
+
150
+ .page.with-sidebar {
151
+ .page-region {
152
+ margin-left: 0;
153
+ clear: both;
154
+ }
149
155
  }
150
156
  }
157
+ }
@@ -218,12 +218,17 @@
218
218
 
219
219
  &.icon {
220
220
  & > .tile-content {
221
- img {
221
+ & > img {
222
222
  width: 48px;
223
223
  height: 48px;
224
224
  margin-left: -24px;
225
225
  margin-top: -24px;
226
226
  }
227
+
228
+ & > i {
229
+ margin-left: -24px;
230
+ font-size: 48px;
231
+ }
227
232
  }
228
233
  }
229
234
 
@@ -245,7 +250,7 @@
245
250
  margin: 5px 10px;
246
251
  }
247
252
 
248
- & > .text {
253
+ & > img ~ .text {
249
254
  left: 40px;
250
255
  right: 40px;
251
256
  font-size: 8pt;
@@ -7,8 +7,8 @@
7
7
  @import "reset.less";
8
8
 
9
9
  .metrouicss {
10
- @import "typography.less";
11
10
  @import "routines.less";
11
+ @import "typography.less";
12
12
  @import "icons.less";
13
13
  @import "colors.less";
14
14
  @import "bricks.less";
@@ -35,4 +35,6 @@
35
35
  @import "slider.less";
36
36
  @import "dialog.less";
37
37
  @import "calendar.less";
38
+ @import "contextmenu.less";
39
+ @import "pagelist.less";
38
40
  }
@@ -0,0 +1,53 @@
1
+ /*
2
+ * Metro UI CSS
3
+ * (c) 2012-2013 by Sergey Pimenov
4
+ * Licensed under the MIT License and Commercial
5
+ *
6
+ * Pagelist.less
7
+ *
8
+ */
9
+
10
+ .pagelist {
11
+ padding-bottom: 10px;
12
+ text-align: center;
13
+
14
+ .pagePrevious,
15
+ .pageNext,
16
+ .pageContent,
17
+ .pageJump {
18
+ display: inline-block;
19
+
20
+ input {
21
+ width: 32px;
22
+ height: 32px;
23
+ top: 1px;
24
+ position: relative;
25
+ border: 1px #bababa solid;
26
+ }
27
+
28
+ #pageGo {
29
+ margin: 0px;
30
+ }
31
+ }
32
+
33
+ .pageContent a {
34
+ padding-top: 4px;
35
+ }
36
+
37
+ .pagePrevious {
38
+ text-align: right;
39
+ }
40
+
41
+ .pageNext {
42
+ text-align: left;
43
+ }
44
+
45
+ a {
46
+ margin: 4px;
47
+ cursor: pointer;
48
+ }
49
+
50
+ .pageCurrent {
51
+ font-weight: bold;
52
+ }
53
+ }
@@ -55,6 +55,22 @@
55
55
  overflow: hidden;
56
56
 
57
57
 
58
+ .offset1tile {
59
+ margin-left: @tileSmall + @tileMargin *2;
60
+ }
61
+
62
+ .upset1tile {
63
+ margin-top: -1 * (@tileSmall + @tileMargin *2);
64
+ }
65
+
66
+ .offset1tile {
67
+ margin-left: @tileDouble + @tileMargin *2;
68
+ }
69
+
70
+ .upset1tile {
71
+ margin-top: -1 * (@tileDouble + @tileMargin *2);
72
+ }
73
+
58
74
  * {
59
75
  color: @white;
60
76
  }
@@ -121,11 +137,12 @@
121
137
  position: absolute;
122
138
  width: 64px;
123
139
  height: 64px;
124
- top: 50%;
140
+ top: 30%;
125
141
  left: 50%;
126
142
  margin-left: -32px;
127
- margin-top: -32px;
143
+ //margin-top: -32px;
128
144
  font-size: 64px;
145
+ -webkit-margin-before: -6px; // Workaround for webkit browsers
129
146
  }
130
147
  }
131
148
  }
@@ -305,4 +322,4 @@
305
322
 
306
323
  .tiles {
307
324
  &.scale {}
308
- }
325
+ }
metadata CHANGED
@@ -1,45 +1,49 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: metro-ui-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.15.8.14
4
+ version: 0.15.8.15
5
+ prerelease:
5
6
  platform: ruby
6
7
  authors:
7
8
  - Vilius Luneckas
8
- autorequire:
9
+ autorequire:
9
10
  bindir: bin
10
11
  cert_chain: []
11
- date: 2013-03-31 00:00:00.000000000 Z
12
+ date: 2013-09-03 00:00:00.000000000 Z
12
13
  dependencies:
13
14
  - !ruby/object:Gem::Dependency
14
15
  name: less-rails
15
- requirement: !ruby/object:Gem::Requirement
16
+ version_requirements: !ruby/object:Gem::Requirement
16
17
  requirements:
17
- - - ~>
18
+ - - '>'
18
19
  - !ruby/object:Gem::Version
19
20
  version: 2.2.3
20
- type: :runtime
21
- prerelease: false
22
- version_requirements: !ruby/object:Gem::Requirement
21
+ none: false
22
+ requirement: !ruby/object:Gem::Requirement
23
23
  requirements:
24
- - - ~>
24
+ - - '>'
25
25
  - !ruby/object:Gem::Version
26
26
  version: 2.2.3
27
+ none: false
28
+ prerelease: false
29
+ type: :runtime
27
30
  - !ruby/object:Gem::Dependency
28
31
  name: rails
29
- requirement: !ruby/object:Gem::Requirement
32
+ version_requirements: !ruby/object:Gem::Requirement
30
33
  requirements:
31
- - - ! '>='
34
+ - - '>='
32
35
  - !ruby/object:Gem::Version
33
36
  version: '3.1'
34
- type: :development
35
- prerelease: false
36
- version_requirements: !ruby/object:Gem::Requirement
37
+ none: false
38
+ requirement: !ruby/object:Gem::Requirement
37
39
  requirements:
38
- - - ! '>='
40
+ - - '>='
39
41
  - !ruby/object:Gem::Version
40
42
  version: '3.1'
41
- description: metro-ui-rails project integrates Metro-UI CSS toolkit for Rails 3.1
42
- Asset Pipeline
43
+ none: false
44
+ prerelease: false
45
+ type: :development
46
+ description: metro-ui-rails project integrates Metro-UI CSS toolkit for Rails 3.1 Asset Pipeline
43
47
  email:
44
48
  - vilius.luneckas@gmail.com
45
49
  executables: []
@@ -72,10 +76,12 @@ files:
72
76
  - vendor/assets/javascripts/metro-ui/buttonset.js
73
77
  - vendor/assets/javascripts/metro-ui/calendar.js
74
78
  - vendor/assets/javascripts/metro-ui/carousel.js
79
+ - vendor/assets/javascripts/metro-ui/contextmenu.js
75
80
  - vendor/assets/javascripts/metro-ui/dialog.js
76
81
  - vendor/assets/javascripts/metro-ui/dropdown.js
77
82
  - vendor/assets/javascripts/metro-ui/input-control.js
78
83
  - vendor/assets/javascripts/metro-ui/pagecontrol.js
84
+ - vendor/assets/javascripts/metro-ui/pagelist.js
79
85
  - vendor/assets/javascripts/metro-ui/rating.js
80
86
  - vendor/assets/javascripts/metro-ui/slider.js
81
87
  - vendor/assets/javascripts/metro-ui/start-menu.js
@@ -89,6 +95,7 @@ files:
89
95
  - vendor/toolkit/metro-ui/carousel.less
90
96
  - vendor/toolkit/metro-ui/code.less
91
97
  - vendor/toolkit/metro-ui/colors.less
98
+ - vendor/toolkit/metro-ui/contextmenu.less
92
99
  - vendor/toolkit/metro-ui/dialog.less
93
100
  - vendor/toolkit/metro-ui/forms.less
94
101
  - vendor/toolkit/metro-ui/grid.less
@@ -106,6 +113,7 @@ files:
106
113
  - vendor/toolkit/metro-ui/modern.less
107
114
  - vendor/toolkit/metro-ui/notices.less
108
115
  - vendor/toolkit/metro-ui/pagecontrol.less
116
+ - vendor/toolkit/metro-ui/pagelist.less
109
117
  - vendor/toolkit/metro-ui/progress.less
110
118
  - vendor/toolkit/metro-ui/rating.less
111
119
  - vendor/toolkit/metro-ui/reset.less
@@ -118,25 +126,26 @@ files:
118
126
  - vendor/toolkit/metro-ui/typography.less
119
127
  homepage: https://github.com/viliusluneckas/metro-ui-rails
120
128
  licenses: []
121
- metadata: {}
122
- post_install_message:
129
+ post_install_message:
123
130
  rdoc_options: []
124
131
  require_paths:
125
132
  - lib
126
133
  required_ruby_version: !ruby/object:Gem::Requirement
127
134
  requirements:
128
- - - ! '>='
135
+ - - '>='
129
136
  - !ruby/object:Gem::Version
130
137
  version: '0'
138
+ none: false
131
139
  required_rubygems_version: !ruby/object:Gem::Requirement
132
140
  requirements:
133
- - - ! '>='
141
+ - - '>='
134
142
  - !ruby/object:Gem::Version
135
143
  version: '0'
144
+ none: false
136
145
  requirements: []
137
- rubyforge_project:
138
- rubygems_version: 2.0.3
139
- signing_key:
140
- specification_version: 4
146
+ rubyforge_project:
147
+ rubygems_version: 1.8.24
148
+ signing_key:
149
+ specification_version: 3
141
150
  summary: Metro-UI CSS toolkit for Rails 3.1 Asset Pipeline
142
151
  test_files: []
checksums.yaml DELETED
@@ -1,15 +0,0 @@
1
- ---
2
- !binary "U0hBMQ==":
3
- metadata.gz: !binary |-
4
- ODdiODYxM2ZjYjE1YTYzZDE3YjE4YjlmNGY3YzUwMjViNWMyMWQ1Ng==
5
- data.tar.gz: !binary |-
6
- ZjY3YjIyOThlNjcxMTIxNzBkYTMxZDE4OWY0MzNjNGVjZWI5ZDY0Mg==
7
- !binary "U0hBNTEy":
8
- metadata.gz: !binary |-
9
- ZTZhYzgwZjEwMGEzYTE4ODM1NTViYmIwMDRiNjFkZGI0NTRmMDRjZjFlNTRk
10
- NGVmZTRmODkyMjlkZjVhMDdmMWUyM2I4Zjg4M2I2MTY4ZGExMDFjMzZiNDc3
11
- NjgyNTQwYjE4NDgzYWZiOGI4N2JmNGYxMGJjOTA3Y2JkY2IzY2Y=
12
- data.tar.gz: !binary |-
13
- Nzc1YTEwYjUwOThmZjBlODFkNWJkNzkzMDYzNGFiYWNjNGQ4NTFiZjU5YzZi
14
- MTQ4Y2YyZjQ1ZDdlMjVjYzM4YTBkZWVmOTAxYTdhYmI0NjBjMjUzMmFkNDY5
15
- MTUyODVkYzQxNTg0ZGUwMDQwMDI2MWM2NTZmMDY3MGI4YjhkMDU=