rails-active-ui 0.1.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.
Files changed (167) hide show
  1. checksums.yaml +7 -0
  2. data/Rakefile +6 -0
  3. data/app/assets/stylesheets.css +73555 -0
  4. data/app/components/accordion_component.rb +34 -0
  5. data/app/components/ad_component.rb +28 -0
  6. data/app/components/api_component.rb +24 -0
  7. data/app/components/breadcrumb_component.rb +26 -0
  8. data/app/components/button_component.rb +49 -0
  9. data/app/components/calendar_component.rb +34 -0
  10. data/app/components/card_component.rb +56 -0
  11. data/app/components/checkbox_component.rb +41 -0
  12. data/app/components/column_component.rb +62 -0
  13. data/app/components/comment_component.rb +45 -0
  14. data/app/components/concerns/alignable.rb +21 -0
  15. data/app/components/concerns/attachable.rb +16 -0
  16. data/app/components/concerns/orientable.rb +21 -0
  17. data/app/components/concerns/positionable.rb +21 -0
  18. data/app/components/concerns/sizeable.rb +18 -0
  19. data/app/components/container_component.rb +23 -0
  20. data/app/components/dimmer_component.rb +30 -0
  21. data/app/components/divider_component.rb +30 -0
  22. data/app/components/dropdown_component.rb +63 -0
  23. data/app/components/embed_component.rb +32 -0
  24. data/app/components/emoji_component.rb +15 -0
  25. data/app/components/feed_component.rb +22 -0
  26. data/app/components/flag_component.rb +15 -0
  27. data/app/components/flyout_component.rb +41 -0
  28. data/app/components/form_component.rb +39 -0
  29. data/app/components/grid_component.rb +85 -0
  30. data/app/components/h_stack_component.rb +67 -0
  31. data/app/components/header_component.rb +60 -0
  32. data/app/components/icon_component.rb +41 -0
  33. data/app/components/image_component.rb +46 -0
  34. data/app/components/input_component.rb +52 -0
  35. data/app/components/item_component.rb +39 -0
  36. data/app/components/item_group_component.rb +30 -0
  37. data/app/components/label_component.rb +49 -0
  38. data/app/components/link_component.rb +23 -0
  39. data/app/components/list_component.rb +39 -0
  40. data/app/components/loader_component.rb +33 -0
  41. data/app/components/menu_component.rb +64 -0
  42. data/app/components/menu_item_component.rb +52 -0
  43. data/app/components/message_component.rb +54 -0
  44. data/app/components/modal_component.rb +50 -0
  45. data/app/components/nag_component.rb +25 -0
  46. data/app/components/overlay_component.rb +16 -0
  47. data/app/components/placeholder_component.rb +39 -0
  48. data/app/components/popup_component.rb +31 -0
  49. data/app/components/progress_component.rb +48 -0
  50. data/app/components/pusher_component.rb +18 -0
  51. data/app/components/rail_component.rb +31 -0
  52. data/app/components/rating_component.rb +41 -0
  53. data/app/components/reset_component.rb +12 -0
  54. data/app/components/reveal_component.rb +39 -0
  55. data/app/components/row_component.rb +39 -0
  56. data/app/components/search_component.rb +44 -0
  57. data/app/components/segment_component.rb +57 -0
  58. data/app/components/segment_group_component.rb +36 -0
  59. data/app/components/shape_component.rb +25 -0
  60. data/app/components/sidebar_component.rb +33 -0
  61. data/app/components/site_component.rb +12 -0
  62. data/app/components/slider_component.rb +46 -0
  63. data/app/components/state_component.rb +25 -0
  64. data/app/components/statistic_component.rb +43 -0
  65. data/app/components/step_component.rb +56 -0
  66. data/app/components/step_group_component.rb +38 -0
  67. data/app/components/sticky_component.rb +22 -0
  68. data/app/components/sub_header_component.rb +15 -0
  69. data/app/components/sub_menu_component.rb +24 -0
  70. data/app/components/tab_component.rb +24 -0
  71. data/app/components/table_cell_component.rb +60 -0
  72. data/app/components/table_component.rb +160 -0
  73. data/app/components/table_row_component.rb +43 -0
  74. data/app/components/text_component.rb +73 -0
  75. data/app/components/toast_component.rb +36 -0
  76. data/app/components/transition_component.rb +32 -0
  77. data/app/components/v_stack_component.rb +31 -0
  78. data/app/components/visibility_component.rb +22 -0
  79. data/app/helpers/component_helper.rb +109 -0
  80. data/app/helpers/fui_helper.rb +53 -0
  81. data/app/javascript/accordion.js +547 -0
  82. data/app/javascript/accordion.min.js +11 -0
  83. data/app/javascript/api.js +1112 -0
  84. data/app/javascript/api.min.js +11 -0
  85. data/app/javascript/calendar.js +1960 -0
  86. data/app/javascript/calendar.min.js +11 -0
  87. data/app/javascript/checkbox.js +819 -0
  88. data/app/javascript/checkbox.min.js +11 -0
  89. data/app/javascript/dimmer.js +686 -0
  90. data/app/javascript/dimmer.min.js +11 -0
  91. data/app/javascript/dropdown.js +4019 -0
  92. data/app/javascript/dropdown.min.js +11 -0
  93. data/app/javascript/embed.js +646 -0
  94. data/app/javascript/embed.min.js +11 -0
  95. data/app/javascript/flyout.js +1405 -0
  96. data/app/javascript/flyout.min.js +11 -0
  97. data/app/javascript/form.js +2070 -0
  98. data/app/javascript/form.min.js +11 -0
  99. data/app/javascript/jquery.js +10716 -0
  100. data/app/javascript/jquery.min.js +2 -0
  101. data/app/javascript/modal.js +1507 -0
  102. data/app/javascript/modal.min.js +11 -0
  103. data/app/javascript/nag.js +522 -0
  104. data/app/javascript/nag.min.js +11 -0
  105. data/app/javascript/popup.js +1457 -0
  106. data/app/javascript/popup.min.js +11 -0
  107. data/app/javascript/progress.js +922 -0
  108. data/app/javascript/progress.min.js +11 -0
  109. data/app/javascript/rating.js +496 -0
  110. data/app/javascript/rating.min.js +11 -0
  111. data/app/javascript/search.js +1519 -0
  112. data/app/javascript/search.min.js +11 -0
  113. data/app/javascript/shape.js +721 -0
  114. data/app/javascript/shape.min.js +11 -0
  115. data/app/javascript/sidebar.js +952 -0
  116. data/app/javascript/sidebar.min.js +11 -0
  117. data/app/javascript/site.js +415 -0
  118. data/app/javascript/site.min.js +11 -0
  119. data/app/javascript/slider.js +1449 -0
  120. data/app/javascript/slider.min.js +11 -0
  121. data/app/javascript/state.js +653 -0
  122. data/app/javascript/state.min.js +11 -0
  123. data/app/javascript/sticky.js +852 -0
  124. data/app/javascript/sticky.min.js +11 -0
  125. data/app/javascript/tab.js +867 -0
  126. data/app/javascript/tab.min.js +11 -0
  127. data/app/javascript/toast.js +916 -0
  128. data/app/javascript/toast.min.js +11 -0
  129. data/app/javascript/transition.js +955 -0
  130. data/app/javascript/transition.min.js +11 -0
  131. data/app/javascript/ui/controllers/fui_accordion_controller.js +45 -0
  132. data/app/javascript/ui/controllers/fui_api_controller.js +80 -0
  133. data/app/javascript/ui/controllers/fui_calendar_controller.js +66 -0
  134. data/app/javascript/ui/controllers/fui_checkbox_controller.js +48 -0
  135. data/app/javascript/ui/controllers/fui_dimmer_controller.js +45 -0
  136. data/app/javascript/ui/controllers/fui_dropdown_controller.js +68 -0
  137. data/app/javascript/ui/controllers/fui_embed_controller.js +49 -0
  138. data/app/javascript/ui/controllers/fui_flyout_controller.js +49 -0
  139. data/app/javascript/ui/controllers/fui_form_controller.js +62 -0
  140. data/app/javascript/ui/controllers/fui_modal_controller.js +61 -0
  141. data/app/javascript/ui/controllers/fui_nag_controller.js +52 -0
  142. data/app/javascript/ui/controllers/fui_popup_controller.js +58 -0
  143. data/app/javascript/ui/controllers/fui_progress_controller.js +60 -0
  144. data/app/javascript/ui/controllers/fui_rating_controller.js +49 -0
  145. data/app/javascript/ui/controllers/fui_search_controller.js +76 -0
  146. data/app/javascript/ui/controllers/fui_shape_controller.js +45 -0
  147. data/app/javascript/ui/controllers/fui_sidebar_controller.js +48 -0
  148. data/app/javascript/ui/controllers/fui_site_controller.js +29 -0
  149. data/app/javascript/ui/controllers/fui_slider_controller.js +53 -0
  150. data/app/javascript/ui/controllers/fui_state_controller.js +63 -0
  151. data/app/javascript/ui/controllers/fui_sticky_controller.js +50 -0
  152. data/app/javascript/ui/controllers/fui_tab_controller.js +57 -0
  153. data/app/javascript/ui/controllers/fui_toast_controller.js +60 -0
  154. data/app/javascript/ui/controllers/fui_transition_controller.js +60 -0
  155. data/app/javascript/ui/controllers/fui_visibility_controller.js +55 -0
  156. data/app/javascript/ui/index.js +114 -0
  157. data/app/javascript/visibility.js +1196 -0
  158. data/app/javascript/visibility.min.js +11 -0
  159. data/app/lib/component.rb +63 -0
  160. data/config/importmap.rb +27 -0
  161. data/config/initializers/ruby_template_handler.rb +31 -0
  162. data/config/routes.rb +2 -0
  163. data/lib/tasks/ui_tasks.rake +4 -0
  164. data/lib/ui/engine.rb +27 -0
  165. data/lib/ui/version.rb +3 -0
  166. data/lib/ui.rb +6 -0
  167. metadata +220 -0
