From 4101916d14897e407be5ed0c0e276f9b8041ee1a Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Thu, 11 Jun 2020 15:34:44 +0300 Subject: [PATCH] Switch to String constants Should result in better compression (aprox. -10% from the compressed adminlte.min.js) and should be easier to see unused/undefined variables on lint stage. --- .bundlewatch.config.json | 2 +- build/js/CardRefresh.js | 34 ++++----- build/js/CardWidget.js | 100 +++++++++++++------------- build/js/ControlSidebar.js | 136 +++++++++++++++++------------------- build/js/DirectChat.js | 20 ++---- build/js/Dropdown.js | 25 +++---- build/js/ExpandableTable.js | 46 ++++++------ build/js/Layout.js | 66 ++++++++--------- build/js/PushMenu.js | 82 ++++++++++------------ build/js/SiteSearch.js | 36 +++++----- build/js/Toasts.js | 78 ++++++++++----------- build/js/TodoList.js | 17 ++--- build/js/Treeview.js | 70 +++++++++---------- 13 files changed, 323 insertions(+), 389 deletions(-) diff --git a/.bundlewatch.config.json b/.bundlewatch.config.json index 3c2d01de1..292da376b 100644 --- a/.bundlewatch.config.json +++ b/.bundlewatch.config.json @@ -54,7 +54,7 @@ }, { "path": "./dist/js/adminlte.min.js", - "maxSize": "7 kB" + "maxSize": "6.5 kB" } ] } diff --git a/build/js/CardRefresh.js b/build/js/CardRefresh.js index b0dd9cefe..d0671edc1 100644 --- a/build/js/CardRefresh.js +++ b/build/js/CardRefresh.js @@ -17,26 +17,20 @@ const DATA_KEY = 'lte.cardrefresh' const EVENT_KEY = `.${DATA_KEY}` const JQUERY_NO_CONFLICT = $.fn[NAME] -const Event = { - LOADED: `loaded${EVENT_KEY}`, - OVERLAY_ADDED: `overlay.added${EVENT_KEY}`, - OVERLAY_REMOVED: `overlay.removed${EVENT_KEY}` -} +const EVENT_LOADED = `loaded${EVENT_KEY}` +const EVENT_OVERLAY_ADDED = `overlay.added${EVENT_KEY}` +const EVENT_OVERLAY_REMOVED = `overlay.removed${EVENT_KEY}` -const ClassName = { - CARD: 'card' -} +const CLASS_NAME_CARD = 'card' -const Selector = { - CARD: `.${ClassName.CARD}`, - DATA_REFRESH: '[data-card-widget="card-refresh"]' -} +const SELECTOR_CARD = `.${CLASS_NAME_CARD}` +const SELECTOR_DATA_REFRESH = '[data-card-widget="card-refresh"]' const Default = { source: '', sourceSelector: '', params: {}, - trigger: Selector.DATA_REFRESH, + trigger: SELECTOR_DATA_REFRESH, content: '.card-body', loadInContent: true, loadOnInit: true, @@ -52,11 +46,11 @@ const Default = { class CardRefresh { constructor(element, settings) { this._element = element - this._parent = element.parents(Selector.CARD).first() + this._parent = element.parents(SELECTOR_CARD).first() this._settings = $.extend({}, Default, settings) this._overlay = $(this._settings.overlayTemplate) - if (element.hasClass(ClassName.CARD)) { + if (element.hasClass(CLASS_NAME_CARD)) { this._parent = element } @@ -82,17 +76,17 @@ class CardRefresh { this._removeOverlay() }, this._settings.responseType !== '' && this._settings.responseType) - $(this._element).trigger($.Event(Event.LOADED)) + $(this._element).trigger($.Event(EVENT_LOADED)) } _addOverlay() { this._parent.append(this._overlay) - $(this._element).trigger($.Event(Event.OVERLAY_ADDED)) + $(this._element).trigger($.Event(EVENT_OVERLAY_ADDED)) } _removeOverlay() { this._parent.find(this._overlay).remove() - $(this._element).trigger($.Event(Event.OVERLAY_REMOVED)) + $(this._element).trigger($.Event(EVENT_OVERLAY_REMOVED)) } // Private @@ -131,7 +125,7 @@ class CardRefresh { * ==================================================== */ -$(document).on('click', Selector.DATA_REFRESH, function (event) { +$(document).on('click', SELECTOR_DATA_REFRESH, function (event) { if (event) { event.preventDefault() } @@ -140,7 +134,7 @@ $(document).on('click', Selector.DATA_REFRESH, function (event) { }) $(() => { - $(Selector.DATA_REFRESH).each(function () { + $(SELECTOR_DATA_REFRESH).each(function () { CardRefresh._jQueryInterface.call($(this)) }) }) diff --git a/build/js/CardWidget.js b/build/js/CardWidget.js index 924aba78e..5a62a8beb 100644 --- a/build/js/CardWidget.js +++ b/build/js/CardWidget.js @@ -17,38 +17,32 @@ const DATA_KEY = 'lte.cardwidget' const EVENT_KEY = `.${DATA_KEY}` const JQUERY_NO_CONFLICT = $.fn[NAME] -const Event = { - EXPANDED: `expanded${EVENT_KEY}`, - COLLAPSED: `collapsed${EVENT_KEY}`, - MAXIMIZED: `maximized${EVENT_KEY}`, - MINIMIZED: `minimized${EVENT_KEY}`, - REMOVED: `removed${EVENT_KEY}` -} +const EVENT_EXPANDED = `expanded${EVENT_KEY}` +const EVENT_COLLAPSED = `collapsed${EVENT_KEY}` +const EVENT_MAXIMIZED = `maximized${EVENT_KEY}` +const EVENT_MINIMIZED = `minimized${EVENT_KEY}` +const EVENT_REMOVED = `removed${EVENT_KEY}` -const ClassName = { - CARD: 'card', - COLLAPSED: 'collapsed-card', - COLLAPSING: 'collapsing-card', - EXPANDING: 'expanding-card', - WAS_COLLAPSED: 'was-collapsed', - MAXIMIZED: 'maximized-card' -} +const CLASS_NAME_CARD = 'card' +const CLASS_NAME_COLLAPSED = 'collapsed-card' +const CLASS_NAME_COLLAPSING = 'collapsing-card' +const CLASS_NAME_EXPANDING = 'expanding-card' +const CLASS_NAME_WAS_COLLAPSED = 'was-collapsed' +const CLASS_NAME_MAXIMIZED = 'maximized-card' -const Selector = { - DATA_REMOVE: '[data-card-widget="remove"]', - DATA_COLLAPSE: '[data-card-widget="collapse"]', - DATA_MAXIMIZE: '[data-card-widget="maximize"]', - CARD: `.${ClassName.CARD}`, - CARD_HEADER: '.card-header', - CARD_BODY: '.card-body', - CARD_FOOTER: '.card-footer' -} +const SELECTOR_DATA_REMOVE = '[data-card-widget="remove"]' +const SELECTOR_DATA_COLLAPSE = '[data-card-widget="collapse"]' +const SELECTOR_DATA_MAXIMIZE = '[data-card-widget="maximize"]' +const SELECTOR_CARD = `.${CLASS_NAME_CARD}` +const SELECTOR_CARD_HEADER = '.card-header' +const SELECTOR_CARD_BODY = '.card-body' +const SELECTOR_CARD_FOOTER = '.card-footer' const Default = { animationSpeed: 'normal', - collapseTrigger: Selector.DATA_COLLAPSE, - removeTrigger: Selector.DATA_REMOVE, - maximizeTrigger: Selector.DATA_MAXIMIZE, + collapseTrigger: SELECTOR_DATA_COLLAPSE, + removeTrigger: SELECTOR_DATA_REMOVE, + maximizeTrigger: SELECTOR_DATA_MAXIMIZE, collapseIcon: 'fa-minus', expandIcon: 'fa-plus', maximizeIcon: 'fa-expand', @@ -58,9 +52,9 @@ const Default = { class CardWidget { constructor(element, settings) { this._element = element - this._parent = element.parents(Selector.CARD).first() + this._parent = element.parents(SELECTOR_CARD).first() - if (element.hasClass(ClassName.CARD)) { + if (element.hasClass(CLASS_NAME_CARD)) { this._parent = element } @@ -68,38 +62,38 @@ class CardWidget { } collapse() { - this._parent.addClass(ClassName.COLLAPSING).children(`${Selector.CARD_BODY}, ${Selector.CARD_FOOTER}`) + this._parent.addClass(CLASS_NAME_COLLAPSING).children(`${SELECTOR_CARD_BODY}, ${SELECTOR_CARD_FOOTER}`) .slideUp(this._settings.animationSpeed, () => { - this._parent.addClass(ClassName.COLLAPSED).removeClass(ClassName.COLLAPSING) + this._parent.addClass(CLASS_NAME_COLLAPSED).removeClass(CLASS_NAME_COLLAPSING) }) - this._parent.find('> ' + Selector.CARD_HEADER + ' ' + this._settings.collapseTrigger + ' .' + this._settings.collapseIcon) + this._parent.find('> ' + SELECTOR_CARD_HEADER + ' ' + this._settings.collapseTrigger + ' .' + this._settings.collapseIcon) .addClass(this._settings.expandIcon) .removeClass(this._settings.collapseIcon) - this._element.trigger($.Event(Event.COLLAPSED), this._parent) + this._element.trigger($.Event(EVENT_COLLAPSED), this._parent) } expand() { - this._parent.addClass(ClassName.EXPANDING).children(`${Selector.CARD_BODY}, ${Selector.CARD_FOOTER}`) + this._parent.addClass(CLASS_NAME_EXPANDING).children(`${SELECTOR_CARD_BODY}, ${SELECTOR_CARD_FOOTER}`) .slideDown(this._settings.animationSpeed, () => { - this._parent.removeClass(ClassName.COLLAPSED).removeClass(ClassName.EXPANDING) + this._parent.removeClass(CLASS_NAME_COLLAPSED).removeClass(CLASS_NAME_EXPANDING) }) - this._parent.find('> ' + Selector.CARD_HEADER + ' ' + this._settings.collapseTrigger + ' .' + this._settings.expandIcon) + this._parent.find('> ' + SELECTOR_CARD_HEADER + ' ' + this._settings.collapseTrigger + ' .' + this._settings.expandIcon) .addClass(this._settings.collapseIcon) .removeClass(this._settings.expandIcon) - this._element.trigger($.Event(Event.EXPANDED), this._parent) + this._element.trigger($.Event(EVENT_EXPANDED), this._parent) } remove() { this._parent.slideUp() - this._element.trigger($.Event(Event.REMOVED), this._parent) + this._element.trigger($.Event(EVENT_REMOVED), this._parent) } toggle() { - if (this._parent.hasClass(ClassName.COLLAPSED)) { + if (this._parent.hasClass(CLASS_NAME_COLLAPSED)) { this.expand() return } @@ -118,16 +112,16 @@ class CardWidget { }).delay(150).queue(function () { const $element = $(this) - $element.addClass(ClassName.MAXIMIZED) - $('html').addClass(ClassName.MAXIMIZED) - if ($element.hasClass(ClassName.COLLAPSED)) { - $element.addClass(ClassName.WAS_COLLAPSED) + $element.addClass(CLASS_NAME_MAXIMIZED) + $('html').addClass(CLASS_NAME_MAXIMIZED) + if ($element.hasClass(CLASS_NAME_COLLAPSED)) { + $element.addClass(CLASS_NAME_WAS_COLLAPSED) } $element.dequeue() }) - this._element.trigger($.Event(Event.MAXIMIZED), this._parent) + this._element.trigger($.Event(EVENT_MAXIMIZED), this._parent) } minimize() { @@ -139,24 +133,24 @@ class CardWidget { ).delay(10).queue(function () { const $element = $(this) - $element.removeClass(ClassName.MAXIMIZED) - $('html').removeClass(ClassName.MAXIMIZED) + $element.removeClass(CLASS_NAME_MAXIMIZED) + $('html').removeClass(CLASS_NAME_MAXIMIZED) $element.css({ height: 'inherit', width: 'inherit' }) - if ($element.hasClass(ClassName.WAS_COLLAPSED)) { - $element.removeClass(ClassName.WAS_COLLAPSED) + if ($element.hasClass(CLASS_NAME_WAS_COLLAPSED)) { + $element.removeClass(CLASS_NAME_WAS_COLLAPSED) } $element.dequeue() }) - this._element.trigger($.Event(Event.MINIMIZED), this._parent) + this._element.trigger($.Event(EVENT_MINIMIZED), this._parent) } toggleMaximize() { - if (this._parent.hasClass(ClassName.MAXIMIZED)) { + if (this._parent.hasClass(CLASS_NAME_MAXIMIZED)) { this.minimize() return } @@ -206,7 +200,7 @@ class CardWidget { * ==================================================== */ -$(document).on('click', Selector.DATA_COLLAPSE, function (event) { +$(document).on('click', SELECTOR_DATA_COLLAPSE, function (event) { if (event) { event.preventDefault() } @@ -214,7 +208,7 @@ $(document).on('click', Selector.DATA_COLLAPSE, function (event) { CardWidget._jQueryInterface.call($(this), 'toggle') }) -$(document).on('click', Selector.DATA_REMOVE, function (event) { +$(document).on('click', SELECTOR_DATA_REMOVE, function (event) { if (event) { event.preventDefault() } @@ -222,7 +216,7 @@ $(document).on('click', Selector.DATA_REMOVE, function (event) { CardWidget._jQueryInterface.call($(this), 'remove') }) -$(document).on('click', Selector.DATA_MAXIMIZE, function (event) { +$(document).on('click', SELECTOR_DATA_MAXIMIZE, function (event) { if (event) { event.preventDefault() } diff --git a/build/js/ControlSidebar.js b/build/js/ControlSidebar.js index b87798adc..06bc94863 100644 --- a/build/js/ControlSidebar.js +++ b/build/js/ControlSidebar.js @@ -17,35 +17,29 @@ const DATA_KEY = 'lte.controlsidebar' const EVENT_KEY = `.${DATA_KEY}` const JQUERY_NO_CONFLICT = $.fn[NAME] -const Event = { - COLLAPSED: `collapsed${EVENT_KEY}`, - EXPANDED: `expanded${EVENT_KEY}` -} +const EVENT_COLLAPSED = `collapsed${EVENT_KEY}` +const EVENT_EXPANDED = `expanded${EVENT_KEY}` -const Selector = { - CONTROL_SIDEBAR: '.control-sidebar', - CONTROL_SIDEBAR_CONTENT: '.control-sidebar-content', - DATA_TOGGLE: '[data-widget="control-sidebar"]', - HEADER: '.main-header', - FOOTER: '.main-footer' -} +const SELECTOR_CONTROL_SIDEBAR = '.control-sidebar' +const SELECTOR_CONTROL_SIDEBAR_CONTENT = '.control-sidebar-content' +const SELECTOR_DATA_TOGGLE = '[data-widget="control-sidebar"]' +const SELECTOR_HEADER = '.main-header' +const SELECTOR_FOOTER = '.main-footer' -const ClassName = { - CONTROL_SIDEBAR_ANIMATE: 'control-sidebar-animate', - CONTROL_SIDEBAR_OPEN: 'control-sidebar-open', - CONTROL_SIDEBAR_SLIDE: 'control-sidebar-slide-open', - LAYOUT_FIXED: 'layout-fixed', - NAVBAR_FIXED: 'layout-navbar-fixed', - NAVBAR_SM_FIXED: 'layout-sm-navbar-fixed', - NAVBAR_MD_FIXED: 'layout-md-navbar-fixed', - NAVBAR_LG_FIXED: 'layout-lg-navbar-fixed', - NAVBAR_XL_FIXED: 'layout-xl-navbar-fixed', - FOOTER_FIXED: 'layout-footer-fixed', - FOOTER_SM_FIXED: 'layout-sm-footer-fixed', - FOOTER_MD_FIXED: 'layout-md-footer-fixed', - FOOTER_LG_FIXED: 'layout-lg-footer-fixed', - FOOTER_XL_FIXED: 'layout-xl-footer-fixed' -} +const CLASS_NAME_CONTROL_SIDEBAR_ANIMATE = 'control-sidebar-animate' +const CLASS_NAME_CONTROL_SIDEBAR_OPEN = 'control-sidebar-open' +const CLASS_NAME_CONTROL_SIDEBAR_SLIDE = 'control-sidebar-slide-open' +const CLASS_NAME_LAYOUT_FIXED = 'layout-fixed' +const CLASS_NAME_NAVBAR_FIXED = 'layout-navbar-fixed' +const CLASS_NAME_NAVBAR_SM_FIXED = 'layout-sm-navbar-fixed' +const CLASS_NAME_NAVBAR_MD_FIXED = 'layout-md-navbar-fixed' +const CLASS_NAME_NAVBAR_LG_FIXED = 'layout-lg-navbar-fixed' +const CLASS_NAME_NAVBAR_XL_FIXED = 'layout-xl-navbar-fixed' +const CLASS_NAME_FOOTER_FIXED = 'layout-footer-fixed' +const CLASS_NAME_FOOTER_SM_FIXED = 'layout-sm-footer-fixed' +const CLASS_NAME_FOOTER_MD_FIXED = 'layout-md-footer-fixed' +const CLASS_NAME_FOOTER_LG_FIXED = 'layout-lg-footer-fixed' +const CLASS_NAME_FOOTER_XL_FIXED = 'layout-xl-footer-fixed' const Default = { controlsidebarSlide: true, @@ -74,17 +68,17 @@ class ControlSidebar { // Show the control sidebar if (this._config.controlsidebarSlide) { - $html.addClass(ClassName.CONTROL_SIDEBAR_ANIMATE) - $body.removeClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function () { - $(Selector.CONTROL_SIDEBAR).hide() - $html.removeClass(ClassName.CONTROL_SIDEBAR_ANIMATE) + $html.addClass(CLASS_NAME_CONTROL_SIDEBAR_ANIMATE) + $body.removeClass(CLASS_NAME_CONTROL_SIDEBAR_SLIDE).delay(300).queue(function () { + $(SELECTOR_CONTROL_SIDEBAR).hide() + $html.removeClass(CLASS_NAME_CONTROL_SIDEBAR_ANIMATE) $(this).dequeue() }) } else { - $body.removeClass(ClassName.CONTROL_SIDEBAR_OPEN) + $body.removeClass(CLASS_NAME_CONTROL_SIDEBAR_OPEN) } - $(this._element).trigger($.Event(Event.COLLAPSED)) + $(this._element).trigger($.Event(EVENT_COLLAPSED)) } show() { @@ -93,25 +87,25 @@ class ControlSidebar { // Collapse the control sidebar if (this._config.controlsidebarSlide) { - $html.addClass(ClassName.CONTROL_SIDEBAR_ANIMATE) - $(Selector.CONTROL_SIDEBAR).show().delay(10).queue(function () { - $body.addClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function () { - $html.removeClass(ClassName.CONTROL_SIDEBAR_ANIMATE) + $html.addClass(CLASS_NAME_CONTROL_SIDEBAR_ANIMATE) + $(SELECTOR_CONTROL_SIDEBAR).show().delay(10).queue(function () { + $body.addClass(CLASS_NAME_CONTROL_SIDEBAR_SLIDE).delay(300).queue(function () { + $html.removeClass(CLASS_NAME_CONTROL_SIDEBAR_ANIMATE) $(this).dequeue() }) $(this).dequeue() }) } else { - $body.addClass(ClassName.CONTROL_SIDEBAR_OPEN) + $body.addClass(CLASS_NAME_CONTROL_SIDEBAR_OPEN) } - $(this._element).trigger($.Event(Event.EXPANDED)) + $(this._element).trigger($.Event(EVENT_EXPANDED)) } toggle() { const $body = $('body') - const shouldClose = $body.hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || - $body.hasClass(ClassName.CONTROL_SIDEBAR_SLIDE) + const shouldClose = $body.hasClass(CLASS_NAME_CONTROL_SIDEBAR_OPEN) || + $body.hasClass(CLASS_NAME_CONTROL_SIDEBAR_SLIDE) if (shouldClose) { // Close the control sidebar @@ -135,8 +129,8 @@ class ControlSidebar { $(window).scroll(() => { const $body = $('body') - const shouldFixHeight = $body.hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || - $body.hasClass(ClassName.CONTROL_SIDEBAR_SLIDE) + const shouldFixHeight = $body.hasClass(CLASS_NAME_CONTROL_SIDEBAR_OPEN) || + $body.hasClass(CLASS_NAME_CONTROL_SIDEBAR_SLIDE) if (shouldFixHeight) { this._fixScrollHeight() @@ -147,15 +141,15 @@ class ControlSidebar { _fixScrollHeight() { const $body = $('body') - if (!$body.hasClass(ClassName.LAYOUT_FIXED)) { + if (!$body.hasClass(CLASS_NAME_LAYOUT_FIXED)) { return } const heights = { scroll: $(document).height(), window: $(window).height(), - header: $(Selector.HEADER).outerHeight(), - footer: $(Selector.FOOTER).outerHeight() + header: $(SELECTOR_HEADER).outerHeight(), + footer: $(SELECTOR_FOOTER).outerHeight() } const positions = { bottom: Math.abs((heights.window + $(window).scrollTop()) - heights.scroll), @@ -166,31 +160,31 @@ class ControlSidebar { let footerFixed = false if ( - $body.hasClass(ClassName.NAVBAR_FIXED) || - $body.hasClass(ClassName.NAVBAR_SM_FIXED) || - $body.hasClass(ClassName.NAVBAR_MD_FIXED) || - $body.hasClass(ClassName.NAVBAR_LG_FIXED) || - $body.hasClass(ClassName.NAVBAR_XL_FIXED) + $body.hasClass(CLASS_NAME_NAVBAR_FIXED) || + $body.hasClass(CLASS_NAME_NAVBAR_SM_FIXED) || + $body.hasClass(CLASS_NAME_NAVBAR_MD_FIXED) || + $body.hasClass(CLASS_NAME_NAVBAR_LG_FIXED) || + $body.hasClass(CLASS_NAME_NAVBAR_XL_FIXED) ) { - if ($(Selector.HEADER).css('position') === 'fixed') { + if ($(SELECTOR_HEADER).css('position') === 'fixed') { navbarFixed = true } } if ( - $body.hasClass(ClassName.FOOTER_FIXED) || - $body.hasClass(ClassName.FOOTER_SM_FIXED) || - $body.hasClass(ClassName.FOOTER_MD_FIXED) || - $body.hasClass(ClassName.FOOTER_LG_FIXED) || - $body.hasClass(ClassName.FOOTER_XL_FIXED) + $body.hasClass(CLASS_NAME_FOOTER_FIXED) || + $body.hasClass(CLASS_NAME_FOOTER_SM_FIXED) || + $body.hasClass(CLASS_NAME_FOOTER_MD_FIXED) || + $body.hasClass(CLASS_NAME_FOOTER_LG_FIXED) || + $body.hasClass(CLASS_NAME_FOOTER_XL_FIXED) ) { - if ($(Selector.FOOTER).css('position') === 'fixed') { + if ($(SELECTOR_FOOTER).css('position') === 'fixed') { footerFixed = true } } - const $controlSidebar = $(Selector.CONTROL_SIDEBAR) - const $controlsidebarContent = $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT) + const $controlSidebar = $(SELECTOR_CONTROL_SIDEBAR) + const $controlsidebarContent = $(SELECTOR_CONTROL_SIDEBAR + ', ' + SELECTOR_CONTROL_SIDEBAR + ' ' + SELECTOR_CONTROL_SIDEBAR_CONTENT) if (positions.top === 0 && positions.bottom === 0) { $controlSidebar.css({ @@ -223,31 +217,31 @@ class ControlSidebar { _fixHeight() { const $body = $('body') - if (!$body.hasClass(ClassName.LAYOUT_FIXED)) { + if (!$body.hasClass(CLASS_NAME_LAYOUT_FIXED)) { return } const heights = { window: $(window).height(), - header: $(Selector.HEADER).outerHeight(), - footer: $(Selector.FOOTER).outerHeight() + header: $(SELECTOR_HEADER).outerHeight(), + footer: $(SELECTOR_FOOTER).outerHeight() } let sidebarHeight = heights.window - heights.header if ( - $body.hasClass(ClassName.FOOTER_FIXED) || - $body.hasClass(ClassName.FOOTER_SM_FIXED) || - $body.hasClass(ClassName.FOOTER_MD_FIXED) || - $body.hasClass(ClassName.FOOTER_LG_FIXED) || - $body.hasClass(ClassName.FOOTER_XL_FIXED) + $body.hasClass(CLASS_NAME_FOOTER_FIXED) || + $body.hasClass(CLASS_NAME_FOOTER_SM_FIXED) || + $body.hasClass(CLASS_NAME_FOOTER_MD_FIXED) || + $body.hasClass(CLASS_NAME_FOOTER_LG_FIXED) || + $body.hasClass(CLASS_NAME_FOOTER_XL_FIXED) ) { - if ($(Selector.FOOTER).css('position') === 'fixed') { + if ($(SELECTOR_FOOTER).css('position') === 'fixed') { sidebarHeight = heights.window - heights.header - heights.footer } } - const $controlSidebar = $(Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT) + const $controlSidebar = $(SELECTOR_CONTROL_SIDEBAR + ' ' + SELECTOR_CONTROL_SIDEBAR_CONTENT) $controlSidebar.css('height', sidebarHeight) if (typeof $.fn.overlayScrollbars !== 'undefined') { @@ -288,7 +282,7 @@ class ControlSidebar { * Data Api implementation * ==================================================== */ -$(document).on('click', Selector.DATA_TOGGLE, function (event) { +$(document).on('click', SELECTOR_DATA_TOGGLE, function (event) { event.preventDefault() ControlSidebar._jQueryInterface.call($(this), 'toggle') diff --git a/build/js/DirectChat.js b/build/js/DirectChat.js index a25ce3abd..bb71907e0 100644 --- a/build/js/DirectChat.js +++ b/build/js/DirectChat.js @@ -16,18 +16,12 @@ const NAME = 'DirectChat' const DATA_KEY = 'lte.directchat' const JQUERY_NO_CONFLICT = $.fn[NAME] -const Event = { - TOGGLED: 'toggled{EVENT_KEY}' -} +const EVENT_TOGGLED = 'toggled{EVENT_KEY}' // TODO: missing $ and variable EVENT_KEY -const Selector = { - DATA_TOGGLE: '[data-widget="chat-pane-toggle"]', - DIRECT_CHAT: '.direct-chat' -} +const SELECTOR_DATA_TOGGLE = '[data-widget="chat-pane-toggle"]' +const SELECTOR_DIRECT_CHAT = '.direct-chat' -const ClassName = { - DIRECT_CHAT_OPEN: 'direct-chat-contacts-open' -} +const CLASS_NAME_DIRECT_CHAT_OPEN = 'direct-chat-contacts-open' /** * Class Definition @@ -40,8 +34,8 @@ class DirectChat { } toggle() { - $(this._element).parents(Selector.DIRECT_CHAT).first().toggleClass(ClassName.DIRECT_CHAT_OPEN) - $(this._element).trigger($.Event(Event.TOGGLED)) + $(this._element).parents(SELECTOR_DIRECT_CHAT).first().toggleClass(CLASS_NAME_DIRECT_CHAT_OPEN) + $(this._element).trigger($.Event(EVENT_TOGGLED)) } // Static @@ -66,7 +60,7 @@ class DirectChat { * ==================================================== */ -$(document).on('click', Selector.DATA_TOGGLE, function (event) { +$(document).on('click', SELECTOR_DATA_TOGGLE, function (event) { if (event) { event.preventDefault() } diff --git a/build/js/Dropdown.js b/build/js/Dropdown.js index ad9dbdd40..4d4d57197 100644 --- a/build/js/Dropdown.js +++ b/build/js/Dropdown.js @@ -16,17 +16,14 @@ const NAME = 'Dropdown' const DATA_KEY = 'lte.dropdown' const JQUERY_NO_CONFLICT = $.fn[NAME] -const Selector = { - NAVBAR: '.navbar', - DROPDOWN_MENU: '.dropdown-menu', - DROPDOWN_MENU_ACTIVE: '.dropdown-menu.show', - DROPDOWN_TOGGLE: '[data-toggle="dropdown"]' -} +const SELECTOR_NAVBAR = '.navbar' +const SELECTOR_DROPDOWN_MENU = '.dropdown-menu' +const SELECTOR_DROPDOWN_MENU_ACTIVE = '.dropdown-menu.show' +const SELECTOR_DROPDOWN_TOGGLE = '[data-toggle="dropdown"]' -const ClassName = { - DROPDOWN_RIGHT: 'dropdown-menu-right' -} +const CLASS_NAME_DROPDOWN_RIGHT = 'dropdown-menu-right' +// TODO: this is unused; should be removed along with the extend? const Default = { } @@ -47,7 +44,7 @@ class Dropdown { this._element.siblings().show().toggleClass('show') if (!this._element.next().hasClass('show')) { - this._element.parents(Selector.DROPDOWN_MENU).first().find('.show').removeClass('show').hide() + this._element.parents(SELECTOR_DROPDOWN_MENU).first().find('.show').removeClass('show').hide() } this._element.parents('li.nav-item.dropdown.show').on('hidden.bs.dropdown', () => { @@ -56,13 +53,13 @@ class Dropdown { } fixPosition() { - const $element = $(Selector.DROPDOWN_MENU_ACTIVE) + const $element = $(SELECTOR_DROPDOWN_MENU_ACTIVE) if ($element.length === 0) { return } - if ($element.hasClass(ClassName.DROPDOWN_RIGHT)) { + if ($element.hasClass(CLASS_NAME_DROPDOWN_RIGHT)) { $element.css({ left: 'inherit', right: 0 @@ -115,14 +112,14 @@ class Dropdown { * ==================================================== */ -$(Selector.DROPDOWN_MENU + ' ' + Selector.DROPDOWN_TOGGLE).on('click', function (event) { +$(SELECTOR_DROPDOWN_MENU + ' ' + SELECTOR_DROPDOWN_TOGGLE).on('click', function (event) { event.preventDefault() event.stopPropagation() Dropdown._jQueryInterface.call($(this), 'toggleSubmenu') }) -$(Selector.NAVBAR + ' ' + Selector.DROPDOWN_TOGGLE).on('click', event => { +$(SELECTOR_NAVBAR + ' ' + SELECTOR_DROPDOWN_TOGGLE).on('click', event => { event.preventDefault() setTimeout(function () { diff --git a/build/js/ExpandableTable.js b/build/js/ExpandableTable.js index 9d9835044..0715a5da9 100644 --- a/build/js/ExpandableTable.js +++ b/build/js/ExpandableTable.js @@ -17,21 +17,15 @@ const DATA_KEY = 'lte.expandableTable' const EVENT_KEY = `.${DATA_KEY}` const JQUERY_NO_CONFLICT = $.fn[NAME] -const Event = { - EXPANDED: `expanded${EVENT_KEY}`, - COLLAPSED: `collapsed${EVENT_KEY}` -} +const EVENT_EXPANDED = `expanded${EVENT_KEY}` +const EVENT_COLLAPSED = `collapsed${EVENT_KEY}` -const ClassName = { - HEADER: 'expandable-header' -} +const CLASS_NAME_HEADER = 'expandable-header' -const Selector = { - HEADER: `.${ClassName.HEADER}`, - DATA_SELECTOR: 'data-expandable-table', - EXPANDED: 'expanded', - COLLAPSED: 'collapsed' -} +const SELECTOR_HEADER = `.${CLASS_NAME_HEADER}` +const SELECTOR_DATA_SELECTOR = 'data-expandable-table' +const SELECTOR_EXPANDED = 'expanded' +const SELECTOR_COLLAPSED = 'collapsed' /** * Class Definition @@ -46,16 +40,16 @@ class ExpandableTable { // Public init() { - $(Selector.HEADER).each((_, $header) => { + $(SELECTOR_HEADER).each((_, $header) => { // Next Child to the header will have the same column span as header $($header).next().children().first().attr('colspan', $($header).children().length) // Setting up table design for the first time - const $type = $($header).next().attr(Selector.DATA_SELECTOR) + const $type = $($header).next().attr(SELECTOR_DATA_SELECTOR) const $body = $($header).next().children().first().children() - if ($type === Selector.EXPANDED) { + if ($type === SELECTOR_EXPANDED) { $body.show() - } else if ($type === Selector.COLLAPSED) { + } else if ($type === SELECTOR_COLLAPSED) { $body.hide() $body.parent().parent().addClass('d-none') } @@ -65,20 +59,20 @@ class ExpandableTable { toggleRow() { const $element = this._element const time = 500 - const $type = $element.next().attr(Selector.DATA_SELECTOR) + const $type = $element.next().attr(SELECTOR_DATA_SELECTOR) const $body = $element.next().children().first().children() $body.stop() - if ($type === Selector.EXPANDED) { + if ($type === SELECTOR_EXPANDED) { $body.slideUp(time, () => { $element.next().addClass('d-none') }) - $element.next().attr(Selector.DATA_SELECTOR, Selector.COLLAPSED) - $element.trigger($.Event(Event.COLLAPSED)) - } else if ($type === Selector.COLLAPSED) { + $element.next().attr(SELECTOR_DATA_SELECTOR, SELECTOR_COLLAPSED) + $element.trigger($.Event(EVENT_COLLAPSED)) + } else if ($type === SELECTOR_COLLAPSED) { $element.next().removeClass('d-none') $body.slideDown(time) - $element.next().attr(Selector.DATA_SELECTOR, Selector.EXPANDED) - $element.trigger($.Event(Event.EXPANDED)) + $element.next().attr(SELECTOR_DATA_SELECTOR, SELECTOR_EXPANDED) + $element.trigger($.Event(EVENT_EXPANDED)) } } @@ -103,11 +97,11 @@ class ExpandableTable { * Data API * ==================================================== */ -$(ClassName.TABLE).ready(function () { +$(CLASS_NAME_TABLE).ready(function () { ExpandableTable._jQueryInterface.call($(this), 'init') }) -$(document).on('click', Selector.HEADER, function () { +$(document).on('click', SELECTOR_HEADER, function () { ExpandableTable._jQueryInterface.call($(this), 'toggleRow') }) diff --git a/build/js/Layout.js b/build/js/Layout.js index a5693b063..42d930d16 100644 --- a/build/js/Layout.js +++ b/build/js/Layout.js @@ -16,25 +16,21 @@ const NAME = 'Layout' const DATA_KEY = 'lte.layout' const JQUERY_NO_CONFLICT = $.fn[NAME] -const Selector = { - HEADER: '.main-header', - MAIN_SIDEBAR: '.main-sidebar', - SIDEBAR: '.main-sidebar .sidebar', - CONTENT: '.content-wrapper', - CONTROL_SIDEBAR_CONTENT: '.control-sidebar-content', - CONTROL_SIDEBAR_BTN: '[data-widget="control-sidebar"]', - FOOTER: '.main-footer', - PUSHMENU_BTN: '[data-widget="pushmenu"]', - LOGIN_BOX: '.login-box', - REGISTER_BOX: '.register-box' -} +const SELECTOR_HEADER = '.main-header' +const SELECTOR_MAIN_SIDEBAR = '.main-sidebar' +const SELECTOR_SIDEBAR = '.main-sidebar .sidebar' +const SELECTOR_CONTENT = '.content-wrapper' +const SELECTOR_CONTROL_SIDEBAR_CONTENT = '.control-sidebar-content' +const SELECTOR_CONTROL_SIDEBAR_BTN = '[data-widget="control-sidebar"]' +const SELECTOR_FOOTER = '.main-footer' +const SELECTOR_PUSHMENU_BTN = '[data-widget="pushmenu"]' +const SELECTOR_LOGIN_BOX = '.login-box' +const SELECTOR_REGISTER_BOX = '.register-box' -const ClassName = { - SIDEBAR_FOCUSED: 'sidebar-focused', - LAYOUT_FIXED: 'layout-fixed', - CONTROL_SIDEBAR_SLIDE_OPEN: 'control-sidebar-slide-open', - CONTROL_SIDEBAR_OPEN: 'control-sidebar-open' -} +const CLASS_NAME_SIDEBAR_FOCUSED = 'sidebar-focused' +const CLASS_NAME_LAYOUT_FIXED = 'layout-fixed' +const CLASS_NAME_CONTROL_SIDEBAR_SLIDE_OPEN = 'control-sidebar-slide-open' +const CLASS_NAME_CONTROL_SIDEBAR_OPEN = 'control-sidebar-open' const Default = { scrollbarTheme: 'os-theme-light', @@ -62,15 +58,15 @@ class Layout { const $body = $('body') let controlSidebar = 0 - if ($body.hasClass(ClassName.CONTROL_SIDEBAR_SLIDE_OPEN) || $body.hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || extra === 'control_sidebar') { - controlSidebar = $(Selector.CONTROL_SIDEBAR_CONTENT).height() + if ($body.hasClass(CLASS_NAME_CONTROL_SIDEBAR_SLIDE_OPEN) || $body.hasClass(CLASS_NAME_CONTROL_SIDEBAR_OPEN) || extra === 'control_sidebar') { + controlSidebar = $(SELECTOR_CONTROL_SIDEBAR_CONTENT).height() } const heights = { window: $(window).height(), - header: $(Selector.HEADER).length !== 0 ? $(Selector.HEADER).outerHeight() : 0, - footer: $(Selector.FOOTER).length !== 0 ? $(Selector.FOOTER).outerHeight() : 0, - sidebar: $(Selector.SIDEBAR).length !== 0 ? $(Selector.SIDEBAR).height() : 0, + header: $(SELECTOR_HEADER).length !== 0 ? $(SELECTOR_HEADER).outerHeight() : 0, + footer: $(SELECTOR_FOOTER).length !== 0 ? $(SELECTOR_FOOTER).outerHeight() : 0, + sidebar: $(SELECTOR_SIDEBAR).length !== 0 ? $(SELECTOR_SIDEBAR).height() : 0, controlSidebar } @@ -81,7 +77,7 @@ class Layout { offset = 0 } - const $contentSelector = $(Selector.CONTENT) + const $contentSelector = $(SELECTOR_CONTENT) if (offset !== false) { if (max === heights.controlSidebar) { @@ -97,7 +93,7 @@ class Layout { } } - if (!$body.hasClass(ClassName.LAYOUT_FIXED)) { + if (!$body.hasClass(CLASS_NAME_LAYOUT_FIXED)) { return } @@ -106,7 +102,7 @@ class Layout { } if (typeof $.fn.overlayScrollbars !== 'undefined') { - $(Selector.SIDEBAR).overlayScrollbars({ + $(SELECTOR_SIDEBAR).overlayScrollbars({ className: this._config.scrollbarTheme, sizeAutoCapable: true, scrollbars: { @@ -119,7 +115,7 @@ class Layout { fixLoginRegisterHeight() { const $body = $('body') - const $selector = $(Selector.LOGIN_BOX + ', ' + Selector.REGISTER_BOX) + const $selector = $(SELECTOR_LOGIN_BOX + ', ' + SELECTOR_REGISTER_BOX) if ($selector.length === 0) { $body.css('height', 'auto') @@ -145,17 +141,17 @@ class Layout { setInterval(this.fixLoginRegisterHeight, this._config.loginRegisterAutoHeight) } - $(Selector.SIDEBAR) + $(SELECTOR_SIDEBAR) .on('collapsed.lte.treeview expanded.lte.treeview', () => { this.fixLayoutHeight() }) - $(Selector.PUSHMENU_BTN) + $(SELECTOR_PUSHMENU_BTN) .on('collapsed.lte.pushmenu shown.lte.pushmenu', () => { this.fixLayoutHeight() }) - $(Selector.CONTROL_SIDEBAR_BTN) + $(SELECTOR_CONTROL_SIDEBAR_BTN) .on('collapsed.lte.controlsidebar', () => { this.fixLayoutHeight() }) @@ -186,7 +182,7 @@ class Layout { } _isFooterFixed() { - return $(Selector.FOOTER).css('position') === 'fixed' + return $(SELECTOR_FOOTER).css('position') === 'fixed' } // Static @@ -219,12 +215,12 @@ $(window).on('load', () => { Layout._jQueryInterface.call($('body')) }) -$(Selector.SIDEBAR + ' a').on('focusin', () => { - $(Selector.MAIN_SIDEBAR).addClass(ClassName.SIDEBAR_FOCUSED) +$(SELECTOR_SIDEBAR + ' a').on('focusin', () => { + $(SELECTOR_MAIN_SIDEBAR).addClass(CLASS_NAME_SIDEBAR_FOCUSED) }) -$(Selector.SIDEBAR + ' a').on('focusout', () => { - $(Selector.MAIN_SIDEBAR).removeClass(ClassName.SIDEBAR_FOCUSED) +$(SELECTOR_SIDEBAR + ' a').on('focusout', () => { + $(SELECTOR_MAIN_SIDEBAR).removeClass(CLASS_NAME_SIDEBAR_FOCUSED) }) /** diff --git a/build/js/PushMenu.js b/build/js/PushMenu.js index 4a4340ec6..e7c18c1e5 100644 --- a/build/js/PushMenu.js +++ b/build/js/PushMenu.js @@ -17,10 +17,18 @@ const DATA_KEY = 'lte.pushmenu' const EVENT_KEY = `.${DATA_KEY}` const JQUERY_NO_CONFLICT = $.fn[NAME] -const Event = { - COLLAPSED: `collapsed${EVENT_KEY}`, - SHOWN: `shown${EVENT_KEY}` -} +const EVENT_COLLAPSED = `collapsed${EVENT_KEY}` +const EVENT_SHOWN = `shown${EVENT_KEY}` + +const SELECTOR_TOGGLE_BUTTON = '[data-widget="pushmenu"]' +const SELECTOR_BODY = 'body' +const SELECTOR_OVERLAY = '#sidebar-overlay' +const SELECTOR_WRAPPER = '.wrapper' + +const CLASS_NAME_COLLAPSED = 'sidebar-collapse' +const CLASS_NAME_OPEN = 'sidebar-open' +const CLASS_NAME_IS_OPENING = 'sidebar-is-opening' +const CLASS_NAME_CLOSED = 'sidebar-closed' const Default = { autoCollapseSize: 992, @@ -28,20 +36,6 @@ const Default = { noTransitionAfterReload: true } -const Selector = { - TOGGLE_BUTTON: '[data-widget="pushmenu"]', - BODY: 'body', - OVERLAY: '#sidebar-overlay', - WRAPPER: '.wrapper' -} - -const ClassName = { - COLLAPSED: 'sidebar-collapse', - OPEN: 'sidebar-open', - IS_OPENING: 'sidebar-is-opening', - CLOSED: 'sidebar-closed' -} - /** * Class Definition * ==================================================== @@ -52,7 +46,7 @@ class PushMenu { this._element = element this._options = $.extend({}, Default, options) - if ($(Selector.OVERLAY).length === 0) { + if ($(SELECTOR_OVERLAY).length === 0) { this._addOverlay() } @@ -62,43 +56,43 @@ class PushMenu { // Public expand() { - const $bodySelector = $(Selector.BODY) + const $bodySelector = $(SELECTOR_BODY) if (this._options.autoCollapseSize) { if ($(window).width() <= this._options.autoCollapseSize) { - $bodySelector.addClass(ClassName.OPEN) + $bodySelector.addClass(CLASS_NAME_OPEN) } } - $bodySelector.addClass(ClassName.IS_OPENING).removeClass(`${ClassName.COLLAPSED} ${ClassName.CLOSED}`) + $bodySelector.addClass(CLASS_NAME_IS_OPENING).removeClass(`${CLASS_NAME_COLLAPSED} ${CLASS_NAME_CLOSED}`) if (this._options.enableRemember) { - localStorage.setItem(`remember${EVENT_KEY}`, ClassName.OPEN) + localStorage.setItem(`remember${EVENT_KEY}`, CLASS_NAME_OPEN) } - $(this._element).trigger($.Event(Event.SHOWN)) + $(this._element).trigger($.Event(EVENT_SHOWN)) } collapse() { - const $bodySelector = $(Selector.BODY) + const $bodySelector = $(SELECTOR_BODY) if (this._options.autoCollapseSize) { if ($(window).width() <= this._options.autoCollapseSize) { - $bodySelector.removeClass(ClassName.OPEN).addClass(ClassName.CLOSED) + $bodySelector.removeClass(CLASS_NAME_OPEN).addClass(CLASS_NAME_CLOSED) } } - $bodySelector.removeClass(ClassName.IS_OPENING).addClass(ClassName.COLLAPSED) + $bodySelector.removeClass(CLASS_NAME_IS_OPENING).addClass(CLASS_NAME_COLLAPSED) if (this._options.enableRemember) { - localStorage.setItem(`remember${EVENT_KEY}`, ClassName.COLLAPSED) + localStorage.setItem(`remember${EVENT_KEY}`, CLASS_NAME_COLLAPSED) } - $(this._element).trigger($.Event(Event.COLLAPSED)) + $(this._element).trigger($.Event(EVENT_COLLAPSED)) } toggle() { - if ($(Selector.BODY).hasClass(ClassName.COLLAPSED)) { + if ($(SELECTOR_BODY).hasClass(CLASS_NAME_COLLAPSED)) { this.expand() } else { this.collapse() @@ -110,16 +104,16 @@ class PushMenu { return } - const $bodySelector = $(Selector.BODY) + const $bodySelector = $(SELECTOR_BODY) if ($(window).width() <= this._options.autoCollapseSize) { - if (!$bodySelector.hasClass(ClassName.OPEN)) { + if (!$bodySelector.hasClass(CLASS_NAME_OPEN)) { this.collapse() } } else if (resize === true) { - if ($bodySelector.hasClass(ClassName.OPEN)) { - $bodySelector.removeClass(ClassName.OPEN) - } else if ($bodySelector.hasClass(ClassName.CLOSED)) { + if ($bodySelector.hasClass(CLASS_NAME_OPEN)) { + $bodySelector.removeClass(CLASS_NAME_OPEN) + } else if ($bodySelector.hasClass(CLASS_NAME_CLOSED)) { this.expand() } } @@ -133,22 +127,22 @@ class PushMenu { const $body = $('body') const toggleState = localStorage.getItem(`remember${EVENT_KEY}`) - if (toggleState === ClassName.COLLAPSED) { + if (toggleState === CLASS_NAME_COLLAPSED) { if (this._options.noTransitionAfterReload) { - $body.addClass('hold-transition').addClass(ClassName.COLLAPSED).delay(50).queue(function () { + $body.addClass('hold-transition').addClass(CLASS_NAME_COLLAPSED).delay(50).queue(function () { $(this).removeClass('hold-transition') $(this).dequeue() }) } else { - $body.addClass(ClassName.COLLAPSED) + $body.addClass(CLASS_NAME_COLLAPSED) } } else if (this._options.noTransitionAfterReload) { - $body.addClass('hold-transition').removeClass(ClassName.COLLAPSED).delay(50).queue(function () { + $body.addClass('hold-transition').removeClass(CLASS_NAME_COLLAPSED).delay(50).queue(function () { $(this).removeClass('hold-transition') $(this).dequeue() }) } else { - $body.removeClass(ClassName.COLLAPSED) + $body.removeClass(CLASS_NAME_COLLAPSED) } } @@ -172,7 +166,7 @@ class PushMenu { this.collapse() }) - $(Selector.WRAPPER).append(overlay) + $(SELECTOR_WRAPPER).append(overlay) } // Static @@ -199,20 +193,20 @@ class PushMenu { * ==================================================== */ -$(document).on('click', Selector.TOGGLE_BUTTON, event => { +$(document).on('click', SELECTOR_TOGGLE_BUTTON, event => { event.preventDefault() let button = event.currentTarget if ($(button).data('widget') !== 'pushmenu') { - button = $(button).closest(Selector.TOGGLE_BUTTON) + button = $(button).closest(SELECTOR_TOGGLE_BUTTON) } PushMenu._jQueryInterface.call($(button), 'toggle') }) $(window).on('load', () => { - PushMenu._jQueryInterface.call($(Selector.TOGGLE_BUTTON)) + PushMenu._jQueryInterface.call($(SELECTOR_TOGGLE_BUTTON)) }) /** diff --git a/build/js/SiteSearch.js b/build/js/SiteSearch.js index 295f747f0..d0c4e4f95 100644 --- a/build/js/SiteSearch.js +++ b/build/js/SiteSearch.js @@ -16,16 +16,12 @@ const NAME = 'SiteSearch' const DATA_KEY = 'lte.site-search' const JQUERY_NO_CONFLICT = $.fn[NAME] -const Selector = { - TOGGLE_BUTTON: '[data-widget="site-search"]', - SEARCH_BLOCK: '.site-search-block', - SEARCH_BACKDROP: '.site-search-backdrop', - SEARCH_INPUT: '.site-search-block .form-control' -} +const SELECTOR_TOGGLE_BUTTON = '[data-widget="site-search"]' +const SELECTOR_SEARCH_BLOCK = '.site-search-block' +const SELECTOR_SEARCH_BACKDROP = '.site-search-backdrop' +const SELECTOR_SEARCH_INPUT = '.site-search-block .form-control' -const ClassName = { - OPEN: 'site-search-open' -} +const CLASS_NAME_OPEN = 'site-search-open' const Default = { transitionSpeed: 300 @@ -45,20 +41,20 @@ class SiteSearch { // Public open() { - $(Selector.SEARCH_BLOCK).slideDown(this.options.transitionSpeed) - $(Selector.SEARCH_BACKDROP).show(0) - $(Selector.SEARCH_INPUT).focus() - $(Selector.SEARCH_BLOCK).addClass(ClassName.OPEN) + $(SELECTOR_SEARCH_BLOCK).slideDown(this.options.transitionSpeed) + $(SELECTOR_SEARCH_BACKDROP).show(0) + $(SELECTOR_SEARCH_INPUT).focus() + $(SELECTOR_SEARCH_BLOCK).addClass(CLASS_NAME_OPEN) } close() { - $(Selector.SEARCH_BLOCK).slideUp(this.options.transitionSpeed) - $(Selector.SEARCH_BACKDROP).hide(0) - $(Selector.SEARCH_BLOCK).removeClass(ClassName.OPEN) + $(SELECTOR_SEARCH_BLOCK).slideUp(this.options.transitionSpeed) + $(SELECTOR_SEARCH_BACKDROP).hide(0) + $(SELECTOR_SEARCH_BLOCK).removeClass(CLASS_NAME_OPEN) } toggle() { - if ($(Selector.SEARCH_BLOCK).hasClass(ClassName.OPEN)) { + if ($(SELECTOR_SEARCH_BLOCK).hasClass(CLASS_NAME_OPEN)) { this.close() } else { this.open() @@ -89,19 +85,19 @@ class SiteSearch { * Data API * ==================================================== */ -$(document).on('click', Selector.TOGGLE_BUTTON, event => { +$(document).on('click', SELECTOR_TOGGLE_BUTTON, event => { event.preventDefault() let button = $(event.currentTarget) if (button.data('widget') !== 'site-search') { - button = button.closest(Selector.TOGGLE_BUTTON) + button = button.closest(SELECTOR_TOGGLE_BUTTON) } SiteSearch._jQueryInterface.call(button, 'toggle') }) -$(document).on('click', Selector.SEARCH_BACKDROP, event => { +$(document).on('click', SELECTOR_SEARCH_BACKDROP, event => { const backdrop = $(event.currentTarget) SiteSearch._jQueryInterface.call(backdrop, 'close') }) diff --git a/build/js/Toasts.js b/build/js/Toasts.js index 4884aee55..41b308d4f 100644 --- a/build/js/Toasts.js +++ b/build/js/Toasts.js @@ -17,35 +17,27 @@ const DATA_KEY = 'lte.toasts' const EVENT_KEY = `.${DATA_KEY}` const JQUERY_NO_CONFLICT = $.fn[NAME] -const Event = { - INIT: `init${EVENT_KEY}`, - CREATED: `created${EVENT_KEY}`, - REMOVED: `removed${EVENT_KEY}` -} +const EVENT_INIT = `init${EVENT_KEY}` +const EVENT_CREATED = `created${EVENT_KEY}` +const EVENT_REMOVED = `removed${EVENT_KEY}` -const Selector = { - CONTAINER_TOP_RIGHT: '#toastsContainerTopRight', - CONTAINER_TOP_LEFT: '#toastsContainerTopLeft', - CONTAINER_BOTTOM_RIGHT: '#toastsContainerBottomRight', - CONTAINER_BOTTOM_LEFT: '#toastsContainerBottomLeft' -} +const SELECTOR_CONTAINER_TOP_RIGHT = '#toastsContainerTopRight' +const SELECTOR_CONTAINER_TOP_LEFT = '#toastsContainerTopLeft' +const SELECTOR_CONTAINER_BOTTOM_RIGHT = '#toastsContainerBottomRight' +const SELECTOR_CONTAINER_BOTTOM_LEFT = '#toastsContainerBottomLeft' -const ClassName = { - TOP_RIGHT: 'toasts-top-right', - TOP_LEFT: 'toasts-top-left', - BOTTOM_RIGHT: 'toasts-bottom-right', - BOTTOM_LEFT: 'toasts-bottom-left' -} +const CLASS_NAME_TOP_RIGHT = 'toasts-top-right' +const CLASS_NAME_TOP_LEFT = 'toasts-top-left' +const CLASS_NAME_BOTTOM_RIGHT = 'toasts-bottom-right' +const CLASS_NAME_BOTTOM_LEFT = 'toasts-bottom-left' -const Position = { - TOP_RIGHT: 'topRight', - TOP_LEFT: 'topLeft', - BOTTOM_RIGHT: 'bottomRight', - BOTTOM_LEFT: 'bottomLeft' -} +const POSITION_TOP_RIGHT = 'topRight' +const POSITION_TOP_LEFT = 'topLeft' +const POSITION_BOTTOM_RIGHT = 'bottomRight' +const POSITION_BOTTOM_LEFT = 'bottomLeft' const Default = { - position: Position.TOP_RIGHT, + position: POSITION_TOP_RIGHT, fixed: true, autohide: false, autoremove: true, @@ -71,7 +63,7 @@ class Toasts { this._config = config this._prepareContainer() - $('body').trigger($.Event(Event.INIT)) + $('body').trigger($.Event(EVENT_INIT)) } // Public @@ -134,13 +126,13 @@ class Toasts { const $body = $('body') - $body.trigger($.Event(Event.CREATED)) + $body.trigger($.Event(EVENT_CREATED)) toast.toast('show') if (this._config.autoremove) { toast.on('hidden.bs.toast', function () { $(this).delay(200).remove() - $body.trigger($.Event(Event.REMOVED)) + $body.trigger($.Event(EVENT_REMOVED)) }) } } @@ -148,34 +140,34 @@ class Toasts { // Static _getContainerId() { - if (this._config.position == Position.TOP_RIGHT) { - return Selector.CONTAINER_TOP_RIGHT + if (this._config.position == POSITION_TOP_RIGHT) { + return SELECTOR_CONTAINER_TOP_RIGHT } - if (this._config.position == Position.TOP_LEFT) { - return Selector.CONTAINER_TOP_LEFT + if (this._config.position == POSITION_TOP_LEFT) { + return SELECTOR_CONTAINER_TOP_LEFT } - if (this._config.position == Position.BOTTOM_RIGHT) { - return Selector.CONTAINER_BOTTOM_RIGHT + if (this._config.position == POSITION_BOTTOM_RIGHT) { + return SELECTOR_CONTAINER_BOTTOM_RIGHT } - if (this._config.position == Position.BOTTOM_LEFT) { - return Selector.CONTAINER_BOTTOM_LEFT + if (this._config.position == POSITION_BOTTOM_LEFT) { + return SELECTOR_CONTAINER_BOTTOM_LEFT } } _prepareContainer() { if ($(this._getContainerId()).length === 0) { const container = $('
').attr('id', this._getContainerId().replace('#', '')) - if (this._config.position == Position.TOP_RIGHT) { - container.addClass(ClassName.TOP_RIGHT) - } else if (this._config.position == Position.TOP_LEFT) { - container.addClass(ClassName.TOP_LEFT) - } else if (this._config.position == Position.BOTTOM_RIGHT) { - container.addClass(ClassName.BOTTOM_RIGHT) - } else if (this._config.position == Position.BOTTOM_LEFT) { - container.addClass(ClassName.BOTTOM_LEFT) + if (this._config.position == POSITION_TOP_RIGHT) { + container.addClass(CLASS_NAME_TOP_RIGHT) + } else if (this._config.position == POSITION_TOP_LEFT) { + container.addClass(CLASS_NAME_TOP_LEFT) + } else if (this._config.position == POSITION_BOTTOM_RIGHT) { + container.addClass(CLASS_NAME_BOTTOM_RIGHT) + } else if (this._config.position == POSITION_BOTTOM_LEFT) { + container.addClass(CLASS_NAME_BOTTOM_LEFT) } $('body').append(container) diff --git a/build/js/TodoList.js b/build/js/TodoList.js index f995bb7e4..f63fa5199 100644 --- a/build/js/TodoList.js +++ b/build/js/TodoList.js @@ -16,13 +16,8 @@ const NAME = 'TodoList' const DATA_KEY = 'lte.todolist' const JQUERY_NO_CONFLICT = $.fn[NAME] -const Selector = { - DATA_TOGGLE: '[data-widget="todo-list"]' -} - -const ClassName = { - TODO_LIST_DONE: 'done' -} +const SELECTOR_DATA_TOGGLE = '[data-widget="todo-list"]' +const CLASS_NAME_TODO_LIST_DONE = 'done' const Default = { onCheck(item) { @@ -49,7 +44,7 @@ class TodoList { // Public toggle(item) { - item.parents('li').toggleClass(ClassName.TODO_LIST_DONE) + item.parents('li').toggleClass(CLASS_NAME_TODO_LIST_DONE) if (!$(item).prop('checked')) { this.unCheck($(item)) return @@ -69,9 +64,9 @@ class TodoList { // Private _init() { - const $toggleSelector = $(Selector.DATA_TOGGLE) + const $toggleSelector = $(SELECTOR_DATA_TOGGLE) - $toggleSelector.find('input:checkbox:checked').parents('li').toggleClass(ClassName.TODO_LIST_DONE) + $toggleSelector.find('input:checkbox:checked').parents('li').toggleClass(CLASS_NAME_TODO_LIST_DONE) $toggleSelector.on('change', 'input:checkbox', event => { this.toggle($(event.target)) }) @@ -102,7 +97,7 @@ class TodoList { */ $(window).on('load', () => { - TodoList._jQueryInterface.call($(Selector.DATA_TOGGLE)) + TodoList._jQueryInterface.call($(SELECTOR_DATA_TOGGLE)) }) /** diff --git a/build/js/Treeview.js b/build/js/Treeview.js index 5f6091fce..73b99386d 100644 --- a/build/js/Treeview.js +++ b/build/js/Treeview.js @@ -17,28 +17,22 @@ const DATA_KEY = 'lte.treeview' const EVENT_KEY = `.${DATA_KEY}` const JQUERY_NO_CONFLICT = $.fn[NAME] -const Event = { - EXPANDED: `expanded${EVENT_KEY}`, - COLLAPSED: `collapsed${EVENT_KEY}`, - LOAD_DATA_API: `load${EVENT_KEY}` -} +const EVENT_EXPANDED = `expanded${EVENT_KEY}` +const EVENT_COLLAPSED = `collapsed${EVENT_KEY}` +const EVENT_LOAD_DATA_API = `load${EVENT_KEY}` -const Selector = { - LI: '.nav-item', - LINK: '.nav-link', - TREEVIEW_MENU: '.nav-treeview', - OPEN: '.menu-open', - DATA_WIDGET: '[data-widget="treeview"]' -} +const SELECTOR_LI = '.nav-item' +const SELECTOR_LINK = '.nav-link' +const SELECTOR_TREEVIEW_MENU = '.nav-treeview' +const SELECTOR_OPEN = '.menu-open' +const SELECTOR_DATA_WIDGET = '[data-widget="treeview"]' -const ClassName = { - OPEN: 'menu-open', - IS_OPENING: 'menu-is-opening', - SIDEBAR_COLLAPSED: 'sidebar-collapse' -} +const CLASS_NAME_OPEN = 'menu-open' +const CLASS_NAME_IS_OPENING = 'menu-is-opening' +const CLASS_NAME_SIDEBAR_COLLAPSED = 'sidebar-collapse' const Default = { - trigger: `${Selector.DATA_WIDGET} ${Selector.LINK}`, + trigger: `${SELECTOR_DATA_WIDGET} ${SELECTOR_LINK}`, animationSpeed: 300, accordion: true, expandSidebar: false, @@ -58,22 +52,22 @@ class Treeview { // Public init() { - $(`${Selector.LI}${Selector.OPEN} ${Selector.TREEVIEW_MENU}`).css('display', 'block') + $(`${SELECTOR_LI}${SELECTOR_OPEN} ${SELECTOR_TREEVIEW_MENU}`).css('display', 'block') this._setupListeners() } expand(treeviewMenu, parentLi) { - const expandedEvent = $.Event(Event.EXPANDED) + const expandedEvent = $.Event(EVENT_EXPANDED) if (this._config.accordion) { - const openMenuLi = parentLi.siblings(Selector.OPEN).first() - const openTreeview = openMenuLi.find(Selector.TREEVIEW_MENU).first() + const openMenuLi = parentLi.siblings(SELECTOR_OPEN).first() + const openTreeview = openMenuLi.find(SELECTOR_TREEVIEW_MENU).first() this.collapse(openTreeview, openMenuLi) } - parentLi.addClass(ClassName.IS_OPENING) + parentLi.addClass(CLASS_NAME_IS_OPENING) treeviewMenu.stop().slideDown(this._config.animationSpeed, () => { - parentLi.addClass(ClassName.OPEN) + parentLi.addClass(CLASS_NAME_OPEN) $(this._element).trigger(expandedEvent) }) @@ -83,13 +77,13 @@ class Treeview { } collapse(treeviewMenu, parentLi) { - const collapsedEvent = $.Event(Event.COLLAPSED) + const collapsedEvent = $.Event(EVENT_COLLAPSED) - parentLi.removeClass(`${ClassName.IS_OPENING} ${ClassName.OPEN}`) + parentLi.removeClass(`${CLASS_NAME_IS_OPENING} ${CLASS_NAME_OPEN}`) treeviewMenu.stop().slideUp(this._config.animationSpeed, () => { $(this._element).trigger(collapsedEvent) - treeviewMenu.find(`${Selector.OPEN} > ${Selector.TREEVIEW_MENU}`).slideUp() - treeviewMenu.find(Selector.OPEN).removeClass(ClassName.OPEN) + treeviewMenu.find(`${SELECTOR_OPEN} > ${SELECTOR_TREEVIEW_MENU}`).slideUp() + treeviewMenu.find(SELECTOR_OPEN).removeClass(CLASS_NAME_OPEN) }) } @@ -97,22 +91,22 @@ class Treeview { const $relativeTarget = $(event.currentTarget) const $parent = $relativeTarget.parent() - let treeviewMenu = $parent.find('> ' + Selector.TREEVIEW_MENU) + let treeviewMenu = $parent.find('> ' + SELECTOR_TREEVIEW_MENU) - if (!treeviewMenu.is(Selector.TREEVIEW_MENU)) { - if (!$parent.is(Selector.LI)) { - treeviewMenu = $parent.parent().find('> ' + Selector.TREEVIEW_MENU) + if (!treeviewMenu.is(SELECTOR_TREEVIEW_MENU)) { + if (!$parent.is(SELECTOR_LI)) { + treeviewMenu = $parent.parent().find('> ' + SELECTOR_TREEVIEW_MENU) } - if (!treeviewMenu.is(Selector.TREEVIEW_MENU)) { + if (!treeviewMenu.is(SELECTOR_TREEVIEW_MENU)) { return } } event.preventDefault() - const parentLi = $relativeTarget.parents(Selector.LI).first() - const isOpen = parentLi.hasClass(ClassName.OPEN) + const parentLi = $relativeTarget.parents(SELECTOR_LI).first() + const isOpen = parentLi.hasClass(CLASS_NAME_OPEN) if (isOpen) { this.collapse($(treeviewMenu), parentLi) @@ -130,7 +124,7 @@ class Treeview { } _expandSidebar() { - if ($('body').hasClass(ClassName.SIDEBAR_COLLAPSED)) { + if ($('body').hasClass(CLASS_NAME_SIDEBAR_COLLAPSED)) { $(this._config.sidebarButtonSelector).PushMenu('expand') } } @@ -159,8 +153,8 @@ class Treeview { * ==================================================== */ -$(window).on(Event.LOAD_DATA_API, () => { - $(Selector.DATA_WIDGET).each(function () { +$(window).on(EVENT_LOAD_DATA_API, () => { + $(SELECTOR_DATA_WIDGET).each(function () { Treeview._jQueryInterface.call($(this), 'init') }) })