metro-ui-rails 0.15.8.13 → 0.15.8.14
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 +15 -0
- data/Rakefile +6 -4
- data/lib/generators/metro/layout/templates/layout.html.erb +1 -1
- data/lib/metro/ui/rails/version.rb +1 -1
- data/vendor/assets/fonts/metro-ui/iconFont.eot +0 -0
- data/vendor/assets/fonts/metro-ui/iconFont.svg +26 -20
- data/vendor/assets/fonts/metro-ui/iconFont.ttf +0 -0
- data/vendor/assets/fonts/metro-ui/iconFont.woff +0 -0
- data/vendor/assets/javascripts/jquery.mousewheel.min.js +84 -0
- data/vendor/assets/javascripts/metro-ui/calendar.js +557 -0
- data/vendor/assets/javascripts/metro-ui/dialog.js +1 -1
- data/vendor/assets/javascripts/metro-ui/input-control.js +3 -3
- data/vendor/assets/javascripts/metro-ui/slider.js +2 -2
- data/vendor/assets/javascripts/metro-ui/tile-drag.js +5 -1
- data/vendor/assets/javascripts/metro-ui.js +9 -7
- data/vendor/toolkit/metro-ui/accordion.less +3 -2
- data/vendor/toolkit/metro-ui/bricks.less +2 -2
- data/vendor/toolkit/metro-ui/buttons.less +26 -17
- data/vendor/toolkit/metro-ui/calendar.less +81 -0
- data/vendor/toolkit/metro-ui/cards.less +18 -12
- data/vendor/toolkit/metro-ui/carousel.less +2 -3
- data/vendor/toolkit/metro-ui/code.less +2 -2
- data/vendor/toolkit/metro-ui/colors.less +21 -5
- data/vendor/toolkit/metro-ui/dialog.less +16 -16
- data/vendor/toolkit/metro-ui/forms.less +57 -32
- data/vendor/toolkit/metro-ui/grid.less +2 -2
- data/vendor/toolkit/metro-ui/hero.less +2 -2
- data/vendor/toolkit/metro-ui/icons.less +519 -1126
- data/vendor/toolkit/metro-ui/images.less +3 -3
- data/vendor/toolkit/metro-ui/layout.less +13 -9
- data/vendor/toolkit/metro-ui/listview.less +4 -3
- data/vendor/toolkit/metro-ui/menus.less +14 -7
- data/vendor/toolkit/metro-ui/modern-responsive-max480.less +7 -4
- data/vendor/toolkit/metro-ui/modern-responsive-max767.less +8 -3
- data/vendor/toolkit/metro-ui/modern-responsive-max979.less +8 -4
- data/vendor/toolkit/metro-ui/modern-responsive-min1200.less +9 -3
- data/vendor/toolkit/metro-ui/modern-responsive.less +4 -3
- data/vendor/toolkit/metro-ui/modern.less +32 -30
- data/vendor/toolkit/metro-ui/notices.less +6 -2
- data/vendor/toolkit/metro-ui/pagecontrol.less +5 -4
- data/vendor/toolkit/metro-ui/progress.less +4 -3
- data/vendor/toolkit/metro-ui/rating.less +4 -3
- data/vendor/toolkit/metro-ui/routines.less +12 -2
- data/vendor/toolkit/metro-ui/sidebar.less +4 -3
- data/vendor/toolkit/metro-ui/slider.less +2 -2
- data/vendor/toolkit/metro-ui/tables.less +2 -2
- data/vendor/toolkit/metro-ui/theme-dark.less +3 -3
- data/vendor/toolkit/metro-ui/tiles.less +7 -2
- data/vendor/toolkit/metro-ui/typography.less +50 -11
- metadata +8 -12
@@ -0,0 +1,557 @@
|
|
1
|
+
/**
|
2
|
+
* Calendar - jQuery plugin for MetroUiCss framework
|
3
|
+
*
|
4
|
+
* this plugin required moment.js library (http://momentjs.com/)
|
5
|
+
*
|
6
|
+
* to apply this plugin to element use same code:
|
7
|
+
* <div class="calnedar"></div> or <div data-role="calendar"></div>
|
8
|
+
*
|
9
|
+
* init plugin manually
|
10
|
+
* <div id="calnedar"></div>
|
11
|
+
* $('#calendar').calendar(options)
|
12
|
+
*
|
13
|
+
* available options:
|
14
|
+
* initDate: calendar start date - the instance of moment.js library, or the string like '2013-02-18', if undefined initDate = now date
|
15
|
+
* lang: string 'en', 'ru', 'de' etc. More see here - https://github.com/timrwood/moment/blob/develop/min/langs.js
|
16
|
+
* yearButtons: if set you will see buttons to switch years
|
17
|
+
*
|
18
|
+
* handling 'date-selected' event:
|
19
|
+
* $('#calendar').on('date-selected', function(el, dateString, dateMoment){
|
20
|
+
* // some code here
|
21
|
+
* });
|
22
|
+
*
|
23
|
+
* to retrieve current calendar date in any time use this code
|
24
|
+
* $('#calendar').data('date')
|
25
|
+
* you will get the instance of moment.js library
|
26
|
+
*
|
27
|
+
* you can set any date you want by using $('#calendar').calendarSetDate('2013-03-16');
|
28
|
+
* if no argument - will sets current date
|
29
|
+
*
|
30
|
+
* you can add event on calendar by using $('#calendar').calendarSetEvent({'date': '2013-03-16', 'event': 'today my birthday'})
|
31
|
+
* or $('#calendar').calendarSetEvents([{'date': '2013-03-16', 'event': 'today my birthday'}, ...]) to add several events
|
32
|
+
* to remove events use clearEvents
|
33
|
+
* $('#calendar').calendarClearEvents('all') - will remove all events
|
34
|
+
* $('#calendar').calendarClearEvents('2013-03-16') - will remove all events for specified date
|
35
|
+
* $('#calendar').calendarClearEvents(['2013-03-16', '2013-03-17', ...]) - will remove all events for specified dates
|
36
|
+
* to get events of any date use $('#calendar').calendarGetEvents('2013-03-16')
|
37
|
+
*
|
38
|
+
*/
|
39
|
+
|
40
|
+
(function($) {
|
41
|
+
|
42
|
+
var pluginName = 'calendar',
|
43
|
+
initAllSelector = '[data-role=calendar], .calendar',
|
44
|
+
paramKeys = ['InitDate', 'Lang', 'YearButtons'];
|
45
|
+
|
46
|
+
$[pluginName] = function(element, options) {
|
47
|
+
|
48
|
+
if (!element) {
|
49
|
+
return $()[pluginName]({initAll: true});
|
50
|
+
}
|
51
|
+
|
52
|
+
// default settings
|
53
|
+
var defaults = {
|
54
|
+
initDate: false,
|
55
|
+
lang: 'en',
|
56
|
+
yearButtons: false
|
57
|
+
};
|
58
|
+
|
59
|
+
var plugin = this;
|
60
|
+
plugin.settings = {};
|
61
|
+
|
62
|
+
var $element = $(element); // reference to the jQuery version of DOM element
|
63
|
+
|
64
|
+
var $prevMonthBtn,
|
65
|
+
$nextMonthBtn,
|
66
|
+
$prevYearBtn,
|
67
|
+
$nextYearBtn,
|
68
|
+
$header,
|
69
|
+
$days = [],
|
70
|
+
calMoment,
|
71
|
+
lang,
|
72
|
+
dow,
|
73
|
+
selectedDateString,
|
74
|
+
calendarEvents = {}; // user defined calendar events, structure {'YYYY-MM-DD': ['string', 'string', ...]}
|
75
|
+
|
76
|
+
// initialization
|
77
|
+
plugin.init = function () {
|
78
|
+
plugin.settings = $.extend({}, defaults, options);
|
79
|
+
|
80
|
+
lang = plugin.settings.lang;
|
81
|
+
var date = plugin.settings.initDate;
|
82
|
+
|
83
|
+
dow = moment.langData(lang)._week.dow;
|
84
|
+
|
85
|
+
var selectedDateMoment = date ? moment(date) : moment();
|
86
|
+
selectedDateString = selectedDateMoment.format('YYYY-MM-DD');
|
87
|
+
|
88
|
+
renderCalendar();
|
89
|
+
plugin.setDate(date);
|
90
|
+
};
|
91
|
+
|
92
|
+
/**
|
93
|
+
* generate constant elements of calendar
|
94
|
+
* moment - is an object of moment.js
|
95
|
+
*/
|
96
|
+
function renderCalendar () {
|
97
|
+
var i, j, table, tr, td, mom,
|
98
|
+
yearBtns = plugin.settings.yearButtons;
|
99
|
+
|
100
|
+
table = $('<table></table>');
|
101
|
+
|
102
|
+
tr = $('<tr class="current-month"></tr>');
|
103
|
+
if (yearBtns) {
|
104
|
+
td = $('<th></th>');
|
105
|
+
$prevYearBtn = $('<a href="javascript:void(0)" class="icon-arrow-left"></a>');
|
106
|
+
td.append($prevYearBtn);
|
107
|
+
tr.append(td);
|
108
|
+
}
|
109
|
+
td = $('<th ' + (yearBtns ? '' : 'colspan="2"') + '></th>');
|
110
|
+
$prevMonthBtn = $('<a href="javascript:void(0)" class="icon-arrow-left-3"></a>');
|
111
|
+
td.append($prevMonthBtn);
|
112
|
+
tr.append(td);
|
113
|
+
$header = $('<th colspan="3"></th>');
|
114
|
+
tr.append($header);
|
115
|
+
td = $('<th ' + (yearBtns ? '' : 'colspan="2"') + '></th>');
|
116
|
+
$nextMonthBtn = $('<a href="javascript:void(0)" class="icon-arrow-right-3"></a>');
|
117
|
+
td.append($nextMonthBtn);
|
118
|
+
tr.append(td);
|
119
|
+
if (yearBtns) {
|
120
|
+
td = $('<th></th>');
|
121
|
+
$nextYearBtn = $('<a href="javascript:void(0)" class="icon-arrow-right"></a>');
|
122
|
+
td.append($nextYearBtn);
|
123
|
+
tr.append(td);
|
124
|
+
}
|
125
|
+
table.append(tr);
|
126
|
+
|
127
|
+
mom = moment().lang(lang).startOf('week').add('day', dow);
|
128
|
+
tr = $('<tr class="weekdays"></tr>');
|
129
|
+
for (i = 0; i < 7; i++) {
|
130
|
+
tr.append('<td>' + mom.format('ddd') + '</td>');
|
131
|
+
mom.add('day', 1);
|
132
|
+
}
|
133
|
+
table.append(tr);
|
134
|
+
|
135
|
+
for (i = 0; i < 6; i++) {
|
136
|
+
tr = $('<tr></tr>');
|
137
|
+
for (j = 0; j < 7; j++) {
|
138
|
+
td = $('<td></td>');
|
139
|
+
$days[i * 7 + j] = td;
|
140
|
+
tr.append(td);
|
141
|
+
}
|
142
|
+
table.append(tr);
|
143
|
+
}
|
144
|
+
|
145
|
+
$element.append(table);
|
146
|
+
|
147
|
+
// append events
|
148
|
+
$nextMonthBtn.on('mousedown', function(event){
|
149
|
+
event.stopPropagation();
|
150
|
+
calMoment.add('month', 1);
|
151
|
+
plugin.setDate(calMoment);
|
152
|
+
});
|
153
|
+
$prevMonthBtn.on('mousedown', function(event){
|
154
|
+
event.stopPropagation();
|
155
|
+
calMoment.add('month', -1);
|
156
|
+
plugin.setDate(calMoment);
|
157
|
+
});
|
158
|
+
if (yearBtns) {
|
159
|
+
$nextYearBtn.on('mousedown', function(event){
|
160
|
+
event.stopPropagation();
|
161
|
+
calMoment.add('year', 1);
|
162
|
+
plugin.setDate(calMoment);
|
163
|
+
});
|
164
|
+
$prevYearBtn.on('mousedown', function(event){
|
165
|
+
event.stopPropagation();
|
166
|
+
calMoment.add('year', -1);
|
167
|
+
plugin.setDate(calMoment);
|
168
|
+
});
|
169
|
+
}
|
170
|
+
$days.forEach(function(day){
|
171
|
+
day.on('mousedown', function(event){
|
172
|
+
event.stopPropagation();
|
173
|
+
var date = day.data('date');
|
174
|
+
if (!date) {
|
175
|
+
return;
|
176
|
+
}
|
177
|
+
calMoment = moment(date);
|
178
|
+
calMoment.lang(lang);
|
179
|
+
selectedDateString = calMoment.format('YYYY-MM-DD');
|
180
|
+
plugin.setDate(calMoment);
|
181
|
+
$element.trigger('date-selected', [date, calMoment]);
|
182
|
+
});
|
183
|
+
});
|
184
|
+
}
|
185
|
+
|
186
|
+
function fillCalendar () {
|
187
|
+
var dayIndex, date, dateStr, html;
|
188
|
+
// header
|
189
|
+
$header.text(calMoment.format('MMM YYYY'));
|
190
|
+
|
191
|
+
// this month
|
192
|
+
var thisMonthMom = calMoment.clone().startOf('month');
|
193
|
+
var daysInMonth = calMoment.daysInMonth();
|
194
|
+
var firstDayIndex = +thisMonthMom.format('d') - dow; // it also day of week index
|
195
|
+
firstDayIndex = firstDayIndex < 0 ? firstDayIndex + 7 : firstDayIndex;
|
196
|
+
var lastDayIndex = firstDayIndex + daysInMonth;
|
197
|
+
for (dayIndex = firstDayIndex; dayIndex < lastDayIndex; dayIndex++) {
|
198
|
+
date = thisMonthMom.format('D');
|
199
|
+
dateStr = thisMonthMom.format('YYYY-MM-DD');
|
200
|
+
html = date;
|
201
|
+
if (dateStr === selectedDateString) {
|
202
|
+
$days[dayIndex].prop('class', 'current-day');
|
203
|
+
} else {
|
204
|
+
$days[dayIndex].prop('class', 'current-month');
|
205
|
+
}
|
206
|
+
if (calendarEvents[dateStr]) {
|
207
|
+
$days[dayIndex].addClass('event');
|
208
|
+
$days[dayIndex].prop('title', calendarEvents[dateStr][0]);
|
209
|
+
}
|
210
|
+
$days[dayIndex].html(html);
|
211
|
+
$days[dayIndex].data('date', dateStr);
|
212
|
+
thisMonthMom.add('day', 1);
|
213
|
+
}
|
214
|
+
|
215
|
+
// prev month
|
216
|
+
var prevMonthMom = calMoment.clone().add('month', -1).endOf('month');
|
217
|
+
for (dayIndex = firstDayIndex - 1; dayIndex >= 0; dayIndex--) {
|
218
|
+
date = prevMonthMom.format('D');
|
219
|
+
dateStr = prevMonthMom.format('YYYY-MM-DD');
|
220
|
+
html = date;
|
221
|
+
$days[dayIndex].prop('class', 'out');
|
222
|
+
if (calendarEvents[dateStr]) {
|
223
|
+
$days[dayIndex].addClass('event');
|
224
|
+
$days[dayIndex].prop('title', calendarEvents[dateStr][0]);
|
225
|
+
}
|
226
|
+
$days[dayIndex].html(html);
|
227
|
+
$days[dayIndex].data('date', dateStr);
|
228
|
+
prevMonthMom.add('day', -1);
|
229
|
+
}
|
230
|
+
|
231
|
+
// next month
|
232
|
+
var nextMonthMom = calMoment.clone().add('month', 1).startOf('month');
|
233
|
+
for (dayIndex = lastDayIndex; dayIndex < 42; dayIndex++) {
|
234
|
+
date = nextMonthMom.format('D');
|
235
|
+
dateStr = nextMonthMom.format('YYYY-MM-DD');
|
236
|
+
html = date;
|
237
|
+
$days[dayIndex].prop('class', 'out');
|
238
|
+
if (calendarEvents[dateStr]) {
|
239
|
+
$days[dayIndex].addClass('event');
|
240
|
+
$days[dayIndex].prop('title', calendarEvents[dateStr][0]);
|
241
|
+
}
|
242
|
+
$days[dayIndex].html(html);
|
243
|
+
$days[dayIndex].data('date', dateStr);
|
244
|
+
nextMonthMom.add('day', 1);
|
245
|
+
}
|
246
|
+
}
|
247
|
+
|
248
|
+
|
249
|
+
// sets date
|
250
|
+
// date - string ('YYYY-MM-DD') or instance of moment.js library
|
251
|
+
plugin.setDate = function(date) {
|
252
|
+
calMoment = date ? moment(date) : moment();
|
253
|
+
calMoment.lang(lang);
|
254
|
+
$element.data('date', calMoment);
|
255
|
+
fillCalendar();
|
256
|
+
$element.trigger('date-setted', [date, calMoment]);
|
257
|
+
};
|
258
|
+
|
259
|
+
// sets event
|
260
|
+
// event - object {'date': '2013-03-01', 'text': 'any text'}
|
261
|
+
plugin.setEvent = function(event) {
|
262
|
+
var mom = event.date ? moment(event.date) : moment();
|
263
|
+
var dateStr = mom.format('YYYY-MM-DD');
|
264
|
+
if (!calendarEvents[dateStr]) {
|
265
|
+
calendarEvents[dateStr] = [];
|
266
|
+
}
|
267
|
+
calendarEvents[dateStr].push(event.text);
|
268
|
+
fillCalendar();
|
269
|
+
};
|
270
|
+
|
271
|
+
// return array of events for specified date
|
272
|
+
plugin.getEvents = function (date) {
|
273
|
+
var mom = date ? moment(date) : moment();
|
274
|
+
var dateStr = mom.format('YYYY-MM-DD');
|
275
|
+
return calendarEvents[dateStr];
|
276
|
+
}
|
277
|
+
|
278
|
+
// clearing events
|
279
|
+
// dates:
|
280
|
+
// - string - 'YYYY-MM-DD' - clearing events for this date
|
281
|
+
// - string - 'all' - clearing all events
|
282
|
+
// - array - ['YYYY-MM-DD', 'YYYY-MM-DD' ...] - clearing events of several dates
|
283
|
+
plugin.clearEvents = function (dates) {
|
284
|
+
if (dates === 'all') {
|
285
|
+
calendarEvents = {};
|
286
|
+
} else if (typeof dates === 'string') {
|
287
|
+
calendarEvents[dates] = null;
|
288
|
+
} else if (typeof dates === 'array') {
|
289
|
+
$.each(dates, function(i, date){
|
290
|
+
calendarEvents[date] = null;
|
291
|
+
});
|
292
|
+
}
|
293
|
+
fillCalendar();
|
294
|
+
};
|
295
|
+
|
296
|
+
plugin.init();
|
297
|
+
|
298
|
+
};
|
299
|
+
|
300
|
+
// sets date
|
301
|
+
$.fn[pluginName + 'SetDate'] = function(date) {
|
302
|
+
var plugin = $(this.get(0)).data(pluginName);
|
303
|
+
if (typeof plugin !== 'undefined') {
|
304
|
+
plugin.setDate(date);
|
305
|
+
}
|
306
|
+
};
|
307
|
+
// sets event
|
308
|
+
$.fn[pluginName + 'SetEvent'] = function(event) {
|
309
|
+
var plugin = $(this.get(0)).data(pluginName);
|
310
|
+
if (typeof plugin !== 'undefined') {
|
311
|
+
plugin.setEvent(event);
|
312
|
+
}
|
313
|
+
};
|
314
|
+
// set many events
|
315
|
+
$.fn[pluginName + 'SetEvents'] = function(events) {
|
316
|
+
var plugin = $(this.get(0)).data(pluginName);
|
317
|
+
if (typeof plugin !== 'undefined') {
|
318
|
+
$.each(events, function(i, event){
|
319
|
+
plugin.setEvent(event);
|
320
|
+
});
|
321
|
+
}
|
322
|
+
};
|
323
|
+
// get events
|
324
|
+
$.fn[pluginName + 'GetEvents'] = function(date) {
|
325
|
+
var plugin = $(this.get(0)).data(pluginName);
|
326
|
+
if (typeof plugin !== 'undefined') {
|
327
|
+
return plugin.getEvents(date);
|
328
|
+
}
|
329
|
+
};
|
330
|
+
// clear events for any date
|
331
|
+
$.fn[pluginName + 'ClearEvents'] = function(dates) {
|
332
|
+
var plugin = $(this.get(0)).data(pluginName);
|
333
|
+
if (typeof plugin !== 'undefined') {
|
334
|
+
plugin.clearEvents(dates);
|
335
|
+
}
|
336
|
+
};
|
337
|
+
|
338
|
+
$.fn[pluginName] = function(options) {
|
339
|
+
var elements = options && options.initAll ? $(initAllSelector) : this;
|
340
|
+
return elements.each(function() {
|
341
|
+
var that = $(this),
|
342
|
+
params = {},
|
343
|
+
plugin;
|
344
|
+
if (undefined == that.data(pluginName)) {
|
345
|
+
$.each(paramKeys, function(index, key){
|
346
|
+
params[key[0].toLowerCase() + key.slice(1)] = that.data('param' + key);
|
347
|
+
});
|
348
|
+
params = $.extend({}, params, options);
|
349
|
+
plugin = new $[pluginName](this, params);
|
350
|
+
that.data(pluginName, plugin);
|
351
|
+
}
|
352
|
+
});
|
353
|
+
};
|
354
|
+
// autoinit
|
355
|
+
$(function(){
|
356
|
+
$()[pluginName]({initAll: true});
|
357
|
+
});
|
358
|
+
|
359
|
+
})(jQuery);
|
360
|
+
|
361
|
+
|
362
|
+
/**
|
363
|
+
* datepicker plugin
|
364
|
+
*
|
365
|
+
* this plugin required moment.js library (http://momentjs.com/)
|
366
|
+
*
|
367
|
+
* to apply this plugin to element use same code:
|
368
|
+
* <div class="datepicker"></div> or <div data-role="datepicker"></div>
|
369
|
+
*
|
370
|
+
* init plugin manually
|
371
|
+
* <div id="datepicker"></div>
|
372
|
+
* $('#datepicker').datepicker(options)
|
373
|
+
*
|
374
|
+
* available options:
|
375
|
+
* initDate: calendar start date - the instance of moment.js library, or the string like '2013-02-18', if undefined initDate = now date
|
376
|
+
* lang: string 'en', 'ru', 'de' etc. More see here - https://github.com/timrwood/moment/blob/develop/min/langs.js
|
377
|
+
* yearButtons: if set you will see buttons to switch years
|
378
|
+
*
|
379
|
+
* handling 'date-selected' event:
|
380
|
+
* $('#datepicker').on('date-selected', function(el, dateString, dateMoment){
|
381
|
+
* // some code here
|
382
|
+
* });
|
383
|
+
*
|
384
|
+
* to retrieve current calendar date in any time use this code
|
385
|
+
* $('#datepicker').data('date')
|
386
|
+
* you will get the instance of moment.js library
|
387
|
+
*
|
388
|
+
* you can set any date you want by using $('#datepicker').datepickerSetDate('2013-03-16');
|
389
|
+
* if no argument - will sets current date
|
390
|
+
*
|
391
|
+
* you can add event on datepicker by using $('#datepicker').datepickerSetEvent({'date': '2013-03-16', 'event': 'today my birthday'})
|
392
|
+
* or $('#datepicker').datepickerSetEvents([{'date': '2013-03-16', 'event': 'today my birthday'}, ...]) to add several events
|
393
|
+
* to remove events use clearEvents
|
394
|
+
* $('#datepicker').datepickerClearEvents('all') - will remove all events
|
395
|
+
* $('#datepicker').datepickerClearEvents('2013-03-16') - will remove all events for specified date
|
396
|
+
* $('#datepicker').datepickerClearEvents(['2013-03-16', '2013-03-17', ...]) - will remove all events for specified dates
|
397
|
+
* to get events of any date use $('#datepicker').datepickerGetEvents('2013-03-16')
|
398
|
+
*
|
399
|
+
*/
|
400
|
+
(function($) {
|
401
|
+
|
402
|
+
var pluginName = 'datepicker',
|
403
|
+
initAllSelector = '[data-role=datepicker], .datepicker';
|
404
|
+
paramKeys = ['InitDate', 'Lang', 'YearButtons'];
|
405
|
+
|
406
|
+
$[pluginName] = function(element, options) {
|
407
|
+
|
408
|
+
if (!element) {
|
409
|
+
return $()[pluginName]({initAll: true});
|
410
|
+
}
|
411
|
+
|
412
|
+
// default settings
|
413
|
+
var defaults = {
|
414
|
+
initDate: false,
|
415
|
+
lang: 'en',
|
416
|
+
yearButtons: false
|
417
|
+
};
|
418
|
+
|
419
|
+
var plugin = this;
|
420
|
+
plugin.settings = {};
|
421
|
+
|
422
|
+
var $element = $(element); // reference to the jQuery version of DOM element
|
423
|
+
|
424
|
+
var $calendar,
|
425
|
+
$input,
|
426
|
+
$button;
|
427
|
+
|
428
|
+
// initialization
|
429
|
+
plugin.init = function () {
|
430
|
+
var settings = plugin.settings = $.extend({}, defaults, options);
|
431
|
+
|
432
|
+
$input = $element.find('input');
|
433
|
+
$button = $element.find('button');
|
434
|
+
|
435
|
+
var $calendarWrap = $('<div class="span4" style="position:relative"></div>');
|
436
|
+
$calendar = $('<div class="calendar span4" style="position:absolute;display:none;z-index:10000"></div>');
|
437
|
+
$element.data('calendar', $calendar);
|
438
|
+
$calendarWrap.append($calendar);
|
439
|
+
$element.after($calendarWrap);
|
440
|
+
$calendar.calendar({
|
441
|
+
initDate: settings.initDate,
|
442
|
+
lang: settings.lang,
|
443
|
+
yearButtons: settings.yearButtons
|
444
|
+
});
|
445
|
+
|
446
|
+
dateSelected(null, null, $calendar.data('date'));
|
447
|
+
|
448
|
+
$input.on('focus', showCalendar);
|
449
|
+
$button.on('click', showCalendar);
|
450
|
+
$element.on('mousedown', function(event){
|
451
|
+
event.stopPropagation();
|
452
|
+
});
|
453
|
+
$calendar.on('mousedown', function(event){
|
454
|
+
event.stopPropagation();
|
455
|
+
});
|
456
|
+
|
457
|
+
$calendar.on('date-selected', dateSelected);
|
458
|
+
$calendar.on('date-setted', dateSetted);
|
459
|
+
};
|
460
|
+
|
461
|
+
function showCalendar (event) {
|
462
|
+
if ($calendar.css('display') !== 'none') {
|
463
|
+
return;
|
464
|
+
}
|
465
|
+
var doc = $(document);
|
466
|
+
$calendar.css('bottom', '');
|
467
|
+
var docHeight = doc.height();
|
468
|
+
$calendar.show();
|
469
|
+
var docHeightNew = doc.height();
|
470
|
+
if (docHeight < docHeightNew) {
|
471
|
+
$calendar.css('bottom', $element.height() + 11);
|
472
|
+
}
|
473
|
+
$input.prop('disabled', true);
|
474
|
+
$(document).one('mousedown.calendar', hideCalendar);
|
475
|
+
}
|
476
|
+
|
477
|
+
function hideCalendar () {
|
478
|
+
$calendar.hide();
|
479
|
+
$input.prop('disabled', false);
|
480
|
+
$(document).off('mousedown.calendar');
|
481
|
+
$input.blur();
|
482
|
+
}
|
483
|
+
|
484
|
+
function dateSelected (event, dateString, dateMoment) {
|
485
|
+
hideCalendar();
|
486
|
+
$input.val(dateMoment.format('ll'));
|
487
|
+
$element.data('date', dateMoment);
|
488
|
+
$input.trigger('date-selected', [dateString, dateMoment]);
|
489
|
+
}
|
490
|
+
function dateSetted (event, dateString, dateMoment) {
|
491
|
+
$input.val(dateMoment.format('ll'));
|
492
|
+
$element.data('date', dateMoment);
|
493
|
+
}
|
494
|
+
|
495
|
+
plugin.init();
|
496
|
+
|
497
|
+
};
|
498
|
+
|
499
|
+
// sets date
|
500
|
+
$.fn[pluginName + 'SetDate'] = function(date) {
|
501
|
+
var $calendar = $(this.get(0)).data('calendar');
|
502
|
+
if (typeof $calendar !== 'undefined') {
|
503
|
+
$calendar.calendarSetDate(date);
|
504
|
+
}
|
505
|
+
};
|
506
|
+
// sets event
|
507
|
+
$.fn[pluginName + 'SetEvent'] = function(event) {
|
508
|
+
var $calendar = $(this.get(0)).data('calendar');
|
509
|
+
if (typeof $calendar !== 'undefined') {
|
510
|
+
$calendar.calendarSetEvent(event);
|
511
|
+
}
|
512
|
+
};
|
513
|
+
// set many events
|
514
|
+
$.fn[pluginName + 'SetEvents'] = function(events) {
|
515
|
+
var $calendar = $(this.get(0)).data('calendar');
|
516
|
+
if (typeof $calendar !== 'undefined') {
|
517
|
+
$.each(events, function(i, event){
|
518
|
+
$calendar.calendarSetEvent(event);
|
519
|
+
});
|
520
|
+
}
|
521
|
+
};
|
522
|
+
// get events
|
523
|
+
$.fn[pluginName + 'GetEvents'] = function(date) {
|
524
|
+
var $calendar = $(this.get(0)).data('calendar');
|
525
|
+
if (typeof $calendar !== 'undefined') {
|
526
|
+
return $calendar.calendarGetEvents(date);
|
527
|
+
}
|
528
|
+
};
|
529
|
+
// clear events for any date
|
530
|
+
$.fn[pluginName + 'ClearEvents'] = function(dates) {
|
531
|
+
var $calendar = $(this.get(0)).data('calendar');
|
532
|
+
if (typeof $calendar !== 'undefined') {
|
533
|
+
$calendar.calendarClearEvents(dates);
|
534
|
+
}
|
535
|
+
};
|
536
|
+
|
537
|
+
$.fn[pluginName] = function(options) {
|
538
|
+
var elements = options && options.initAll ? $(initAllSelector) : this;
|
539
|
+
return elements.each(function() {
|
540
|
+
var that = $(this),
|
541
|
+
params = {},
|
542
|
+
plugin;
|
543
|
+
if (undefined == that.data(pluginName)) {
|
544
|
+
$.each(paramKeys, function(index, key){
|
545
|
+
params[key[0].toLowerCase() + key.slice(1)] = that.data('param' + key);
|
546
|
+
});
|
547
|
+
plugin = new $[pluginName](this, params);
|
548
|
+
that.data(pluginName, plugin);
|
549
|
+
}
|
550
|
+
});
|
551
|
+
};
|
552
|
+
// autoinit
|
553
|
+
$(function(){
|
554
|
+
$()[pluginName]({initAll: true});
|
555
|
+
});
|
556
|
+
|
557
|
+
})(jQuery);
|
@@ -62,7 +62,7 @@
|
|
62
62
|
'<div id="dialogBox" class="dialog">',
|
63
63
|
'<div class="header">',
|
64
64
|
params.title,
|
65
|
-
(params.closeButton)?('<div><button><i class="icon-cancel-2"></i></button></div>'):(''),
|
65
|
+
(params.closeButton)?('<div><button class="tool-button"><i class="icon-cancel-2"></i></button></div>'):(''),
|
66
66
|
'</div>',
|
67
67
|
'<div class="content">', params.content, '</div>',
|
68
68
|
'<div class="action" id="dialogButtons">',
|
@@ -34,7 +34,7 @@
|
|
34
34
|
var initTextInput = function () {
|
35
35
|
var $helper,
|
36
36
|
input;
|
37
|
-
$helper = $element.children('.helper');
|
37
|
+
$helper = $element.children('.helper, .btn-clear');
|
38
38
|
|
39
39
|
if (!$helper.get(0)) {
|
40
40
|
return;
|
@@ -61,7 +61,7 @@
|
|
61
61
|
var $helper,
|
62
62
|
password,
|
63
63
|
text;
|
64
|
-
$helper = $element.children('.helper');
|
64
|
+
$helper = $element.children('.helper, .btn-reveal');
|
65
65
|
if (!$helper.get(0)) {
|
66
66
|
return;
|
67
67
|
}
|
@@ -107,7 +107,7 @@
|
|
107
107
|
};
|
108
108
|
// autoinit
|
109
109
|
$(function(){
|
110
|
-
|
110
|
+
$()["Input"]({initAll: true});
|
111
111
|
});
|
112
112
|
|
113
113
|
})(jQuery);
|
@@ -6,7 +6,7 @@
|
|
6
6
|
*
|
7
7
|
* you may use this code to handle events:
|
8
8
|
|
9
|
-
|
9
|
+
$(window).ready(function(){
|
10
10
|
$('.slider').on('change', function(e, val){
|
11
11
|
console.log('change to ' + val);
|
12
12
|
}).on('changed', function(e, val){
|
@@ -16,7 +16,7 @@
|
|
16
16
|
|
17
17
|
* and this, to retrieve value
|
18
18
|
|
19
|
-
|
19
|
+
$('.slider').data('value')
|
20
20
|
|
21
21
|
*
|
22
22
|
*/
|
@@ -196,7 +196,11 @@
|
|
196
196
|
if (!mouseMoved) {
|
197
197
|
// emulate default click behavior
|
198
198
|
if ($draggingTile.is('a')) {
|
199
|
-
|
199
|
+
if ($draggingTile.prop('target') === '_blank') {
|
200
|
+
window.open($draggingTile.attr('href'));
|
201
|
+
} else {
|
202
|
+
window.location.href = $draggingTile.attr('href');
|
203
|
+
}
|
200
204
|
}
|
201
205
|
} else {
|
202
206
|
event.preventDefault();
|
@@ -1,12 +1,14 @@
|
|
1
|
+
//= require jquery.mousewheel.min.js
|
2
|
+
//= require metro-ui/pagecontrol
|
1
3
|
//= require metro-ui/accordion
|
2
|
-
//= require metro-ui/
|
3
|
-
//= require metro-ui/
|
4
|
-
//= require metro-ui/dialog
|
4
|
+
//= require metro-ui/calendar
|
5
|
+
//= require metro-ui/tile-drag
|
5
6
|
//= require metro-ui/dropdown
|
7
|
+
//= require metro-ui/start-menu
|
8
|
+
//= require metro-ui/dialog
|
9
|
+
//= require metro-ui/tile-slider
|
10
|
+
//= require metro-ui/carousel
|
11
|
+
//= require metro-ui/buttonset
|
6
12
|
//= require metro-ui/input-control
|
7
|
-
//= require metro-ui/pagecontrol
|
8
13
|
//= require metro-ui/rating
|
9
14
|
//= require metro-ui/slider
|
10
|
-
//= require metro-ui/start-menu
|
11
|
-
//= require metro-ui/tile-drag
|
12
|
-
//= require metro-ui/tile-slider
|
@@ -1,9 +1,10 @@
|
|
1
1
|
/*
|
2
2
|
* Metro UI CSS
|
3
|
-
*
|
4
|
-
* Licensed under the MIT License
|
3
|
+
* (c) 2012-2013 by Sergey Pimenov
|
4
|
+
* Licensed under the MIT License and Commercial
|
5
5
|
*
|
6
6
|
* Accordion.less
|
7
|
+
*
|
7
8
|
*/
|
8
9
|
|
9
10
|
@acc-image-collapse: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHpSURBVEhLtZavT8JRFMXBGQgEg5FAYNNgIBAMBhpsEowEIpFgYLMYMBsMFht/gRNHgRn8EzDoCBY2CAQ3g4GAAz/ncUW+ym++nu3swnn3nfu47/se32BgDobDYRie8DEFozAiHXRhB9aDwWAFvjl1CqYWkDGhSDwjykgmL8QW1LgK7cEMPIA3jF/MKzTGYDBIwLYxbfJMkHMIm/B9YT4JWdiDZVa5Y/JCkBtizqXNPTXZCwa0ciXkTFoZFEoyvw/Vuh8wEEZUS8omrQ28Svh8wO8HYiy2iUu3ZRbw2MarMV6srV6tWbihywLPOH5qVUy9z8FXG/MNeD7A8y0+6xBVnOov7mFKBaJ2iHwFns+EqApot90JnQR9XAk2bRItikRUYBt+OukfoAIdFqCLzAOqrwSbNokIvl1XAOri8hWY7xM6KlCH3qPtD45hTZV2eV51KBIjfXOo5fj1iHEn8OUaNhFCTtgQeD3Cqn11FfUrdJ9fmrQ28CjAPp7agx8gpqF+VtKklSFTPHST5k3ygoEiVPUS1PlYGszTymV+ZdJ0kJCxxAZFRps0B+RoQ9VzPSjTV/4bJEZgGeoa161YwCgpM+MRWh7eWU4Vzdtzw9zXFibGCFnoXls4sO5fCrPv15Ya2i18kv4XgcAXTr+7IYi7bgIAAAAASUVORK5CYII%3D);
|