@@ -0,0 +1,952 @@
1
+ /*!
2
+ * # Fomantic-UI 2.9.4 - Sidebar
3
+ * https://github.com/fomantic/Fomantic-UI/
4
+ *
5
+ *
6
+ * Released under the MIT license
7
+ * https://opensource.org/licenses/MIT
8
+ *
9
+ */
10
+
11
+ (function ($, window, document) {
12
+ 'use strict';
13
+
14
+ function isFunction(obj) {
15
+ return typeof obj === 'function' && typeof obj.nodeType !== 'number';
16
+ }
17
+
18
+ window = window !== undefined && window.Math === Math
19
+ ? window
20
+ : globalThis;
21
+
22
+ $.fn.sidebar = function (...args) {
23
+ const $allModules = $(this);
24
+ const $window = $(window);
25
+ const $document = $(document);
26
+ const $body = $('body');
27
+ const $html = $('html');
28
+ const $head = $('head');
29
+
30
+ let time = Date.now();
31
+ let performance = [];
32
+
33
+ const parameters = args[0];
34
+ const methodInvoked = typeof parameters === 'string';
35
+ const queryArguments = args.slice(1);
36
+ const contextCheck = function (context, win) {
37
+ let $context;
38
+ if ([window, document].includes(context)) {
39
+ $context = $body;
40
+ } else {
41
+ $context = $(win.document).find(context);
42
+ if ($context.length === 0) {
43
+ $context = win.frameElement ? contextCheck(context, win.parent) : $body;
44
+ }
45
+ }
46
+
47
+ return $context;
48
+ };
49
+ let returnedValue;
50
+
51
+ $allModules.each(function () {
52
+ const settings = $.isPlainObject(parameters)
53
+ ? $.extend(true, {}, $.fn.sidebar.settings, parameters)
54
+ : $.extend({}, $.fn.sidebar.settings);
55
+
56
+ const selector = settings.selector;
57
+ const className = settings.className;
58
+ const namespace = settings.namespace;
59
+ const regExp = settings.regExp;
60
+ const error = settings.error;
61
+
62
+ const eventNamespace = '.' + namespace;
63
+ const moduleNamespace = 'module-' + namespace;
64
+
65
+ const $module = $(this);
66
+ let $context = contextCheck(settings.context, window);
67
+ const isBody = $context[0] === $body[0];
68
+
69
+ let $sidebars = $module.children(selector.sidebar);
70
+ let $fixed = $context.children(selector.fixed);
71
+ let $pusher = $context.children(selector.pusher);
72
+ let $style;
73
+
74
+ const element = this;
75
+ let instance = $module.data(moduleNamespace);
76
+
77
+ let elementNamespace;
78
+ let id;
79
+ let currentScroll;
80
+ let initialBodyMargin = '';
81
+ let initialBodyMarginInt = 0;
82
+ let tempBodyMargin = 0;
83
+ let hadScrollbar = false;
84
+
85
+ const module = {
86
+
87
+ initialize: function () {
88
+ module.debug('Initializing sidebar', parameters);
89
+
90
+ module.create.id();
91
+
92
+ // avoids locking rendering if initialized in onReady
93
+ if (settings.delaySetup) {
94
+ requestAnimationFrame(module.setup.layout);
95
+ } else {
96
+ module.setup.layout();
97
+ }
98
+
99
+ requestAnimationFrame(function () {
100
+ module.setup.cache();
101
+ });
102
+
103
+ module.instantiate();
104
+ },
105
+
106
+ instantiate: function () {
107
+ module.verbose('Storing instance of module', module);
108
+ instance = module;
109
+ $module
110
+ .data(moduleNamespace, module);
111
+ },
112
+
113
+ create: {
114
+ id: function () {
115
+ id = (Math.random().toString(16) + '000000000').slice(2, 10);
116
+ elementNamespace = '.' + id;
117
+ module.verbose('Creating unique id for element', id);
118
+ },
119
+ },
120
+
121
+ destroy: function () {
122
+ module.verbose('Destroying previous module for', $module);
123
+ $module
124
+ .off(eventNamespace)
125
+ .removeData(moduleNamespace);
126
+ // bound by uuid
127
+ $context.off(elementNamespace);
128
+ $window.off(elementNamespace);
129
+ $document.off(elementNamespace);
130
+ },
131
+
132
+ event: {
133
+ clickaway: function (event) {
134
+ if (settings.closable) {
135
+ const clickedInPusher = $pusher.find(event.target).length > 0 || $pusher.is(event.target);
136
+ const clickedContext = $context.is(event.target);
137
+ if (clickedInPusher) {
138
+ module.verbose('User clicked on dimmed page');
139
+ module.hide();
140
+ }
141
+ if (clickedContext) {
142
+ module.verbose('User clicked on dimmable context (scaled out page)');
143
+ module.hide();
144
+ }
145
+ }
146
+ },
147
+ touch: function (event) {
148
+ // event.stopPropagation();
149
+ },
150
+ containScroll: function (event) {
151
+ if (element.scrollTop <= 0) {
152
+ element.scrollTop = 1;
153
+ }
154
+ if ((element.scrollTop + element.offsetHeight) >= element.scrollHeight) {
155
+ element.scrollTop = element.scrollHeight - element.offsetHeight - 1;
156
+ }
157
+ },
158
+ scroll: function (event) {
159
+ if ($(event.target).closest(selector.sidebar).length === 0) {
160
+ event.preventDefault();
161
+ }
162
+ },
163
+ },
164
+
165
+ bind: {
166
+ clickaway: function () {
167
+ module.verbose('Adding clickaway events to context', $context);
168
+ $context
169
+ .on('click' + elementNamespace, module.event.clickaway)
170
+ .on('touchend' + elementNamespace, module.event.clickaway);
171
+ },
172
+ scrollLock: function () {
173
+ if (settings.scrollLock) {
174
+ module.debug('Disabling page scroll');
175
+ hadScrollbar = module.has.scrollbar();
176
+ if (hadScrollbar) {
177
+ module.save.bodyMargin();
178
+ module.set.bodyMargin();
179
+ }
180
+ $context.addClass(className.locked);
181
+ }
182
+ module.verbose('Adding events to contain sidebar scroll');
183
+ $document
184
+ .on('touchmove' + elementNamespace, module.event.touch);
185
+ $module
186
+ .on('scroll' + eventNamespace, module.event.containScroll);
187
+ },
188
+ },
189
+ unbind: {
190
+ clickaway: function () {
191
+ module.verbose('Removing clickaway events from context', $context);
192
+ $context.off(elementNamespace);
193
+ },
194
+ scrollLock: function () {
195
+ module.verbose('Removing scroll lock from page');
196
+ if (hadScrollbar) {
197
+ module.restore.bodyMargin();
198
+ }
199
+ $context.removeClass(className.locked);
200
+ $document.off(elementNamespace);
201
+ $module.off('scroll' + eventNamespace);
202
+ },
203
+ },
204
+
205
+ add: {
206
+ inlineCSS: function () {
207
+ const width = module.cache.width || $module.outerWidth();
208
+ const height = module.cache.height || $module.outerHeight();
209
+ const isRTL = module.is.rtl();
210
+ const direction = module.get.direction();
211
+ const distance = {
212
+ left: width,
213
+ right: -width,
214
+ top: height,
215
+ bottom: -height,
216
+ };
217
+ let style;
218
+
219
+ if (isRTL) {
220
+ module.verbose('RTL detected, flipping widths');
221
+ distance.left = -width;
222
+ distance.right = width;
223
+ }
224
+
225
+ style = '<style>';
226
+
227
+ if (direction === 'left' || direction === 'right') {
228
+ module.debug('Adding CSS rules for animation distance', width);
229
+ style += ''
230
+ + ' .ui.visible.' + direction + '.sidebar ~ .fixed,'
231
+ + ' .ui.visible.' + direction + '.sidebar ~ .pusher {'
232
+ + ' transform: translate3d(' + distance[direction] + 'px, 0, 0);'
233
+ + ' }';
234
+ } else if (direction === 'top' || direction === 'bottom') {
235
+ style += ''
236
+ + ' .ui.visible.' + direction + '.sidebar ~ .fixed,'
237
+ + ' .ui.visible.' + direction + '.sidebar ~ .pusher {'
238
+ + ' transform: translate3d(0, ' + distance[direction] + 'px, 0);'
239
+ + ' }';
240
+ }
241
+
242
+ style += '</style>';
243
+ $style = $(style)
244
+ .appendTo($head);
245
+ module.debug('Adding sizing css to head', $style);
246
+ },
247
+ },
248
+
249
+ refresh: function () {
250
+ module.verbose('Refreshing selector cache');
251
+ $context = contextCheck(settings.context, window);
252
+ module.refreshSidebars();
253
+ $pusher = $context.children(selector.pusher);
254
+ $fixed = $context.children(selector.fixed);
255
+ module.clear.cache();
256
+ },
257
+
258
+ refreshSidebars: function () {
259
+ module.verbose('Refreshing other sidebars');
260
+ $sidebars = $context.children(selector.sidebar);
261
+ },
262
+
263
+ repaint: function () {
264
+ module.verbose('Forcing repaint event');
265
+ element.style.display = 'none';
266
+ const ignored = element.offsetHeight;
267
+ element.scrollTop = element.scrollTop; // eslint-disable-line no-self-assign
268
+ element.style.display = '';
269
+ },
270
+
271
+ setup: {
272
+ cache: function () {
273
+ module.cache = {
274
+ width: $module.outerWidth(),
275
+ height: $module.outerHeight(),
276
+ };
277
+ },
278
+ layout: function () {
279
+ if ($context.children(selector.pusher).length === 0) {
280
+ module.debug('Adding wrapper element for sidebar');
281
+ module.error(error.pusher);
282
+ $pusher = $('<div class="pusher" />');
283
+ $context
284
+ .children()
285
+ .not(selector.omitted)
286
+ .not($sidebars)
287
+ .wrapAll($pusher);
288
+ module.refresh();
289
+ }
290
+ if ($module.nextAll(selector.pusher).length === 0 || $module.nextAll(selector.pusher)[0] !== $pusher[0]) {
291
+ module.debug('Moved sidebar to correct parent element');
292
+ module.error(error.movedSidebar, element);
293
+ $module.detach().prependTo($context);
294
+ module.refresh();
295
+ }
296
+ module.clear.cache();
297
+ module.set.pushable();
298
+ module.set.direction();
299
+ },
300
+ },
301
+
302
+ attachEvents: function (selector, event) {
303
+ const $toggle = $(selector);
304
+ event = isFunction(module[event])
305
+ ? module[event]
306
+ : module.toggle;
307
+ if ($toggle.length > 0) {
308
+ module.debug('Attaching sidebar events to element', selector, event);
309
+ $toggle
310
+ .on('click' + eventNamespace, event);
311
+ } else {
312
+ module.error(error.notFound, selector);
313
+ }
314
+ },
315
+ can: {
316
+ leftBodyScrollbar: function () {
317
+ if (module.cache.leftBodyScrollbar === undefined) {
318
+ module.cache.leftBodyScrollbar = module.is.rtl() && ((module.is.iframe && !module.is.firefox()) || module.is.safari());
319
+ }
320
+
321
+ return module.cache.leftBodyScrollbar;
322
+ },
323
+ },
324
+ save: {
325
+ bodyMargin: function () {
326
+ initialBodyMargin = $context.css((isBody ? 'margin-' : 'padding-') + (module.can.leftBodyScrollbar() ? 'left' : 'right'));
327
+ initialBodyMarginInt = Number.parseInt(initialBodyMargin.replace(/[^\d.]/g, ''), 10);
328
+ const bodyScrollbarWidth = isBody ? window.innerWidth - document.documentElement.clientWidth : $context[0].offsetWidth - $context[0].clientWidth;
329
+ tempBodyMargin = initialBodyMarginInt + bodyScrollbarWidth;
330
+ },
331
+ },
332
+ show: function (callback) {
333
+ callback = isFunction(callback)
334
+ ? callback
335
+ : function () {};
336
+ if (module.is.hidden()) {
337
+ if (settings.onShow.call(element) === false) {
338
+ module.verbose('Show callback returned false cancelling show');
339
+
340
+ return;
341
+ }
342
+ if (settings.overlay) {
343
+ module.error(error.overlay);
344
+ settings.transition = 'overlay';
345
+ }
346
+ module.refresh();
347
+ if (module.othersActive()) {
348
+ module.debug('Other sidebars currently visible');
349
+ if (settings.exclusive) {
350
+ // if not overlay, queue animation after hide
351
+ if (settings.transition !== 'overlay') {
352
+ module.hideOthers(module.show);
353
+
354
+ return;
355
+ }
356
+
357
+ module.hideOthers();
358
+ } else {
359
+ settings.transition = 'overlay';
360
+ }
361
+ }
362
+ module.set.dimmerStyles();
363
+ module.pushPage(function () {
364
+ callback.call(element);
365
+ settings.onVisible.call(element);
366
+ });
367
+ settings.onChange.call(element);
368
+ } else {
369
+ module.debug('Sidebar is already visible');
370
+ }
371
+ },
372
+
373
+ hide: function (callback) {
374
+ callback = isFunction(callback)
375
+ ? callback
376
+ : function () {};
377
+ if ((module.is.visible() || module.is.animating()) && settings.onHide.call(element) !== false) {
378
+ module.debug('Hiding sidebar', callback);
379
+ module.refreshSidebars();
380
+ module.pullPage(function () {
381
+ callback.call(element);
382
+ settings.onHidden.call(element);
383
+ });
384
+ settings.onChange.call(element);
385
+ }
386
+ },
387
+
388
+ othersAnimating: function () {
389
+ return $sidebars.not($module).filter('.' + className.animating).length > 0;
390
+ },
391
+ othersVisible: function () {
392
+ return $sidebars.not($module).filter('.' + className.visible).length > 0;
393
+ },
394
+ othersActive: function () {
395
+ return module.othersVisible() || module.othersAnimating();
396
+ },
397
+
398
+ hideOthers: function (callback = function () {}) {
399
+ const $otherSidebars = $sidebars.not($module).filter('.' + className.visible);
400
+ const sidebarCount = $otherSidebars.length;
401
+ let callbackCount = 0;
402
+ $otherSidebars
403
+ .sidebar('hide', function () {
404
+ callbackCount++;
405
+ if (callbackCount === sidebarCount && isFunction(callback)) {
406
+ callback();
407
+ }
408
+ });
409
+ },
410
+
411
+ toggle: function () {
412
+ module.verbose('Determining toggled direction');
413
+ if (module.is.hidden()) {
414
+ module.show();
415
+ } else {
416
+ module.hide();
417
+ }
418
+ },
419
+
420
+ pushPage: function (callback) {
421
+ const transition = module.get.transition();
422
+ const $transition = transition === 'overlay' || module.othersActive()
423
+ ? $module
424
+ : $pusher;
425
+ callback = isFunction(callback)
426
+ ? callback
427
+ : function () {};
428
+ if (settings.returnScroll) {
429
+ currentScroll = (isBody ? $window : $context).scrollTop();
430
+ }
431
+ if (settings.transition === 'scale down') {
432
+ module.scrollToTop();
433
+ }
434
+ module.bind.scrollLock();
435
+ module.set.transition(transition);
436
+ module.repaint();
437
+ const animate = function () {
438
+ module.bind.clickaway();
439
+ module.add.inlineCSS();
440
+ module.set.animating();
441
+ module.set.visible();
442
+ };
443
+ const dim = function () {
444
+ module.set.dimmed();
445
+ };
446
+ const transitionEnd = function (event) {
447
+ if (event.target === $transition[0]) {
448
+ $transition.off('transitionend' + elementNamespace, transitionEnd);
449
+ module.remove.animating();
450
+ callback.call(element);
451
+ }
452
+ };
453
+ $transition.off('transitionend' + elementNamespace);
454
+ $transition.on('transitionend' + elementNamespace, transitionEnd);
455
+ requestAnimationFrame(animate);
456
+ if (settings.dimPage && !module.othersVisible()) {
457
+ requestAnimationFrame(dim);
458
+ }
459
+ },
460
+
461
+ pullPage: function (callback) {
462
+ const transition = module.get.transition();
463
+ const $transition = transition === 'overlay' || module.othersActive()
464
+ ? $module
465
+ : $pusher;
466
+ callback = isFunction(callback)
467
+ ? callback
468
+ : function () {};
469
+ module.verbose('Removing context push state', module.get.direction());
470
+
471
+ module.unbind.clickaway();
472
+ module.unbind.scrollLock();
473
+
474
+ const animate = function () {
475
+ module.set.transition(transition);
476
+ module.set.animating();
477
+ if (settings.dimPage && !module.othersVisible()) {
478
+ module.set.closing();
479
+ }
480
+ module.remove.visible();
481
+ };
482
+ const transitionEnd = function (event) {
483
+ if (event.target === $transition[0]) {
484
+ $transition.off('transitionend' + elementNamespace, transitionEnd);
485
+ module.remove.animating();
486
+ module.remove.closing();
487
+ module.remove.transition();
488
+ module.remove.inlineCSS();
489
+ if (transition === 'scale down' || settings.returnScroll) {
490
+ module.scrollBack();
491
+ }
492
+ if (settings.dimPage && !module.othersVisible()) {
493
+ $pusher.removeClass(className.dimmed);
494
+ }
495
+ callback.call(element);
496
+ }
497
+ };
498
+ $transition.off('transitionend' + elementNamespace);
499
+ $transition.on('transitionend' + elementNamespace, transitionEnd);
500
+ requestAnimationFrame(animate);
501
+ },
502
+
503
+ scrollToTop: function () {
504
+ module.verbose('Scrolling to top of page to avoid animation issues');
505
+ $module.scrollTop(0);
506
+ (isBody ? $window : $context)[0].scrollTo(0, 0);
507
+ },
508
+
509
+ scrollBack: function () {
510
+ module.verbose('Scrolling back to original page position');
511
+ (isBody ? $window : $context)[0].scrollTo(0, currentScroll);
512
+ },
513
+
514
+ clear: {
515
+ cache: function () {
516
+ module.verbose('Clearing cached dimensions');
517
+ module.cache = {};
518
+ },
519
+ },
520
+
521
+ set: {
522
+ bodyMargin: function () {
523
+ const position = module.can.leftBodyScrollbar() ? 'left' : 'right';
524
+ $context.css((isBody ? 'margin-' : 'padding-') + position, tempBodyMargin + 'px');
525
+ $context.find(selector.bodyFixed.replace('right', position)).each(function () {
526
+ const el = $(this);
527
+ const attribute = el.css('position') === 'fixed' ? 'padding-' + position : position;
528
+ el.css(attribute, 'calc(' + el.css(attribute) + ' + ' + tempBodyMargin + 'px)');
529
+ });
530
+ },
531
+ dimmerStyles: function () {
532
+ if (settings.blurring) {
533
+ $pusher.addClass(className.blurring);
534
+ } else {
535
+ $pusher.removeClass(className.blurring);
536
+ }
537
+ },
538
+
539
+ // container
540
+ pushed: function () {
541
+ $context.addClass(className.pushed);
542
+ },
543
+ pushable: function () {
544
+ $context.addClass(className.pushable);
545
+ },
546
+
547
+ // pusher
548
+ dimmed: function () {
549
+ $pusher.addClass(className.dimmed);
550
+ },
551
+
552
+ // sidebar
553
+ active: function () {
554
+ $module.addClass(className.active);
555
+ },
556
+ animating: function () {
557
+ $module.addClass(className.animating);
558
+ },
559
+ closing: function () {
560
+ $pusher.addClass(className.closing);
561
+ },
562
+ transition: function (transition = module.get.transition()) {
563
+ $module.addClass(transition);
564
+ },
565
+ direction: function (direction = module.get.direction()) {
566
+ $module.addClass(className[direction]);
567
+ },
568
+ visible: function () {
569
+ $module.addClass(className.visible);
570
+ },
571
+ overlay: function () {
572
+ $module.addClass(className.overlay);
573
+ },
574
+ },
575
+ remove: {
576
+
577
+ inlineCSS: function () {
578
+ module.debug('Removing inline css styles', $style);
579
+ if ($style && $style.length > 0) {
580
+ $style.remove();
581
+ }
582
+ },
583
+
584
+ // context
585
+ pushed: function () {
586
+ $context.removeClass(className.pushed);
587
+ },
588
+ pushable: function () {
589
+ $context.removeClass(className.pushable);
590
+ },
591
+
592
+ // sidebar
593
+ active: function () {
594
+ $module.removeClass(className.active);
595
+ },
596
+ animating: function () {
597
+ $module.removeClass(className.animating);
598
+ },
599
+ closing: function () {
600
+ $pusher.removeClass(className.closing);
601
+ },
602
+ transition: function (transition = module.get.transition()) {
603
+ $module.removeClass(transition);
604
+ },
605
+ direction: function (direction = module.get.direction()) {
606
+ $module.removeClass(className[direction]);
607
+ },
608
+ visible: function () {
609
+ $module.removeClass(className.visible);
610
+ },
611
+ overlay: function () {
612
+ $module.removeClass(className.overlay);
613
+ },
614
+ },
615
+ restore: {
616
+ bodyMargin: function () {
617
+ const position = module.can.leftBodyScrollbar() ? 'left' : 'right';
618
+ $context.css((isBody ? 'margin-' : 'padding-') + position, initialBodyMarginInt === 0 ? '' : initialBodyMargin);
619
+ $context.find(selector.bodyFixed.replace('right', position)).each(function () {
620
+ const el = $(this);
621
+ const attribute = el.css('position') === 'fixed' ? 'padding-' + position : position;
622
+ el.css(attribute, '');
623
+ });
624
+ },
625
+ },
626
+ get: {
627
+ direction: function () {
628
+ if ($module.hasClass(className.top)) {
629
+ return className.top;
630
+ }
631
+ if ($module.hasClass(className.right)) {
632
+ return className.right;
633
+ }
634
+ if ($module.hasClass(className.bottom)) {
635
+ return className.bottom;
636
+ }
637
+
638
+ return className.left;
639
+ },
640
+ transition: function () {
641
+ const direction = module.get.direction();
642
+ const transition = module.is.mobile()
643
+ ? (settings.mobileTransition === 'auto'
644
+ ? settings.defaultTransition.mobile[direction]
645
+ : settings.mobileTransition)
646
+ : (settings.transition === 'auto'
647
+ ? settings.defaultTransition.computer[direction]
648
+ : settings.transition);
649
+ module.verbose('Determined transition', transition);
650
+
651
+ return transition;
652
+ },
653
+ },
654
+ has: {
655
+ scrollbar: function () {
656
+ return isBody || $context.css('overflow-y') !== 'hidden';
657
+ },
658
+ },
659
+ is: {
660
+ safari: function () {
661
+ if (module.cache.isSafari === undefined) {
662
+ module.cache.isSafari = /constructor/i.test(window.HTMLElement) || !!window.ApplePaySession;
663
+ }
664
+
665
+ return module.cache.isSafari;
666
+ },
667
+ firefox: function () {
668
+ if (module.cache.isFirefox === undefined) {
669
+ module.cache.isFirefox = !!window.InstallTrigger;
670
+ }
671
+
672
+ return module.cache.isFirefox;
673
+ },
674
+ iframe: function () {
675
+ return !(window.self === window.top);
676
+ },
677
+ mobile: function () {
678
+ const userAgent = navigator.userAgent;
679
+ const isMobile = userAgent.match(regExp.mobile);
680
+ if (isMobile) {
681
+ module.verbose('Browser was found to be mobile', userAgent);
682
+
683
+ return true;
684
+ }
685
+
686
+ module.verbose('Browser is not mobile, using regular transition', userAgent);
687
+
688
+ return false;
689
+ },
690
+ hidden: function () {
691
+ return !module.is.visible();
692
+ },
693
+ visible: function () {
694
+ return $module.hasClass(className.visible);
695
+ },
696
+ // alias
697
+ open: function () {
698
+ return module.is.visible();
699
+ },
700
+ closed: function () {
701
+ return module.is.hidden();
702
+ },
703
+ vertical: function () {
704
+ return $module.hasClass(className.top);
705
+ },
706
+ animating: function () {
707
+ return $context.hasClass(className.animating);
708
+ },
709
+ rtl: function () {
710
+ if (module.cache.isRTL === undefined) {
711
+ module.cache.isRTL = $module.attr('dir') === 'rtl' || $module.css('direction') === 'rtl' || $body.attr('dir') === 'rtl' || $body.css('direction') === 'rtl' || $context.attr('dir') === 'rtl' || $context.css('direction') === 'rtl';
712
+ }
713
+
714
+ return module.cache.isRTL;
715
+ },
716
+ },
717
+
718
+ setting: function (name, value) {
719
+ module.debug('Changing setting', name, value);
720
+ if ($.isPlainObject(name)) {
721
+ $.extend(true, settings, name);
722
+ } else if (value !== undefined) {
723
+ if ($.isPlainObject(settings[name])) {
724
+ $.extend(true, settings[name], value);
725
+ } else {
726
+ settings[name] = value;
727
+ }
728
+ } else {
729
+ return settings[name];
730
+ }
731
+ },
732
+ internal: function (name, value) {
733
+ if ($.isPlainObject(name)) {
734
+ $.extend(true, module, name);
735
+ } else if (value !== undefined) {
736
+ module[name] = value;
737
+ } else {
738
+ return module[name];
739
+ }
740
+ },
741
+ debug: function (...args) {
742
+ if (!settings.silent && settings.debug) {
743
+ if (settings.performance) {
744
+ module.performance.log(args);
745
+ } else {
746
+ module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':');
747
+ module.debug.apply(console, args);
748
+ }
749
+ }
750
+ },
751
+ verbose: function (...args) {
752
+ if (!settings.silent && settings.verbose && settings.debug) {
753
+ if (settings.performance) {
754
+ module.performance.log(args);
755
+ } else {
756
+ module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':');
757
+ module.verbose.apply(console, args);
758
+ }
759
+ }
760
+ },
761
+ error: function (...args) {
762
+ if (!settings.silent) {
763
+ module.error = Function.prototype.bind.call(console.error, console, settings.name + ':');
764
+ module.error.apply(console, args);
765
+ }
766
+ },
767
+ performance: {
768
+ log: function (message) {
769
+ let currentTime;
770
+ let executionTime;
771
+ let previousTime;
772
+ if (settings.performance) {
773
+ currentTime = Date.now();
774
+ previousTime = time || currentTime;
775
+ executionTime = currentTime - previousTime;
776
+ time = currentTime;
777
+ performance.push({
778
+ Name: message[0],
779
+ Arguments: message.slice(1),
780
+ Element: element,
781
+ 'Execution Time': executionTime,
782
+ });
783
+ }
784
+ clearTimeout(module.performance.timer);
785
+ module.performance.timer = setTimeout(function () {
786
+ module.performance.display();
787
+ }, 500);
788
+ },
789
+ display: function () {
790
+ let title = settings.name + ':';
791
+ let totalTime = 0;
792
+ time = false;
793
+ clearTimeout(module.performance.timer);
794
+ $.each(performance, function (index, data) {
795
+ totalTime += data['Execution Time'];
796
+ });
797
+ title += ' ' + totalTime + 'ms';
798
+ if (performance.length > 0) {
799
+ console.groupCollapsed(title);
800
+ console.table(performance);
801
+ console.groupEnd();
802
+ }
803
+ performance = [];
804
+ },
805
+ },
806
+ invoke: function (query, passedArguments = queryArguments, context = element) {
807
+ let object = instance;
808
+ let maxDepth;
809
+ let found;
810
+ let response;
811
+ if (typeof query === 'string' && object !== undefined) {
812
+ query = query.split(/[ .]/);
813
+ maxDepth = query.length - 1;
814
+ $.each(query, function (depth, value) {
815
+ const camelCaseValue = depth !== maxDepth
816
+ ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
817
+ : query;
818
+ if ($.isPlainObject(object[camelCaseValue]) && (depth !== maxDepth)) {
819
+ object = object[camelCaseValue];
820
+ } else if (object[camelCaseValue] !== undefined) {
821
+ found = object[camelCaseValue];
822
+
823
+ return false;
824
+ } else if ($.isPlainObject(object[value]) && (depth !== maxDepth)) {
825
+ object = object[value];
826
+ } else if (object[value] !== undefined) {
827
+ found = object[value];
828
+
829
+ return false;
830
+ } else {
831
+ module.error(error.method, query);
832
+
833
+ return false;
834
+ }
835
+ });
836
+ }
837
+ if (isFunction(found)) {
838
+ response = found.apply(context, passedArguments);
839
+ } else if (found !== undefined) {
840
+ response = found;
841
+ }
842
+ if (Array.isArray(returnedValue)) {
843
+ returnedValue.push(response);
844
+ } else if (returnedValue !== undefined) {
845
+ returnedValue = [returnedValue, response];
846
+ } else if (response !== undefined) {
847
+ returnedValue = response;
848
+ }
849
+
850
+ return found;
851
+ },
852
+ };
853
+
854
+ if (methodInvoked) {
855
+ if (instance === undefined) {
856
+ module.initialize();
857
+ }
858
+ module.invoke(parameters);
859
+ } else {
860
+ if (instance !== undefined) {
861
+ module.invoke('destroy');
862
+ }
863
+ module.initialize();
864
+ }
865
+ });
866
+
867
+ return returnedValue !== undefined
868
+ ? returnedValue
869
+ : this;
870
+ };
871
+
872
+ $.fn.sidebar.settings = {
873
+
874
+ name: 'Sidebar',
875
+ namespace: 'sidebar',
876
+
877
+ silent: false,
878
+ debug: false,
879
+ verbose: false,
880
+ performance: true,
881
+
882
+ transition: 'auto',
883
+ mobileTransition: 'auto',
884
+
885
+ defaultTransition: {
886
+ computer: {
887
+ left: 'uncover',
888
+ right: 'uncover',
889
+ top: 'overlay',
890
+ bottom: 'overlay',
891
+ },
892
+ mobile: {
893
+ left: 'uncover',
894
+ right: 'uncover',
895
+ top: 'overlay',
896
+ bottom: 'overlay',
897
+ },
898
+ },
899
+
900
+ context: 'body',
901
+ exclusive: false,
902
+ closable: true,
903
+ dimPage: true,
904
+ scrollLock: false,
905
+ returnScroll: false,
906
+ delaySetup: false,
907
+
908
+ onChange: function () {},
909
+ onShow: function () {},
910
+ onHide: function () {},
911
+
912
+ onHidden: function () {},
913
+ onVisible: function () {},
914
+
915
+ className: {
916
+ active: 'active',
917
+ animating: 'animating',
918
+ blurring: 'blurring',
919
+ closing: 'closing',
920
+ dimmed: 'dimmed',
921
+ locked: 'locked',
922
+ pushable: 'pushable',
923
+ pushed: 'pushed',
924
+ right: 'right',
925
+ top: 'top',
926
+ left: 'left',
927
+ bottom: 'bottom',
928
+ visible: 'visible',
929
+ },
930
+
931
+ selector: {
932
+ bodyFixed: '> .ui.fixed.menu, > .ui.right.toast-container, > .ui.right.sidebar, > .ui.fixed.nag, > .ui.fixed.nag > .close',
933
+ fixed: '.fixed',
934
+ omitted: 'script, link, style, .ui.modal, .ui.dimmer, .ui.nag, .ui.fixed',
935
+ pusher: '.pusher',
936
+ sidebar: '.ui.sidebar',
937
+ },
938
+
939
+ regExp: {
940
+ mobile: /Mobile|iP(hone|od|ad)|Android|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/g,
941
+ },
942
+
943
+ error: {
944
+ method: 'The method you called is not defined.',
945
+ pusher: 'Had to add pusher element. For optimal performance make sure body content is inside a pusher element',
946
+ movedSidebar: 'Had to move sidebar. For optimal performance make sure sidebar and pusher are direct children of your body tag',
947
+ overlay: 'The overlay setting is no longer supported, use animation: overlay',
948
+ notFound: 'There were no elements that matched the specified selector',
949
+ },
950
+
951
+ };
952
+ })(jQuery, window, document);