Add js cor elibrary
This commit is contained in:
parent
8c46fd750d
commit
be99b8e37f
|
@ -0,0 +1,432 @@
|
|||
"use strict";
|
||||
|
||||
/*!
|
||||
|
||||
=========================================================
|
||||
* Black Dashboard Pro - v1.1.1
|
||||
=========================================================
|
||||
|
||||
* Product Page: https://themes.getbootstrap.com/product/black-dashboard-pro-premium-bootstrap-4-admin/
|
||||
* Copyright 2019 Creative Tim (https://www.creative-tim.com)
|
||||
* Coded by Creative Tim
|
||||
|
||||
=========================================================
|
||||
|
||||
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||
|
||||
*/
|
||||
|
||||
var transparent = true;
|
||||
var transparentDemo = true;
|
||||
var fixedTop = false;
|
||||
|
||||
var navbar_initialized = false;
|
||||
var backgroundOrange = false;
|
||||
var sidebar_mini_active = false;
|
||||
var toggle_initialized = false;
|
||||
|
||||
var $html = $('html');
|
||||
var $body = $('body');
|
||||
var $navbar_minimize_fixed = $('.navbar-minimize-fixed');
|
||||
var $collapse = $('.collapse');
|
||||
var $navbar = $('.navbar');
|
||||
var $tagsinput = $('.tagsinput');
|
||||
var $selectpicker = $('.selectpicker');
|
||||
var $navbar_color = $('.navbar[color-on-scroll]');
|
||||
var $full_screen_map = $('.full-screen-map');
|
||||
var $datetimepicker = $('.datetimepicker');
|
||||
var $datepicker = $('.datepicker');
|
||||
var $timepicker = $('.timepicker');
|
||||
|
||||
var seq = 0,
|
||||
delays = 80,
|
||||
durations = 500;
|
||||
var seq2 = 0,
|
||||
delays2 = 80,
|
||||
durations2 = 500;
|
||||
|
||||
// Returns a function, that, as long as it continues to be invoked, will not
|
||||
// be triggered. The function will be called after it stops being called for
|
||||
// N milliseconds. If `immediate` is passed, trigger the function on the
|
||||
// leading edge, instead of the trailing.
|
||||
|
||||
function debounce(func, wait, immediate) {
|
||||
var timeout;
|
||||
return function() {
|
||||
var context = this,
|
||||
args = arguments;
|
||||
clearTimeout(timeout);
|
||||
timeout = setTimeout(function() {
|
||||
timeout = null;
|
||||
if (!immediate) func.apply(context, args);
|
||||
}, wait);
|
||||
if (immediate && !timeout) func.apply(context, args);
|
||||
};
|
||||
};
|
||||
|
||||
(function() {
|
||||
var isWindows = navigator.platform.indexOf('Win') > -1 ? true : false;
|
||||
|
||||
if (isWindows) {
|
||||
// if we are on windows OS we activate the perfectScrollbar function
|
||||
if ($('.main-panel').length != 0) {
|
||||
var ps = new PerfectScrollbar('.main-panel', {
|
||||
wheelSpeed: 2,
|
||||
wheelPropagation: true,
|
||||
minScrollbarLength: 20,
|
||||
suppressScrollX: true
|
||||
});
|
||||
}
|
||||
|
||||
if ($('.sidebar .sidebar-wrapper').length != 0) {
|
||||
|
||||
var ps1 = new PerfectScrollbar('.sidebar .sidebar-wrapper');
|
||||
$('.table-responsive').each(function() {
|
||||
var ps2 = new PerfectScrollbar($(this)[0]);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
$html.addClass('perfect-scrollbar-on');
|
||||
} else {
|
||||
$html.addClass('perfect-scrollbar-off');
|
||||
}
|
||||
})();
|
||||
|
||||
$(document).ready(function() {
|
||||
|
||||
var scroll_start = 0;
|
||||
var startchange = $('.row');
|
||||
var offset = startchange.offset();
|
||||
var scrollElement = navigator.platform.indexOf('Win') > -1 ? $(".ps") : $(window);
|
||||
scrollElement.scroll(function() {
|
||||
|
||||
scroll_start = $(this).scrollTop();
|
||||
|
||||
if (scroll_start > 50) {
|
||||
$navbar_minimize_fixed.css('opacity', '1');
|
||||
} else {
|
||||
$navbar_minimize_fixed.css('opacity', '0');
|
||||
}
|
||||
});
|
||||
|
||||
// hide the siblings opened collapse
|
||||
|
||||
$collapse.on('show.bs.collapse', function() {
|
||||
$(this).parent().siblings().children('.collapse').each(function() {
|
||||
$(this).collapse('hide');
|
||||
});
|
||||
});
|
||||
|
||||
// Activate the Tooltips
|
||||
$('[data-toggle="tooltip"], [rel="tooltip"]').tooltip();
|
||||
|
||||
// Activate Popovers and set color for popovers
|
||||
$('[data-toggle="popover"]').each(function() {
|
||||
color_class = $(this).data('color');
|
||||
$(this).popover({
|
||||
template: '<div class="popover popover-' + color_class + '" role="tooltip"><div class="arrow"></div><h3 class="popover-header"></h3><div class="popover-body"></div></div>'
|
||||
});
|
||||
});
|
||||
|
||||
var tagClass = $tagsinput.data('color');
|
||||
|
||||
if ($tagsinput.length != 0) {
|
||||
$tagsinput.tagsinput();
|
||||
}
|
||||
|
||||
$('.bootstrap-tagsinput').find('.tag').addClass('badge-' + tagClass);
|
||||
|
||||
// Activate bootstrap-select
|
||||
if ($selectpicker.length != 0) {
|
||||
$selectpicker.selectpicker({
|
||||
iconBase: "tim-icons",
|
||||
tickIcon: "icon-check-2"
|
||||
});
|
||||
}
|
||||
|
||||
//when you click the modal search button the navbar will not be collapsed
|
||||
$("#search-button").click(function() {
|
||||
$(this).closest('.navbar-collapse').removeClass('show');
|
||||
$navbar.addClass('navbar-transparent').removeClass('bg-white');
|
||||
$('#inlineFormInputGroup').focus();
|
||||
});
|
||||
|
||||
|
||||
|
||||
blackDashboard.initMinimizeSidebar();
|
||||
|
||||
var scroll_distance = $navbar_color.attr('color-on-scroll') || 500;
|
||||
|
||||
// Check if we have the class "navbar-color-on-scroll" then add the function to remove the class "navbar-transparent" so it will transform to a plain color.
|
||||
if ($navbar_color.length != 0) {
|
||||
blackDashboard.checkScrollForTransparentNavbar();
|
||||
$(window).on('scroll', blackDashboard.checkScrollForTransparentNavbar)
|
||||
}
|
||||
|
||||
if ($full_screen_map.length == 0 && $('.bd-docs').length == 0) {
|
||||
// On click navbar-collapse the menu will be white not transparent
|
||||
$('.navbar-toggler').click(function() {
|
||||
$collapse.on('show.bs.collapse', function() {
|
||||
$(this).closest('.navbar').removeClass('navbar-transparent').addClass('bg-white');
|
||||
}).on('hide.bs.collapse', function() {
|
||||
$(this).closest('.navbar').addClass('navbar-transparent').removeClass('bg-white');
|
||||
});
|
||||
$navbar.css('transition', '');
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
$navbar.css({
|
||||
'top': '0',
|
||||
'transition': 'all .5s linear'
|
||||
});
|
||||
|
||||
$('.form-control').on("focus", function() {
|
||||
$(this).parent('.input-group').addClass("input-group-focus");
|
||||
}).on("blur", function() {
|
||||
$(this).parent(".input-group").removeClass("input-group-focus");
|
||||
});
|
||||
|
||||
// Activate bootstrapSwitch
|
||||
$('.bootstrap-switch').each(function() {
|
||||
var data_on_label = $(this).data('on-label') || '';
|
||||
var data_off_label = $(this).data('off-label') || '';
|
||||
|
||||
$(this).bootstrapSwitch({
|
||||
onText: data_on_label,
|
||||
offText: data_off_label
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
$(document).on('click', '.navbar-toggle', function() {
|
||||
var $toggle = $(this);
|
||||
|
||||
if (blackDashboard.misc.navbar_menu_visible == 1) {
|
||||
$html.removeClass('nav-open');
|
||||
blackDashboard.misc.navbar_menu_visible = 0;
|
||||
setTimeout(function() {
|
||||
$toggle.removeClass('toggled');
|
||||
$('.bodyClick').remove();
|
||||
}, 550);
|
||||
|
||||
} else {
|
||||
setTimeout(function() {
|
||||
$toggle.addClass('toggled');
|
||||
}, 580);
|
||||
|
||||
var div = '<div class="bodyClick"></div>';
|
||||
$(div).appendTo('body').click(function() {
|
||||
$html.removeClass('nav-open');
|
||||
blackDashboard.misc.navbar_menu_visible = 0;
|
||||
setTimeout(function() {
|
||||
$toggle.removeClass('toggled');
|
||||
$('.bodyClick').remove();
|
||||
}, 550);
|
||||
});
|
||||
|
||||
$html.addClass('nav-open');
|
||||
blackDashboard.misc.navbar_menu_visible = 1;
|
||||
}
|
||||
});
|
||||
|
||||
$(window).resize(function() {
|
||||
// reset the seq for charts drawing animations
|
||||
seq = seq2 = 0;
|
||||
|
||||
if ($full_screen_map.length == 0 && $('.bd-docs').length == 0) {
|
||||
var isExpanded = $navbar.find('[data-toggle="collapse"]').attr("aria-expanded");
|
||||
if ($navbar.hasClass('bg-white') && $(window).width() > 991) {
|
||||
$navbar.removeClass('bg-white').addClass('navbar-transparent');
|
||||
} else if ($navbar.hasClass('navbar-transparent') && $(window).width() < 991 && isExpanded != "false") {
|
||||
$navbar.addClass('bg-white').removeClass('navbar-transparent');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var blackDashboard = {
|
||||
misc: {
|
||||
navbar_menu_visible: 0
|
||||
},
|
||||
|
||||
checkScrollForTransparentNavbar: debounce(function() {
|
||||
if ($(document).scrollTop() > scroll_distance) {
|
||||
if (transparent) {
|
||||
transparent = false;
|
||||
$navbar_color.removeClass('navbar-transparent');
|
||||
}
|
||||
} else {
|
||||
if (!transparent) {
|
||||
transparent = true;
|
||||
$navbar_color.addClass('navbar-transparent');
|
||||
}
|
||||
}
|
||||
}, 17),
|
||||
|
||||
|
||||
|
||||
// Activate DateTimePicker
|
||||
|
||||
initDateTimePicker: function() {
|
||||
if ($datetimepicker.length != 0) {
|
||||
$datetimepicker.datetimepicker({
|
||||
format: 'YYYY-MM-DD H:mm',
|
||||
icons: {
|
||||
time: "tim-icons icon-watch-time",
|
||||
date: "tim-icons icon-calendar-60",
|
||||
up: "fa fa-chevron-up",
|
||||
down: "fa fa-chevron-down",
|
||||
previous: 'tim-icons icon-minimal-left',
|
||||
next: 'tim-icons icon-minimal-right',
|
||||
today: 'fa fa-screenshot',
|
||||
clear: 'fa fa-trash',
|
||||
close: 'fa fa-remove'
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if ($datepicker.length != 0) {
|
||||
$datepicker.datetimepicker({
|
||||
format: 'YYYY-MM-DD',
|
||||
icons: {
|
||||
time: "tim-icons icon-watch-time",
|
||||
date: "tim-icons icon-calendar-60",
|
||||
up: "fa fa-chevron-up",
|
||||
down: "fa fa-chevron-down",
|
||||
previous: 'tim-icons icon-minimal-left',
|
||||
next: 'tim-icons icon-minimal-right',
|
||||
today: 'fa fa-screenshot',
|
||||
clear: 'fa fa-trash',
|
||||
close: 'fa fa-remove'
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if ($timepicker.length != 0) {
|
||||
$timepicker.datetimepicker({
|
||||
format: 'H:mm', // use this format if you want the 24hours timepicker
|
||||
// format: 'h:mm A', //use this format if you want the 12hours timpiecker with AM/PM toggle
|
||||
icons: {
|
||||
time: "tim-icons icon-watch-time",
|
||||
date: "tim-icons icon-calendar-60",
|
||||
up: "fa fa-chevron-up",
|
||||
down: "fa fa-chevron-down",
|
||||
previous: 'tim-icons icon-minimal-left',
|
||||
next: 'tim-icons icon-minimal-right',
|
||||
today: 'fa fa-screenshot',
|
||||
clear: 'fa fa-trash',
|
||||
close: 'fa fa-remove'
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
initMinimizeSidebar: function() {
|
||||
if ($('.sidebar-mini').length != 0) {
|
||||
sidebar_mini_active = true;
|
||||
}
|
||||
|
||||
$('.minimize-sidebar').click(function() {
|
||||
|
||||
if (sidebar_mini_active == true) {
|
||||
$body.removeClass('sidebar-mini');
|
||||
sidebar_mini_active = false;
|
||||
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||
} else {
|
||||
$body.addClass('sidebar-mini');
|
||||
sidebar_mini_active = true;
|
||||
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||
}
|
||||
|
||||
// we simulate the window Resize so the charts will get updated in realtime.
|
||||
var simulateWindowResize = setInterval(function() {
|
||||
window.dispatchEvent(new Event('resize'));
|
||||
}, 180);
|
||||
|
||||
// we stop the simulation of Window Resize after the animations are completed
|
||||
setTimeout(function() {
|
||||
clearInterval(simulateWindowResize);
|
||||
}, 1000);
|
||||
});
|
||||
},
|
||||
|
||||
startAnimationForLineChart: function(chart) {
|
||||
chart.on('draw', function(data) {
|
||||
if (data.type === 'line' || data.type === 'area') {
|
||||
data.element.animate({
|
||||
d: {
|
||||
begin: 600,
|
||||
dur: 700,
|
||||
from: data.path.clone().scale(1, 0).translate(0, data.chartRect.height()).stringify(),
|
||||
to: data.path.clone().stringify(),
|
||||
easing: Chartist.Svg.Easing.easeOutQuint
|
||||
}
|
||||
});
|
||||
} else if (data.type === 'point') {
|
||||
seq++;
|
||||
data.element.animate({
|
||||
opacity: {
|
||||
begin: seq * delays,
|
||||
dur: durations,
|
||||
from: 0,
|
||||
to: 1,
|
||||
easing: 'ease'
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
seq = 0;
|
||||
},
|
||||
startAnimationForBarChart: function(chart) {
|
||||
|
||||
chart.on('draw', function(data) {
|
||||
if (data.type === 'bar') {
|
||||
seq2++;
|
||||
data.element.animate({
|
||||
opacity: {
|
||||
begin: seq2 * delays2,
|
||||
dur: durations2,
|
||||
from: 0,
|
||||
to: 1,
|
||||
easing: 'ease'
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
seq2 = 0;
|
||||
},
|
||||
showSidebarMessage: function(message) {
|
||||
try {
|
||||
$.notify({
|
||||
icon: "tim-icons icon-bell-55",
|
||||
message: message
|
||||
}, {
|
||||
type: 'primary',
|
||||
timer: 4000,
|
||||
placement: {
|
||||
from: 'top',
|
||||
align: 'right'
|
||||
}
|
||||
});
|
||||
} catch (e) {
|
||||
console.log('Notify library is missing, please make sure you have the notifications library added.');
|
||||
}
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
function hexToRGB(hex, alpha) {
|
||||
var r = parseInt(hex.slice(1, 3), 16),
|
||||
g = parseInt(hex.slice(3, 5), 16),
|
||||
b = parseInt(hex.slice(5, 7), 16);
|
||||
|
||||
if (alpha) {
|
||||
return "rgba(" + r + ", " + g + ", " + b + ", " + alpha + ")";
|
||||
} else {
|
||||
return "rgb(" + r + ", " + g + ", " + b + ")";
|
||||
}
|
||||
}
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue