Merge pull request #2751 from XhmikosR/js-tweaks

JS tweaks

build/js/CardRefresh.js

@@ -81,22 +81,17 @@ const CardRefresh = ($ => {
         this._removeOverlay()
       }, this._settings.responseType !== '' && this._settings.responseType)
 
-      const loadedEvent = $.Event(Event.LOADED)
-      $(this._element).trigger(loadedEvent)
+      $(this._element).trigger($.Event(Event.LOADED))
     }
 
     _addOverlay() {
       this._parent.append(this._overlay)
-
-      const overlayAddedEvent = $.Event(Event.OVERLAY_ADDED)
-      $(this._element).trigger(overlayAddedEvent)
+      $(this._element).trigger($.Event(Event.OVERLAY_ADDED))
     }
 
     _removeOverlay() {
       this._parent.find(this._overlay).remove()
-
-      const overlayRemovedEvent = $.Event(Event.OVERLAY_REMOVED)
-      $(this._element).trigger(overlayRemovedEvent)
+      $(this._element).trigger($.Event(Event.OVERLAY_REMOVED))
     }
 
     // Private
@@ -143,7 +138,7 @@ const CardRefresh = ($ => {
     CardRefresh._jQueryInterface.call($(this), 'load')
   })
 
-  $(document).ready(() => {
+  $(() => {
     $(Selector.DATA_REFRESH).each(function () {
       CardRefresh._jQueryInterface.call($(this))
     })

build/js/CardWidget.js

@@ -76,9 +76,7 @@ const CardWidget = ($ => {
         .addClass(this._settings.expandIcon)
         .removeClass(this._settings.collapseIcon)
 
-      const collapsed = $.Event(Event.COLLAPSED)
-
-      this._element.trigger(collapsed, this._parent)
+      this._element.trigger($.Event(Event.COLLAPSED), this._parent)
     }
 
     expand() {
@@ -91,17 +89,12 @@ const CardWidget = ($ => {
         .addClass(this._settings.collapseIcon)
         .removeClass(this._settings.expandIcon)
 
-      const expanded = $.Event(Event.EXPANDED)
-
-      this._element.trigger(expanded, this._parent)
+      this._element.trigger($.Event(Event.EXPANDED), this._parent)
     }
 
     remove() {
       this._parent.slideUp()
-
-      const removed = $.Event(Event.REMOVED)
-
-      this._element.trigger(removed, this._parent)
+      this._element.trigger($.Event(Event.REMOVED), this._parent)
     }
 
     toggle() {
@@ -131,9 +124,7 @@ const CardWidget = ($ => {
         $(this).dequeue()
       })
 
-      const maximized = $.Event(Event.MAXIMIZED)
-
-      this._element.trigger(maximized, this._parent)
+      this._element.trigger($.Event(Event.MAXIMIZED), this._parent)
     }
 
     minimize() {
@@ -156,9 +147,7 @@ const CardWidget = ($ => {
         $(this).dequeue()
       })
 
-      const MINIMIZED = $.Event(Event.MINIMIZED)
-
-      this._element.trigger(MINIMIZED, this._parent)
+      this._element.trigger($.Event(Event.MINIMIZED), this._parent)
     }
 
     toggleMaximize() {

build/js/ControlSidebar.js

@@ -80,8 +80,7 @@ const ControlSidebar = ($ => {
         $('body').removeClass(ClassName.CONTROL_SIDEBAR_OPEN)
       }
 
-      const collapsedEvent = $.Event(Event.COLLAPSED)
-      $(this._element).trigger(collapsedEvent)
+      $(this._element).trigger($.Event(Event.COLLAPSED))
     }
 
     show() {
@@ -99,8 +98,7 @@ const ControlSidebar = ($ => {
         $('body').addClass(ClassName.CONTROL_SIDEBAR_OPEN)
       }
 
-      const expandedEvent = $.Event(Event.EXPANDED)
-      $(this._element).trigger(expandedEvent)
+      $(this._element).trigger($.Event(Event.EXPANDED))
     }
 
     toggle() {
@@ -134,6 +132,10 @@ const ControlSidebar = ($ => {
     }
 
     _fixScrollHeight() {
+      if (!$('body').hasClass(ClassName.LAYOUT_FIXED)) {
+        return
+      }
+
       const heights = {
         scroll: $(document).height(),
         window: $(window).height(),
@@ -148,92 +150,92 @@ const ControlSidebar = ($ => {
       let navbarFixed = false
       let footerFixed = false
 
-      if ($('body').hasClass(ClassName.LAYOUT_FIXED)) {
-        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)
-        ) {
-          if ($(Selector.HEADER).css('position') === 'fixed') {
-            navbarFixed = true
-          }
+      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)
+      ) {
+        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)
-        ) {
-          if ($(Selector.FOOTER).css('position') === 'fixed') {
-            footerFixed = 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)
+      ) {
+        if ($(Selector.FOOTER).css('position') === 'fixed') {
+          footerFixed = true
         }
+      }
 
-        if (positions.top === 0 && positions.bottom === 0) {
+      if (positions.top === 0 && positions.bottom === 0) {
+        $(Selector.CONTROL_SIDEBAR).css('bottom', heights.footer)
+        $(Selector.CONTROL_SIDEBAR).css('top', heights.header)
+        $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window - (heights.header + heights.footer))
+      } else if (positions.bottom <= heights.footer) {
+        if (footerFixed === false) {
+          $(Selector.CONTROL_SIDEBAR).css('bottom', heights.footer - positions.bottom)
+          $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window - (heights.footer - positions.bottom))
+        } else {
           $(Selector.CONTROL_SIDEBAR).css('bottom', heights.footer)
-          $(Selector.CONTROL_SIDEBAR).css('top', heights.header)
-          $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window - (heights.header + heights.footer))
-        } else if (positions.bottom <= heights.footer) {
-          if (footerFixed === false) {
-            $(Selector.CONTROL_SIDEBAR).css('bottom', heights.footer - positions.bottom)
-            $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window - (heights.footer - positions.bottom))
-          } else {
-            $(Selector.CONTROL_SIDEBAR).css('bottom', heights.footer)
-          }
-        } else if (positions.top <= heights.header) {
-          if (navbarFixed === false) {
-            $(Selector.CONTROL_SIDEBAR).css('top', heights.header - positions.top)
-            $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window - (heights.header - positions.top))
-          } else {
-            $(Selector.CONTROL_SIDEBAR).css('top', heights.header)
-          }
-        } else if (navbarFixed === false) {
-          $(Selector.CONTROL_SIDEBAR).css('top', 0)
-          $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window)
+        }
+      } else if (positions.top <= heights.header) {
+        if (navbarFixed === false) {
+          $(Selector.CONTROL_SIDEBAR).css('top', heights.header - positions.top)
+          $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window - (heights.header - positions.top))
         } else {
           $(Selector.CONTROL_SIDEBAR).css('top', heights.header)
         }
+      } else if (navbarFixed === false) {
+        $(Selector.CONTROL_SIDEBAR).css('top', 0)
+        $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window)
+      } else {
+        $(Selector.CONTROL_SIDEBAR).css('top', heights.header)
       }
     }
 
     _fixHeight() {
+      if (!$('body').hasClass(ClassName.LAYOUT_FIXED)) {
+        return
+      }
+
       const heights = {
         window: $(window).height(),
         header: $(Selector.HEADER).outerHeight(),
         footer: $(Selector.FOOTER).outerHeight()
       }
 
-      if ($('body').hasClass(ClassName.LAYOUT_FIXED)) {
-        let sidebarHeight = heights.window - heights.header
+      let sidebarHeight = heights.window - heights.header
 
-        if (
-          $('body').hasClass(ClassName.FOOTER_FIXED) ||
+      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)
-        ) {
-          if ($(Selector.FOOTER).css('position') === 'fixed') {
-            sidebarHeight = heights.window - heights.header - heights.footer
-          }
+      ) {
+        if ($(Selector.FOOTER).css('position') === 'fixed') {
+          sidebarHeight = heights.window - heights.header - heights.footer
         }
+      }
 
-        $(Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', sidebarHeight)
+      $(Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', sidebarHeight)
 
-        if (typeof $.fn.overlayScrollbars !== 'undefined') {
-          $(Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).overlayScrollbars({
-            className: this._config.scrollbarTheme,
-            sizeAutoCapable: true,
-            scrollbars: {
-              autoHide: this._config.scrollbarAutoHide,
-              clickScrolling: true
-            }
-          })
-        }
+      if (typeof $.fn.overlayScrollbars !== 'undefined') {
+        $(Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).overlayScrollbars({
+          className: this._config.scrollbarTheme,
+          sizeAutoCapable: true,
+          scrollbars: {
+            autoHide: this._config.scrollbarAutoHide,
+            clickScrolling: true
+          }
+        })
       }
     }
 

build/js/DirectChat.js

@@ -40,9 +40,7 @@ const DirectChat = ($ => {
 
     toggle() {
       $(this._element).parents(Selector.DIRECT_CHAT).first().toggleClass(ClassName.DIRECT_CHAT_OPEN)
-
-      const toggledEvent = $.Event(Event.TOGGLED)
-      $(this._element).trigger(toggledEvent)
+      $(this._element).trigger($.Event(Event.TOGGLED))
     }
 
     // Static

build/js/Dropdown.js

@@ -46,7 +46,7 @@ const Dropdown = ($ => {
       this._element.siblings().show().toggleClass('show')
 
       if (!this._element.next().hasClass('show')) {
-        this._element.parents('.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', () => {

build/js/Layout.js

@@ -60,7 +60,7 @@ const Layout = ($ => {
     fixLayoutHeight(extra = null) {
       let controlSidebar = 0
 
-      if ($('body').hasClass(ClassName.CONTROL_SIDEBAR_SLIDE_OPEN) || $('body').hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || extra === 'controlSidebar') {
+      if ($('body').hasClass(ClassName.CONTROL_SIDEBAR_SLIDE_OPEN) || $('body').hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || extra === 'control_sidebar') {
         controlSidebar = $(Selector.CONTROL_SIDEBAR_CONTENT).height()
       }
 
@@ -93,28 +93,30 @@ const Layout = ($ => {
         }
       }
 
-      if ($('body').hasClass(ClassName.LAYOUT_FIXED)) {
-        if (offset !== false) {
-          $(Selector.CONTENT).css('min-height', (max + offset) - heights.header - heights.footer)
-        }
+      if (!$('body').hasClass(ClassName.LAYOUT_FIXED)) {
+        return
+      }
 
-        if (typeof $.fn.overlayScrollbars !== 'undefined') {
-          $(Selector.SIDEBAR).overlayScrollbars({
-            className: this._config.scrollbarTheme,
-            sizeAutoCapable: true,
-            scrollbars: {
-              autoHide: this._config.scrollbarAutoHide,
-              clickScrolling: true
-            }
-          })
-        }
+      if (offset !== false) {
+        $(Selector.CONTENT).css('min-height', (max + offset) - heights.header - heights.footer)
+      }
+
+      if (typeof $.fn.overlayScrollbars !== 'undefined') {
+        $(Selector.SIDEBAR).overlayScrollbars({
+          className: this._config.scrollbarTheme,
+          sizeAutoCapable: true,
+          scrollbars: {
+            autoHide: this._config.scrollbarAutoHide,
+            clickScrolling: true
+          }
+        })
       }
     }
 
     fixLoginRegisterHeight() {
       if ($(Selector.LOGIN_BOX + ', ' + Selector.REGISTER_BOX).length === 0) {
         $('body, html').css('height', 'auto')
-      } else if ($(Selector.LOGIN_BOX + ', ' + Selector.REGISTER_BOX).length !== 0) {
+      } else {
         const boxHeight = $(Selector.LOGIN_BOX + ', ' + Selector.REGISTER_BOX).height()
 
         if ($('body').css('min-height') !== boxHeight) {
@@ -150,7 +152,7 @@ const Layout = ($ => {
           this.fixLayoutHeight()
         })
         .on('expanded.lte.controlsidebar', () => {
-          this.fixLayoutHeight('controlSidebar')
+          this.fixLayoutHeight('control_sidebar')
         })
 
       $(window).resize(() => {

build/js/PushMenu.js

@@ -72,8 +72,7 @@ const PushMenu = ($ => {
         localStorage.setItem(`remember${EVENT_KEY}`, ClassName.OPEN)
       }
 
-      const shownEvent = $.Event(Event.SHOWN)
-      $(this._element).trigger(shownEvent)
+      $(this._element).trigger($.Event(Event.SHOWN))
     }
 
     collapse() {
@@ -89,8 +88,7 @@ const PushMenu = ($ => {
         localStorage.setItem(`remember${EVENT_KEY}`, ClassName.COLLAPSED)
       }
 
-      const collapsedEvent = $.Event(Event.COLLAPSED)
-      $(this._element).trigger(collapsedEvent)
+      $(this._element).trigger($.Event(Event.COLLAPSED))
     }
 
     toggle() {
@@ -102,41 +100,45 @@ const PushMenu = ($ => {
     }
 
     autoCollapse(resize = false) {
-      if (this._options.autoCollapseSize) {
-        if ($(window).width() <= this._options.autoCollapseSize) {
-          if (!$(Selector.BODY).hasClass(ClassName.OPEN)) {
-            this.collapse()
-          }
-        } else if (resize === true) {
-          if ($(Selector.BODY).hasClass(ClassName.OPEN)) {
-            $(Selector.BODY).removeClass(ClassName.OPEN)
-          } else if ($(Selector.BODY).hasClass(ClassName.CLOSED)) {
-            this.expand()
-          }
+      if (!this._options.autoCollapseSize) {
+        return
+      }
+
+      if ($(window).width() <= this._options.autoCollapseSize) {
+        if (!$(Selector.BODY).hasClass(ClassName.OPEN)) {
+          this.collapse()
+        }
+      } else if (resize === true) {
+        if ($(Selector.BODY).hasClass(ClassName.OPEN)) {
+          $(Selector.BODY).removeClass(ClassName.OPEN)
+        } else if ($(Selector.BODY).hasClass(ClassName.CLOSED)) {
+          this.expand()
         }
       }
     }
 
     remember() {
-      if (this._options.enableRemember) {
-        const toggleState = localStorage.getItem(`remember${EVENT_KEY}`)
-        if (toggleState === ClassName.COLLAPSED) {
-          if (this._options.noTransitionAfterReload) {
-            $('body').addClass('hold-transition').addClass(ClassName.COLLAPSED).delay(50).queue(function () {
-              $(this).removeClass('hold-transition')
-              $(this).dequeue()
-            })
-          } else {
-            $('body').addClass(ClassName.COLLAPSED)
-          }
-        } else if (this._options.noTransitionAfterReload) {
-          $('body').addClass('hold-transition').removeClass(ClassName.COLLAPSED).delay(50).queue(function () {
+      if (!this._options.enableRemember) {
+        return
+      }
+
+      const toggleState = localStorage.getItem(`remember${EVENT_KEY}`)
+      if (toggleState === ClassName.COLLAPSED) {
+        if (this._options.noTransitionAfterReload) {
+          $('body').addClass('hold-transition').addClass(ClassName.COLLAPSED).delay(50).queue(function () {
             $(this).removeClass('hold-transition')
             $(this).dequeue()
           })
         } else {
-          $('body').removeClass(ClassName.COLLAPSED)
+          $('body').addClass(ClassName.COLLAPSED)
         }
+      } else if (this._options.noTransitionAfterReload) {
+        $('body').addClass('hold-transition').removeClass(ClassName.COLLAPSED).delay(50).queue(function () {
+          $(this).removeClass('hold-transition')
+          $(this).dequeue()
+        })
+      } else {
+        $('body').removeClass(ClassName.COLLAPSED)
       }
     }
 

build/js/Toasts.js

@@ -68,11 +68,9 @@ const Toasts = ($ => {
   class Toasts {
     constructor(element, config) {
       this._config = config
-
       this._prepareContainer()
 
-      const initEvent = $.Event(Event.INIT)
-      $('body').trigger(initEvent)
+      $('body').trigger($.Event(Event.INIT))
     }
 
     // Public
@@ -133,17 +131,14 @@ const Toasts = ($ => {
 
       $(this._getContainerId()).prepend(toast)
 
-      const createdEvent = $.Event(Event.CREATED)
-      $('body').trigger(createdEvent)
+      $('body').trigger($.Event(Event.CREATED))
 
       toast.toast('show')
 
       if (this._config.autoremove) {
         toast.on('hidden.bs.toast', function () {
           $(this).delay(200).remove()
-
-          const removedEvent = $.Event(Event.REMOVED)
-          $('body').trigger(removedEvent)
+          $('body').trigger($.Event(Event.REMOVED))
         })
       }
     }

build/js/TodoList.js

@@ -68,10 +68,9 @@ const TodoList = ($ => {
     // Private
 
     _init() {
-      const that = this
       $(Selector.DATA_TOGGLE).find('input:checkbox:checked').parents('li').toggleClass(ClassName.TODO_LIST_DONE)
       $(Selector.DATA_TOGGLE).on('change', 'input:checkbox', event => {
-        that.toggle($(event.target))
+        this.toggle($(event.target))
       })
     }
 

pages/forms/general.html

@@ -1314,7 +1314,7 @@
 <!-- AdminLTE for demo purposes -->
 <script src="../../dist/js/demo.js"></script>
 <script>
-$(document).ready(function () {
+$(function () {
   bsCustomFileInput.init();
 });
 </script>