maxmustermann/AdminLTE
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Comply to the ESLint rules.

Browse source
This commit is contained in:
XhmikosR 2020-05-30 16:44:20 +03:00
parent 5ba59f1454
commit 27ff009494
22 changed files with 720 additions and 744 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
build/config/postcss.config.js
View file

@ -1,6 +1,6 @@
'use strict' 'use strict'
module.exports = (ctx) => ({ module.exports = () => ({
map: { map: {
inline: false, inline: false,
annotation: true, annotation: true,

4
build/config/rollup.config.js
View file

@ -1,6 +1,8 @@
'use strict'
const { babel } = require('@rollup/plugin-babel') const { babel } = require('@rollup/plugin-babel')
const pkg = require('../../package') const pkg = require('../../package')
const year = new Date().getFullYear() const year = new Date().getFullYear()
const banner = `/*! const banner = `/*!
* AdminLTE v${pkg.version} (${pkg.homepage}) * AdminLTE v${pkg.version} (${pkg.homepage})

47
build/js/CardRefresh.js
View file

@ -5,30 +5,30 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const CardRefresh = (($) => { const CardRefresh = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'CardRefresh' const NAME = 'CardRefresh'
const DATA_KEY = 'lte.cardrefresh' const DATA_KEY = 'lte.cardrefresh'
const EVENT_KEY = `.${DATA_KEY}` const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const Event = { const Event = {
LOADED: `loaded${EVENT_KEY}`, LOADED: `loaded${EVENT_KEY}`,
OVERLAY_ADDED: `overlay.added${EVENT_KEY}`, OVERLAY_ADDED: `overlay.added${EVENT_KEY}`,
OVERLAY_REMOVED: `overlay.removed${EVENT_KEY}`, OVERLAY_REMOVED: `overlay.removed${EVENT_KEY}`
} }
const ClassName = { const ClassName = {
CARD: 'card', CARD: 'card'
} }
const Selector = { const Selector = {
CARD: `.${ClassName.CARD}`, CARD: `.${ClassName.CARD}`,
DATA_REFRESH: '[data-card-widget="card-refresh"]', DATA_REFRESH: '[data-card-widget="card-refresh"]'
} }
const Default = { const Default = {
@ -41,16 +41,16 @@ const CardRefresh = (($) => {
loadOnInit: true, loadOnInit: true,
responseType: '', responseType: '',
overlayTemplate: '<div class="overlay"><i class="fas fa-2x fa-sync-alt fa-spin"></i></div>', overlayTemplate: '<div class="overlay"><i class="fas fa-2x fa-sync-alt fa-spin"></i></div>',
onLoadStart: function () { onLoadStart() {
}, },
onLoadDone: function (response) { onLoadDone(response) {
return response; return response
} }
} }
class CardRefresh { class CardRefresh {
constructor(element, settings) { constructor(element, settings) {
this._element = element this._element = element
this._parent = element.parents(Selector.CARD).first() this._parent = element.parents(Selector.CARD).first()
this._settings = $.extend({}, Default, settings) this._settings = $.extend({}, Default, settings)
this._overlay = $(this._settings.overlayTemplate) this._overlay = $(this._settings.overlayTemplate)
@ -60,7 +60,7 @@ const CardRefresh = (($) => {
} }
if (this._settings.source === '') { if (this._settings.source === '') {
throw new Error('Source url was not defined. Please specify a url in your CardRefresh source option.'); throw new Error('Source url was not defined. Please specify a url in your CardRefresh source option.')
} }
} }
@ -68,9 +68,9 @@ const CardRefresh = (($) => {
this._addOverlay() this._addOverlay()
this._settings.onLoadStart.call($(this)) this._settings.onLoadStart.call($(this))
$.get(this._settings.source, this._settings.params, function (response) { $.get(this._settings.source, this._settings.params, response => {
if (this._settings.loadInContent) { if (this._settings.loadInContent) {
if (this._settings.sourceSelector != '') { if (this._settings.sourceSelector !== '') {
response = $(response).find(this._settings.sourceSelector).html() response = $(response).find(this._settings.sourceSelector).html()
} }
@ -78,8 +78,8 @@ const CardRefresh = (($) => {
} }
this._settings.onLoadDone.call($(this), response) this._settings.onLoadDone.call($(this), response)
this._removeOverlay(); this._removeOverlay()
}.bind(this), this._settings.responseType !== '' && this._settings.responseType) }, this._settings.responseType !== '' && this._settings.responseType)
const loadedEvent = $.Event(Event.LOADED) const loadedEvent = $.Event(Event.LOADED)
$(this._element).trigger(loadedEvent) $(this._element).trigger(loadedEvent)
@ -90,19 +90,18 @@ const CardRefresh = (($) => {
const overlayAddedEvent = $.Event(Event.OVERLAY_ADDED) const overlayAddedEvent = $.Event(Event.OVERLAY_ADDED)
$(this._element).trigger(overlayAddedEvent) $(this._element).trigger(overlayAddedEvent)
}; }
_removeOverlay() { _removeOverlay() {
this._parent.find(this._overlay).remove() this._parent.find(this._overlay).remove()
const overlayRemovedEvent = $.Event(Event.OVERLAY_REMOVED) const overlayRemovedEvent = $.Event(Event.OVERLAY_REMOVED)
$(this._element).trigger(overlayRemovedEvent) $(this._element).trigger(overlayRemovedEvent)
}; }
// Private // Private
_init(card) { _init() {
$(this).find(this._settings.trigger).on('click', () => { $(this).find(this._settings.trigger).on('click', () => {
this.load() this.load()
}) })
@ -120,7 +119,7 @@ const CardRefresh = (($) => {
if (!data) { if (!data) {
data = new CardRefresh($(this), _options) data = new CardRefresh($(this), _options)
$(this).data(DATA_KEY, typeof config === 'string' ? data: config) $(this).data(DATA_KEY, typeof config === 'string' ? data : config)
} }
if (typeof config === 'string' && config.match(/load/)) { if (typeof config === 'string' && config.match(/load/)) {
@ -144,8 +143,8 @@ const CardRefresh = (($) => {
CardRefresh._jQueryInterface.call($(this), 'load') CardRefresh._jQueryInterface.call($(this), 'load')
}) })
$(document).ready(function () { $(document).ready(() => {
$(Selector.DATA_REFRESH).each(function() { $(Selector.DATA_REFRESH).each(function () {
CardRefresh._jQueryInterface.call($(this)) CardRefresh._jQueryInterface.call($(this))
}) })
}) })
@ -157,7 +156,7 @@ const CardRefresh = (($) => {
$.fn[NAME] = CardRefresh._jQueryInterface $.fn[NAME] = CardRefresh._jQueryInterface
$.fn[NAME].Constructor = CardRefresh $.fn[NAME].Constructor = CardRefresh
$.fn[NAME].noConflict = function () { $.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT $.fn[NAME] = JQUERY_NO_CONFLICT
return CardRefresh._jQueryInterface return CardRefresh._jQueryInterface
} }

37
build/js/CardWidget.js
View file

@ -5,15 +5,15 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const CardWidget = (($) => { const CardWidget = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'CardWidget' const NAME = 'CardWidget'
const DATA_KEY = 'lte.cardwidget' const DATA_KEY = 'lte.cardwidget'
const EVENT_KEY = `.${DATA_KEY}` const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const Event = { const Event = {
@ -30,7 +30,7 @@ const CardWidget = (($) => {
COLLAPSING: 'collapsing-card', COLLAPSING: 'collapsing-card',
EXPANDING: 'expanding-card', EXPANDING: 'expanding-card',
WAS_COLLAPSED: 'was-collapsed', WAS_COLLAPSED: 'was-collapsed',
MAXIMIZED: 'maximized-card', MAXIMIZED: 'maximized-card'
} }
const Selector = { const Selector = {
@ -40,8 +40,7 @@ const CardWidget = (($) => {
CARD: `.${ClassName.CARD}`, CARD: `.${ClassName.CARD}`,
CARD_HEADER: '.card-header', CARD_HEADER: '.card-header',
CARD_BODY: '.card-body', CARD_BODY: '.card-body',
CARD_FOOTER: '.card-footer', CARD_FOOTER: '.card-footer'
COLLAPSED: `.${ClassName.COLLAPSED}`,
} }
const Default = { const Default = {
@ -52,12 +51,12 @@ const CardWidget = (($) => {
collapseIcon: 'fa-minus', collapseIcon: 'fa-minus',
expandIcon: 'fa-plus', expandIcon: 'fa-plus',
maximizeIcon: 'fa-expand', maximizeIcon: 'fa-expand',
minimizeIcon: 'fa-compress', minimizeIcon: 'fa-compress'
} }
class CardWidget { class CardWidget {
constructor(element, settings) { constructor(element, settings) {
this._element = element 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(ClassName.CARD)) {
@ -119,15 +118,16 @@ const CardWidget = (($) => {
.addClass(this._settings.minimizeIcon) .addClass(this._settings.minimizeIcon)
.removeClass(this._settings.maximizeIcon) .removeClass(this._settings.maximizeIcon)
this._parent.css({ this._parent.css({
'height': this._parent.height(), height: this._parent.height(),
'width': this._parent.width(), width: this._parent.width(),
'transition': 'all .15s' transition: 'all .15s'
}).delay(150).queue(function(){ }).delay(150).queue(function () {
$(this).addClass(ClassName.MAXIMIZED) $(this).addClass(ClassName.MAXIMIZED)
$('html').addClass(ClassName.MAXIMIZED) $('html').addClass(ClassName.MAXIMIZED)
if ($(this).hasClass(ClassName.COLLAPSED)) { if ($(this).hasClass(ClassName.COLLAPSED)) {
$(this).addClass(ClassName.WAS_COLLAPSED) $(this).addClass(ClassName.WAS_COLLAPSED)
} }
$(this).dequeue() $(this).dequeue()
}) })
@ -142,16 +142,17 @@ const CardWidget = (($) => {
.removeClass(this._settings.minimizeIcon) .removeClass(this._settings.minimizeIcon)
this._parent.css('cssText', 'height:' + this._parent[0].style.height + ' !important;' + this._parent.css('cssText', 'height:' + this._parent[0].style.height + ' !important;' +
'width:' + this._parent[0].style.width + ' !important; transition: all .15s;' 'width:' + this._parent[0].style.width + ' !important; transition: all .15s;'
).delay(10).queue(function(){ ).delay(10).queue(function () {
$(this).removeClass(ClassName.MAXIMIZED) $(this).removeClass(ClassName.MAXIMIZED)
$('html').removeClass(ClassName.MAXIMIZED) $('html').removeClass(ClassName.MAXIMIZED)
$(this).css({ $(this).css({
'height': 'inherit', height: 'inherit',
'width': 'inherit' width: 'inherit'
}) })
if ($(this).hasClass(ClassName.WAS_COLLAPSED)) { if ($(this).hasClass(ClassName.WAS_COLLAPSED)) {
$(this).removeClass(ClassName.WAS_COLLAPSED) $(this).removeClass(ClassName.WAS_COLLAPSED)
} }
$(this).dequeue() $(this).dequeue()
}) })
@ -195,7 +196,7 @@ const CardWidget = (($) => {
if (!data) { if (!data) {
data = new CardWidget($(this), _options) data = new CardWidget($(this), _options)
$(this).data(DATA_KEY, typeof config === 'string' ? data: config) $(this).data(DATA_KEY, typeof config === 'string' ? data : config)
} }
if (typeof config === 'string' && config.match(/collapse|expand|remove|toggle|maximize|minimize|toggleMaximize/)) { if (typeof config === 'string' && config.match(/collapse|expand|remove|toggle|maximize|minimize|toggleMaximize/)) {
@ -242,7 +243,7 @@ const CardWidget = (($) => {
$.fn[NAME] = CardWidget._jQueryInterface $.fn[NAME] = CardWidget._jQueryInterface
$.fn[NAME].Constructor = CardWidget $.fn[NAME].Constructor = CardWidget
$.fn[NAME].noConflict = function () { $.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT $.fn[NAME] = JQUERY_NO_CONFLICT
return CardWidget._jQueryInterface return CardWidget._jQueryInterface
} }

118
build/js/ControlSidebar.js
View file

@ -5,30 +5,28 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const ControlSidebar = (($) => { const ControlSidebar = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'ControlSidebar' const NAME = 'ControlSidebar'
const DATA_KEY = 'lte.controlsidebar' const DATA_KEY = 'lte.controlsidebar'
const EVENT_KEY = `.${DATA_KEY}` const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const DATA_API_KEY = '.data-api'
const Event = { const Event = {
COLLAPSED: `collapsed${EVENT_KEY}`, COLLAPSED: `collapsed${EVENT_KEY}`,
EXPANDED: `expanded${EVENT_KEY}`, EXPANDED: `expanded${EVENT_KEY}`
} }
const Selector = { const Selector = {
CONTROL_SIDEBAR: '.control-sidebar', CONTROL_SIDEBAR: '.control-sidebar',
CONTROL_SIDEBAR_CONTENT: '.control-sidebar-content', CONTROL_SIDEBAR_CONTENT: '.control-sidebar-content',
DATA_TOGGLE: '[data-widget="control-sidebar"]', DATA_TOGGLE: '[data-widget="control-sidebar"]',
CONTENT: '.content-wrapper',
HEADER: '.main-header', HEADER: '.main-header',
FOOTER: '.main-footer', FOOTER: '.main-footer'
} }
const ClassName = { const ClassName = {
@ -45,13 +43,13 @@ const ControlSidebar = (($) => {
FOOTER_SM_FIXED: 'layout-sm-footer-fixed', FOOTER_SM_FIXED: 'layout-sm-footer-fixed',
FOOTER_MD_FIXED: 'layout-md-footer-fixed', FOOTER_MD_FIXED: 'layout-md-footer-fixed',
FOOTER_LG_FIXED: 'layout-lg-footer-fixed', FOOTER_LG_FIXED: 'layout-lg-footer-fixed',
FOOTER_XL_FIXED: 'layout-xl-footer-fixed', FOOTER_XL_FIXED: 'layout-xl-footer-fixed'
} }
const Default = { const Default = {
controlsidebarSlide: true, controlsidebarSlide: true,
scrollbarTheme : 'os-theme-light', scrollbarTheme: 'os-theme-light',
scrollbarAutoHide: 'l', scrollbarAutoHide: 'l'
} }
/** /**
@ -62,7 +60,7 @@ const ControlSidebar = (($) => {
class ControlSidebar { class ControlSidebar {
constructor(element, config) { constructor(element, config) {
this._element = element this._element = element
this._config = config this._config = config
this._init() this._init()
} }
@ -73,7 +71,7 @@ const ControlSidebar = (($) => {
// Show the control sidebar // Show the control sidebar
if (this._config.controlsidebarSlide) { if (this._config.controlsidebarSlide) {
$('html').addClass(ClassName.CONTROL_SIDEBAR_ANIMATE) $('html').addClass(ClassName.CONTROL_SIDEBAR_ANIMATE)
$('body').removeClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function(){ $('body').removeClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function () {
$(Selector.CONTROL_SIDEBAR).hide() $(Selector.CONTROL_SIDEBAR).hide()
$('html').removeClass(ClassName.CONTROL_SIDEBAR_ANIMATE) $('html').removeClass(ClassName.CONTROL_SIDEBAR_ANIMATE)
$(this).dequeue() $(this).dequeue()
@ -90,8 +88,8 @@ const ControlSidebar = (($) => {
// Collapse the control sidebar // Collapse the control sidebar
if (this._config.controlsidebarSlide) { if (this._config.controlsidebarSlide) {
$('html').addClass(ClassName.CONTROL_SIDEBAR_ANIMATE) $('html').addClass(ClassName.CONTROL_SIDEBAR_ANIMATE)
$(Selector.CONTROL_SIDEBAR).show().delay(10).queue(function(){ $(Selector.CONTROL_SIDEBAR).show().delay(10).queue(function () {
$('body').addClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function(){ $('body').addClass(ClassName.CONTROL_SIDEBAR_SLIDE).delay(300).queue(function () {
$('html').removeClass(ClassName.CONTROL_SIDEBAR_ANIMATE) $('html').removeClass(ClassName.CONTROL_SIDEBAR_ANIMATE)
$(this).dequeue() $(this).dequeue()
}) })
@ -130,7 +128,7 @@ const ControlSidebar = (($) => {
$(window).scroll(() => { $(window).scroll(() => {
if ($('body').hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || $('body').hasClass(ClassName.CONTROL_SIDEBAR_SLIDE)) { if ($('body').hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || $('body').hasClass(ClassName.CONTROL_SIDEBAR_SLIDE)) {
this._fixScrollHeight() this._fixScrollHeight()
} }
}) })
} }
@ -140,65 +138,64 @@ const ControlSidebar = (($) => {
scroll: $(document).height(), scroll: $(document).height(),
window: $(window).height(), window: $(window).height(),
header: $(Selector.HEADER).outerHeight(), header: $(Selector.HEADER).outerHeight(),
footer: $(Selector.FOOTER).outerHeight(), footer: $(Selector.FOOTER).outerHeight()
} }
const positions = { const positions = {
bottom: Math.abs((heights.window + $(window).scrollTop()) - heights.scroll), bottom: Math.abs((heights.window + $(window).scrollTop()) - heights.scroll),
top: $(window).scrollTop(), top: $(window).scrollTop()
} }
let navbarFixed = false; let navbarFixed = false
let footerFixed = false; let footerFixed = false
if ($('body').hasClass(ClassName.LAYOUT_FIXED)) { if ($('body').hasClass(ClassName.LAYOUT_FIXED)) {
if ( if (
$('body').hasClass(ClassName.NAVBAR_FIXED) $('body').hasClass(ClassName.NAVBAR_FIXED) ||
|| $('body').hasClass(ClassName.NAVBAR_SM_FIXED) $('body').hasClass(ClassName.NAVBAR_SM_FIXED) ||
|| $('body').hasClass(ClassName.NAVBAR_MD_FIXED) $('body').hasClass(ClassName.NAVBAR_MD_FIXED) ||
|| $('body').hasClass(ClassName.NAVBAR_LG_FIXED) $('body').hasClass(ClassName.NAVBAR_LG_FIXED) ||
|| $('body').hasClass(ClassName.NAVBAR_XL_FIXED) $('body').hasClass(ClassName.NAVBAR_XL_FIXED)
) { ) {
if ($(Selector.HEADER).css("position") === "fixed") { if ($(Selector.HEADER).css('position') === 'fixed') {
navbarFixed = true; navbarFixed = true
} }
} }
if ( if (
$('body').hasClass(ClassName.FOOTER_FIXED) $('body').hasClass(ClassName.FOOTER_FIXED) ||
|| $('body').hasClass(ClassName.FOOTER_SM_FIXED) $('body').hasClass(ClassName.FOOTER_SM_FIXED) ||
|| $('body').hasClass(ClassName.FOOTER_MD_FIXED) $('body').hasClass(ClassName.FOOTER_MD_FIXED) ||
|| $('body').hasClass(ClassName.FOOTER_LG_FIXED) $('body').hasClass(ClassName.FOOTER_LG_FIXED) ||
|| $('body').hasClass(ClassName.FOOTER_XL_FIXED) $('body').hasClass(ClassName.FOOTER_XL_FIXED)
) { ) {
if ($(Selector.FOOTER).css("position") === "fixed") { if ($(Selector.FOOTER).css('position') === 'fixed') {
footerFixed = true; 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('bottom', heights.footer)
$(Selector.CONTROL_SIDEBAR).css('top', heights.header); $(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)) $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window - (heights.header + heights.footer))
} else if (positions.bottom <= heights.footer) { } else if (positions.bottom <= heights.footer) {
if (footerFixed === false) { if (footerFixed === false) {
$(Selector.CONTROL_SIDEBAR).css('bottom', heights.footer - positions.bottom); $(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)) $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window - (heights.footer - positions.bottom))
} else { } else {
$(Selector.CONTROL_SIDEBAR).css('bottom', heights.footer); $(Selector.CONTROL_SIDEBAR).css('bottom', heights.footer)
} }
} else if (positions.top <= heights.header) { } else if (positions.top <= heights.header) {
if (navbarFixed === false) { if (navbarFixed === false) {
$(Selector.CONTROL_SIDEBAR).css('top', heights.header - positions.top); $(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)) $(Selector.CONTROL_SIDEBAR + ', ' + Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).css('height', heights.window - (heights.header - positions.top))
} else { } else {
$(Selector.CONTROL_SIDEBAR).css('top', heights.header); $(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 { } else {
if (navbarFixed === false) { $(Selector.CONTROL_SIDEBAR).css('top', heights.header)
$(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);
}
} }
} }
} }
@ -207,21 +204,21 @@ const ControlSidebar = (($) => {
const heights = { const heights = {
window: $(window).height(), window: $(window).height(),
header: $(Selector.HEADER).outerHeight(), header: $(Selector.HEADER).outerHeight(),
footer: $(Selector.FOOTER).outerHeight(), footer: $(Selector.FOOTER).outerHeight()
} }
if ($('body').hasClass(ClassName.LAYOUT_FIXED)) { if ($('body').hasClass(ClassName.LAYOUT_FIXED)) {
let sidebarHeight = heights.window - heights.header; let sidebarHeight = heights.window - heights.header
if ( if (
$('body').hasClass(ClassName.FOOTER_FIXED) $('body').hasClass(ClassName.FOOTER_FIXED) ||
|| $('body').hasClass(ClassName.FOOTER_SM_FIXED) $('body').hasClass(ClassName.FOOTER_SM_FIXED) ||
|| $('body').hasClass(ClassName.FOOTER_MD_FIXED) $('body').hasClass(ClassName.FOOTER_MD_FIXED) ||
|| $('body').hasClass(ClassName.FOOTER_LG_FIXED) $('body').hasClass(ClassName.FOOTER_LG_FIXED) ||
|| $('body').hasClass(ClassName.FOOTER_XL_FIXED) $('body').hasClass(ClassName.FOOTER_XL_FIXED)
) { ) {
if ($(Selector.FOOTER).css("position") === "fixed") { if ($(Selector.FOOTER).css('position') === 'fixed') {
sidebarHeight = heights.window - heights.header - heights.footer; sidebarHeight = heights.window - heights.header - heights.footer
} }
} }
@ -229,18 +226,17 @@ const ControlSidebar = (($) => {
if (typeof $.fn.overlayScrollbars !== 'undefined') { if (typeof $.fn.overlayScrollbars !== 'undefined') {
$(Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).overlayScrollbars({ $(Selector.CONTROL_SIDEBAR + ' ' + Selector.CONTROL_SIDEBAR_CONTENT).overlayScrollbars({
className : this._config.scrollbarTheme, className: this._config.scrollbarTheme,
sizeAutoCapable : true, sizeAutoCapable: true,
scrollbars : { scrollbars: {
autoHide: this._config.scrollbarAutoHide, autoHide: this._config.scrollbarAutoHide,
clickScrolling : true clickScrolling: true
} }
}) })
} }
} }
} }
// Static // Static
static _jQueryInterface(operation) { static _jQueryInterface(operation) {
@ -280,7 +276,7 @@ const ControlSidebar = (($) => {
$.fn[NAME] = ControlSidebar._jQueryInterface $.fn[NAME] = ControlSidebar._jQueryInterface
$.fn[NAME].Constructor = ControlSidebar $.fn[NAME].Constructor = ControlSidebar
$.fn[NAME].noConflict = function () { $.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT $.fn[NAME] = JQUERY_NO_CONFLICT
return ControlSidebar._jQueryInterface return ControlSidebar._jQueryInterface
} }

31
build/js/DirectChat.js
View file

@ -5,30 +5,28 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const DirectChat = (($) => { const DirectChat = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'DirectChat' const NAME = 'DirectChat'
const DATA_KEY = 'lte.directchat' const DATA_KEY = 'lte.directchat'
const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const DATA_API_KEY = '.data-api'
const Event = { const Event = {
TOGGLED: `toggled{EVENT_KEY}` TOGGLED: 'toggled{EVENT_KEY}'
} }
const Selector = { const Selector = {
DATA_TOGGLE: '[data-widget="chat-pane-toggle"]', DATA_TOGGLE: '[data-widget="chat-pane-toggle"]',
DIRECT_CHAT: '.direct-chat' DIRECT_CHAT: '.direct-chat'
}; }
const ClassName = { const ClassName = {
DIRECT_CHAT_OPEN: 'direct-chat-contacts-open' DIRECT_CHAT_OPEN: 'direct-chat-contacts-open'
}; }
/** /**
* Class Definition * Class Definition
@ -36,12 +34,12 @@ const DirectChat = (($) => {
*/ */
class DirectChat { class DirectChat {
constructor(element, config) { constructor(element) {
this._element = element this._element = element
} }
toggle() { toggle() {
$(this._element).parents(Selector.DIRECT_CHAT).first().toggleClass(ClassName.DIRECT_CHAT_OPEN); $(this._element).parents(Selector.DIRECT_CHAT).first().toggleClass(ClassName.DIRECT_CHAT_OPEN)
const toggledEvent = $.Event(Event.TOGGLED) const toggledEvent = $.Event(Event.TOGGLED)
$(this._element).trigger(toggledEvent) $(this._element).trigger(toggledEvent)
@ -51,7 +49,7 @@ const DirectChat = (($) => {
static _jQueryInterface(config) { static _jQueryInterface(config) {
return this.each(function () { return this.each(function () {
let data = $(this).data(DATA_KEY) let data = $(this).data(DATA_KEY)
if (!data) { if (!data) {
data = new DirectChat($(this)) data = new DirectChat($(this))
@ -70,9 +68,12 @@ const DirectChat = (($) => {
*/ */
$(document).on('click', Selector.DATA_TOGGLE, function (event) { $(document).on('click', Selector.DATA_TOGGLE, function (event) {
if (event) event.preventDefault(); if (event) {
DirectChat._jQueryInterface.call($(this), 'toggle'); event.preventDefault()
}); }
DirectChat._jQueryInterface.call($(this), 'toggle')
})
/** /**
* jQuery API * jQuery API
@ -81,7 +82,7 @@ const DirectChat = (($) => {
$.fn[NAME] = DirectChat._jQueryInterface $.fn[NAME] = DirectChat._jQueryInterface
$.fn[NAME].Constructor = DirectChat $.fn[NAME].Constructor = DirectChat
$.fn[NAME].noConflict = function () { $.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT $.fn[NAME] = JQUERY_NO_CONFLICT
return DirectChat._jQueryInterface return DirectChat._jQueryInterface
} }

55
build/js/Dropdown.js
View file

@ -5,33 +5,30 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const Dropdown = (($) => { const Dropdown = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'Dropdown' const NAME = 'Dropdown'
const DATA_KEY = 'lte.dropdown' const DATA_KEY = 'lte.dropdown'
const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const Selector = { const Selector = {
NAVBAR: '.navbar', NAVBAR: '.navbar',
DROPDOWN_MENU: '.dropdown-menu', DROPDOWN_MENU: '.dropdown-menu',
DROPDOWN_MENU_ACTIVE: '.dropdown-menu.show', DROPDOWN_MENU_ACTIVE: '.dropdown-menu.show',
DROPDOWN_TOGGLE: '[data-toggle="dropdown"]', DROPDOWN_TOGGLE: '[data-toggle="dropdown"]'
} }
const ClassName = { const ClassName = {
DROPDOWN_HOVER: 'dropdown-hover',
DROPDOWN_RIGHT: 'dropdown-menu-right' DROPDOWN_RIGHT: 'dropdown-menu-right'
} }
const Default = { const Default = {
} }
/** /**
* Class Definition * Class Definition
* ==================================================== * ====================================================
@ -39,26 +36,26 @@ const Dropdown = (($) => {
class Dropdown { class Dropdown {
constructor(element, config) { constructor(element, config) {
this._config = config this._config = config
this._element = element this._element = element
} }
// Public // Public
toggleSubmenu() { toggleSubmenu() {
this._element.siblings().show().toggleClass("show") this._element.siblings().show().toggleClass('show')
if (! this._element.next().hasClass('show')) { if (!this._element.next().hasClass('show')) {
this._element.parents('.dropdown-menu').first().find('.show').removeClass("show").hide() this._element.parents('.dropdown-menu').first().find('.show').removeClass('show').hide()
} }
this._element.parents('li.nav-item.dropdown.show').on('hidden.bs.dropdown', function(e) { this._element.parents('li.nav-item.dropdown.show').on('hidden.bs.dropdown', () => {
$('.dropdown-submenu .show').removeClass("show").hide() $('.dropdown-submenu .show').removeClass('show').hide()
}) })
} }
fixPosition() { fixPosition() {
let elm = $(Selector.DROPDOWN_MENU_ACTIVE) const elm = $(Selector.DROPDOWN_MENU_ACTIVE)
if (elm.length !== 0) { if (elm.length !== 0) {
if (elm.hasClass(ClassName.DROPDOWN_RIGHT)) { if (elm.hasClass(ClassName.DROPDOWN_RIGHT)) {
@ -69,19 +66,17 @@ const Dropdown = (($) => {
elm.css('right', 'inherit') elm.css('right', 'inherit')
} }
let offset = elm.offset() const offset = elm.offset()
let width = elm.width() const width = elm.width()
let windowWidth = $(window).width() const windowWidth = $(window).width()
let visiblePart = windowWidth - offset.left const visiblePart = windowWidth - offset.left
if (offset.left < 0) { if (offset.left < 0) {
elm.css('left', 'inherit') elm.css('left', 'inherit')
elm.css('right', (offset.left - 5)) elm.css('right', (offset.left - 5))
} else { } else if (visiblePart < width) {
if (visiblePart < width) { elm.css('left', 'inherit')
elm.css('left', 'inherit') elm.css('right', 0)
elm.css('right', 0)
}
} }
} }
} }
@ -90,7 +85,7 @@ const Dropdown = (($) => {
static _jQueryInterface(config) { static _jQueryInterface(config) {
return this.each(function () { return this.each(function () {
let data = $(this).data(DATA_KEY) let data = $(this).data(DATA_KEY)
const _config = $.extend({}, Default, $(this).data()) const _config = $.extend({}, Default, $(this).data())
if (!data) { if (!data) {
@ -98,7 +93,7 @@ const Dropdown = (($) => {
$(this).data(DATA_KEY, data) $(this).data(DATA_KEY, data)
} }
if (config === 'toggleSubmenu' || config == 'fixPosition') { if (config === 'toggleSubmenu' || config === 'fixPosition') {
data[config]() data[config]()
} }
}) })
@ -110,20 +105,20 @@ const Dropdown = (($) => {
* ==================================================== * ====================================================
*/ */
$(Selector.DROPDOWN_MENU + ' ' + Selector.DROPDOWN_TOGGLE).on("click", function(event) { $(Selector.DROPDOWN_MENU + ' ' + Selector.DROPDOWN_TOGGLE).on('click', function (event) {
event.preventDefault() event.preventDefault()
event.stopPropagation() event.stopPropagation()
Dropdown._jQueryInterface.call($(this), 'toggleSubmenu') Dropdown._jQueryInterface.call($(this), 'toggleSubmenu')
}); })
$(Selector.NAVBAR + ' ' + Selector.DROPDOWN_TOGGLE).on("click", function(event) { $(Selector.NAVBAR + ' ' + Selector.DROPDOWN_TOGGLE).on('click', event => {
event.preventDefault() event.preventDefault()
setTimeout(function() { setTimeout(function () {
Dropdown._jQueryInterface.call($(this), 'fixPosition') Dropdown._jQueryInterface.call($(this), 'fixPosition')
}, 1) }, 1)
}); })
/** /**
* jQuery API * jQuery API

97
build/js/Layout.js
View file

@ -5,58 +5,41 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const Layout = (($) => { const Layout = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'Layout' const NAME = 'Layout'
const DATA_KEY = 'lte.layout' const DATA_KEY = 'lte.layout'
const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const Event = {
SIDEBAR: 'sidebar'
}
const Selector = { const Selector = {
HEADER : '.main-header', HEADER: '.main-header',
MAIN_SIDEBAR : '.main-sidebar', MAIN_SIDEBAR: '.main-sidebar',
SIDEBAR : '.main-sidebar .sidebar', SIDEBAR: '.main-sidebar .sidebar',
CONTENT : '.content-wrapper', CONTENT: '.content-wrapper',
BRAND : '.brand-link',
CONTENT_HEADER : '.content-header',
WRAPPER : '.wrapper',
CONTROL_SIDEBAR: '.control-sidebar',
CONTROL_SIDEBAR_CONTENT: '.control-sidebar-content', CONTROL_SIDEBAR_CONTENT: '.control-sidebar-content',
CONTROL_SIDEBAR_BTN: '[data-widget="control-sidebar"]', CONTROL_SIDEBAR_BTN: '[data-widget="control-sidebar"]',
LAYOUT_FIXED : '.layout-fixed', FOOTER: '.main-footer',
FOOTER : '.main-footer', PUSHMENU_BTN: '[data-widget="pushmenu"]',
PUSHMENU_BTN : '[data-widget="pushmenu"]', LOGIN_BOX: '.login-box',
LOGIN_BOX : '.login-box', REGISTER_BOX: '.register-box'
REGISTER_BOX : '.register-box'
} }
const ClassName = { const ClassName = {
HOLD : 'hold-transition',
SIDEBAR : 'main-sidebar',
CONTENT_FIXED : 'content-fixed',
SIDEBAR_FOCUSED: 'sidebar-focused', SIDEBAR_FOCUSED: 'sidebar-focused',
LAYOUT_FIXED : 'layout-fixed', LAYOUT_FIXED: 'layout-fixed',
NAVBAR_FIXED : 'layout-navbar-fixed',
FOOTER_FIXED : 'layout-footer-fixed',
LOGIN_PAGE : 'login-page',
REGISTER_PAGE : 'register-page',
CONTROL_SIDEBAR_SLIDE_OPEN: 'control-sidebar-slide-open', CONTROL_SIDEBAR_SLIDE_OPEN: 'control-sidebar-slide-open',
CONTROL_SIDEBAR_OPEN: 'control-sidebar-open', CONTROL_SIDEBAR_OPEN: 'control-sidebar-open'
} }
const Default = { const Default = {
scrollbarTheme : 'os-theme-light', scrollbarTheme: 'os-theme-light',
scrollbarAutoHide: 'l', scrollbarAutoHide: 'l',
panelAutoHeight: true, panelAutoHeight: true,
loginRegisterAutoHeight: true, loginRegisterAutoHeight: true
} }
/** /**
@ -66,7 +49,7 @@ const Layout = (($) => {
class Layout { class Layout {
constructor(element, config) { constructor(element, config) {
this._config = config this._config = config
this._element = element this._element = element
this._init() this._init()
@ -75,10 +58,10 @@ const Layout = (($) => {
// Public // Public
fixLayoutHeight(extra = null) { fixLayoutHeight(extra = null) {
let control_sidebar = 0 let controlSidebar = 0
if ($('body').hasClass(ClassName.CONTROL_SIDEBAR_SLIDE_OPEN) || $('body').hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || extra == 'control_sidebar') { if ($('body').hasClass(ClassName.CONTROL_SIDEBAR_SLIDE_OPEN) || $('body').hasClass(ClassName.CONTROL_SIDEBAR_OPEN) || extra === 'controlSidebar') {
control_sidebar = $(Selector.CONTROL_SIDEBAR_CONTENT).height() controlSidebar = $(Selector.CONTROL_SIDEBAR_CONTENT).height()
} }
const heights = { const heights = {
@ -86,26 +69,27 @@ const Layout = (($) => {
header: $(Selector.HEADER).length !== 0 ? $(Selector.HEADER).outerHeight() : 0, header: $(Selector.HEADER).length !== 0 ? $(Selector.HEADER).outerHeight() : 0,
footer: $(Selector.FOOTER).length !== 0 ? $(Selector.FOOTER).outerHeight() : 0, footer: $(Selector.FOOTER).length !== 0 ? $(Selector.FOOTER).outerHeight() : 0,
sidebar: $(Selector.SIDEBAR).length !== 0 ? $(Selector.SIDEBAR).height() : 0, sidebar: $(Selector.SIDEBAR).length !== 0 ? $(Selector.SIDEBAR).height() : 0,
control_sidebar: control_sidebar, controlSidebar
} }
const max = this._max(heights) const max = this._max(heights)
let offset = this._config.panelAutoHeight let offset = this._config.panelAutoHeight
if (offset === true) { if (offset === true) {
offset = 0; offset = 0
} }
if (offset !== false) { if (offset !== false) {
if (max == heights.control_sidebar) { if (max === heights.controlSidebar) {
$(Selector.CONTENT).css('min-height', (max + offset)) $(Selector.CONTENT).css('min-height', (max + offset))
} else if (max == heights.window) { } else if (max === heights.window) {
$(Selector.CONTENT).css('min-height', (max + offset) - heights.header - heights.footer) $(Selector.CONTENT).css('min-height', (max + offset) - heights.header - heights.footer)
} else { } else {
$(Selector.CONTENT).css('min-height', (max + offset) - heights.header) $(Selector.CONTENT).css('min-height', (max + offset) - heights.header)
} }
if (this._isFooterFixed()) { if (this._isFooterFixed()) {
$(Selector.CONTENT).css('min-height', parseFloat($(Selector.CONTENT).css('min-height')) + heights.footer); $(Selector.CONTENT).css('min-height', parseFloat($(Selector.CONTENT).css('min-height')) + heights.footer)
} }
} }
@ -116,11 +100,11 @@ const Layout = (($) => {
if (typeof $.fn.overlayScrollbars !== 'undefined') { if (typeof $.fn.overlayScrollbars !== 'undefined') {
$(Selector.SIDEBAR).overlayScrollbars({ $(Selector.SIDEBAR).overlayScrollbars({
className : this._config.scrollbarTheme, className: this._config.scrollbarTheme,
sizeAutoCapable : true, sizeAutoCapable: true,
scrollbars : { scrollbars: {
autoHide: this._config.scrollbarAutoHide, autoHide: this._config.scrollbarAutoHide,
clickScrolling : true clickScrolling: true
} }
}) })
} }
@ -131,10 +115,10 @@ const Layout = (($) => {
if ($(Selector.LOGIN_BOX + ', ' + Selector.REGISTER_BOX).length === 0) { if ($(Selector.LOGIN_BOX + ', ' + Selector.REGISTER_BOX).length === 0) {
$('body, html').css('height', 'auto') $('body, html').css('height', 'auto')
} else if ($(Selector.LOGIN_BOX + ', ' + Selector.REGISTER_BOX).length !== 0) { } else if ($(Selector.LOGIN_BOX + ', ' + Selector.REGISTER_BOX).length !== 0) {
let box_height = $(Selector.LOGIN_BOX + ', ' + Selector.REGISTER_BOX).height() const boxHeight = $(Selector.LOGIN_BOX + ', ' + Selector.REGISTER_BOX).height()
if ($('body').css('min-height') !== box_height) { if ($('body').css('min-height') !== boxHeight) {
$('body').css('min-height', box_height) $('body').css('min-height', boxHeight)
} }
} }
} }
@ -148,7 +132,7 @@ const Layout = (($) => {
if (this._config.loginRegisterAutoHeight === true) { if (this._config.loginRegisterAutoHeight === true) {
this.fixLoginRegisterHeight() this.fixLoginRegisterHeight()
} else if (Number.isInteger(this._config.loginRegisterAutoHeight)) { } else if (Number.isInteger(this._config.loginRegisterAutoHeight)) {
setInterval(this.fixLoginRegisterHeight, this._config.loginRegisterAutoHeight); setInterval(this.fixLoginRegisterHeight, this._config.loginRegisterAutoHeight)
} }
$(Selector.SIDEBAR) $(Selector.SIDEBAR)
@ -166,7 +150,7 @@ const Layout = (($) => {
this.fixLayoutHeight() this.fixLayoutHeight()
}) })
.on('expanded.lte.controlsidebar', () => { .on('expanded.lte.controlsidebar', () => {
this.fixLayoutHeight('control_sidebar') this.fixLayoutHeight('controlSidebar')
}) })
$(window).resize(() => { $(window).resize(() => {
@ -175,15 +159,14 @@ const Layout = (($) => {
setTimeout(() => { setTimeout(() => {
$('body.hold-transition').removeClass('hold-transition') $('body.hold-transition').removeClass('hold-transition')
}, 50)
}, 50);
} }
_max(numbers) { _max(numbers) {
// Calculate the maximum number in a list // Calculate the maximum number in a list
let max = 0 let max = 0
Object.keys(numbers).forEach((key) => { Object.keys(numbers).forEach(key => {
if (numbers[key] > max) { if (numbers[key] > max) {
max = numbers[key] max = numbers[key]
} }
@ -193,7 +176,7 @@ const Layout = (($) => {
} }
_isFooterFixed() { _isFooterFixed() {
return $('.main-footer').css('position') === 'fixed'; return $('.main-footer').css('position') === 'fixed'
} }
// Static // Static
@ -209,7 +192,7 @@ const Layout = (($) => {
} }
if (config === 'init' || config === '') { if (config === 'init' || config === '') {
data['_init']() data._init()
} else if (config === 'fixLayoutHeight' || config === 'fixLoginRegisterHeight') { } else if (config === 'fixLayoutHeight' || config === 'fixLoginRegisterHeight') {
data[config]() data[config]()
} }
@ -227,11 +210,11 @@ const Layout = (($) => {
}) })
$(Selector.SIDEBAR + ' a').on('focusin', () => { $(Selector.SIDEBAR + ' a').on('focusin', () => {
$(Selector.MAIN_SIDEBAR).addClass(ClassName.SIDEBAR_FOCUSED); $(Selector.MAIN_SIDEBAR).addClass(ClassName.SIDEBAR_FOCUSED)
}) })
$(Selector.SIDEBAR + ' a').on('focusout', () => { $(Selector.SIDEBAR + ' a').on('focusout', () => {
$(Selector.MAIN_SIDEBAR).removeClass(ClassName.SIDEBAR_FOCUSED); $(Selector.MAIN_SIDEBAR).removeClass(ClassName.SIDEBAR_FOCUSED)
}) })
/** /**

56
build/js/PushMenu.js
View file

@ -5,15 +5,15 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const PushMenu = (($) => { const PushMenu = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'PushMenu' const NAME = 'PushMenu'
const DATA_KEY = 'lte.pushmenu' const DATA_KEY = 'lte.pushmenu'
const EVENT_KEY = `.${DATA_KEY}` const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const Event = { const Event = {
@ -29,8 +29,6 @@ const PushMenu = (($) => {
const Selector = { const Selector = {
TOGGLE_BUTTON: '[data-widget="pushmenu"]', TOGGLE_BUTTON: '[data-widget="pushmenu"]',
SIDEBAR_MINI: '.sidebar-mini',
SIDEBAR_COLLAPSED: '.sidebar-collapse',
BODY: 'body', BODY: 'body',
OVERLAY: '#sidebar-overlay', OVERLAY: '#sidebar-overlay',
WRAPPER: '.wrapper' WRAPPER: '.wrapper'
@ -52,7 +50,7 @@ const PushMenu = (($) => {
this._element = element this._element = element
this._options = $.extend({}, Default, options) this._options = $.extend({}, Default, options)
if (!$(Selector.OVERLAY).length) { if ($(Selector.OVERLAY).length === 0) {
this._addOverlay() this._addOverlay()
} }
@ -70,7 +68,7 @@ const PushMenu = (($) => {
$(Selector.BODY).removeClass(ClassName.COLLAPSED).removeClass(ClassName.CLOSED) $(Selector.BODY).removeClass(ClassName.COLLAPSED).removeClass(ClassName.CLOSED)
if(this._options.enableRemember) { if (this._options.enableRemember) {
localStorage.setItem(`remember${EVENT_KEY}`, ClassName.OPEN) localStorage.setItem(`remember${EVENT_KEY}`, ClassName.OPEN)
} }
@ -87,7 +85,7 @@ const PushMenu = (($) => {
$(Selector.BODY).addClass(ClassName.COLLAPSED) $(Selector.BODY).addClass(ClassName.COLLAPSED)
if(this._options.enableRemember) { if (this._options.enableRemember) {
localStorage.setItem(`remember${EVENT_KEY}`, ClassName.COLLAPSED) localStorage.setItem(`remember${EVENT_KEY}`, ClassName.COLLAPSED)
} }
@ -96,10 +94,10 @@ const PushMenu = (($) => {
} }
toggle() { toggle() {
if (!$(Selector.BODY).hasClass(ClassName.COLLAPSED)) { if ($(Selector.BODY).hasClass(ClassName.COLLAPSED)) {
this.collapse()
} else {
this.expand() this.expand()
} else {
this.collapse()
} }
} }
@ -109,10 +107,10 @@ const PushMenu = (($) => {
if (!$(Selector.BODY).hasClass(ClassName.OPEN)) { if (!$(Selector.BODY).hasClass(ClassName.OPEN)) {
this.collapse() this.collapse()
} }
} else if (resize == true) { } else if (resize === true) {
if ($(Selector.BODY).hasClass(ClassName.OPEN)) { if ($(Selector.BODY).hasClass(ClassName.OPEN)) {
$(Selector.BODY).removeClass(ClassName.OPEN) $(Selector.BODY).removeClass(ClassName.OPEN)
} else if($(Selector.BODY).hasClass(ClassName.CLOSED)) { } else if ($(Selector.BODY).hasClass(ClassName.CLOSED)) {
this.expand() this.expand()
} }
} }
@ -120,26 +118,24 @@ const PushMenu = (($) => {
} }
remember() { remember() {
if(this._options.enableRemember) { if (this._options.enableRemember) {
let toggleState = localStorage.getItem(`remember${EVENT_KEY}`) const toggleState = localStorage.getItem(`remember${EVENT_KEY}`)
if (toggleState == ClassName.COLLAPSED){ if (toggleState === ClassName.COLLAPSED) {
if (this._options.noTransitionAfterReload) { if (this._options.noTransitionAfterReload) {
$("body").addClass('hold-transition').addClass(ClassName.COLLAPSED).delay(50).queue(function() { $('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() {
$(this).removeClass('hold-transition') $(this).removeClass('hold-transition')
$(this).dequeue() $(this).dequeue()
}) })
} else { } 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)
} }
} }
} }
@ -191,7 +187,7 @@ const PushMenu = (($) => {
* ==================================================== * ====================================================
*/ */
$(document).on('click', Selector.TOGGLE_BUTTON, (event) => { $(document).on('click', Selector.TOGGLE_BUTTON, event => {
event.preventDefault() event.preventDefault()
let button = event.currentTarget let button = event.currentTarget
@ -214,7 +210,7 @@ const PushMenu = (($) => {
$.fn[NAME] = PushMenu._jQueryInterface $.fn[NAME] = PushMenu._jQueryInterface
$.fn[NAME].Constructor = PushMenu $.fn[NAME].Constructor = PushMenu
$.fn[NAME].noConflict = function () { $.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT $.fn[NAME] = JQUERY_NO_CONFLICT
return PushMenu._jQueryInterface return PushMenu._jQueryInterface
} }

24
build/js/SiteSearch.js
View file

@ -5,24 +5,21 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const SiteSearch = (($) => { const SiteSearch = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'SiteSearch' const NAME = 'SiteSearch'
const DATA_KEY = 'lte.site-search' const DATA_KEY = 'lte.site-search'
const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const Event = {}
const Selector = { const Selector = {
TOGGLE_BUTTON : '[data-widget="site-search"]', TOGGLE_BUTTON: '[data-widget="site-search"]',
SEARCH_BLOCK : '.site-search-block', SEARCH_BLOCK: '.site-search-block',
SEARCH_BACKDROP: '.site-search-backdrop', SEARCH_BACKDROP: '.site-search-backdrop',
SEARCH_INPUT : '.site-search-block .form-control' SEARCH_INPUT: '.site-search-block .form-control'
} }
const ClassName = { const ClassName = {
@ -39,7 +36,6 @@ const SiteSearch = (($) => {
*/ */
class SiteSearch { class SiteSearch {
constructor(_element, _options) { constructor(_element, _options) {
this.element = _element this.element = _element
this.options = $.extend({}, Default, _options) this.options = $.extend({}, Default, _options)
@ -80,7 +76,7 @@ const SiteSearch = (($) => {
} }
if (!/toggle|close/.test(options)) { if (!/toggle|close/.test(options)) {
throw Error(`Undefined method ${options}`) throw new Error(`Undefined method ${options}`)
} }
data[options]() data[options]()
@ -92,7 +88,7 @@ const SiteSearch = (($) => {
* Data API * Data API
* ==================================================== * ====================================================
*/ */
$(document).on('click', Selector.TOGGLE_BUTTON, (event) => { $(document).on('click', Selector.TOGGLE_BUTTON, event => {
event.preventDefault() event.preventDefault()
let button = $(event.currentTarget) let button = $(event.currentTarget)
@ -104,7 +100,7 @@ const SiteSearch = (($) => {
SiteSearch._jQueryInterface.call(button, 'toggle') SiteSearch._jQueryInterface.call(button, 'toggle')
}) })
$(document).on('click', Selector.SEARCH_BACKDROP, (event) => { $(document).on('click', Selector.SEARCH_BACKDROP, event => {
const backdrop = $(event.currentTarget) const backdrop = $(event.currentTarget)
SiteSearch._jQueryInterface.call(backdrop, 'close') SiteSearch._jQueryInterface.call(backdrop, 'close')
}) })
@ -116,7 +112,7 @@ const SiteSearch = (($) => {
$.fn[NAME] = SiteSearch._jQueryInterface $.fn[NAME] = SiteSearch._jQueryInterface
$.fn[NAME].Constructor = SiteSearch $.fn[NAME].Constructor = SiteSearch
$.fn[NAME].noConflict = function () { $.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT $.fn[NAME] = JQUERY_NO_CONFLICT
return SiteSearch._jQueryInterface return SiteSearch._jQueryInterface
} }

86
build/js/Toasts.js
View file

@ -5,51 +5,42 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const Toasts = (($) => { const Toasts = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'Toasts' const NAME = 'Toasts'
const DATA_KEY = 'lte.toasts' const DATA_KEY = 'lte.toasts'
const EVENT_KEY = `.${DATA_KEY}` const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const Event = { const Event = {
INIT: `init${EVENT_KEY}`, INIT: `init${EVENT_KEY}`,
CREATED: `created${EVENT_KEY}`, CREATED: `created${EVENT_KEY}`,
REMOVED: `removed${EVENT_KEY}`, REMOVED: `removed${EVENT_KEY}`
} }
const Selector = { const Selector = {
BODY: 'toast-body',
CONTAINER_TOP_RIGHT: '#toastsContainerTopRight', CONTAINER_TOP_RIGHT: '#toastsContainerTopRight',
CONTAINER_TOP_LEFT: '#toastsContainerTopLeft', CONTAINER_TOP_LEFT: '#toastsContainerTopLeft',
CONTAINER_BOTTOM_RIGHT: '#toastsContainerBottomRight', CONTAINER_BOTTOM_RIGHT: '#toastsContainerBottomRight',
CONTAINER_BOTTOM_LEFT: '#toastsContainerBottomLeft', CONTAINER_BOTTOM_LEFT: '#toastsContainerBottomLeft'
} }
const ClassName = { const ClassName = {
TOP_RIGHT: 'toasts-top-right', TOP_RIGHT: 'toasts-top-right',
TOP_LEFT: 'toasts-top-left', TOP_LEFT: 'toasts-top-left',
BOTTOM_RIGHT: 'toasts-bottom-right', BOTTOM_RIGHT: 'toasts-bottom-right',
BOTTOM_LEFT: 'toasts-bottom-left', BOTTOM_LEFT: 'toasts-bottom-left'
FADE: 'fade',
} }
const Position = { const Position = {
TOP_RIGHT: 'topRight', TOP_RIGHT: 'topRight',
TOP_LEFT: 'topLeft', TOP_LEFT: 'topLeft',
BOTTOM_RIGHT: 'bottomRight', BOTTOM_RIGHT: 'bottomRight',
BOTTOM_LEFT: 'bottomLeft', BOTTOM_LEFT: 'bottomLeft'
}
const Id = {
CONTAINER_TOP_RIGHT: 'toastsContainerTopRight',
CONTAINER_TOP_LEFT: 'toastsContainerTopLeft',
CONTAINER_BOTTOM_RIGHT: 'toastsContainerBottomRight',
CONTAINER_BOTTOM_LEFT: 'toastsContainerBottomLeft',
} }
const Default = { const Default = {
@ -67,7 +58,7 @@ const Toasts = (($) => {
subtitle: null, subtitle: null,
close: true, close: true,
body: null, body: null,
class: null, class: null
} }
/** /**
@ -76,9 +67,9 @@ const Toasts = (($) => {
*/ */
class Toasts { class Toasts {
constructor(element, config) { constructor(element, config) {
this._config = config this._config = config
this._prepareContainer(); this._prepareContainer()
const initEvent = $.Event(Event.INIT) const initEvent = $.Event(Event.INIT)
$('body').trigger(initEvent) $('body').trigger(initEvent)
@ -87,7 +78,7 @@ const Toasts = (($) => {
// Public // Public
create() { create() {
var toast = $('<div class="toast" role="alert" aria-live="assertive" aria-atomic="true"/>') const toast = $('<div class="toast" role="alert" aria-live="assertive" aria-atomic="true"/>')
toast.data('autohide', this._config.autohide) toast.data('autohide', this._config.autohide)
toast.data('animation', this._config.fade) toast.data('animation', this._config.fade)
@ -100,41 +91,41 @@ const Toasts = (($) => {
toast.data('delay', this._config.delay) toast.data('delay', this._config.delay)
} }
var toast_header = $('<div class="toast-header">') const toastHeader = $('<div class="toast-header">')
if (this._config.image != null) { if (this._config.image != null) {
var toast_image = $('<img />').addClass('rounded mr-2').attr('src', this._config.image).attr('alt', this._config.imageAlt) const toastImage = $('<img />').addClass('rounded mr-2').attr('src', this._config.image).attr('alt', this._config.imageAlt)
if (this._config.imageHeight != null) { if (this._config.imageHeight != null) {
toast_image.height(this._config.imageHeight).width('auto') toastImage.height(this._config.imageHeight).width('auto')
} }
toast_header.append(toast_image) toastHeader.append(toastImage)
} }
if (this._config.icon != null) { if (this._config.icon != null) {
toast_header.append($('<i />').addClass('mr-2').addClass(this._config.icon)) toastHeader.append($('<i />').addClass('mr-2').addClass(this._config.icon))
} }
if (this._config.title != null) { if (this._config.title != null) {
toast_header.append($('<strong />').addClass('mr-auto').html(this._config.title)) toastHeader.append($('<strong />').addClass('mr-auto').html(this._config.title))
} }
if (this._config.subtitle != null) { if (this._config.subtitle != null) {
toast_header.append($('<small />').html(this._config.subtitle)) toastHeader.append($('<small />').html(this._config.subtitle))
} }
if (this._config.close == true) { if (this._config.close == true) {
var toast_close = $('<button data-dismiss="toast" />').attr('type', 'button').addClass('ml-2 mb-1 close').attr('aria-label', 'Close').append('<span aria-hidden="true">&times;</span>') const toastClose = $('<button data-dismiss="toast" />').attr('type', 'button').addClass('ml-2 mb-1 close').attr('aria-label', 'Close').append('<span aria-hidden="true">&times;</span>')
if (this._config.title == null) { if (this._config.title == null) {
toast_close.toggleClass('ml-2 ml-auto') toastClose.toggleClass('ml-2 ml-auto')
} }
toast_header.append(toast_close) toastHeader.append(toastClose)
} }
toast.append(toast_header) toast.append(toastHeader)
if (this._config.body != null) { if (this._config.body != null) {
toast.append($('<div class="toast-body" />').html(this._config.body)) toast.append($('<div class="toast-body" />').html(this._config.body))
@ -147,36 +138,39 @@ const Toasts = (($) => {
toast.toast('show') toast.toast('show')
if (this._config.autoremove) { if (this._config.autoremove) {
toast.on('hidden.bs.toast', function () { toast.on('hidden.bs.toast', function () {
$(this).delay(200).remove(); $(this).delay(200).remove()
const removedEvent = $.Event(Event.REMOVED) const removedEvent = $.Event(Event.REMOVED)
$('body').trigger(removedEvent) $('body').trigger(removedEvent)
}) })
} }
} }
// Static // Static
_getContainerId() { _getContainerId() {
if (this._config.position == Position.TOP_RIGHT) { if (this._config.position == Position.TOP_RIGHT) {
return Selector.CONTAINER_TOP_RIGHT; return Selector.CONTAINER_TOP_RIGHT
} else if (this._config.position == Position.TOP_LEFT) { }
return Selector.CONTAINER_TOP_LEFT;
} else if (this._config.position == Position.BOTTOM_RIGHT) { if (this._config.position == Position.TOP_LEFT) {
return Selector.CONTAINER_BOTTOM_RIGHT; return Selector.CONTAINER_TOP_LEFT
} else if (this._config.position == Position.BOTTOM_LEFT) { }
return Selector.CONTAINER_BOTTOM_LEFT;
if (this._config.position == Position.BOTTOM_RIGHT) {
return Selector.CONTAINER_BOTTOM_RIGHT
}
if (this._config.position == Position.BOTTOM_LEFT) {
return Selector.CONTAINER_BOTTOM_LEFT
} }
} }
_prepareContainer() { _prepareContainer() {
if ($(this._getContainerId()).length === 0) { if ($(this._getContainerId()).length === 0) {
var container = $('<div />').attr('id', this._getContainerId().replace('#', '')) const container = $('<div />').attr('id', this._getContainerId().replace('#', ''))
if (this._config.position == Position.TOP_RIGHT) { if (this._config.position == Position.TOP_RIGHT) {
container.addClass(ClassName.TOP_RIGHT) container.addClass(ClassName.TOP_RIGHT)
} else if (this._config.position == Position.TOP_LEFT) { } else if (this._config.position == Position.TOP_LEFT) {
@ -202,7 +196,7 @@ const Toasts = (($) => {
static _jQueryInterface(option, config) { static _jQueryInterface(option, config) {
return this.each(function () { return this.each(function () {
const _options = $.extend({}, Default, config) const _options = $.extend({}, Default, config)
var toast = new Toasts($(this), _options) const toast = new Toasts($(this), _options)
if (option === 'create') { if (option === 'create') {
toast[option]() toast[option]()
@ -218,7 +212,7 @@ const Toasts = (($) => {
$.fn[NAME] = Toasts._jQueryInterface $.fn[NAME] = Toasts._jQueryInterface
$.fn[NAME].Constructor = Toasts $.fn[NAME].Constructor = Toasts
$.fn[NAME].noConflict = function () { $.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT $.fn[NAME] = JQUERY_NO_CONFLICT
return Toasts._jQueryInterface return Toasts._jQueryInterface
} }

39
build/js/TodoList.js
View file

@ -5,15 +5,14 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const TodoList = (($) => { const TodoList = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'TodoList' const NAME = 'TodoList'
const DATA_KEY = 'lte.todolist' const DATA_KEY = 'lte.todolist'
const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const Selector = { const Selector = {
@ -25,11 +24,11 @@ const TodoList = (($) => {
} }
const Default = { const Default = {
onCheck: function (item) { onCheck(item) {
return item; return item
}, },
onUnCheck: function (item) { onUnCheck(item) {
return item; return item
} }
} }
@ -40,7 +39,7 @@ const TodoList = (($) => {
class TodoList { class TodoList {
constructor(element, config) { constructor(element, config) {
this._config = config this._config = config
this._element = element this._element = element
this._init() this._init()
@ -49,29 +48,29 @@ const TodoList = (($) => {
// Public // Public
toggle(item) { toggle(item) {
item.parents('li').toggleClass(ClassName.TODO_LIST_DONE); item.parents('li').toggleClass(ClassName.TODO_LIST_DONE)
if (! $(item).prop('checked')) { if (!$(item).prop('checked')) {
this.unCheck($(item)); this.unCheck($(item))
return; return
} }
this.check(item); this.check(item)
} }
check (item) { check(item) {
this._config.onCheck.call(item); this._config.onCheck.call(item)
} }
unCheck (item) { unCheck(item) {
this._config.onUnCheck.call(item); this._config.onUnCheck.call(item)
} }
// Private // Private
_init() { _init() {
var that = this const that = this
$(Selector.DATA_TOGGLE).find('input:checkbox:checked').parents('li').toggleClass(ClassName.TODO_LIST_DONE) $(Selector.DATA_TOGGLE).find('input:checkbox:checked').parents('li').toggleClass(ClassName.TODO_LIST_DONE)
$(Selector.DATA_TOGGLE).on('change', 'input:checkbox', (event) => { $(Selector.DATA_TOGGLE).on('change', 'input:checkbox', event => {
that.toggle($(event.target)) that.toggle($(event.target))
}) })
} }

46
build/js/Treeview.js
View file

@ -5,45 +5,41 @@
* -------------------------------------------- * --------------------------------------------
*/ */
const Treeview = (($) => { const Treeview = ($ => {
/** /**
* Constants * Constants
* ==================================================== * ====================================================
*/ */
const NAME = 'Treeview' const NAME = 'Treeview'
const DATA_KEY = 'lte.treeview' const DATA_KEY = 'lte.treeview'
const EVENT_KEY = `.${DATA_KEY}` const EVENT_KEY = `.${DATA_KEY}`
const JQUERY_NO_CONFLICT = $.fn[NAME] const JQUERY_NO_CONFLICT = $.fn[NAME]
const Event = { const Event = {
SELECTED : `selected${EVENT_KEY}`, EXPANDED: `expanded${EVENT_KEY}`,
EXPANDED : `expanded${EVENT_KEY}`, COLLAPSED: `collapsed${EVENT_KEY}`,
COLLAPSED : `collapsed${EVENT_KEY}`,
LOAD_DATA_API: `load${EVENT_KEY}` LOAD_DATA_API: `load${EVENT_KEY}`
} }
const Selector = { const Selector = {
LI : '.nav-item', LI: '.nav-item',
LINK : '.nav-link', LINK: '.nav-link',
TREEVIEW_MENU: '.nav-treeview', TREEVIEW_MENU: '.nav-treeview',
OPEN : '.menu-open', OPEN: '.menu-open',
DATA_WIDGET : '[data-widget="treeview"]' DATA_WIDGET: '[data-widget="treeview"]'
} }
const ClassName = { const ClassName = {
LI : 'nav-item', OPEN: 'menu-open',
LINK : 'nav-link',
TREEVIEW_MENU : 'nav-treeview',
OPEN : 'menu-open',
SIDEBAR_COLLAPSED: 'sidebar-collapse' SIDEBAR_COLLAPSED: 'sidebar-collapse'
} }
const Default = { const Default = {
trigger : `${Selector.DATA_WIDGET} ${Selector.LINK}`, trigger: `${Selector.DATA_WIDGET} ${Selector.LINK}`,
animationSpeed : 300, animationSpeed: 300,
accordion : true, accordion: true,
expandSidebar : false, expandSidebar: false,
sidebarButtonSelector: '[data-widget="pushmenu"]' sidebarButtonSelector: '[data-widget="pushmenu"]'
} }
@ -53,7 +49,7 @@ const Treeview = (($) => {
*/ */
class Treeview { class Treeview {
constructor(element, config) { constructor(element, config) {
this._config = config this._config = config
this._element = element this._element = element
} }
@ -67,7 +63,7 @@ const Treeview = (($) => {
const expandedEvent = $.Event(Event.EXPANDED) const expandedEvent = $.Event(Event.EXPANDED)
if (this._config.accordion) { if (this._config.accordion) {
const openMenuLi = parentLi.siblings(Selector.OPEN).first() const openMenuLi = parentLi.siblings(Selector.OPEN).first()
const openTreeview = openMenuLi.find(Selector.TREEVIEW_MENU).first() const openTreeview = openMenuLi.find(Selector.TREEVIEW_MENU).first()
this.collapse(openTreeview, openMenuLi) this.collapse(openTreeview, openMenuLi)
} }
@ -94,14 +90,12 @@ const Treeview = (($) => {
} }
toggle(event) { toggle(event) {
const $relativeTarget = $(event.currentTarget) const $relativeTarget = $(event.currentTarget)
const $parent = $relativeTarget.parent() 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 (!treeviewMenu.is(Selector.TREEVIEW_MENU)) {
if (!$parent.is(Selector.LI)) { if (!$parent.is(Selector.LI)) {
treeviewMenu = $parent.parent().find('> ' + Selector.TREEVIEW_MENU) treeviewMenu = $parent.parent().find('> ' + Selector.TREEVIEW_MENU)
} }
@ -114,7 +108,7 @@ const Treeview = (($) => {
event.preventDefault() event.preventDefault()
const parentLi = $relativeTarget.parents(Selector.LI).first() const parentLi = $relativeTarget.parents(Selector.LI).first()
const isOpen = parentLi.hasClass(ClassName.OPEN) const isOpen = parentLi.hasClass(ClassName.OPEN)
if (isOpen) { if (isOpen) {
this.collapse($(treeviewMenu), parentLi) this.collapse($(treeviewMenu), parentLi)
@ -126,7 +120,7 @@ const Treeview = (($) => {
// Private // Private
_setupListeners() { _setupListeners() {
$(document).on('click', this._config.trigger, (event) => { $(document).on('click', this._config.trigger, event => {
this.toggle(event) this.toggle(event)
}) })
} }
@ -174,7 +168,7 @@ const Treeview = (($) => {
$.fn[NAME] = Treeview._jQueryInterface $.fn[NAME] = Treeview._jQueryInterface
$.fn[NAME].Constructor = Treeview $.fn[NAME].Constructor = Treeview
$.fn[NAME].noConflict = function () { $.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT $.fn[NAME] = JQUERY_NO_CONFLICT
return Treeview._jQueryInterface return Treeview._jQueryInterface
} }

20
build/npm/DocsPlugins.js
View file

@ -1,45 +1,47 @@
'use strict'
const Plugins = [ const Plugins = [
// AdminLTE Dist // AdminLTE Dist
{ {
from: 'dist/css/', from: 'dist/css/',
to : 'docs/assets/css/' to: 'docs/assets/css/'
}, },
{ {
from: 'dist/js/', from: 'dist/js/',
to : 'docs/assets/js/' to: 'docs/assets/js/'
}, },
// jQuery // jQuery
{ {
from: 'node_modules/jquery/dist/', from: 'node_modules/jquery/dist/',
to : 'docs/assets/plugins/jquery/' to: 'docs/assets/plugins/jquery/'
}, },
// Popper // Popper
{ {
from: 'node_modules/popper.js/dist/', from: 'node_modules/popper.js/dist/',
to : 'docs/assets/plugins/popper/' to: 'docs/assets/plugins/popper/'
}, },
// Bootstrap // Bootstrap
{ {
from: 'node_modules/bootstrap/dist/js/', from: 'node_modules/bootstrap/dist/js/',
to : 'docs/assets/plugins/bootstrap/js/' to: 'docs/assets/plugins/bootstrap/js/'
}, },
// Font Awesome // Font Awesome
{ {
from: 'node_modules/@fortawesome/fontawesome-free/css/', from: 'node_modules/@fortawesome/fontawesome-free/css/',
to : 'docs/assets/plugins/fontawesome-free/css/' to: 'docs/assets/plugins/fontawesome-free/css/'
}, },
{ {
from: 'node_modules/@fortawesome/fontawesome-free/webfonts/', from: 'node_modules/@fortawesome/fontawesome-free/webfonts/',
to : 'docs/assets/plugins/fontawesome-free/webfonts/' to: 'docs/assets/plugins/fontawesome-free/webfonts/'
}, },
// overlayScrollbars // overlayScrollbars
{ {
from: 'node_modules/overlayscrollbars/js/', from: 'node_modules/overlayscrollbars/js/',
to : 'docs/assets/plugins/overlayScrollbars/js/' to: 'docs/assets/plugins/overlayScrollbars/js/'
}, },
{ {
from: 'node_modules/overlayscrollbars/css/', from: 'node_modules/overlayscrollbars/css/',
to : 'docs/assets/plugins/overlayScrollbars/css/' to: 'docs/assets/plugins/overlayScrollbars/css/'
} }
] ]

12
build/npm/DocsPublish.js
View file

@ -1,5 +1,7 @@
'use strict'
const Plugins = require('./DocsPlugins') const Plugins = require('./DocsPlugins')
const fse = require('fs-extra') const fse = require('fs-extra')
class Publish { class Publish {
constructor() { constructor() {
@ -12,7 +14,7 @@ class Publish {
getArguments() { getArguments() {
if (process.argv.length > 2) { if (process.argv.length > 2) {
let arg = process.argv[2] const arg = process.argv[2]
switch (arg) { switch (arg) {
case '-v': case '-v':
case '--verbose': case '--verbose':
@ -26,15 +28,15 @@ class Publish {
run() { run() {
// Publish files // Publish files
Plugins.forEach((module) => { Plugins.forEach(module => {
try { try {
fse.copySync(module.from, module.to) fse.copySync(module.from, module.to)
if (this.options.verbose) { if (this.options.verbose) {
console.log(`Copied ${module.from} to ${module.to}`) console.log(`Copied ${module.from} to ${module.to}`)
} }
} catch (err) { } catch (error) {
console.error(`Error: ${err}`) console.error(`Error: ${error}`)
} }
}) })
} }

90
build/npm/Plugins.js
View file

@ -1,102 +1,104 @@
'use strict'
const Plugins = [ const Plugins = [
// jQuery // jQuery
{ {
from: 'node_modules/jquery/dist', from: 'node_modules/jquery/dist',
to : 'plugins/jquery' to: 'plugins/jquery'
}, },
// Popper // Popper
{ {
from: 'node_modules/popper.js/dist', from: 'node_modules/popper.js/dist',
to : 'plugins/popper' to: 'plugins/popper'
}, },
// Bootstrap // Bootstrap
{ {
from: 'node_modules/bootstrap/dist/js', from: 'node_modules/bootstrap/dist/js',
to : 'plugins/bootstrap/js' to: 'plugins/bootstrap/js'
}, },
// Font Awesome // Font Awesome
{ {
from: 'node_modules/@fortawesome/fontawesome-free/css', from: 'node_modules/@fortawesome/fontawesome-free/css',
to : 'plugins/fontawesome-free/css' to: 'plugins/fontawesome-free/css'
}, },
{ {
from: 'node_modules/@fortawesome/fontawesome-free/webfonts', from: 'node_modules/@fortawesome/fontawesome-free/webfonts',
to : 'plugins/fontawesome-free/webfonts' to: 'plugins/fontawesome-free/webfonts'
}, },
// overlayScrollbars // overlayScrollbars
{ {
from: 'node_modules/overlayscrollbars/js', from: 'node_modules/overlayscrollbars/js',
to : 'plugins/overlayScrollbars/js' to: 'plugins/overlayScrollbars/js'
}, },
{ {
from: 'node_modules/overlayscrollbars/css', from: 'node_modules/overlayscrollbars/css',
to : 'plugins/overlayScrollbars/css' to: 'plugins/overlayScrollbars/css'
}, },
// Chart.js // Chart.js
{ {
from: 'node_modules/chart.js/dist/', from: 'node_modules/chart.js/dist/',
to : 'plugins/chart.js' to: 'plugins/chart.js'
}, },
// jQuery UI // jQuery UI
{ {
from: 'node_modules/jquery-ui-dist/', from: 'node_modules/jquery-ui-dist/',
to : 'plugins/jquery-ui' to: 'plugins/jquery-ui'
}, },
// Flot // Flot
{ {
from: 'node_modules/flot/dist/es5/', from: 'node_modules/flot/dist/es5/',
to : 'plugins/flot' to: 'plugins/flot'
}, },
// Summernote // Summernote
{ {
from: 'node_modules/summernote/dist/', from: 'node_modules/summernote/dist/',
to : 'plugins/summernote' to: 'plugins/summernote'
}, },
// Bootstrap Slider // Bootstrap Slider
{ {
from: 'node_modules/bootstrap-slider/dist/', from: 'node_modules/bootstrap-slider/dist/',
to : 'plugins/bootstrap-slider' to: 'plugins/bootstrap-slider'
}, },
{ {
from: 'node_modules/bootstrap-slider/dist/css', from: 'node_modules/bootstrap-slider/dist/css',
to : 'plugins/bootstrap-slider/css' to: 'plugins/bootstrap-slider/css'
}, },
// Bootstrap Colorpicker // Bootstrap Colorpicker
{ {
from: 'node_modules/bootstrap-colorpicker/dist/js', from: 'node_modules/bootstrap-colorpicker/dist/js',
to : 'plugins/bootstrap-colorpicker/js' to: 'plugins/bootstrap-colorpicker/js'
}, },
{ {
from: 'node_modules/bootstrap-colorpicker/dist/css', from: 'node_modules/bootstrap-colorpicker/dist/css',
to : 'plugins/bootstrap-colorpicker/css' to: 'plugins/bootstrap-colorpicker/css'
}, },
// Tempusdominus Bootstrap 4 // Tempusdominus Bootstrap 4
{ {
from: 'node_modules/tempusdominus-bootstrap-4/build/js', from: 'node_modules/tempusdominus-bootstrap-4/build/js',
to : 'plugins/tempusdominus-bootstrap-4/js' to: 'plugins/tempusdominus-bootstrap-4/js'
}, },
{ {
from: 'node_modules/tempusdominus-bootstrap-4/build/css', from: 'node_modules/tempusdominus-bootstrap-4/build/css',
to : 'plugins/tempusdominus-bootstrap-4/css' to: 'plugins/tempusdominus-bootstrap-4/css'
}, },
// Moment // Moment
{ {
from: 'node_modules/moment/min', from: 'node_modules/moment/min',
to : 'plugins/moment' to: 'plugins/moment'
}, },
{ {
from: 'node_modules/moment/locale', from: 'node_modules/moment/locale',
to : 'plugins/moment/locale' to: 'plugins/moment/locale'
}, },
// FastClick // FastClick
{ {
from: 'node_modules/fastclick/lib', from: 'node_modules/fastclick/lib',
to : 'plugins/fastclick' to: 'plugins/fastclick'
}, },
// Date Range Picker // Date Range Picker
{ {
from: 'node_modules/daterangepicker/', from: 'node_modules/daterangepicker/',
to : 'plugins/daterangepicker' to: 'plugins/daterangepicker'
}, },
// DataTables // DataTables
{ {
@ -255,96 +257,96 @@ const Plugins = [
// Fullcalendar // Fullcalendar
{ {
from: 'node_modules/@fullcalendar/core/', from: 'node_modules/@fullcalendar/core/',
to : 'plugins/fullcalendar' to: 'plugins/fullcalendar'
}, },
{ {
from: 'node_modules/@fullcalendar/bootstrap/', from: 'node_modules/@fullcalendar/bootstrap/',
to : 'plugins/fullcalendar-bootstrap' to: 'plugins/fullcalendar-bootstrap'
}, },
{ {
from: 'node_modules/@fullcalendar/daygrid/', from: 'node_modules/@fullcalendar/daygrid/',
to : 'plugins/fullcalendar-daygrid' to: 'plugins/fullcalendar-daygrid'
}, },
{ {
from: 'node_modules/@fullcalendar/timegrid/', from: 'node_modules/@fullcalendar/timegrid/',
to : 'plugins/fullcalendar-timegrid' to: 'plugins/fullcalendar-timegrid'
}, },
{ {
from: 'node_modules/@fullcalendar/interaction/', from: 'node_modules/@fullcalendar/interaction/',
to : 'plugins/fullcalendar-interaction' to: 'plugins/fullcalendar-interaction'
}, },
// icheck bootstrap // icheck bootstrap
{ {
from: 'node_modules/icheck-bootstrap/', from: 'node_modules/icheck-bootstrap/',
to : 'plugins/icheck-bootstrap' to: 'plugins/icheck-bootstrap'
}, },
// inputmask // inputmask
{ {
from: 'node_modules/inputmask/dist/', from: 'node_modules/inputmask/dist/',
to : 'plugins/inputmask' to: 'plugins/inputmask'
}, },
// ion-rangeslider // ion-rangeslider
{ {
from: 'node_modules/ion-rangeslider/', from: 'node_modules/ion-rangeslider/',
to : 'plugins/ion-rangeslider' to: 'plugins/ion-rangeslider'
}, },
// JQVMap (jqvmap-novulnerability) // JQVMap (jqvmap-novulnerability)
{ {
from: 'node_modules/jqvmap-novulnerability/dist/', from: 'node_modules/jqvmap-novulnerability/dist/',
to : 'plugins/jqvmap' to: 'plugins/jqvmap'
}, },
// jQuery Mapael // jQuery Mapael
{ {
from: 'node_modules/jquery-mapael/js/', from: 'node_modules/jquery-mapael/js/',
to : 'plugins/jquery-mapael' to: 'plugins/jquery-mapael'
}, },
// Raphael // Raphael
{ {
from: 'node_modules/raphael/', from: 'node_modules/raphael/',
to : 'plugins/raphael' to: 'plugins/raphael'
}, },
// jQuery Mousewheel // jQuery Mousewheel
{ {
from: 'node_modules/jquery-mousewheel/', from: 'node_modules/jquery-mousewheel/',
to : 'plugins/jquery-mousewheel' to: 'plugins/jquery-mousewheel'
}, },
// jQuery Knob // jQuery Knob
{ {
from: 'node_modules/jquery-knob-chif/dist/', from: 'node_modules/jquery-knob-chif/dist/',
to : 'plugins/jquery-knob' to: 'plugins/jquery-knob'
}, },
// pace-progress // pace-progress
{ {
from: 'node_modules/@lgaitan/pace-progress/dist/', from: 'node_modules/@lgaitan/pace-progress/dist/',
to : 'plugins/pace-progress' to: 'plugins/pace-progress'
}, },
// Select2 // Select2
{ {
from: 'node_modules/select2/dist/', from: 'node_modules/select2/dist/',
to : 'plugins/select2' to: 'plugins/select2'
}, },
{ {
from: 'node_modules/@ttskch/select2-bootstrap4-theme/dist/', from: 'node_modules/@ttskch/select2-bootstrap4-theme/dist/',
to : 'plugins/select2-bootstrap4-theme' to: 'plugins/select2-bootstrap4-theme'
}, },
// Sparklines // Sparklines
{ {
from: 'node_modules/sparklines/source/', from: 'node_modules/sparklines/source/',
to : 'plugins/sparklines' to: 'plugins/sparklines'
}, },
// SweetAlert2 // SweetAlert2
{ {
from: 'node_modules/sweetalert2/dist/', from: 'node_modules/sweetalert2/dist/',
to : 'plugins/sweetalert2' to: 'plugins/sweetalert2'
}, },
{ {
from: 'node_modules/@sweetalert2/theme-bootstrap-4/', from: 'node_modules/@sweetalert2/theme-bootstrap-4/',
to : 'plugins/sweetalert2-theme-bootstrap-4' to: 'plugins/sweetalert2-theme-bootstrap-4'
}, },
// Toastr // Toastr
{ {
from: 'node_modules/toastr/build/', from: 'node_modules/toastr/build/',
to : 'plugins/toastr' to: 'plugins/toastr'
}, },
// jsGrid // jsGrid
{ {
@ -387,13 +389,13 @@ const Plugins = [
// jQuery Validate // jQuery Validate
{ {
from: 'node_modules/jquery-validation/dist/', from: 'node_modules/jquery-validation/dist/',
to : 'plugins/jquery-validation' to: 'plugins/jquery-validation'
}, },
// bs-custom-file-input // bs-custom-file-input
{ {
from: 'node_modules/bs-custom-file-input/dist/', from: 'node_modules/bs-custom-file-input/dist/',
to : 'plugins/bs-custom-file-input' to: 'plugins/bs-custom-file-input'
}, }
] ]
module.exports = Plugins module.exports = Plugins

12
build/npm/Publish.js
View file

@ -1,5 +1,7 @@
'use strict'
const Plugins = require('./Plugins') const Plugins = require('./Plugins')
const fse = require('fs-extra') const fse = require('fs-extra')
class Publish { class Publish {
constructor() { constructor() {
@ -12,7 +14,7 @@ class Publish {
getArguments() { getArguments() {
if (process.argv.length > 2) { if (process.argv.length > 2) {
let arg = process.argv[2] const arg = process.argv[2]
switch (arg) { switch (arg) {
case '-v': case '-v':
case '--verbose': case '--verbose':
@ -26,7 +28,7 @@ class Publish {
run() { run() {
// Publish files // Publish files
Plugins.forEach((module) => { Plugins.forEach(module => {
try { try {
if (fse.existsSync(module.from)) { if (fse.existsSync(module.from)) {
fse.copySync(module.from, module.to) fse.copySync(module.from, module.to)
@ -37,8 +39,8 @@ class Publish {
if (this.options.verbose) { if (this.options.verbose) {
console.log(`Copied ${module.from} to ${module.to}`) console.log(`Copied ${module.from} to ${module.to}`)
} }
} catch (err) { } catch (error) {
console.error(`Error: ${err}`) console.error(`Error: ${error}`)
} }
}) })
} }

163
dist/js/demo.js vendored
View file

@ -4,10 +4,13 @@
* You should not use this file in production. * You should not use this file in production.
* This file is for demo purposes only. * This file is for demo purposes only.
*/ */
/* eslint-disable camelcase */
(function ($) { (function ($) {
'use strict' 'use strict'
var $sidebar = $('.control-sidebar') var $sidebar = $('.control-sidebar')
var $container = $('<div />', { var $container = $('<div />', {
class: 'p-3 control-sidebar-content' class: 'p-3 control-sidebar-content'
}) })
@ -29,14 +32,14 @@
'navbar-cyan', 'navbar-cyan',
'navbar-dark', 'navbar-dark',
'navbar-gray-dark', 'navbar-gray-dark',
'navbar-gray', 'navbar-gray'
] ]
var navbar_light_skins = [ var navbar_light_skins = [
'navbar-light', 'navbar-light',
'navbar-warning', 'navbar-warning',
'navbar-white', 'navbar-white',
'navbar-orange', 'navbar-orange'
] ]
$container.append( $container.append(
@ -44,10 +47,10 @@
) )
var $no_border_checkbox = $('<input />', { var $no_border_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('.main-header').hasClass('border-bottom-0'), checked: $('.main-header').hasClass('border-bottom-0'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('.main-header').addClass('border-bottom-0') $('.main-header').addClass('border-bottom-0')
@ -55,14 +58,14 @@
$('.main-header').removeClass('border-bottom-0') $('.main-header').removeClass('border-bottom-0')
} }
}) })
var $no_border_container = $('<div />', {'class': 'mb-1'}).append($no_border_checkbox).append('<span>No Navbar border</span>') var $no_border_container = $('<div />', { class: 'mb-1' }).append($no_border_checkbox).append('<span>No Navbar border</span>')
$container.append($no_border_container) $container.append($no_border_container)
var $text_sm_body_checkbox = $('<input />', { var $text_sm_body_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('body').hasClass('text-sm'), checked: $('body').hasClass('text-sm'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('body').addClass('text-sm') $('body').addClass('text-sm')
@ -70,14 +73,14 @@
$('body').removeClass('text-sm') $('body').removeClass('text-sm')
} }
}) })
var $text_sm_body_container = $('<div />', {'class': 'mb-1'}).append($text_sm_body_checkbox).append('<span>Body small text</span>') var $text_sm_body_container = $('<div />', { class: 'mb-1' }).append($text_sm_body_checkbox).append('<span>Body small text</span>')
$container.append($text_sm_body_container) $container.append($text_sm_body_container)
var $text_sm_header_checkbox = $('<input />', { var $text_sm_header_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('.main-header').hasClass('text-sm'), checked: $('.main-header').hasClass('text-sm'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('.main-header').addClass('text-sm') $('.main-header').addClass('text-sm')
@ -85,14 +88,14 @@
$('.main-header').removeClass('text-sm') $('.main-header').removeClass('text-sm')
} }
}) })
var $text_sm_header_container = $('<div />', {'class': 'mb-1'}).append($text_sm_header_checkbox).append('<span>Navbar small text</span>') var $text_sm_header_container = $('<div />', { class: 'mb-1' }).append($text_sm_header_checkbox).append('<span>Navbar small text</span>')
$container.append($text_sm_header_container) $container.append($text_sm_header_container)
var $text_sm_sidebar_checkbox = $('<input />', { var $text_sm_sidebar_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('.nav-sidebar').hasClass('text-sm'), checked: $('.nav-sidebar').hasClass('text-sm'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('.nav-sidebar').addClass('text-sm') $('.nav-sidebar').addClass('text-sm')
@ -100,14 +103,14 @@
$('.nav-sidebar').removeClass('text-sm') $('.nav-sidebar').removeClass('text-sm')
} }
}) })
var $text_sm_sidebar_container = $('<div />', {'class': 'mb-1'}).append($text_sm_sidebar_checkbox).append('<span>Sidebar nav small text</span>') var $text_sm_sidebar_container = $('<div />', { class: 'mb-1' }).append($text_sm_sidebar_checkbox).append('<span>Sidebar nav small text</span>')
$container.append($text_sm_sidebar_container) $container.append($text_sm_sidebar_container)
var $text_sm_footer_checkbox = $('<input />', { var $text_sm_footer_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('.main-footer').hasClass('text-sm'), checked: $('.main-footer').hasClass('text-sm'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('.main-footer').addClass('text-sm') $('.main-footer').addClass('text-sm')
@ -115,14 +118,14 @@
$('.main-footer').removeClass('text-sm') $('.main-footer').removeClass('text-sm')
} }
}) })
var $text_sm_footer_container = $('<div />', {'class': 'mb-1'}).append($text_sm_footer_checkbox).append('<span>Footer small text</span>') var $text_sm_footer_container = $('<div />', { class: 'mb-1' }).append($text_sm_footer_checkbox).append('<span>Footer small text</span>')
$container.append($text_sm_footer_container) $container.append($text_sm_footer_container)
var $flat_sidebar_checkbox = $('<input />', { var $flat_sidebar_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('.nav-sidebar').hasClass('nav-flat'), checked: $('.nav-sidebar').hasClass('nav-flat'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('.nav-sidebar').addClass('nav-flat') $('.nav-sidebar').addClass('nav-flat')
@ -130,14 +133,14 @@
$('.nav-sidebar').removeClass('nav-flat') $('.nav-sidebar').removeClass('nav-flat')
} }
}) })
var $flat_sidebar_container = $('<div />', {'class': 'mb-1'}).append($flat_sidebar_checkbox).append('<span>Sidebar nav flat style</span>') var $flat_sidebar_container = $('<div />', { class: 'mb-1' }).append($flat_sidebar_checkbox).append('<span>Sidebar nav flat style</span>')
$container.append($flat_sidebar_container) $container.append($flat_sidebar_container)
var $legacy_sidebar_checkbox = $('<input />', { var $legacy_sidebar_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('.nav-sidebar').hasClass('nav-legacy'), checked: $('.nav-sidebar').hasClass('nav-legacy'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('.nav-sidebar').addClass('nav-legacy') $('.nav-sidebar').addClass('nav-legacy')
@ -145,14 +148,14 @@
$('.nav-sidebar').removeClass('nav-legacy') $('.nav-sidebar').removeClass('nav-legacy')
} }
}) })
var $legacy_sidebar_container = $('<div />', {'class': 'mb-1'}).append($legacy_sidebar_checkbox).append('<span>Sidebar nav legacy style</span>') var $legacy_sidebar_container = $('<div />', { class: 'mb-1' }).append($legacy_sidebar_checkbox).append('<span>Sidebar nav legacy style</span>')
$container.append($legacy_sidebar_container) $container.append($legacy_sidebar_container)
var $compact_sidebar_checkbox = $('<input />', { var $compact_sidebar_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('.nav-sidebar').hasClass('nav-compact'), checked: $('.nav-sidebar').hasClass('nav-compact'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('.nav-sidebar').addClass('nav-compact') $('.nav-sidebar').addClass('nav-compact')
@ -160,14 +163,14 @@
$('.nav-sidebar').removeClass('nav-compact') $('.nav-sidebar').removeClass('nav-compact')
} }
}) })
var $compact_sidebar_container = $('<div />', {'class': 'mb-1'}).append($compact_sidebar_checkbox).append('<span>Sidebar nav compact</span>') var $compact_sidebar_container = $('<div />', { class: 'mb-1' }).append($compact_sidebar_checkbox).append('<span>Sidebar nav compact</span>')
$container.append($compact_sidebar_container) $container.append($compact_sidebar_container)
var $child_indent_sidebar_checkbox = $('<input />', { var $child_indent_sidebar_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('.nav-sidebar').hasClass('nav-child-indent'), checked: $('.nav-sidebar').hasClass('nav-child-indent'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('.nav-sidebar').addClass('nav-child-indent') $('.nav-sidebar').addClass('nav-child-indent')
@ -175,14 +178,14 @@
$('.nav-sidebar').removeClass('nav-child-indent') $('.nav-sidebar').removeClass('nav-child-indent')
} }
}) })
var $child_indent_sidebar_container = $('<div />', {'class': 'mb-1'}).append($child_indent_sidebar_checkbox).append('<span>Sidebar nav child indent</span>') var $child_indent_sidebar_container = $('<div />', { class: 'mb-1' }).append($child_indent_sidebar_checkbox).append('<span>Sidebar nav child indent</span>')
$container.append($child_indent_sidebar_container) $container.append($child_indent_sidebar_container)
var $no_expand_sidebar_checkbox = $('<input />', { var $no_expand_sidebar_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('.main-sidebar').hasClass('sidebar-no-expand'), checked: $('.main-sidebar').hasClass('sidebar-no-expand'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('.main-sidebar').addClass('sidebar-no-expand') $('.main-sidebar').addClass('sidebar-no-expand')
@ -190,14 +193,14 @@
$('.main-sidebar').removeClass('sidebar-no-expand') $('.main-sidebar').removeClass('sidebar-no-expand')
} }
}) })
var $no_expand_sidebar_container = $('<div />', {'class': 'mb-1'}).append($no_expand_sidebar_checkbox).append('<span>Main Sidebar disable hover/focus auto expand</span>') var $no_expand_sidebar_container = $('<div />', { class: 'mb-1' }).append($no_expand_sidebar_checkbox).append('<span>Main Sidebar disable hover/focus auto expand</span>')
$container.append($no_expand_sidebar_container) $container.append($no_expand_sidebar_container)
var $text_sm_brand_checkbox = $('<input />', { var $text_sm_brand_checkbox = $('<input />', {
type : 'checkbox', type: 'checkbox',
value : 1, value: 1,
checked: $('.brand-link').hasClass('text-sm'), checked: $('.brand-link').hasClass('text-sm'),
'class': 'mr-1' class: 'mr-1'
}).on('click', function () { }).on('click', function () {
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
$('.brand-link').addClass('text-sm') $('.brand-link').addClass('text-sm')
@ -205,20 +208,20 @@
$('.brand-link').removeClass('text-sm') $('.brand-link').removeClass('text-sm')
} }
}) })
var $text_sm_brand_container = $('<div />', {'class': 'mb-4'}).append($text_sm_brand_checkbox).append('<span>Brand small text</span>') var $text_sm_brand_container = $('<div />', { class: 'mb-4' }).append($text_sm_brand_checkbox).append('<span>Brand small text</span>')
$container.append($text_sm_brand_container) $container.append($text_sm_brand_container)
$container.append('<h6>Navbar Variants</h6>') $container.append('<h6>Navbar Variants</h6>')
var $navbar_variants = $('<div />', { var $navbar_variants = $('<div />', {
'class': 'd-flex' class: 'd-flex'
}) })
var navbar_all_colors = navbar_dark_skins.concat(navbar_light_skins) var navbar_all_colors = navbar_dark_skins.concat(navbar_light_skins)
var $navbar_variants_colors = createSkinBlock(navbar_all_colors, function (e) { var $navbar_variants_colors = createSkinBlock(navbar_all_colors, function () {
var color = $(this).data('color') var color = $(this).data('color')
var $main_header = $('.main-header') var $main_header = $('.main-header')
$main_header.removeClass('navbar-dark').removeClass('navbar-light') $main_header.removeClass('navbar-dark').removeClass('navbar-light')
navbar_all_colors.map(function (color) { navbar_all_colors.forEach(function (color) {
$main_header.removeClass(color) $main_header.removeClass(color)
}) })
@ -310,14 +313,14 @@
$container.append('<h6>Accent Color Variants</h6>') $container.append('<h6>Accent Color Variants</h6>')
var $accent_variants = $('<div />', { var $accent_variants = $('<div />', {
'class': 'd-flex' class: 'd-flex'
}) })
$container.append($accent_variants) $container.append($accent_variants)
$container.append(createSkinBlock(accent_colors, function () { $container.append(createSkinBlock(accent_colors, function () {
var color = $(this).data('color') var color = $(this).data('color')
var accent_class = color var accent_class = color
var $body = $('body') var $body = $('body')
accent_colors.map(function (skin) { accent_colors.forEach(function (skin) {
$body.removeClass(skin) $body.removeClass(skin)
}) })
@ -326,14 +329,14 @@
$container.append('<h6>Dark Sidebar Variants</h6>') $container.append('<h6>Dark Sidebar Variants</h6>')
var $sidebar_variants_dark = $('<div />', { var $sidebar_variants_dark = $('<div />', {
'class': 'd-flex' class: 'd-flex'
}) })
$container.append($sidebar_variants_dark) $container.append($sidebar_variants_dark)
$container.append(createSkinBlock(sidebar_colors, function () { $container.append(createSkinBlock(sidebar_colors, function () {
var color = $(this).data('color') var color = $(this).data('color')
var sidebar_class = 'sidebar-dark-' + color.replace('bg-', '') var sidebar_class = 'sidebar-dark-' + color.replace('bg-', '')
var $sidebar = $('.main-sidebar') var $sidebar = $('.main-sidebar')
sidebar_skins.map(function (skin) { sidebar_skins.forEach(function (skin) {
$sidebar.removeClass(skin) $sidebar.removeClass(skin)
}) })
@ -342,14 +345,14 @@
$container.append('<h6>Light Sidebar Variants</h6>') $container.append('<h6>Light Sidebar Variants</h6>')
var $sidebar_variants_light = $('<div />', { var $sidebar_variants_light = $('<div />', {
'class': 'd-flex' class: 'd-flex'
}) })
$container.append($sidebar_variants_light) $container.append($sidebar_variants_light)
$container.append(createSkinBlock(sidebar_colors, function () { $container.append(createSkinBlock(sidebar_colors, function () {
var color = $(this).data('color') var color = $(this).data('color')
var sidebar_class = 'sidebar-light-' + color.replace('bg-', '') var sidebar_class = 'sidebar-light-' + color.replace('bg-', '')
var $sidebar = $('.main-sidebar') var $sidebar = $('.main-sidebar')
sidebar_skins.map(function (skin) { sidebar_skins.forEach(function (skin) {
$sidebar.removeClass(skin) $sidebar.removeClass(skin)
}) })
@ -359,21 +362,21 @@
var logo_skins = navbar_all_colors var logo_skins = navbar_all_colors
$container.append('<h6>Brand Logo Variants</h6>') $container.append('<h6>Brand Logo Variants</h6>')
var $logo_variants = $('<div />', { var $logo_variants = $('<div />', {
'class': 'd-flex' class: 'd-flex'
}) })
$container.append($logo_variants) $container.append($logo_variants)
var $clear_btn = $('<a />', { var $clear_btn = $('<a />', {
href: 'javascript:void(0)' href: 'javascript:void(0)'
}).text('clear').on('click', function () { }).text('clear').on('click', function () {
var $logo = $('.brand-link') var $logo = $('.brand-link')
logo_skins.map(function (skin) { logo_skins.forEach(function (skin) {
$logo.removeClass(skin) $logo.removeClass(skin)
}) })
}) })
$container.append(createSkinBlock(logo_skins, function () { $container.append(createSkinBlock(logo_skins, function () {
var color = $(this).data('color') var color = $(this).data('color')
var $logo = $('.brand-link') var $logo = $('.brand-link')
logo_skins.map(function (skin) { logo_skins.forEach(function (skin) {
$logo.removeClass(skin) $logo.removeClass(skin)
}) })
$logo.addClass(color) $logo.addClass(color)
@ -381,12 +384,12 @@
function createSkinBlock(colors, callback) { function createSkinBlock(colors, callback) {
var $block = $('<div />', { var $block = $('<div />', {
'class': 'd-flex flex-wrap mb-3' class: 'd-flex flex-wrap mb-3'
}) })
colors.map(function (color) { colors.forEach(function (color) {
var $color = $('<div />', { var $color = $('<div />', {
'class': (typeof color === 'object' ? color.join(' ') : color).replace('navbar-', 'bg-').replace('accent-', 'bg-') + ' elevation-2' class: (typeof color === 'object' ? color.join(' ') : color).replace('navbar-', 'bg-').replace('accent-', 'bg-') + ' elevation-2'
}) })
$block.append($color) $block.append($color)
@ -394,13 +397,13 @@
$color.data('color', color) $color.data('color', color)
$color.css({ $color.css({
width : '40px', width: '40px',
height : '20px', height: '20px',
borderRadius: '25px', borderRadius: '25px',
marginRight : 10, marginRight: 10,
marginBottom: 10, marginBottom: 10,
opacity : 0.8, opacity: 0.8,
cursor : 'pointer' cursor: 'pointer'
}) })
$color.hover(function () { $color.hover(function () {
@ -417,10 +420,10 @@
return $block return $block
} }
$('.product-image-thumb').on('click', function() { $('.product-image-thumb').on('click', function () {
const image_element = $(this).find('img'); var image_element = $(this).find('img')
$('.product-image').prop('src', $(image_element).attr('src')) $('.product-image').prop('src', $(image_element).attr('src'))
$('.product-image-thumb.active').removeClass('active'); $('.product-image-thumb.active').removeClass('active')
$(this).addClass('active'); $(this).addClass('active')
}); })
})(jQuery) })(jQuery)

237
dist/js/pages/dashboard.js vendored
View file

@ -5,44 +5,46 @@
* This is a demo file used only for the main dashboard (index.html) * This is a demo file used only for the main dashboard (index.html)
**/ **/
$(function () { /* global moment:false, Chart:false, Sparkline:false */
$(function () {
'use strict' 'use strict'
// Make the dashboard widgets sortable Using jquery UI // Make the dashboard widgets sortable Using jquery UI
$('.connectedSortable').sortable({ $('.connectedSortable').sortable({
placeholder : 'sort-highlight', placeholder: 'sort-highlight',
connectWith : '.connectedSortable', connectWith: '.connectedSortable',
handle : '.card-header, .nav-tabs', handle: '.card-header, .nav-tabs',
forcePlaceholderSize: true, forcePlaceholderSize: true,
zIndex : 999999 zIndex: 999999
}) })
$('.connectedSortable .card-header, .connectedSortable .nav-tabs-custom').css('cursor', 'move') $('.connectedSortable .card-header, .connectedSortable .nav-tabs-custom').css('cursor', 'move')
// jQuery UI sortable for the todo list // jQuery UI sortable for the todo list
$('.todo-list').sortable({ $('.todo-list').sortable({
placeholder : 'sort-highlight', placeholder: 'sort-highlight',
handle : '.handle', handle: '.handle',
forcePlaceholderSize: true, forcePlaceholderSize: true,
zIndex : 999999 zIndex: 999999
}) })
// bootstrap WYSIHTML5 - text editor // bootstrap WYSIHTML5 - text editor
$('.textarea').summernote() $('.textarea').summernote()
$('.daterange').daterangepicker({ $('.daterange').daterangepicker({
ranges : { ranges: {
'Today' : [moment(), moment()], Today: [moment(), moment()],
'Yesterday' : [moment().subtract(1, 'days'), moment().subtract(1, 'days')], Yesterday: [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
'Last 7 Days' : [moment().subtract(6, 'days'), moment()], 'Last 7 Days': [moment().subtract(6, 'days'), moment()],
'Last 30 Days': [moment().subtract(29, 'days'), moment()], 'Last 30 Days': [moment().subtract(29, 'days'), moment()],
'This Month' : [moment().startOf('month'), moment().endOf('month')], 'This Month': [moment().startOf('month'), moment().endOf('month')],
'Last Month' : [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')] 'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
}, },
startDate: moment().subtract(29, 'days'), startDate: moment().subtract(29, 'days'),
endDate : moment() endDate: moment()
}, function (start, end) { }, function (start, end) {
window.alert('You chose: ' + start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY')) // eslint-disable-next-line no-alert
alert('You chose: ' + start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'))
}) })
/* jQueryKnob */ /* jQueryKnob */
@ -50,52 +52,53 @@ $(function () {
// jvectormap data // jvectormap data
var visitorsData = { var visitorsData = {
'US': 398, //USA US: 398, // USA
'SA': 400, //Saudi Arabia SA: 400, // Saudi Arabia
'CA': 1000, //Canada CA: 1000, // Canada
'DE': 500, //Germany DE: 500, // Germany
'FR': 760, //France FR: 760, // France
'CN': 300, //China CN: 300, // China
'AU': 700, //Australia AU: 700, // Australia
'BR': 600, //Brazil BR: 600, // Brazil
'IN': 800, //India IN: 800, // India
'GB': 320, //Great Britain GB: 320, // Great Britain
'RU': 3000 //Russia RU: 3000 // Russia
} }
// World map by jvectormap // World map by jvectormap
$('#world-map').vectorMap({ $('#world-map').vectorMap({
map : 'usa_en', map: 'usa_en',
backgroundColor : 'transparent', backgroundColor: 'transparent',
regionStyle : { regionStyle: {
initial: { initial: {
fill : 'rgba(255, 255, 255, 0.7)', fill: 'rgba(255, 255, 255, 0.7)',
'fill-opacity' : 1, 'fill-opacity': 1,
stroke : 'rgba(0,0,0,.2)', stroke: 'rgba(0,0,0,.2)',
'stroke-width' : 1, 'stroke-width': 1,
'stroke-opacity': 1 'stroke-opacity': 1
} }
}, },
series : { series: {
regions: [{ regions: [{
values : visitorsData, values: visitorsData,
scale : ['#ffffff', '#0154ad'], scale: ['#ffffff', '#0154ad'],
normalizeFunction: 'polynomial' normalizeFunction: 'polynomial'
}] }]
}, },
onRegionLabelShow: function (e, el, code) { onRegionLabelShow: function (e, el, code) {
if (typeof visitorsData[code] != 'undefined') if (typeof visitorsData[code] !== 'undefined') {
el.html(el.html() + ': ' + visitorsData[code] + ' new visitors') el.html(el.html() + ': ' + visitorsData[code] + ' new visitors')
}
} }
}) })
// Sparkline charts // Sparkline charts
var sparkline1 = new Sparkline($("#sparkline-1")[0], {width: 80, height: 50, lineColor: '#92c1dc', endColor: '#ebf4f9'}); var sparkline1 = new Sparkline($('#sparkline-1')[0], { width: 80, height: 50, lineColor: '#92c1dc', endColor: '#ebf4f9' })
var sparkline2 = new Sparkline($("#sparkline-2")[0], {width: 80, height: 50, lineColor: '#92c1dc', endColor: '#ebf4f9'}); var sparkline2 = new Sparkline($('#sparkline-2')[0], { width: 80, height: 50, lineColor: '#92c1dc', endColor: '#ebf4f9' })
var sparkline3 = new Sparkline($("#sparkline-3")[0], {width: 80, height: 50, lineColor: '#92c1dc', endColor: '#ebf4f9'}); var sparkline3 = new Sparkline($('#sparkline-3')[0], { width: 80, height: 50, lineColor: '#92c1dc', endColor: '#ebf4f9' })
sparkline1.draw([1000, 1200, 920, 927, 931, 1027, 819, 930, 1021]); sparkline1.draw([1000, 1200, 920, 927, 931, 1027, 819, 930, 1021])
sparkline2.draw([515, 519, 520, 522, 652, 810, 370, 627, 319, 630, 921]); sparkline2.draw([515, 519, 520, 522, 652, 810, 370, 627, 319, 630, 921])
sparkline3.draw([15, 19, 20, 22, 33, 27, 31, 27, 19, 30, 21]); sparkline3.draw([15, 19, 20, 22, 33, 27, 31, 27, 19, 30, 21])
// The Calender // The Calender
$('#calendar').datetimepicker({ $('#calendar').datetimepicker({
@ -110,77 +113,77 @@ $(function () {
/* Chart.js Charts */ /* Chart.js Charts */
// Sales chart // Sales chart
var salesChartCanvas = document.getElementById('revenue-chart-canvas').getContext('2d'); var salesChartCanvas = document.getElementById('revenue-chart-canvas').getContext('2d')
//$('#revenue-chart').get(0).getContext('2d'); // $('#revenue-chart').get(0).getContext('2d');
var salesChartData = { var salesChartData = {
labels : ['January', 'February', 'March', 'April', 'May', 'June', 'July'], labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
datasets: [ datasets: [
{ {
label : 'Digital Goods', label: 'Digital Goods',
backgroundColor : 'rgba(60,141,188,0.9)', backgroundColor: 'rgba(60,141,188,0.9)',
borderColor : 'rgba(60,141,188,0.8)', borderColor: 'rgba(60,141,188,0.8)',
pointRadius : false, pointRadius: false,
pointColor : '#3b8bba', pointColor: '#3b8bba',
pointStrokeColor : 'rgba(60,141,188,1)', pointStrokeColor: 'rgba(60,141,188,1)',
pointHighlightFill : '#fff', pointHighlightFill: '#fff',
pointHighlightStroke: 'rgba(60,141,188,1)', pointHighlightStroke: 'rgba(60,141,188,1)',
data : [28, 48, 40, 19, 86, 27, 90] data: [28, 48, 40, 19, 86, 27, 90]
}, },
{ {
label : 'Electronics', label: 'Electronics',
backgroundColor : 'rgba(210, 214, 222, 1)', backgroundColor: 'rgba(210, 214, 222, 1)',
borderColor : 'rgba(210, 214, 222, 1)', borderColor: 'rgba(210, 214, 222, 1)',
pointRadius : false, pointRadius: false,
pointColor : 'rgba(210, 214, 222, 1)', pointColor: 'rgba(210, 214, 222, 1)',
pointStrokeColor : '#c1c7d1', pointStrokeColor: '#c1c7d1',
pointHighlightFill : '#fff', pointHighlightFill: '#fff',
pointHighlightStroke: 'rgba(220,220,220,1)', pointHighlightStroke: 'rgba(220,220,220,1)',
data : [65, 59, 80, 81, 56, 55, 40] data: [65, 59, 80, 81, 56, 55, 40]
}, }
] ]
} }
var salesChartOptions = { var salesChartOptions = {
maintainAspectRatio : false, maintainAspectRatio: false,
responsive : true, responsive: true,
legend: { legend: {
display: false display: false
}, },
scales: { scales: {
xAxes: [{ xAxes: [{
gridLines : { gridLines: {
display : false, display: false
} }
}], }],
yAxes: [{ yAxes: [{
gridLines : { gridLines: {
display : false, display: false
} }
}] }]
} }
} }
// This will get the first returned node in the jQuery collection. // This will get the first returned node in the jQuery collection.
// eslint-disable-next-line no-unused-vars
var salesChart = new Chart(salesChartCanvas, { var salesChart = new Chart(salesChartCanvas, {
type: 'line', type: 'line',
data: salesChartData, data: salesChartData,
options: salesChartOptions options: salesChartOptions
} })
)
// Donut Chart // Donut Chart
var pieChartCanvas = $('#sales-chart-canvas').get(0).getContext('2d') var pieChartCanvas = $('#sales-chart-canvas').get(0).getContext('2d')
var pieData = { var pieData = {
labels: [ labels: [
'Instore Sales', 'Instore Sales',
'Download Sales', 'Download Sales',
'Mail-Order Sales', 'Mail-Order Sales'
], ],
datasets: [ datasets: [
{ {
data: [30,12,20], data: [30, 12, 20],
backgroundColor : ['#f56954', '#00a65a', '#f39c12'], backgroundColor: ['#f56954', '#00a65a', '#f39c12']
} }
] ]
} }
@ -188,77 +191,77 @@ $(function () {
legend: { legend: {
display: false display: false
}, },
maintainAspectRatio : false, maintainAspectRatio: false,
responsive : true, responsive: true
} }
//Create pie or douhnut chart // Create pie or douhnut chart
// You can switch between pie and douhnut using the method below. // You can switch between pie and douhnut using the method below.
// eslint-disable-next-line no-unused-vars
var pieChart = new Chart(pieChartCanvas, { var pieChart = new Chart(pieChartCanvas, {
type: 'doughnut', type: 'doughnut',
data: pieData, data: pieData,
options: pieOptions options: pieOptions
}); })
// Sales graph chart // Sales graph chart
var salesGraphChartCanvas = $('#line-chart').get(0).getContext('2d'); var salesGraphChartCanvas = $('#line-chart').get(0).getContext('2d')
//$('#revenue-chart').get(0).getContext('2d'); // $('#revenue-chart').get(0).getContext('2d');
var salesGraphChartData = { var salesGraphChartData = {
labels : ['2011 Q1', '2011 Q2', '2011 Q3', '2011 Q4', '2012 Q1', '2012 Q2', '2012 Q3', '2012 Q4', '2013 Q1', '2013 Q2'], labels: ['2011 Q1', '2011 Q2', '2011 Q3', '2011 Q4', '2012 Q1', '2012 Q2', '2012 Q3', '2012 Q4', '2013 Q1', '2013 Q2'],
datasets: [ datasets: [
{ {
label : 'Digital Goods', label: 'Digital Goods',
fill : false, fill: false,
borderWidth : 2, borderWidth: 2,
lineTension : 0, lineTension: 0,
spanGaps : true, spanGaps: true,
borderColor : '#efefef', borderColor: '#efefef',
pointRadius : 3, pointRadius: 3,
pointHoverRadius : 7, pointHoverRadius: 7,
pointColor : '#efefef', pointColor: '#efefef',
pointBackgroundColor: '#efefef', pointBackgroundColor: '#efefef',
data : [2666, 2778, 4912, 3767, 6810, 5670, 4820, 15073, 10687, 8432] data: [2666, 2778, 4912, 3767, 6810, 5670, 4820, 15073, 10687, 8432]
} }
] ]
} }
var salesGraphChartOptions = { var salesGraphChartOptions = {
maintainAspectRatio : false, maintainAspectRatio: false,
responsive : true, responsive: true,
legend: { legend: {
display: false, display: false
}, },
scales: { scales: {
xAxes: [{ xAxes: [{
ticks : { ticks: {
fontColor: '#efefef', fontColor: '#efefef'
}, },
gridLines : { gridLines: {
display : false, display: false,
color: '#efefef', color: '#efefef',
drawBorder: false, drawBorder: false
} }
}], }],
yAxes: [{ yAxes: [{
ticks : { ticks: {
stepSize: 5000, stepSize: 5000,
fontColor: '#efefef', fontColor: '#efefef'
}, },
gridLines : { gridLines: {
display : true, display: true,
color: '#efefef', color: '#efefef',
drawBorder: false, drawBorder: false
} }
}] }]
} }
} }
// This will get the first returned node in the jQuery collection. // This will get the first returned node in the jQuery collection.
// eslint-disable-next-line no-unused-vars
var salesGraphChart = new Chart(salesGraphChartCanvas, { var salesGraphChart = new Chart(salesGraphChartCanvas, {
type: 'line', type: 'line',
data: salesGraphChartData, data: salesGraphChartData,
options: salesGraphChartOptions options: salesGraphChartOptions
} })
)
}) })

139
dist/js/pages/dashboard2.js vendored
View file

@ -1,5 +1,6 @@
$(function () { /* global Chart:false */
$(function () {
'use strict' 'use strict'
/* ChartJS /* ChartJS
@ -8,108 +9,110 @@ $(function () {
*/ */
//----------------------- //-----------------------
//- MONTHLY SALES CHART - // - MONTHLY SALES CHART -
//----------------------- //-----------------------
// Get context with jQuery - using jQuery's .get() method. // Get context with jQuery - using jQuery's .get() method.
var salesChartCanvas = $('#salesChart').get(0).getContext('2d') var salesChartCanvas = $('#salesChart').get(0).getContext('2d')
var salesChartData = { var salesChartData = {
labels : ['January', 'February', 'March', 'April', 'May', 'June', 'July'], labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
datasets: [ datasets: [
{ {
label : 'Digital Goods', label: 'Digital Goods',
backgroundColor : 'rgba(60,141,188,0.9)', backgroundColor: 'rgba(60,141,188,0.9)',
borderColor : 'rgba(60,141,188,0.8)', borderColor: 'rgba(60,141,188,0.8)',
pointRadius : false, pointRadius: false,
pointColor : '#3b8bba', pointColor: '#3b8bba',
pointStrokeColor : 'rgba(60,141,188,1)', pointStrokeColor: 'rgba(60,141,188,1)',
pointHighlightFill : '#fff', pointHighlightFill: '#fff',
pointHighlightStroke: 'rgba(60,141,188,1)', pointHighlightStroke: 'rgba(60,141,188,1)',
data : [28, 48, 40, 19, 86, 27, 90] data: [28, 48, 40, 19, 86, 27, 90]
}, },
{ {
label : 'Electronics', label: 'Electronics',
backgroundColor : 'rgba(210, 214, 222, 1)', backgroundColor: 'rgba(210, 214, 222, 1)',
borderColor : 'rgba(210, 214, 222, 1)', borderColor: 'rgba(210, 214, 222, 1)',
pointRadius : false, pointRadius: false,
pointColor : 'rgba(210, 214, 222, 1)', pointColor: 'rgba(210, 214, 222, 1)',
pointStrokeColor : '#c1c7d1', pointStrokeColor: '#c1c7d1',
pointHighlightFill : '#fff', pointHighlightFill: '#fff',
pointHighlightStroke: 'rgba(220,220,220,1)', pointHighlightStroke: 'rgba(220,220,220,1)',
data : [65, 59, 80, 81, 56, 55, 40] data: [65, 59, 80, 81, 56, 55, 40]
}, }
] ]
} }
var salesChartOptions = { var salesChartOptions = {
maintainAspectRatio : false, maintainAspectRatio: false,
responsive : true, responsive: true,
legend: { legend: {
display: false display: false
}, },
scales: { scales: {
xAxes: [{ xAxes: [{
gridLines : { gridLines: {
display : false, display: false
} }
}], }],
yAxes: [{ yAxes: [{
gridLines : { gridLines: {
display : false, display: false
} }
}] }]
} }
} }
// This will get the first returned node in the jQuery collection. // This will get the first returned node in the jQuery collection.
// eslint-disable-next-line no-unused-vars
var salesChart = new Chart(salesChartCanvas, { var salesChart = new Chart(salesChartCanvas, {
type: 'line', type: 'line',
data: salesChartData, data: salesChartData,
options: salesChartOptions options: salesChartOptions
} }
) )
//--------------------------- //---------------------------
//- END MONTHLY SALES CHART - // - END MONTHLY SALES CHART -
//--------------------------- //---------------------------
//------------- //-------------
//- PIE CHART - // - PIE CHART -
//------------- //-------------
// Get context with jQuery - using jQuery's .get() method. // Get context with jQuery - using jQuery's .get() method.
var pieChartCanvas = $('#pieChart').get(0).getContext('2d') var pieChartCanvas = $('#pieChart').get(0).getContext('2d')
var pieData = { var pieData = {
labels: [ labels: [
'Chrome', 'Chrome',
'IE', 'IE',
'FireFox', 'FireFox',
'Safari', 'Safari',
'Opera', 'Opera',
'Navigator', 'Navigator'
], ],
datasets: [ datasets: [
{ {
data: [700,500,400,600,300,100], data: [700, 500, 400, 600, 300, 100],
backgroundColor : ['#f56954', '#00a65a', '#f39c12', '#00c0ef', '#3c8dbc', '#d2d6de'], backgroundColor: ['#f56954', '#00a65a', '#f39c12', '#00c0ef', '#3c8dbc', '#d2d6de']
}
]
}
var pieOptions = {
legend: {
display: false
} }
]
}
var pieOptions = {
legend: {
display: false
} }
//Create pie or douhnut chart }
// You can switch between pie and douhnut using the method below. // Create pie or douhnut chart
var pieChart = new Chart(pieChartCanvas, { // You can switch between pie and douhnut using the method below.
type: 'doughnut', // eslint-disable-next-line no-unused-vars
data: pieData, var pieChart = new Chart(pieChartCanvas, {
options: pieOptions type: 'doughnut',
}) data: pieData,
options: pieOptions
})
//----------------- //-----------------
//- END PIE CHART - // - END PIE CHART -
//----------------- //-----------------
/* jVector Maps /* jVector Maps
@ -117,15 +120,14 @@ $(function () {
* Create a world map with markers * Create a world map with markers
*/ */
$('#world-map-markers').mapael({ $('#world-map-markers').mapael({
map: { map: {
name : "usa_states", name: 'usa_states',
zoom: { zoom: {
enabled: true, enabled: true,
maxLevel: 10 maxLevel: 10
}, }
},
} }
); })
// $('#world-map-markers').vectorMap({ // $('#world-map-markers').vectorMap({
// map : 'world_en', // map : 'world_en',
@ -263,5 +265,4 @@ $(function () {
// } // }
// ] // ]
// }) // })
}) })

115
dist/js/pages/dashboard3.js vendored
View file

@ -1,3 +1,5 @@
/* global Chart:false */
$(function () { $(function () {
'use strict' 'use strict'
@ -6,133 +8,136 @@ $(function () {
fontStyle: 'bold' fontStyle: 'bold'
} }
var mode = 'index' var mode = 'index'
var intersect = true var intersect = true
var $salesChart = $('#sales-chart') var $salesChart = $('#sales-chart')
var salesChart = new Chart($salesChart, { // eslint-disable-next-line no-unused-vars
type : 'bar', var salesChart = new Chart($salesChart, {
data : { type: 'bar',
labels : ['JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'], data: {
labels: ['JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'],
datasets: [ datasets: [
{ {
backgroundColor: '#007bff', backgroundColor: '#007bff',
borderColor : '#007bff', borderColor: '#007bff',
data : [1000, 2000, 3000, 2500, 2700, 2500, 3000] data: [1000, 2000, 3000, 2500, 2700, 2500, 3000]
}, },
{ {
backgroundColor: '#ced4da', backgroundColor: '#ced4da',
borderColor : '#ced4da', borderColor: '#ced4da',
data : [700, 1700, 2700, 2000, 1800, 1500, 2000] data: [700, 1700, 2700, 2000, 1800, 1500, 2000]
} }
] ]
}, },
options: { options: {
maintainAspectRatio: false, maintainAspectRatio: false,
tooltips : { tooltips: {
mode : mode, mode: mode,
intersect: intersect intersect: intersect
}, },
hover : { hover: {
mode : mode, mode: mode,
intersect: intersect intersect: intersect
}, },
legend : { legend: {
display: false display: false
}, },
scales : { scales: {
yAxes: [{ yAxes: [{
// display: false, // display: false,
gridLines: { gridLines: {
display : true, display: true,
lineWidth : '4px', lineWidth: '4px',
color : 'rgba(0, 0, 0, .2)', color: 'rgba(0, 0, 0, .2)',
zeroLineColor: 'transparent' zeroLineColor: 'transparent'
}, },
ticks : $.extend({ ticks: $.extend({
beginAtZero: true, beginAtZero: true,
// Include a dollar sign in the ticks // Include a dollar sign in the ticks
callback: function (value, index, values) { callback: function (value) {
if (value >= 1000) { if (value >= 1000) {
value /= 1000 value /= 1000
value += 'k' value += 'k'
} }
return '$' + value return '$' + value
} }
}, ticksStyle) }, ticksStyle)
}], }],
xAxes: [{ xAxes: [{
display : true, display: true,
gridLines: { gridLines: {
display: false display: false
}, },
ticks : ticksStyle ticks: ticksStyle
}] }]
} }
} }
}) })
var $visitorsChart = $('#visitors-chart') var $visitorsChart = $('#visitors-chart')
var visitorsChart = new Chart($visitorsChart, { // eslint-disable-next-line no-unused-vars
data : { var visitorsChart = new Chart($visitorsChart, {
labels : ['18th', '20th', '22nd', '24th', '26th', '28th', '30th'], data: {
labels: ['18th', '20th', '22nd', '24th', '26th', '28th', '30th'],
datasets: [{ datasets: [{
type : 'line', type: 'line',
data : [100, 120, 170, 167, 180, 177, 160], data: [100, 120, 170, 167, 180, 177, 160],
backgroundColor : 'transparent', backgroundColor: 'transparent',
borderColor : '#007bff', borderColor: '#007bff',
pointBorderColor : '#007bff', pointBorderColor: '#007bff',
pointBackgroundColor: '#007bff', pointBackgroundColor: '#007bff',
fill : false fill: false
// pointHoverBackgroundColor: '#007bff', // pointHoverBackgroundColor: '#007bff',
// pointHoverBorderColor : '#007bff' // pointHoverBorderColor : '#007bff'
}, },
{ {
type : 'line', type: 'line',
data : [60, 80, 70, 67, 80, 77, 100], data: [60, 80, 70, 67, 80, 77, 100],
backgroundColor : 'tansparent', backgroundColor: 'tansparent',
borderColor : '#ced4da', borderColor: '#ced4da',
pointBorderColor : '#ced4da', pointBorderColor: '#ced4da',
pointBackgroundColor: '#ced4da', pointBackgroundColor: '#ced4da',
fill : false fill: false
// pointHoverBackgroundColor: '#ced4da', // pointHoverBackgroundColor: '#ced4da',
// pointHoverBorderColor : '#ced4da' // pointHoverBorderColor : '#ced4da'
}] }]
}, },
options: { options: {
maintainAspectRatio: false, maintainAspectRatio: false,
tooltips : { tooltips: {
mode : mode, mode: mode,
intersect: intersect intersect: intersect
}, },
hover : { hover: {
mode : mode, mode: mode,
intersect: intersect intersect: intersect
}, },
legend : { legend: {
display: false display: false
}, },
scales : { scales: {
yAxes: [{ yAxes: [{
// display: false, // display: false,
gridLines: { gridLines: {
display : true, display: true,
lineWidth : '4px', lineWidth: '4px',
color : 'rgba(0, 0, 0, .2)', color: 'rgba(0, 0, 0, .2)',
zeroLineColor: 'transparent' zeroLineColor: 'transparent'
}, },
ticks : $.extend({ ticks: $.extend({
beginAtZero : true, beginAtZero: true,
suggestedMax: 200 suggestedMax: 200
}, ticksStyle) }, ticksStyle)
}], }],
xAxes: [{ xAxes: [{
display : true, display: true,
gridLines: { gridLines: {
display: false display: false
}, },
ticks : ticksStyle ticks: ticksStyle
}] }]
} }
} }

2
pages/UI/modals.html
View file

@ -1188,7 +1188,7 @@
<script> <script>
$(function() { $(function() {
const Toast = Swal.mixin({ var Toast = Swal.mixin({
toast: true, toast: true,
position: 'top-end', position: 'top-end',
showConfirmButton: false, showConfirmButton: false,