Penambahan FrontEnd All-New-Manufacture
This commit is contained in:
pand03
BIN
public/js/.DS_Store
vendored
Normal file
BIN
public/js/.DS_Store
vendored
Normal file
Binary file not shown.
352
public/js/chart.js
Executable file
352
public/js/chart.js
Executable file
@@ -0,0 +1,352 @@
|
||||
$(function() {
|
||||
/* ChartJS
|
||||
* -------
|
||||
* Data and config for chartjs
|
||||
*/
|
||||
'use strict';
|
||||
var data = {
|
||||
labels: ["2013", "2014", "2014", "2015", "2016", "2017"],
|
||||
datasets: [{
|
||||
label: '# of Votes',
|
||||
data: [10, 19, 3, 5, 2, 3],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(255, 206, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
borderWidth: 1,
|
||||
fill: false
|
||||
}]
|
||||
};
|
||||
var multiLineData = {
|
||||
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
|
||||
datasets: [{
|
||||
label: 'Dataset 1',
|
||||
data: [12, 19, 3, 5, 2, 3],
|
||||
borderColor: [
|
||||
'#587ce4'
|
||||
],
|
||||
borderWidth: 2,
|
||||
fill: false
|
||||
},
|
||||
{
|
||||
label: 'Dataset 2',
|
||||
data: [5, 23, 7, 12, 42, 23],
|
||||
borderColor: [
|
||||
'#ede190'
|
||||
],
|
||||
borderWidth: 2,
|
||||
fill: false
|
||||
},
|
||||
{
|
||||
label: 'Dataset 3',
|
||||
data: [15, 10, 21, 32, 12, 33],
|
||||
borderColor: [
|
||||
'#f44252'
|
||||
],
|
||||
borderWidth: 2,
|
||||
fill: false
|
||||
}
|
||||
]
|
||||
};
|
||||
var options = {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}]
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
elements: {
|
||||
point: {
|
||||
radius: 0
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
var doughnutPieData = {
|
||||
datasets: [{
|
||||
data: [30, 40, 30],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.5)',
|
||||
'rgba(54, 162, 235, 0.5)',
|
||||
'rgba(255, 206, 86, 0.5)',
|
||||
'rgba(75, 192, 192, 0.5)',
|
||||
'rgba(153, 102, 255, 0.5)',
|
||||
'rgba(255, 159, 64, 0.5)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
}],
|
||||
|
||||
// These labels appear in the legend and in the tooltips when hovering different arcs
|
||||
labels: [
|
||||
'Pink',
|
||||
'Blue',
|
||||
'Yellow',
|
||||
]
|
||||
};
|
||||
var doughnutPieOptions = {
|
||||
responsive: true,
|
||||
animation: {
|
||||
animateScale: true,
|
||||
animateRotate: true
|
||||
}
|
||||
};
|
||||
var areaData = {
|
||||
labels: ["2013", "2014", "2015", "2016", "2017"],
|
||||
datasets: [{
|
||||
label: '# of Votes',
|
||||
data: [12, 19, 3, 5, 2, 3],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(255, 206, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
borderWidth: 1,
|
||||
fill: true, // 3: no fill
|
||||
}]
|
||||
};
|
||||
|
||||
var areaOptions = {
|
||||
plugins: {
|
||||
filler: {
|
||||
propagate: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var multiAreaData = {
|
||||
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
|
||||
datasets: [{
|
||||
label: 'Facebook',
|
||||
data: [8, 11, 13, 15, 12, 13, 16, 15, 13, 19, 11, 14],
|
||||
borderColor: ['rgba(255, 99, 132, 0.5)'],
|
||||
backgroundColor: ['rgba(255, 99, 132, 0.5)'],
|
||||
borderWidth: 1,
|
||||
fill: true
|
||||
},
|
||||
{
|
||||
label: 'Twitter',
|
||||
data: [7, 17, 12, 16, 14, 18, 16, 12, 15, 11, 13, 9],
|
||||
borderColor: ['rgba(54, 162, 235, 0.5)'],
|
||||
backgroundColor: ['rgba(54, 162, 235, 0.5)'],
|
||||
borderWidth: 1,
|
||||
fill: true
|
||||
},
|
||||
{
|
||||
label: 'Linkedin',
|
||||
data: [6, 14, 16, 20, 12, 18, 15, 12, 17, 19, 15, 11],
|
||||
borderColor: ['rgba(255, 206, 86, 0.5)'],
|
||||
backgroundColor: ['rgba(255, 206, 86, 0.5)'],
|
||||
borderWidth: 1,
|
||||
fill: true
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
var multiAreaOptions = {
|
||||
plugins: {
|
||||
filler: {
|
||||
propagate: true
|
||||
}
|
||||
},
|
||||
elements: {
|
||||
point: {
|
||||
radius: 0
|
||||
}
|
||||
},
|
||||
scales: {
|
||||
xAxes: [{
|
||||
gridLines: {
|
||||
display: false
|
||||
}
|
||||
}],
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
display: false
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
|
||||
var scatterChartData = {
|
||||
datasets: [{
|
||||
label: 'First Dataset',
|
||||
data: [{
|
||||
x: -10,
|
||||
y: 0
|
||||
},
|
||||
{
|
||||
x: 0,
|
||||
y: 3
|
||||
},
|
||||
{
|
||||
x: -25,
|
||||
y: 5
|
||||
},
|
||||
{
|
||||
x: 40,
|
||||
y: 5
|
||||
}
|
||||
],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)'
|
||||
],
|
||||
borderWidth: 1
|
||||
},
|
||||
{
|
||||
label: 'Second Dataset',
|
||||
data: [{
|
||||
x: 10,
|
||||
y: 5
|
||||
},
|
||||
{
|
||||
x: 20,
|
||||
y: -30
|
||||
},
|
||||
{
|
||||
x: -25,
|
||||
y: 15
|
||||
},
|
||||
{
|
||||
x: -10,
|
||||
y: 5
|
||||
}
|
||||
],
|
||||
backgroundColor: [
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(54, 162, 235, 1)',
|
||||
],
|
||||
borderWidth: 1
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
var scatterChartOptions = {
|
||||
scales: {
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
position: 'bottom'
|
||||
}]
|
||||
}
|
||||
}
|
||||
// Get context with jQuery - using jQuery's .get() method.
|
||||
if ($("#barChart").length) {
|
||||
var barChartCanvas = $("#barChart").get(0).getContext("2d");
|
||||
// This will get the first returned node in the jQuery collection.
|
||||
var barChart = new Chart(barChartCanvas, {
|
||||
type: 'bar',
|
||||
data: data,
|
||||
options: options
|
||||
});
|
||||
}
|
||||
|
||||
if ($("#lineChart").length) {
|
||||
var lineChartCanvas = $("#lineChart").get(0).getContext("2d");
|
||||
var lineChart = new Chart(lineChartCanvas, {
|
||||
type: 'line',
|
||||
data: data,
|
||||
options: options
|
||||
});
|
||||
}
|
||||
|
||||
if ($("#linechart-multi").length) {
|
||||
var multiLineCanvas = $("#linechart-multi").get(0).getContext("2d");
|
||||
var lineChart = new Chart(multiLineCanvas, {
|
||||
type: 'line',
|
||||
data: multiLineData,
|
||||
options: options
|
||||
});
|
||||
}
|
||||
|
||||
if ($("#areachart-multi").length) {
|
||||
var multiAreaCanvas = $("#areachart-multi").get(0).getContext("2d");
|
||||
var multiAreaChart = new Chart(multiAreaCanvas, {
|
||||
type: 'line',
|
||||
data: multiAreaData,
|
||||
options: multiAreaOptions
|
||||
});
|
||||
}
|
||||
|
||||
if ($("#doughnutChart").length) {
|
||||
var doughnutChartCanvas = $("#doughnutChart").get(0).getContext("2d");
|
||||
var doughnutChart = new Chart(doughnutChartCanvas, {
|
||||
type: 'doughnut',
|
||||
data: doughnutPieData,
|
||||
options: doughnutPieOptions
|
||||
});
|
||||
}
|
||||
|
||||
if ($("#pieChart").length) {
|
||||
var pieChartCanvas = $("#pieChart").get(0).getContext("2d");
|
||||
var pieChart = new Chart(pieChartCanvas, {
|
||||
type: 'pie',
|
||||
data: doughnutPieData,
|
||||
options: doughnutPieOptions
|
||||
});
|
||||
}
|
||||
|
||||
if ($("#areaChart").length) {
|
||||
var areaChartCanvas = $("#areaChart").get(0).getContext("2d");
|
||||
var areaChart = new Chart(areaChartCanvas, {
|
||||
type: 'line',
|
||||
data: areaData,
|
||||
options: areaOptions
|
||||
});
|
||||
}
|
||||
|
||||
if ($("#scatterChart").length) {
|
||||
var scatterChartCanvas = $("#scatterChart").get(0).getContext("2d");
|
||||
var scatterChart = new Chart(scatterChartCanvas, {
|
||||
type: 'scatter',
|
||||
data: scatterChartData,
|
||||
options: scatterChartOptions
|
||||
});
|
||||
}
|
||||
|
||||
if ($("#browserTrafficChart").length) {
|
||||
var doughnutChartCanvas = $("#browserTrafficChart").get(0).getContext("2d");
|
||||
var doughnutChart = new Chart(doughnutChartCanvas, {
|
||||
type: 'doughnut',
|
||||
data: browserTrafficData,
|
||||
options: doughnutPieOptions
|
||||
});
|
||||
}
|
||||
});
|
||||
492
public/js/custom.js
Normal file
492
public/js/custom.js
Normal file
@@ -0,0 +1,492 @@
|
||||
var Jobick = function(){
|
||||
"use strict"
|
||||
/* Search Bar ============ */
|
||||
var screenWidth = $( window ).width();
|
||||
var screenHeight = $( window ).height();
|
||||
|
||||
|
||||
var handleSelectPicker = function(){
|
||||
if(jQuery('.default-select,.dataTables_wrapper select').length > 0 ){
|
||||
jQuery('.default-select,.dataTables_wrapper select').selectpicker();
|
||||
}
|
||||
}
|
||||
|
||||
var handlePreloader = function(){
|
||||
setTimeout(function() {
|
||||
jQuery('#preloader').remove();
|
||||
$('#main-wrapper').addClass('show');
|
||||
},800);
|
||||
|
||||
}
|
||||
|
||||
var handleMetisMenu = function() {
|
||||
if(jQuery('#menu').length > 0 ){
|
||||
$("#menu").metisMenu();
|
||||
}
|
||||
jQuery('.metismenu > .mm-active ').each(function(){
|
||||
if(!jQuery(this).children('ul').length > 0)
|
||||
{
|
||||
jQuery(this).addClass('active-no-child');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var handleAllChecked = function() {
|
||||
$("#checkAll, #checkAll4, #checkAll1, #checkAll2, #checkAll5").on('change',function() {
|
||||
$("td input, .email-list .custom-checkbox input").prop('checked', $(this).prop("checked"));
|
||||
});
|
||||
$(".checkAllInput").on('click',function() {
|
||||
jQuery(this).closest('.ItemsCheckboxSec').find('input[type="checkbox"]').prop('checked', true);
|
||||
});
|
||||
$(".unCheckAllInput").on('click',function() {
|
||||
jQuery(this).closest('.ItemsCheckboxSec').find('input[type="checkbox"]').prop('checked', false);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
var handleNavigation = function() {
|
||||
$(".nav-control").on('click', function() {
|
||||
|
||||
$('#main-wrapper').toggleClass("menu-toggle");
|
||||
|
||||
$(".hamburger").toggleClass("is-active");
|
||||
});
|
||||
}
|
||||
|
||||
var handleCurrentActive = function() {
|
||||
for (var nk = window.location,
|
||||
o = $("ul#menu a").filter(function() {
|
||||
|
||||
return this.href == nk;
|
||||
|
||||
})
|
||||
.addClass("mm-active")
|
||||
.parent()
|
||||
.addClass("mm-active");;)
|
||||
{
|
||||
|
||||
if (!o.is("li")) break;
|
||||
|
||||
o = o.parent()
|
||||
.addClass("mm-show")
|
||||
.parent()
|
||||
.addClass("mm-active");
|
||||
}
|
||||
}
|
||||
|
||||
var handleMiniSidebar = function() {
|
||||
$("ul#menu>li").on('click', function() {
|
||||
const sidebarStyle = $('body').attr('data-sidebar-style');
|
||||
if (sidebarStyle === 'mini') {
|
||||
console.log($(this).find('ul'))
|
||||
$(this).find('ul').stop()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
var handleMinHeight = function() {
|
||||
var win_h = window.outerHeight;
|
||||
var win_h = window.outerHeight;
|
||||
if (win_h > 0 ? win_h : screen.height) {
|
||||
$(".content-body").css("min-height", (window.innerHeight - 55) + "px");
|
||||
};
|
||||
}
|
||||
|
||||
var handleDataAction = function() {
|
||||
$('a[data-action="collapse"]').on("click", function(i) {
|
||||
i.preventDefault(),
|
||||
$(this).closest(".card").find('[data-action="collapse"] i').toggleClass("mdi-arrow-down mdi-arrow-up"),
|
||||
$(this).closest(".card").children(".card-body").collapse("toggle");
|
||||
});
|
||||
|
||||
$('a[data-action="expand"]').on("click", function(i) {
|
||||
i.preventDefault(),
|
||||
$(this).closest(".card").find('[data-action="expand"] i').toggleClass("icon-size-actual icon-size-fullscreen"),
|
||||
$(this).closest(".card").toggleClass("card-fullscreen");
|
||||
});
|
||||
|
||||
|
||||
|
||||
$('[data-action="close"]').on("click", function() {
|
||||
$(this).closest(".card").removeClass().slideUp("fast");
|
||||
});
|
||||
|
||||
$('[data-action="reload"]').on("click", function() {
|
||||
var e = $(this);
|
||||
e.parents(".card").addClass("card-load"),
|
||||
e.parents(".card").append('<div class="card-loader"><i class=" ti-reload rotate-refresh"></div>'),
|
||||
setTimeout(function() {
|
||||
e.parents(".card").children(".card-loader").remove(),
|
||||
e.parents(".card").removeClass("card-load")
|
||||
}, 2000)
|
||||
});
|
||||
}
|
||||
|
||||
var handleHeaderHight = function() {
|
||||
const headerHight = $('.header').innerHeight();
|
||||
$(window).scroll(function() {
|
||||
if ($('body').attr('data-layout') === "horizontal" && $('body').attr('data-header-position') === "static" && $('body').attr('data-sidebar-position') === "fixed")
|
||||
$(this.window).scrollTop() >= headerHight ? $('.dlabnav').addClass('fixed') : $('.dlabnav').removeClass('fixed')
|
||||
});
|
||||
}
|
||||
|
||||
var handleMenuTabs = function() {
|
||||
if(screenWidth <= 991 ){
|
||||
jQuery('.menu-tabs .nav-link').on('click',function(){
|
||||
if(jQuery(this).hasClass('open'))
|
||||
{
|
||||
jQuery(this).removeClass('open');
|
||||
jQuery('.fixed-content-box').removeClass('active');
|
||||
jQuery('.hamburger').show();
|
||||
}else{
|
||||
jQuery('.menu-tabs .nav-link').removeClass('open');
|
||||
jQuery(this).addClass('open');
|
||||
jQuery('.fixed-content-box').addClass('active');
|
||||
jQuery('.hamburger').hide();
|
||||
}
|
||||
//jQuery('.fixed-content-box').toggleClass('active');
|
||||
});
|
||||
jQuery('.close-fixed-content').on('click',function(){
|
||||
jQuery('.fixed-content-box').removeClass('active');
|
||||
jQuery('.hamburger').removeClass('is-active');
|
||||
jQuery('#main-wrapper').removeClass('menu-toggle');
|
||||
jQuery('.hamburger').show();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handleChatbox = function() {
|
||||
jQuery('.bell-link').on('click',function(){
|
||||
jQuery('.chatbox').addClass('active');
|
||||
});
|
||||
jQuery('.chatbox-close').on('click',function(){
|
||||
jQuery('.chatbox').removeClass('active');
|
||||
});
|
||||
}
|
||||
|
||||
var handlePerfectScrollbar = function() {
|
||||
if(jQuery('.dlabnav-scroll').length > 0)
|
||||
{
|
||||
//const qs = new PerfectScrollbar('.dlabnav-scroll');
|
||||
const qs = new PerfectScrollbar('.dlabnav-scroll');
|
||||
|
||||
qs.isRtl = false;
|
||||
}
|
||||
}
|
||||
|
||||
var handleBtnNumber = function() {
|
||||
$('.btn-number').on('click', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
fieldName = $(this).attr('data-field');
|
||||
type = $(this).attr('data-type');
|
||||
var input = $("input[name='" + fieldName + "']");
|
||||
var currentVal = parseInt(input.val());
|
||||
if (!isNaN(currentVal)) {
|
||||
if (type == 'minus')
|
||||
input.val(currentVal - 1);
|
||||
else if (type == 'plus')
|
||||
input.val(currentVal + 1);
|
||||
} else {
|
||||
input.val(0);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var handleDzChatUser = function() {
|
||||
jQuery('.dlab-chat-user-box .dlab-chat-user').on('click',function(){
|
||||
jQuery('.dlab-chat-user-box').addClass('d-none');
|
||||
jQuery('.dlab-chat-history-box').removeClass('d-none');
|
||||
//$(".chatbox .msg_card_body").height(vHeightArea());
|
||||
//$(".chatbox .msg_card_body").css('height',vHeightArea());
|
||||
});
|
||||
|
||||
jQuery('.dlab-chat-history-back').on('click',function(){
|
||||
jQuery('.dlab-chat-user-box').removeClass('d-none');
|
||||
jQuery('.dlab-chat-history-box').addClass('d-none');
|
||||
});
|
||||
|
||||
jQuery('.dlab-fullscreen').on('click',function(){
|
||||
jQuery('.dlab-fullscreen').toggleClass('active');
|
||||
});
|
||||
|
||||
/* var vHeight = function(){ */
|
||||
|
||||
/* } */
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
var handleDzFullScreen = function() {
|
||||
jQuery('.dlab-fullscreen').on('click',function(e){
|
||||
if(document.fullscreenElement||document.webkitFullscreenElement||document.mozFullScreenElement||document.msFullscreenElement) {
|
||||
/* Enter fullscreen */
|
||||
if(document.exitFullscreen) {
|
||||
document.exitFullscreen();
|
||||
} else if(document.msExitFullscreen) {
|
||||
document.msExitFullscreen(); /* IE/Edge */
|
||||
} else if(document.mozCancelFullScreen) {
|
||||
document.mozCancelFullScreen(); /* Firefox */
|
||||
} else if(document.webkitExitFullscreen) {
|
||||
document.webkitExitFullscreen(); /* Chrome, Safari & Opera */
|
||||
}
|
||||
}
|
||||
else { /* exit fullscreen */
|
||||
if(document.documentElement.requestFullscreen) {
|
||||
document.documentElement.requestFullscreen();
|
||||
} else if(document.documentElement.webkitRequestFullscreen) {
|
||||
document.documentElement.webkitRequestFullscreen();
|
||||
} else if(document.documentElement.mozRequestFullScreen) {
|
||||
document.documentElement.mozRequestFullScreen();
|
||||
} else if(document.documentElement.msRequestFullscreen) {
|
||||
document.documentElement.msRequestFullscreen();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var handleshowPass = function(){
|
||||
jQuery('.show-pass').on('click',function(){
|
||||
jQuery(this).toggleClass('active');
|
||||
if(jQuery('#dlab-password').attr('type') == 'password'){
|
||||
jQuery('#dlab-password').attr('type','text');
|
||||
}else if(jQuery('#dlab-password').attr('type') == 'text'){
|
||||
jQuery('#dlab-password').attr('type','password');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var heartBlast = function (){
|
||||
$(".heart").on("click", function() {
|
||||
$(this).toggleClass("heart-blast");
|
||||
});
|
||||
}
|
||||
|
||||
var handleDzLoadMore = function() {
|
||||
$(".dlab-load-more").on('click', function(e)
|
||||
{
|
||||
e.preventDefault(); //STOP default action
|
||||
$(this).append(' <i class="fas fa-sync"></i>');
|
||||
|
||||
var dlabLoadMoreUrl = $(this).attr('rel');
|
||||
var dlabLoadMoreId = $(this).attr('id');
|
||||
|
||||
$.ajax({
|
||||
method: "POST",
|
||||
url: dlabLoadMoreUrl,
|
||||
dataType: 'html',
|
||||
success: function(data) {
|
||||
$( "#"+dlabLoadMoreId+"Content").append(data);
|
||||
$('.dlab-load-more i').remove();
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
var handleLightgallery = function(){
|
||||
if(jQuery('#lightgallery').length > 0){
|
||||
$('#lightgallery').lightGallery({
|
||||
loop:true,
|
||||
thumbnail:true,
|
||||
exThumbImage: 'data-exthumbimage'
|
||||
});
|
||||
}
|
||||
}
|
||||
var handleCustomFileInput = function() {
|
||||
$(".custom-file-input").on("change", function() {
|
||||
var fileName = $(this).val().split("\\").pop();
|
||||
$(this).siblings(".custom-file-label").addClass("selected").html(fileName);
|
||||
});
|
||||
}
|
||||
|
||||
var vHeight = function(){
|
||||
var ch = $(window).height() - 206;
|
||||
$(".chatbox .msg_card_body").css('height',ch);
|
||||
}
|
||||
|
||||
var domoPanel = function(){
|
||||
if(jQuery(".dlab-demo-content").length>0) {
|
||||
$('.dlab-demo-trigger').on('click', function() {
|
||||
$('.dlab-demo-panel').addClass('show');
|
||||
});
|
||||
$('.dlab-demo-close, .bg-close').on('click', function() {
|
||||
$('.dlab-demo-panel').removeClass('show');
|
||||
});
|
||||
|
||||
$('.dlab-demo-bx').on('click', function() {
|
||||
$('.dlab-demo-bx').removeClass('demo-active');
|
||||
$(this).addClass('demo-active');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handleDatetimepicker = function(){
|
||||
// if(jQuery(".datepicker").length>0) {
|
||||
// $('.datepicker').datetimepicker();
|
||||
// }
|
||||
if(jQuery('.bt-datepicker').length > 0){
|
||||
$(".bt-datepicker").datepicker({
|
||||
autoclose: true,
|
||||
todayHighlight: true
|
||||
}).datepicker('update', new Date());
|
||||
}
|
||||
}
|
||||
|
||||
var handleCkEditor = function(){
|
||||
if(jQuery("#ckeditor").length>0) {
|
||||
ClassicEditor
|
||||
.create( document.querySelector( '#ckeditor' ), {
|
||||
// toolbar: [ 'heading', '|', 'bold', 'italic', 'link' ]
|
||||
} )
|
||||
.then( editor => {
|
||||
window.editor = editor;
|
||||
} )
|
||||
.catch( err => {
|
||||
console.error( err.stack );
|
||||
} );
|
||||
}
|
||||
}
|
||||
|
||||
var handleMenuPosition = function(){
|
||||
|
||||
if(screenWidth > 1024){
|
||||
$(".metismenu li").unbind().each(function (e) {
|
||||
if ($('ul', this).length > 0) {
|
||||
var elm = $('ul:first', this).css('display','block');
|
||||
var off = elm.offset();
|
||||
var l = off.left;
|
||||
var w = elm.width();
|
||||
var elm = $('ul:first', this).removeAttr('style');
|
||||
var docH = $("body").height();
|
||||
var docW = $("body").width();
|
||||
|
||||
if(jQuery('html').hasClass('rtl')){
|
||||
var isEntirelyVisible = (l + w <= docW);
|
||||
}else{
|
||||
var isEntirelyVisible = (l > 0)?true:false;
|
||||
}
|
||||
|
||||
if (!isEntirelyVisible) {
|
||||
$(this).find('ul:first').addClass('left');
|
||||
} else {
|
||||
$(this).find('ul:first').removeClass('left');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
var handleThemeMode = function() {
|
||||
|
||||
|
||||
if(jQuery(".dlab-theme-mode").length>0) {
|
||||
jQuery('.dlab-theme-mode').on('click',function(){
|
||||
jQuery(this).toggleClass('active');
|
||||
if(jQuery(this).hasClass('active')){
|
||||
jQuery('body').attr('data-theme-version','dark');
|
||||
setCookie('version', 'dark');
|
||||
jQuery('#theme_version').val('dark');
|
||||
|
||||
}else{
|
||||
jQuery('body').attr('data-theme-version','light');
|
||||
setCookie('version', 'light');
|
||||
jQuery('#theme_version').val('light');
|
||||
|
||||
}
|
||||
$('.default-select').selectpicker('refresh');
|
||||
});
|
||||
var version = getCookie('version');
|
||||
|
||||
jQuery('body').attr('data-theme-version', version);
|
||||
jQuery('.dlab-theme-mode').removeClass('active');
|
||||
setTimeout(function(){
|
||||
if(jQuery('body').attr('data-theme-version') === "dark")
|
||||
{
|
||||
jQuery('.dlab-theme-mode').addClass('active');
|
||||
}
|
||||
},1500)
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
handleMetisMenu();
|
||||
handleAllChecked();
|
||||
handleNavigation();
|
||||
handleCurrentActive();
|
||||
handleMiniSidebar();
|
||||
handleMinHeight();
|
||||
handleDataAction();
|
||||
handleHeaderHight();
|
||||
handleMenuTabs();
|
||||
handleChatbox();
|
||||
handleBtnNumber();
|
||||
handleDzChatUser();
|
||||
handleDzFullScreen();
|
||||
handleshowPass();
|
||||
heartBlast();
|
||||
handleDzLoadMore();
|
||||
handleLightgallery();
|
||||
handleCustomFileInput();
|
||||
vHeight();
|
||||
domoPanel();
|
||||
handleThemeMode();
|
||||
handleDatetimepicker();
|
||||
handleCkEditor();
|
||||
},
|
||||
|
||||
load:function(){
|
||||
handlePreloader();
|
||||
handleSelectPicker();
|
||||
},
|
||||
|
||||
resize:function(){
|
||||
vHeight();
|
||||
handleMinHeight();
|
||||
},
|
||||
|
||||
handleMenuPosition:function(){
|
||||
handleMenuPosition();
|
||||
},
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
/* Document.ready Start */
|
||||
jQuery(document).ready(function() {
|
||||
$('[data-bs-toggle="popover"]').popover();
|
||||
'use strict';
|
||||
Jobick.init();
|
||||
|
||||
$('a[data-bs-toggle="tab"]').click(function(){
|
||||
// todo remove snippet on bootstrap v5
|
||||
$('a[data-bs-toggle="tab"]').click(function() {
|
||||
$($(this).attr('href')).show().addClass('show active').siblings().hide();
|
||||
})
|
||||
});
|
||||
|
||||
});
|
||||
/* Document.ready END */
|
||||
|
||||
/* Window Load START */
|
||||
jQuery(window).on('load',function () {
|
||||
'use strict';
|
||||
Jobick.load();
|
||||
setTimeout(function(){
|
||||
Jobick.handleMenuPosition();
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
/* Window Load END */
|
||||
/* Window Resize START */
|
||||
jQuery(window).on('resize',function () {
|
||||
'use strict';
|
||||
Jobick.resize();
|
||||
setTimeout(function(){
|
||||
Jobick.handleMenuPosition();
|
||||
}, 1000);
|
||||
});
|
||||
/* Window Resize END */
|
||||
1
public/js/custom.min.js
vendored
Normal file
1
public/js/custom.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1172
public/js/dashboard.js
Executable file
1172
public/js/dashboard.js
Executable file
File diff suppressed because it is too large
Load Diff
75
public/js/dashboard/cards-center.js
Normal file
75
public/js/dashboard/cards-center.js
Normal file
@@ -0,0 +1,75 @@
|
||||
|
||||
|
||||
(function($) {
|
||||
/* "use strict" */
|
||||
|
||||
var dlabChartlist = function(){
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
var polarChart = function(){
|
||||
var ctx = document.getElementById("polarChart").getContext('2d');
|
||||
Chart.defaults.global.legend.display = false;
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'polarArea',
|
||||
data: {
|
||||
labels: ["Mon", "Tue", "Wed", "Thu"],
|
||||
datasets: [{
|
||||
backgroundColor: [
|
||||
"#496ecc",
|
||||
"#68e365",
|
||||
"#ffa755",
|
||||
"#c8c8c8"
|
||||
],
|
||||
data: [40, 35, 30, 20]
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
weight: 1,
|
||||
cutoutPercentage: 70,
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
scale: {
|
||||
scaleShowLine:false,
|
||||
display:false,
|
||||
pointLabels:{
|
||||
fontSize: 0
|
||||
},
|
||||
},
|
||||
tooltips:{
|
||||
enabled:false,
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
},
|
||||
|
||||
|
||||
load:function(){
|
||||
|
||||
polarChart();
|
||||
|
||||
},
|
||||
|
||||
resize:function(){
|
||||
}
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
setTimeout(function(){
|
||||
dlabChartlist.load();
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
})(jQuery);
|
||||
70
public/js/dashboard/cms.js
Normal file
70
public/js/dashboard/cms.js
Normal file
@@ -0,0 +1,70 @@
|
||||
var jobbickCms = function(){
|
||||
var slider = function(){
|
||||
jQuery('.SlideToolHeader').on('click', function () {
|
||||
var el = jQuery(this).find('.handle').hasClass('expand');
|
||||
if(el)
|
||||
{
|
||||
|
||||
jQuery(this).find('.handle').removeClass('expand').addClass('collapse');
|
||||
jQuery(this).closest('.cm-content-box').find('.cm-content-body').slideUp(300);
|
||||
jQuery(this).closest('.content-title').addClass('collapse');
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
jQuery(this).find('.handle').removeClass('collapse').addClass('expand');
|
||||
jQuery(this).closest('.cm-content-box').find('.cm-content-body').slideDown(300);
|
||||
jQuery(this).closest('.content-title').removeClass('collapse');
|
||||
}
|
||||
});
|
||||
|
||||
$(document).ready(function(){
|
||||
$('.open').on('click',function(){
|
||||
$('.main-check').slideToggle('slow');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
slider();
|
||||
|
||||
},
|
||||
load:function(){
|
||||
|
||||
},
|
||||
resize:function(){
|
||||
//vHeight();
|
||||
},
|
||||
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
/* Document.ready Start */
|
||||
jQuery(document).ready(function() {
|
||||
$('[data-bs-toggle="popover"]').popover();
|
||||
'use strict';
|
||||
jobbickCms.init();
|
||||
|
||||
});
|
||||
/* Document.ready END */
|
||||
|
||||
/* Window Load START */
|
||||
jQuery(window).on('load',function () {
|
||||
'use strict';
|
||||
jobbickCms.load();
|
||||
|
||||
|
||||
});
|
||||
/* Window Load END */
|
||||
/* Window Resize START */
|
||||
jQuery(window).on('resize',function () {
|
||||
'use strict';
|
||||
jobbickCms.resize();
|
||||
|
||||
});
|
||||
/* Window Resize END */
|
||||
1008
public/js/dashboard/dashboard-1.js
Normal file
1008
public/js/dashboard/dashboard-1.js
Normal file
File diff suppressed because it is too large
Load Diff
73
public/js/dashboard/my-profile.js
Normal file
73
public/js/dashboard/my-profile.js
Normal file
@@ -0,0 +1,73 @@
|
||||
|
||||
|
||||
(function($) {
|
||||
/* "use strict" */
|
||||
|
||||
var dlabChartlist = function(){
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
|
||||
var pieChart2 = function(){
|
||||
var options = {
|
||||
series: [90, 68, 85],
|
||||
chart: {
|
||||
type: 'donut',
|
||||
height:230
|
||||
},
|
||||
dataLabels:{
|
||||
enabled: false
|
||||
},
|
||||
stroke: {
|
||||
width: 0,
|
||||
},
|
||||
colors:['#1D92DF', '#4754CB', '#D55BC1'],
|
||||
legend: {
|
||||
position: 'bottom',
|
||||
show:false
|
||||
},
|
||||
responsive: [{
|
||||
breakpoint: 768,
|
||||
options: {
|
||||
chart: {
|
||||
height:200
|
||||
},
|
||||
}
|
||||
}]
|
||||
};
|
||||
|
||||
var chart = new ApexCharts(document.querySelector("#pieChart2"), options);
|
||||
chart.render();
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
},
|
||||
|
||||
|
||||
load:function(){
|
||||
pieChart2();
|
||||
|
||||
},
|
||||
|
||||
resize:function(){
|
||||
}
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
setTimeout(function(){
|
||||
dlabChartlist.load();
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
})(jQuery);
|
||||
526
public/js/dashboard/statistics-page.js
Normal file
526
public/js/dashboard/statistics-page.js
Normal file
@@ -0,0 +1,526 @@
|
||||
|
||||
|
||||
(function($) {
|
||||
/* "use strict" */
|
||||
|
||||
var dlabChartlist = function(){
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
|
||||
var pieChart3 = function(){
|
||||
var options = {
|
||||
series: [90, 68, 85],
|
||||
chart: {
|
||||
type: 'donut',
|
||||
height:230
|
||||
},
|
||||
dataLabels:{
|
||||
enabled: false
|
||||
},
|
||||
stroke: {
|
||||
width: 0,
|
||||
},
|
||||
colors:['#F6AD2E', 'var(--primary)', '#412EFF'],
|
||||
legend: {
|
||||
position: 'bottom',
|
||||
show:false
|
||||
},
|
||||
responsive: [{
|
||||
breakpoint: 768,
|
||||
options: {
|
||||
chart: {
|
||||
height:200
|
||||
},
|
||||
}
|
||||
}]
|
||||
};
|
||||
|
||||
var chart = new ApexCharts(document.querySelector("#pieChart3"), options);
|
||||
chart.render();
|
||||
|
||||
}
|
||||
var chartBar = function(){
|
||||
|
||||
var options = {
|
||||
series: [
|
||||
{
|
||||
name: 'Net Profit',
|
||||
data: [15, 55, 90, 80, 25, 15, 70],
|
||||
//radius: 12,
|
||||
},
|
||||
{
|
||||
name: 'Revenue',
|
||||
data: [60, 65, 15, 35, 30, 5, 40]
|
||||
},
|
||||
|
||||
],
|
||||
chart: {
|
||||
type: 'bar',
|
||||
height: 230,
|
||||
|
||||
toolbar: {
|
||||
show: false,
|
||||
},
|
||||
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
horizontal: false,
|
||||
columnWidth: '25%',
|
||||
endingShape: 'rounded'
|
||||
},
|
||||
},
|
||||
colors:['#01111C', 'var(--primary)'],
|
||||
dataLabels: {
|
||||
enabled: false,
|
||||
},
|
||||
markers: {
|
||||
shape: "circle",
|
||||
},
|
||||
|
||||
grid : {
|
||||
show:true,
|
||||
strokeDashArray: 6,
|
||||
},
|
||||
legend: {
|
||||
show: false,
|
||||
fontSize: '12px',
|
||||
labels: {
|
||||
colors: '#000000',
|
||||
|
||||
},
|
||||
markers: {
|
||||
width: 18,
|
||||
height: 18,
|
||||
strokeWidth: 0,
|
||||
strokeColor: '#fff',
|
||||
fillColors: undefined,
|
||||
radius: 12,
|
||||
}
|
||||
},
|
||||
stroke: {
|
||||
show: true,
|
||||
width: 1,
|
||||
colors: ['transparent']
|
||||
},
|
||||
|
||||
xaxis:{
|
||||
|
||||
categories: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
|
||||
grid: {
|
||||
color: "rgba(233,236,255,0.5)",
|
||||
drawBorder: true
|
||||
},
|
||||
labels: {
|
||||
style: {
|
||||
colors: '#787878',
|
||||
fontSize: '13px',
|
||||
fontFamily: 'poppins',
|
||||
fontWeight: 100,
|
||||
cssClass: 'apexcharts-xaxis-label',
|
||||
},
|
||||
},
|
||||
crosshairs: {
|
||||
show: false,
|
||||
},
|
||||
axisTicks : {
|
||||
show : false
|
||||
},
|
||||
axisBorder : {
|
||||
show : false
|
||||
},
|
||||
},
|
||||
yaxis:{
|
||||
labels: {
|
||||
style: {
|
||||
colors: '#787878',
|
||||
fontSize: '13px',
|
||||
fontFamily: 'poppins',
|
||||
fontWeight: 100,
|
||||
cssClass: 'apexcharts-xaxis-label',
|
||||
},
|
||||
},
|
||||
},
|
||||
fill: {
|
||||
opacity: 1
|
||||
},
|
||||
tooltip: {
|
||||
y: {
|
||||
formatter: function (val) {
|
||||
return "$ " + val + " thousands"
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
var chartBar1 = new ApexCharts(document.querySelector("#chartBar"), options);
|
||||
chartBar1.render();
|
||||
}
|
||||
var activityChart = function(){
|
||||
var options = {
|
||||
series: [{
|
||||
name: 'Application Sent',
|
||||
data: [40, 60, 50, 65, 40, 65, 45 ,56 , 45, 60]
|
||||
}, {
|
||||
name: 'Interviews',
|
||||
data: [30, 27, 38, 35, 30, 35, 20 ,35 , 30, 40]
|
||||
}, {
|
||||
name: 'Rejected',
|
||||
data: [20, 25, 28, 20, 25, 28, 35 ,25 , 20, 30]
|
||||
}],
|
||||
chart: {
|
||||
height: 300,
|
||||
type: 'area',
|
||||
toolbar:{
|
||||
show:false
|
||||
},
|
||||
},
|
||||
colors:["#35c556","#3f4cfe","#f34040"],
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
stroke: {
|
||||
curve: 'smooth',
|
||||
width:5,
|
||||
},
|
||||
legend:{
|
||||
show:false
|
||||
},
|
||||
grid:{
|
||||
show:true,
|
||||
strokeDashArray: 6,
|
||||
borderColor: 'var(--border)',
|
||||
},
|
||||
yaxis: {
|
||||
labels: {
|
||||
style: {
|
||||
colors: 'var(--text)',
|
||||
fontSize: '13px',
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: 400
|
||||
|
||||
},
|
||||
formatter: function (value) {
|
||||
return value;
|
||||
}
|
||||
},
|
||||
},
|
||||
xaxis: {
|
||||
categories: ["Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],
|
||||
labels:{
|
||||
style: {
|
||||
colors: 'var(--text)',
|
||||
fontSize: '13px',
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: 400
|
||||
|
||||
},
|
||||
},
|
||||
axisTicks : {
|
||||
show : false
|
||||
},
|
||||
axisBorder : {
|
||||
show : false
|
||||
},
|
||||
},
|
||||
fill:{
|
||||
type:'gradient',
|
||||
gradient: {
|
||||
colorStops:[
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: '#35c556',
|
||||
opacity: .2
|
||||
},
|
||||
{
|
||||
offset: 50,
|
||||
color: '#35c556',
|
||||
opacity: 0
|
||||
},
|
||||
{
|
||||
offset: 100,
|
||||
color: '#35c556',
|
||||
opacity: 0
|
||||
}
|
||||
],
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: '#3f4cfe',
|
||||
opacity: .2
|
||||
},
|
||||
{
|
||||
offset: 50,
|
||||
color: '#3f4cfe',
|
||||
opacity: 0
|
||||
},
|
||||
{
|
||||
offset: 100,
|
||||
color: '#3f4cfe',
|
||||
opacity: 0
|
||||
}
|
||||
],
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: '#f34040',
|
||||
opacity: .2
|
||||
},
|
||||
{
|
||||
offset: 50,
|
||||
color: '#f34040',
|
||||
opacity: 0
|
||||
},
|
||||
{
|
||||
offset: 100,
|
||||
color: '#f34040',
|
||||
opacity: 0
|
||||
}
|
||||
]
|
||||
]
|
||||
},
|
||||
},
|
||||
tooltip: {
|
||||
x: {
|
||||
format: 'dd/MM/yy HH:mm'
|
||||
},
|
||||
},
|
||||
responsive: [{
|
||||
breakpoint: 575,
|
||||
options: {
|
||||
chart : {
|
||||
height:200,
|
||||
},
|
||||
stroke :{
|
||||
width : 3,
|
||||
},
|
||||
yaxis: {
|
||||
labels:{
|
||||
style: {
|
||||
fontSize: '11px',
|
||||
},
|
||||
},
|
||||
},
|
||||
xaxis: {
|
||||
labels:{
|
||||
style: {
|
||||
fontSize: '11px',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
}]
|
||||
};
|
||||
|
||||
var chart = new ApexCharts(document.querySelector("#vacancyChart"), options);
|
||||
chart.render();
|
||||
|
||||
$(".vacany-tabs .nav-link").on('click',function(){
|
||||
var seriesType = $(this).attr('data-series');
|
||||
var data1 = [];
|
||||
var data2 = [];
|
||||
var data3 = [];
|
||||
switch(seriesType) {
|
||||
case "Daily":
|
||||
data1 = [60, 40, 50, 45, 60, 45, 35 ,56 , 45, 60];
|
||||
data2 = [20, 35, 25, 35, 30, 20, 20 ,35 , 25, 40];
|
||||
data3 = [10, 25, 30, 20, 25, 15, 35 ,20 , 20, 30];
|
||||
break;
|
||||
case "Weekly":
|
||||
data1 = [55, 35, 45, 35, 55, 45, 35 ,60 , 40, 55];
|
||||
data2 = [35, 30, 40, 25, 44, 50, 20 ,35 , 30, 40];
|
||||
data3 = [20, 20, 15, 10, 25, 28, 20 ,25 , 20, 30];
|
||||
break;
|
||||
case "Monthly":
|
||||
data1 = [40, 60, 50, 65, 40, 65, 45 ,56 , 45, 60];
|
||||
data2 = [30, 27, 38, 35, 30, 35, 20 ,35 , 30, 40];
|
||||
data3 = [20, 25, 28, 20, 25, 28, 35 ,25 , 20, 30];
|
||||
break;
|
||||
default:
|
||||
data1 = [40, 60, 50, 65, 40, 65, 45 ,56 , 45, 60];
|
||||
data2 = [30, 27, 38, 35, 30, 35, 20 ,35 , 30, 40];
|
||||
data3 = [20, 25, 28, 20, 25, 28, 35 ,25 , 20, 30];
|
||||
}
|
||||
chart.updateSeries([
|
||||
{
|
||||
name: "Application Sent",
|
||||
data: data1
|
||||
},{
|
||||
name: 'Interviews',
|
||||
data: data2
|
||||
},{
|
||||
name: 'Rejected',
|
||||
data: data3
|
||||
}
|
||||
]);
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
var activityBar1 = function(){
|
||||
var options = {
|
||||
series: [{
|
||||
name: 'Net Profit',
|
||||
data: [50, 40, 55, 25, 45, 40, 35, 55, 50,25,42,35,50]
|
||||
}],
|
||||
chart: {
|
||||
type: 'bar',
|
||||
height: 350,
|
||||
toolbar : {
|
||||
show : false
|
||||
},
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
horizontal: false,
|
||||
columnWidth: '35%',
|
||||
endingShape: 'rounded'
|
||||
},
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
colors : ['var(--primary)'],
|
||||
stroke: {
|
||||
show: true,
|
||||
width: 2,
|
||||
colors: ['transparent']
|
||||
},
|
||||
xaxis: {
|
||||
categories: ['01', '02', '03', '04', '05', '06', '07', '08', '09','10','11','12','13'],
|
||||
labels:{
|
||||
style: {
|
||||
colors: 'var(--text)',
|
||||
fontSize: '13px',
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: 400
|
||||
|
||||
},
|
||||
},
|
||||
axisTicks : {
|
||||
show : false
|
||||
},
|
||||
axisBorder : {
|
||||
show : false
|
||||
},
|
||||
},
|
||||
yaxis: {
|
||||
labels: {
|
||||
style: {
|
||||
colors: 'var(--text)',
|
||||
fontSize: '13px',
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: 400
|
||||
|
||||
},
|
||||
formatter: function (value) {
|
||||
return value;
|
||||
}
|
||||
},
|
||||
},
|
||||
grid:{
|
||||
show:true,
|
||||
strokeDashArray: 6,
|
||||
borderColor: 'var(--border)',
|
||||
},
|
||||
fill: {
|
||||
opacity: 1
|
||||
},
|
||||
};
|
||||
|
||||
var chart = new ApexCharts(document.querySelector("#activity1"), options);
|
||||
chart.render();
|
||||
|
||||
$(".chart-tab .nav-link").on('click',function(){
|
||||
var seriesType = $(this).attr('data-series');
|
||||
var data = [];
|
||||
switch(seriesType) {
|
||||
case "Daily":
|
||||
data = [60, 40, 50, 45, 60, 45, 35 ,56, 45, 60, 36, 45, 60];
|
||||
break;
|
||||
case "Weekly":
|
||||
data = [55, 35, 45, 35, 55, 45, 35 ,60, 40, 55, 45, 25, 45];
|
||||
break;
|
||||
case "Monthly":
|
||||
data = [50, 40, 55, 25, 45, 40, 35, 55, 50, 25, 42, 35, 50];
|
||||
break;
|
||||
default:
|
||||
data = [50, 40, 55, 25, 45, 40, 35, 55, 50, 25, 42, 35, 50];
|
||||
}
|
||||
chart.updateSeries([
|
||||
{
|
||||
name: 'Net Profit',
|
||||
data: data
|
||||
}
|
||||
]);
|
||||
})
|
||||
}
|
||||
var pieChart1 = function(){
|
||||
var options = {
|
||||
series: [90, 68, 85],
|
||||
chart: {
|
||||
type: 'donut',
|
||||
height:250
|
||||
},
|
||||
dataLabels:{
|
||||
enabled: false
|
||||
},
|
||||
stroke: {
|
||||
width: 0,
|
||||
},
|
||||
colors:['#1D92DF', '#4754CB', '#D55BC1'],
|
||||
legend: {
|
||||
position: 'bottom',
|
||||
show:false
|
||||
},
|
||||
responsive: [{
|
||||
breakpoint: 768,
|
||||
options: {
|
||||
chart: {
|
||||
height:200
|
||||
},
|
||||
}
|
||||
}]
|
||||
};
|
||||
|
||||
var chart = new ApexCharts(document.querySelector("#pieChart1"), options);
|
||||
chart.render();
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
},
|
||||
|
||||
|
||||
load:function(){
|
||||
pieChart3();
|
||||
chartBar();
|
||||
activityChart();
|
||||
activityBar1();
|
||||
|
||||
},
|
||||
|
||||
resize:function(){
|
||||
}
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
setTimeout(function(){
|
||||
dlabChartlist.load();
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
})(jQuery);
|
||||
317
public/js/demo.js
Normal file
317
public/js/demo.js
Normal file
@@ -0,0 +1,317 @@
|
||||
"use strict"
|
||||
|
||||
var themeOptionArr = {
|
||||
typography: '',
|
||||
version: '',
|
||||
layout: '',
|
||||
primary: '',
|
||||
headerBg: '',
|
||||
navheaderBg: '',
|
||||
sidebarBg: '',
|
||||
sidebarStyle: '',
|
||||
sidebarPosition: '',
|
||||
headerPosition: '',
|
||||
containerLayout: '',
|
||||
direction: '',
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
(function($) {
|
||||
|
||||
"use strict"
|
||||
|
||||
//var direction = getUrlParams('dir');
|
||||
var direction = getUrlParams('dir');
|
||||
var theme = getUrlParams('theme');
|
||||
|
||||
/* Dz Theme Demo Settings */
|
||||
|
||||
var dlabThemeSet0 = { /* Default Theme */
|
||||
typography: "poppins",
|
||||
version: "light",
|
||||
layout: "vertical",
|
||||
primary: "color_1",
|
||||
headerBg: "color_1",
|
||||
navheaderBg: "color_1",
|
||||
sidebarBg: "color_1",
|
||||
sidebarStyle: "full",
|
||||
sidebarPosition: "fixed",
|
||||
headerPosition: "fixed",
|
||||
containerLayout: "full",
|
||||
direction: 'ltr',
|
||||
};
|
||||
|
||||
var dlabThemeSet1 = {
|
||||
typography: "poppins",
|
||||
version: "light",
|
||||
layout: "vertical",
|
||||
primary: "color_1",
|
||||
headerBg: "color_1",
|
||||
navheaderBg: "color_1",
|
||||
sidebarBg: "color_1",
|
||||
sidebarStyle: "full",
|
||||
sidebarPosition: "fixed",
|
||||
headerPosition: "fixed",
|
||||
containerLayout: "full",
|
||||
direction: 'ltr',
|
||||
};
|
||||
|
||||
var dlabThemeSet2 = {
|
||||
typography: "poppins",
|
||||
version: "dark",
|
||||
layout: "vertical",
|
||||
primary: "color_1",
|
||||
headerBg: "color_1",
|
||||
navheaderBg: "color_1",
|
||||
sidebarBg: "color_1",
|
||||
sidebarStyle: "full",
|
||||
sidebarPosition: "fixed",
|
||||
headerPosition: "fixed",
|
||||
containerLayout: "full",
|
||||
direction: 'ltr',
|
||||
};
|
||||
|
||||
|
||||
var dlabThemeSet3 = {
|
||||
typography: "poppins",
|
||||
version: "light",
|
||||
layout: "vertical",
|
||||
primary: "color_1",
|
||||
headerBg: "color_1",
|
||||
navheaderBg: "color_3",
|
||||
sidebarBg: "color_3",
|
||||
sidebarStyle: "full",
|
||||
sidebarPosition: "fixed",
|
||||
headerPosition: "fixed",
|
||||
containerLayout: "full",
|
||||
direction: 'ltr',
|
||||
};
|
||||
|
||||
var dlabThemeSet4 = {
|
||||
typography: "poppins",
|
||||
version: "dark",
|
||||
layout: "vertical",
|
||||
primary: "color_1",
|
||||
headerBg: "color_1",
|
||||
navheaderBg: "color_8",
|
||||
sidebarBg: "color_8",
|
||||
sidebarStyle: "full",
|
||||
sidebarPosition: "fixed",
|
||||
headerPosition: "fixed",
|
||||
containerLayout: "full",
|
||||
direction: 'ltr',
|
||||
};
|
||||
|
||||
var dlabThemeSet5 = {
|
||||
typography: "poppins",
|
||||
version: "light",
|
||||
layout: "horizontal",
|
||||
primary: "color_5",
|
||||
headerBg: "color_5",
|
||||
navheaderBg: "color_5",
|
||||
sidebarBg: "color_1",
|
||||
sidebarStyle: "full",
|
||||
sidebarPosition: "fixed",
|
||||
headerPosition: "fixed",
|
||||
containerLayout: "full",
|
||||
direction: 'ltr',
|
||||
};
|
||||
var dlabThemeSet6 = {
|
||||
typography: "poppins",
|
||||
version: "light",
|
||||
layout: "vertical",
|
||||
primary: "color_11",
|
||||
headerBg: "color_1",
|
||||
navheaderBg: "color_11",
|
||||
sidebarBg: "color_11",
|
||||
sidebarStyle: "compact",
|
||||
sidebarPosition: "fixed",
|
||||
headerPosition: "fixed",
|
||||
containerLayout: "full",
|
||||
direction: 'ltr',
|
||||
};
|
||||
var dlabThemeSet7 = {
|
||||
typography: "poppins",
|
||||
version: "light",
|
||||
layout: "vertical",
|
||||
primary: "color_1",
|
||||
headerBg: "color_1",
|
||||
navheaderBg: "color_13",
|
||||
sidebarBg: "color_13",
|
||||
sidebarStyle: "mini",
|
||||
sidebarPosition: "fixed",
|
||||
headerPosition: "fixed",
|
||||
containerLayout: "full",
|
||||
direction: 'ltr',
|
||||
};
|
||||
var dlabThemeSet8 = {
|
||||
typography: "poppins",
|
||||
version: "light",
|
||||
layout: "vertical",
|
||||
primary: "color_14",
|
||||
headerBg: "color_1",
|
||||
navheaderBg: "color_14",
|
||||
sidebarBg: "color_14",
|
||||
sidebarStyle: "modern",
|
||||
sidebarPosition: "static",
|
||||
headerPosition: "fixed",
|
||||
containerLayout: "full",
|
||||
direction: 'ltr',
|
||||
};
|
||||
|
||||
|
||||
function themeChange(theme, direction){
|
||||
var themeSettings = {};
|
||||
themeSettings = eval('dlabThemeSet'+theme);
|
||||
themeSettings.direction = direction;
|
||||
dlabSettingsOptions = themeSettings; /* For Screen Resize */
|
||||
new dlabSettings(themeSettings);
|
||||
|
||||
setThemeInCookie(themeSettings);
|
||||
}
|
||||
|
||||
function setThemeInCookie(themeSettings)
|
||||
{
|
||||
//console.log(themeSettings);
|
||||
jQuery.each(themeSettings, function(optionKey, optionValue) {
|
||||
setCookie(optionKey,optionValue);
|
||||
});
|
||||
}
|
||||
|
||||
function setThemeLogo() {
|
||||
var logo = getCookie('logo_src');
|
||||
|
||||
var logo2 = getCookie('logo_src2');
|
||||
|
||||
if(logo != ''){
|
||||
jQuery('.nav-header .logo-abbr').attr("src", logo);
|
||||
}
|
||||
|
||||
if(logo2 != ''){
|
||||
jQuery('.nav-header .logo-compact, .nav-header .brand-title').attr("src", logo2);
|
||||
}
|
||||
}
|
||||
|
||||
function setThemeOptionOnPage()
|
||||
{
|
||||
if(getCookie('version') != '')
|
||||
{
|
||||
jQuery.each(themeOptionArr, function(optionKey, optionValue) {
|
||||
var optionData = getCookie(optionKey);
|
||||
themeOptionArr[optionKey] = (optionData != '')?optionData:dlabSettingsOptions[optionKey];
|
||||
});
|
||||
//console.log(themeOptionArr);
|
||||
dlabSettingsOptions = themeOptionArr;
|
||||
new dlabSettings(dlabSettingsOptions);
|
||||
|
||||
setThemeLogo();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* set switcher option start */
|
||||
function getElementAttrs(el) {
|
||||
return [].slice.call(el.attributes).map((attr) => {
|
||||
return {
|
||||
name: attr.name,
|
||||
value: attr.value
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function handleSetThemeOption(item, index, arr) {
|
||||
|
||||
var attrName = item.name.replace('data-','').replace('-','_');
|
||||
|
||||
if(attrName === "sidebarbg" || attrName === "primary" || attrName === "headerbg" || attrName === "nav_headerbg" ){
|
||||
if(item.value === "color_1"){
|
||||
return false;
|
||||
}
|
||||
var attrNameColor = attrName.replace("bg","")
|
||||
document.getElementById(attrNameColor+"_"+item.value).checked = true;
|
||||
}else if(attrName === "navigationbarimg"){
|
||||
document.getElementById("sidebar_img_"+item.value.split('sidebar-img/')[1].split('.')[0]).checked = true;
|
||||
}else if(attrName === "sidebartext"){
|
||||
document.getElementById("sidebar_text_"+item.value).checked = true;
|
||||
}else if(attrName === "direction" || attrName === "nav_headerbg" || attrName === "headerbg"){
|
||||
document.getElementById("theme_direction").value = item.value;
|
||||
}else if(attrName === "sidebar_style" || attrName === "sidebar_position" || attrName === "header_position" || attrName === "typography" || attrName === "theme_version" ){
|
||||
if(item.value === "cairo" || item.value === "full" || item.value === "fixed"|| item.value === "light"){return false}
|
||||
document.getElementById(attrName).value = item.value;
|
||||
}else if(attrName === "layout"){
|
||||
if(item.value === "vertical"){return false}
|
||||
document.getElementById("theme_layout").value = item.value;
|
||||
}
|
||||
else if(attrName === "container"){
|
||||
if(item.value === "wide"){return false}
|
||||
document.getElementById("container_layout").value = item.value;
|
||||
}
|
||||
|
||||
$('.default-select').selectpicker('refresh');
|
||||
}
|
||||
/* / set switcher option end / */
|
||||
|
||||
|
||||
jQuery(document).on('click', '.dlab_theme_demo', function(){
|
||||
|
||||
setTimeout(() => {
|
||||
var allAttrs = getElementAttrs(document.querySelector('body'));
|
||||
allAttrs.forEach(handleSetThemeOption);
|
||||
},1500);
|
||||
|
||||
var demoTheme = jQuery(this).data('theme');
|
||||
themeChange(demoTheme, 'ltr');
|
||||
$('.dlab-demo-panel').removeClass('show');
|
||||
jQuery('.main-css').attr('href','css/style.css');
|
||||
});
|
||||
|
||||
|
||||
jQuery(document).on('click', '.dlab_theme_demo_rtl', function(){
|
||||
var demoTheme = jQuery(this).data('theme');
|
||||
themeChange(demoTheme, 'rtl');
|
||||
$('.dlab-demo-panel').removeClass('show');
|
||||
jQuery('.main-css').attr('href','css/style-rtl.css');
|
||||
});
|
||||
|
||||
|
||||
jQuery(window).on('load', function(){
|
||||
direction = (direction != undefined) ? direction : 'ltr';
|
||||
|
||||
if(getCookie('direction') == 'rtl'){
|
||||
jQuery('.main-css').attr('href','css/style-rtl.css');
|
||||
}
|
||||
|
||||
if(theme != undefined){
|
||||
if(theme == 'rtl'){
|
||||
themeChange(0, 'rtl');
|
||||
jQuery('.main-css').attr('href','css/style-rtl.css');
|
||||
}else {
|
||||
themeChange(theme, direction);
|
||||
}
|
||||
}
|
||||
else if(direction != undefined){
|
||||
if(getCookie('version') == ''){
|
||||
themeChange(0, direction);
|
||||
}
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
var allAttrs = getElementAttrs(document.querySelector('body'));
|
||||
allAttrs.forEach(handleSetThemeOption);
|
||||
},1500);
|
||||
|
||||
/* Set Theme On Page From Cookie */
|
||||
setThemeOptionOnPage();
|
||||
});
|
||||
|
||||
|
||||
jQuery(window).on('resize', function(){
|
||||
setThemeOptionOnPage();
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
53
public/js/dlab.carousel.js
Normal file
53
public/js/dlab.carousel.js
Normal file
@@ -0,0 +1,53 @@
|
||||
/* JavaScript Document */
|
||||
function carouselReview(){
|
||||
"use strict"
|
||||
|
||||
jQuery('.testimonial-one').owlCarousel({
|
||||
loop:true,
|
||||
autoplay:true,
|
||||
margin:20,
|
||||
nav:false,
|
||||
rtl:true,
|
||||
dots: false,
|
||||
navText: ['', ''],
|
||||
responsive:{
|
||||
0:{
|
||||
items:3
|
||||
},
|
||||
450:{
|
||||
items:4
|
||||
},
|
||||
600:{
|
||||
items:5
|
||||
},
|
||||
991:{
|
||||
items:5
|
||||
},
|
||||
|
||||
1200:{
|
||||
items:7
|
||||
},
|
||||
1601:{
|
||||
items:5
|
||||
}
|
||||
}
|
||||
})
|
||||
jQuery('.cards-slider').owlCarousel({
|
||||
loop:false,
|
||||
margin:30,
|
||||
nav:true,
|
||||
rtl:(getUrlParams('dir') == 'rtl')?true:false,
|
||||
autoWidth:true,
|
||||
//rtl:true,
|
||||
dots: false,
|
||||
navText: ['', ''],
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
setTimeout(function(){
|
||||
carouselReview();
|
||||
}, 1000);
|
||||
});
|
||||
/* Document .ready END */
|
||||
111
public/js/dlabnav-init.js
Normal file
111
public/js/dlabnav-init.js
Normal file
@@ -0,0 +1,111 @@
|
||||
|
||||
"use strict"
|
||||
|
||||
var dlabSettingsOptions = {};
|
||||
|
||||
function getUrlParams(dParam)
|
||||
{
|
||||
var dPageURL = window.location.search.substring(1),
|
||||
dURLVariables = dPageURL.split('&'),
|
||||
dParameterName,
|
||||
i;
|
||||
|
||||
for (i = 0; i < dURLVariables.length; i++) {
|
||||
dParameterName = dURLVariables[i].split('=');
|
||||
|
||||
if (dParameterName[0] === dParam) {
|
||||
return dParameterName[1] === undefined ? true : decodeURIComponent(dParameterName[1]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
(function($) {
|
||||
|
||||
"use strict"
|
||||
|
||||
var body = $('body');
|
||||
var direction = getUrlParams('dir');
|
||||
|
||||
dlabSettingsOptions = {
|
||||
typography: "poppins",
|
||||
version: "light",
|
||||
layout: "vertical",
|
||||
primary: "color_14",
|
||||
headerBg: "color_8",
|
||||
navheaderBg: "color_14",
|
||||
sidebarBg: "color_14",
|
||||
sidebarStyle: "full",
|
||||
sidebarPosition: "fixed",
|
||||
headerPosition: "fixed",
|
||||
containerLayout: "full",
|
||||
direction: 'ltr',
|
||||
};
|
||||
|
||||
|
||||
new dlabSettings(dlabSettingsOptions);
|
||||
|
||||
jQuery(window).on('resize',function(){
|
||||
/*Check container layout on resize */
|
||||
dlabSettingsOptions.containerLayout = $('#container_layout').val();
|
||||
/*Check container layout on resize END */
|
||||
|
||||
new dlabSettings(dlabSettingsOptions);
|
||||
});
|
||||
|
||||
if(direction == 'rtl' || body.attr('direction') == 'rtl'){
|
||||
direction = 'rtl';
|
||||
jQuery('.main-css').attr('href','css/style-rtl.css');
|
||||
}else{
|
||||
direction = 'ltr';
|
||||
jQuery('.main-css').attr('href','css/style.css');
|
||||
}
|
||||
|
||||
})(jQuery);
|
||||
|
||||
|
||||
/* Cookies Function */
|
||||
function setCookie(cname, cvalue, exhours)
|
||||
{
|
||||
var d = new Date();
|
||||
d.setTime(d.getTime() + (30*60*1000)); /* 30 Minutes */
|
||||
var expires = "expires="+ d.toString();
|
||||
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
|
||||
}
|
||||
|
||||
function getCookie(cname)
|
||||
{
|
||||
var name = cname + "=";
|
||||
var decodedCookie = decodeURIComponent(document.cookie);
|
||||
var ca = decodedCookie.split(';');
|
||||
for(var i = 0; i <ca.length; i++) {
|
||||
var c = ca[i];
|
||||
while (c.charAt(0) == ' ') {
|
||||
c = c.substring(1);
|
||||
}
|
||||
if (c.indexOf(name) == 0) {
|
||||
return c.substring(name.length, c.length);
|
||||
}
|
||||
}
|
||||
return "";
|
||||
}
|
||||
|
||||
function deleteCookie(cname)
|
||||
{
|
||||
var d = new Date();
|
||||
d.setTime(d.getTime() + (1)); // 1/1000 second
|
||||
var expires = "expires="+ d.toString();
|
||||
//document.cookie = cname + "=1;" + expires + ";path=/";
|
||||
document.cookie = cname + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT"+";path=/";
|
||||
}
|
||||
|
||||
function deleteAllCookie(reload = true)
|
||||
{
|
||||
jQuery.each(themeOptionArr, function(optionKey, optionValue) {
|
||||
deleteCookie(optionKey);
|
||||
});
|
||||
if(reload){
|
||||
location.reload();
|
||||
}
|
||||
}
|
||||
|
||||
/* Cookies Function END */
|
||||
12
public/js/file-upload.js
Executable file
12
public/js/file-upload.js
Executable file
@@ -0,0 +1,12 @@
|
||||
(function($) {
|
||||
'use strict';
|
||||
$(function() {
|
||||
$('.file-upload-browse').on('click', function() {
|
||||
var file = $(this).parent().parent().parent().find('.file-upload-default');
|
||||
file.trigger('click');
|
||||
});
|
||||
$('.file-upload-default').on('change', function() {
|
||||
$(this).parent().find('.form-control').val($(this).val().replace(/C:\\fakepath\\/i, ''));
|
||||
});
|
||||
});
|
||||
})(jQuery);
|
||||
117
public/js/jquery.cookie.js
Executable file
117
public/js/jquery.cookie.js
Executable file
@@ -0,0 +1,117 @@
|
||||
/*!
|
||||
* jQuery Cookie Plugin v1.4.1
|
||||
* https://github.com/carhartl/jquery-cookie
|
||||
*
|
||||
* Copyright 2013 Klaus Hartl
|
||||
* Released under the MIT license
|
||||
*/
|
||||
(function (factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// AMD
|
||||
define(['jquery'], factory);
|
||||
} else if (typeof exports === 'object') {
|
||||
// CommonJS
|
||||
factory(require('jquery'));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
}(function ($) {
|
||||
|
||||
var pluses = /\+/g;
|
||||
|
||||
function encode(s) {
|
||||
return config.raw ? s : encodeURIComponent(s);
|
||||
}
|
||||
|
||||
function decode(s) {
|
||||
return config.raw ? s : decodeURIComponent(s);
|
||||
}
|
||||
|
||||
function stringifyCookieValue(value) {
|
||||
return encode(config.json ? JSON.stringify(value) : String(value));
|
||||
}
|
||||
|
||||
function parseCookieValue(s) {
|
||||
if (s.indexOf('"') === 0) {
|
||||
// This is a quoted cookie as according to RFC2068, unescape...
|
||||
s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\');
|
||||
}
|
||||
|
||||
try {
|
||||
// Replace server-side written pluses with spaces.
|
||||
// If we can't decode the cookie, ignore it, it's unusable.
|
||||
// If we can't parse the cookie, ignore it, it's unusable.
|
||||
s = decodeURIComponent(s.replace(pluses, ' '));
|
||||
return config.json ? JSON.parse(s) : s;
|
||||
} catch(e) {}
|
||||
}
|
||||
|
||||
function read(s, converter) {
|
||||
var value = config.raw ? s : parseCookieValue(s);
|
||||
return $.isFunction(converter) ? converter(value) : value;
|
||||
}
|
||||
|
||||
var config = $.cookie = function (key, value, options) {
|
||||
|
||||
// Write
|
||||
|
||||
if (value !== undefined && !$.isFunction(value)) {
|
||||
options = $.extend({}, config.defaults, options);
|
||||
|
||||
if (typeof options.expires === 'number') {
|
||||
var days = options.expires, t = options.expires = new Date();
|
||||
t.setTime(+t + days * 864e+5);
|
||||
}
|
||||
|
||||
return (document.cookie = [
|
||||
encode(key), '=', stringifyCookieValue(value),
|
||||
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
|
||||
options.path ? '; path=' + options.path : '',
|
||||
options.domain ? '; domain=' + options.domain : '',
|
||||
options.secure ? '; secure' : ''
|
||||
].join(''));
|
||||
}
|
||||
|
||||
// Read
|
||||
|
||||
var result = key ? undefined : {};
|
||||
|
||||
// To prevent the for loop in the first place assign an empty array
|
||||
// in case there are no cookies at all. Also prevents odd result when
|
||||
// calling $.cookie().
|
||||
var cookies = document.cookie ? document.cookie.split('; ') : [];
|
||||
|
||||
for (var i = 0, l = cookies.length; i < l; i++) {
|
||||
var parts = cookies[i].split('=');
|
||||
var name = decode(parts.shift());
|
||||
var cookie = parts.join('=');
|
||||
|
||||
if (key && key === name) {
|
||||
// If second argument (value) is a function it's a converter...
|
||||
result = read(cookie, value);
|
||||
break;
|
||||
}
|
||||
|
||||
// Prevent storing a cookie that we couldn't decode.
|
||||
if (!key && (cookie = read(cookie)) !== undefined) {
|
||||
result[name] = cookie;
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
};
|
||||
|
||||
config.defaults = {};
|
||||
|
||||
$.removeCookie = function (key, options) {
|
||||
if ($.cookie(key) === undefined) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// Must not alter options, thus extending a fresh object...
|
||||
$.cookie(key, '', $.extend({}, options, { expires: -1 }));
|
||||
return !$.cookie(key);
|
||||
};
|
||||
|
||||
}));
|
||||
1394
public/js/jquery.localizationTool.js
Normal file
1394
public/js/jquery.localizationTool.js
Normal file
File diff suppressed because it is too large
Load Diff
9
public/js/layout-compact-nav.js
Normal file
9
public/js/layout-compact-nav.js
Normal file
@@ -0,0 +1,9 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
new dlabSettings({
|
||||
sidebarStyle: "compact"
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
9
public/js/layout-dark.js
Normal file
9
public/js/layout-dark.js
Normal file
@@ -0,0 +1,9 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
new dlabSettings({
|
||||
version: "dark"
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
9
public/js/layout-fixed-header.js
Normal file
9
public/js/layout-fixed-header.js
Normal file
@@ -0,0 +1,9 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
new dlabSettings({
|
||||
headerPosition: "fixed",
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
9
public/js/layout-fixed-nav.js
Normal file
9
public/js/layout-fixed-nav.js
Normal file
@@ -0,0 +1,9 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
new dlabSettings({
|
||||
sidebarPosition: "fixed"
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
9
public/js/layout-full-nav.js
Normal file
9
public/js/layout-full-nav.js
Normal file
@@ -0,0 +1,9 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
new dlabSettings({
|
||||
sidebarStyle: "full",
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
9
public/js/layout-light.js
Normal file
9
public/js/layout-light.js
Normal file
@@ -0,0 +1,9 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
new dlabSettings({
|
||||
version: "light"
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
9
public/js/layout-mini-nav.js
Normal file
9
public/js/layout-mini-nav.js
Normal file
@@ -0,0 +1,9 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
new dlabSettings({
|
||||
sidebarStyle: "mini"
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
9
public/js/layout-rtl.js
Normal file
9
public/js/layout-rtl.js
Normal file
@@ -0,0 +1,9 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
new dlabSettings({
|
||||
direction: "rtl"
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
122
public/js/member/index.js
Normal file
122
public/js/member/index.js
Normal file
@@ -0,0 +1,122 @@
|
||||
$(document).ready(function () {
|
||||
|
||||
$(document).on('change', '.select-option', function () {
|
||||
if ($('option:selected', this).val() == '') {
|
||||
$(".nama").css('display', 'none');
|
||||
$(".nopol").css('display', 'none');
|
||||
$(".nocard").css('display', 'none');
|
||||
$(".notrans").css('display', 'none');
|
||||
// $(".site").val('');
|
||||
} else if ($('option:selected', this).val() == 'nama') {
|
||||
$(".nama").css('display', 'block');
|
||||
$(".nopol").css('display', 'none');
|
||||
$(".nocard").css('display', 'none');
|
||||
$(".notrans").css('display', 'none');
|
||||
$(".input-default").val('');
|
||||
} else if ($('option:selected', this).val() == 'nopol') {
|
||||
$(".nama").css('display', 'none');
|
||||
$(".nopol").css('display', 'block');
|
||||
$(".nocard").css('display', 'none');
|
||||
$(".notrans").css('display', 'none');
|
||||
$(".input-default").val('');
|
||||
} else if ($('option:selected', this).val() == 'nocard') {
|
||||
$(".nama").css('display', 'none');
|
||||
$(".nopol").css('display', 'none');
|
||||
$(".nocard").css('display', 'block');
|
||||
$(".notrans").css('display', 'none');
|
||||
$(".input-default").val('');
|
||||
} else if ($('option:selected', this).val() == 'notrans') {
|
||||
$(".nama").css('display', 'none');
|
||||
$(".nopol").css('display', 'none');
|
||||
$(".nocard").css('display', 'none');
|
||||
$(".notrans").css('display', 'block');
|
||||
$(".input-default").val('');
|
||||
} else {
|
||||
$(".position").css('display', 'none');
|
||||
$(".level-area").css('display', 'none');
|
||||
$(".input-default").val('');
|
||||
}
|
||||
});
|
||||
|
||||
var url = $('#example').data('url');
|
||||
|
||||
$('#search-button').on('click', function () {
|
||||
// Ambil nilai dari selected option
|
||||
var option = $('.select-option').val();
|
||||
|
||||
// Cek jika option yang dipilih bukan 'Pencarian Data...' yang berarti pilihan valid
|
||||
if (option && option !== '') {
|
||||
var inputField = $('.input-default:visible');
|
||||
|
||||
// Periksa apakah input tersebut kosong
|
||||
if (inputField.length === 0 || inputField.val().trim() === '') {
|
||||
// Jika kosong, tampilkan alert
|
||||
alert('Harap masukkan ' + (option === 'nopol' ? 'No. Polisi' : option === 'nocard' ? 'No. Card' : option === 'nama' ? 'Nama' : option === 'notrans' ? 'No. Transaksi' : 'No. Transaksi'));
|
||||
inputField.focus();
|
||||
return; // Hentikan proses jika input kosong
|
||||
}
|
||||
}
|
||||
|
||||
var formData = $('#search-form .input-default:visible').val();
|
||||
console.log(formData);
|
||||
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: "POST",
|
||||
// data: $('#search-form .input-default:visible').serialize(),
|
||||
data: $('#search-form').serialize(),
|
||||
headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
|
||||
dataType: 'json',
|
||||
success: function (response) {
|
||||
var tbody = $('#example tbody');
|
||||
tbody.empty();
|
||||
|
||||
if (response.length !== 0) {
|
||||
// Kelompokkan data berdasarkan notrans
|
||||
var groupedData = {};
|
||||
response.forEach((element) => {
|
||||
if (!groupedData[element.notrans]) {
|
||||
groupedData[element.notrans] = [];
|
||||
}
|
||||
groupedData[element.notrans].push(element);
|
||||
});
|
||||
|
||||
// Generate HTML
|
||||
Object.keys(groupedData).forEach((notrans, index) => {
|
||||
var rows = groupedData[notrans];
|
||||
var rowspan = rows.length;
|
||||
|
||||
rows.forEach((element, rowIndex) => {
|
||||
var rowHtml = `
|
||||
<tr class="mb-2">
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p2" style="text-align: center;">${index + 1}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p2" style="padding: 2px;">${element.notrans}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.nama}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.alamat}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.telepon}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.jmember}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.dept}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" width="200" style="text-align: center; padding: 2px;">${element.awal} <br> ${element.akhir}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p-2" style="padding: 2px;"> ${[...new Set(rows.map(r => `${r.nopol || 'No. Polisi tidak ada'} (${r.vehicle || ''})`))].join('<br>')} </td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${[...new Set(rows.map(r => r.no_card || 'Tidak ada kartu'))].join('<br>')}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p-2" style="text-align: center;">
|
||||
<button class="btn btn-secondary btn-xs extend-button mb-1" data-id="${element.notrans}">Extend</button>
|
||||
<button class="btn btn-primary btn-xs edit-button mb-1" data-id="${element.notrans}">Edit</button>
|
||||
<button class="btn btn-danger btn-xs delete-button mb-1" data-id="${element.notrans}">Delete</button>
|
||||
</td>` : ''}
|
||||
</tr>
|
||||
`;
|
||||
tbody.append(rowHtml);
|
||||
});
|
||||
});
|
||||
} else {
|
||||
alert("Data tidak ditemukan.");
|
||||
$('#example tbody').html(
|
||||
`<tr>
|
||||
<td colspan="11" style="text-align: center;"><p class="text-danger mt-3">Tidak ditemukan data</p></td>
|
||||
<tr>`);
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
});
|
||||
264
public/js/member/member-register.js
Normal file
264
public/js/member/member-register.js
Normal file
@@ -0,0 +1,264 @@
|
||||
$(document).ready(function () {
|
||||
console.log($.fn.jquery);
|
||||
const today = moment();
|
||||
const startDate = moment(today).startOf('day').format('DD-MM-YYYY 00:00');
|
||||
const endDate = moment(today).endOf('day').format('DD-MM-YYYY 23:59');
|
||||
|
||||
$('.tambah-member').validate({
|
||||
rules: {
|
||||
nama: {
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
messages: {
|
||||
nama: {
|
||||
required: 'Masukkan nama member',
|
||||
},
|
||||
},
|
||||
// errorElement: 'span',
|
||||
// errorPlacement: function (error, element) {
|
||||
// error.addClass('invalid-feedback');
|
||||
// // element.closest('.form-group').append(error);
|
||||
// },
|
||||
highlight: function (element, errorClass, validClass) {
|
||||
$(element).addClass('is-invalid');
|
||||
},
|
||||
unhighlight: function (element, errorClass, validClass) {
|
||||
$(element).removeClass('is-invalid');
|
||||
}
|
||||
});
|
||||
|
||||
$('.input-daterange-timepicker').daterangepicker({
|
||||
// singleDatePicker: true,
|
||||
timePicker: true,
|
||||
locale: {
|
||||
format: 'DD-MM-YYYY HH:mm'
|
||||
},
|
||||
timePicker24Hour: true,
|
||||
timePickerSeconds: false,
|
||||
buttonClasses: ['btn', 'btn-sm'],
|
||||
applyClass: 'btn-danger',
|
||||
cancelClass: 'btn-inverse',
|
||||
startDate: startDate,
|
||||
endDate: endDate,
|
||||
}, function (startDate, endDate) {
|
||||
console.log(`Range selected: ${startDate.format('DD-MM-YYYY HH:mm')} s/d ${endDate.format('DD-MM-YYYY HH:mm')}`);
|
||||
$('.input-daterange-timepicker').val(`${startDate.format('DD-MM-YYYY HH:mm')} s/d ${endDate.format('DD-MM-YYYY HH:mm')}`);
|
||||
// $('.awal').val(`${startDate.format('DD-MM-YYYY HH:mm')}`);
|
||||
// $('.akhir').val(`${endDate.format('DD-MM-YYYY HH:mm')}`);
|
||||
});
|
||||
|
||||
// Set nilai awal dan akhir di input
|
||||
$('.input-daterange-timepicker').val(`${startDate} - ${endDate}`);
|
||||
// $('.awal').val(startDate);
|
||||
// $('.akhir').val(endDate);
|
||||
|
||||
$('#jenisVehicle').on('change', function () {
|
||||
var jenisMembers = member;
|
||||
var vehicleSelected = $(this).val();
|
||||
var $jenisMember = $('#jenis-member');
|
||||
// console.log(jenisMembers);
|
||||
|
||||
$jenisMember.empty();
|
||||
$jenisMember.append('<option selected value="">Pilih Jenis</option>');
|
||||
|
||||
jenisMembers.forEach((item) => {
|
||||
if (item.id_mobil === vehicleSelected) {
|
||||
if (item.id_mobil !== 0 ) {
|
||||
$jenisMember.append(
|
||||
`<option value="${item.tarif}">${item.jenis_langganan} - ${item.tarif} </option>`
|
||||
);
|
||||
console.log($jenisMember);
|
||||
} else {
|
||||
$jenisMember.append(
|
||||
`<option value="">Tidak ada Pilihan </option>`
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
$('#nopol-add').on('click', function() {
|
||||
var nopol = $('.nopol-add').val().trim();
|
||||
console.log(nopol);
|
||||
// var vehicle = $('#jenisVehicle option:selected').text();
|
||||
var vehicle = $('#jenisVehicle').val();
|
||||
var vehicleName = $('#jenisVehicle option:selected').text();
|
||||
var member = $('#jenis-member option:selected').text();
|
||||
var merk = $('.merk').val().trim();
|
||||
$('.nopol-add').removeClass('is-invalid'); // Hapus kelas jika ada sebelumnya
|
||||
$('.nopol-add').next('.invalid-feedback').hide();
|
||||
|
||||
if (!vehicle) {
|
||||
alert('Wajib pilih jenis kendaraan');
|
||||
return;
|
||||
}
|
||||
|
||||
$.ajax ({
|
||||
url: 'member/checkField',
|
||||
type: 'POST',
|
||||
data: { nopol: nopol },
|
||||
headers: {'X-CSRF-token': $('meta[name="csrf-token"]').attr('content')},
|
||||
success: function (r) {
|
||||
if (r.response === true) {
|
||||
var rowhtml = `
|
||||
<tr>
|
||||
<td class="text-center">${nopol}</td>
|
||||
<td class="text-center" data-value="${vehicle}"">${vehicleName}</td>
|
||||
<td class="text-center">${member}</td>
|
||||
<td class="text-center">${merk}</td>
|
||||
<td class="text-center p-1" style="text-align: center;">
|
||||
<button class="btn btn-danger btn-xs delete-row">Hapus<buttion>
|
||||
</td>
|
||||
</tr>
|
||||
`;
|
||||
$('#list-nopol').append(rowhtml);
|
||||
console.log('Berhasil menambahkan ' + nopol)
|
||||
|
||||
$('.nopol-add').val('');
|
||||
$('#jenisVehicle').val('');
|
||||
$('#jenis-member').val('');
|
||||
$('.merk').val('');
|
||||
} else {
|
||||
// var warn = `<div class="invalid-feedback">Nopol sudah ada</div>`;
|
||||
$('.nopol-add').addClass('is-invalid'); // Tambahkan kelas invalid
|
||||
$('.nopol-add').next('.invalid-feedback').text(r.message).show(); // Tampilkan pesan error
|
||||
console.log(r.message);
|
||||
}
|
||||
},
|
||||
error: function () {
|
||||
alert('Terjadi kesalahan saat memeriksa nopol');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$('.kartu').on('keydown', function (e) {
|
||||
var kartu = $('.kartu').val().trim();
|
||||
|
||||
if (e.key === 'Enter') {
|
||||
// $.ajax ({
|
||||
// url: 'member/checkField',
|
||||
// type: 'POST',
|
||||
// data: {nocard: kartu},
|
||||
// headers: {'X-CSRF-token': $('meta[name="csrf-token"]').attr('content')},
|
||||
// success: function (r) {
|
||||
// if (r.response === true) {
|
||||
e.preventDefault();
|
||||
$('.nourut').focus();
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
}
|
||||
});
|
||||
|
||||
$('.nourut').on('keydown', function (e) {
|
||||
if (e.key === 'Enter') {
|
||||
e.preventDefault();
|
||||
|
||||
var nocard = $('.kartu').val().trim();
|
||||
var nourut = $('.nourut').val().trim();
|
||||
|
||||
var rowHtml = `
|
||||
<tr>
|
||||
<td class="text-center strong">${nocard}</td>
|
||||
<td class="text-center strong">${nourut}</td>
|
||||
<td class="text-center p-2" >
|
||||
<button class="btn btn-danger btn-xs delete-row">Hapus<buttion>
|
||||
</td>
|
||||
</tr>
|
||||
`;
|
||||
$('#list-card').append(rowHtml);
|
||||
$('.kartu').val('');
|
||||
$('.nourut').val('');
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
$('#list-card').on('click', '.delete-row', function () {
|
||||
$(this).closest('tr').remove(); // Hapus baris yang diklik
|
||||
});
|
||||
|
||||
$('.simpan').on('click', function () {
|
||||
var tombol = $(this);
|
||||
var formCollect = $('#add-member').serialize();
|
||||
var collectNopol = [];
|
||||
var cardCollect = [];
|
||||
|
||||
$('#list-nopol tr').each(function () {
|
||||
var row = $(this);
|
||||
var rowData = {
|
||||
nopol: row.find('td:nth-child(1)').text().trim(),
|
||||
vehicle: row.find('td:nth-child(2)').data('value'),
|
||||
member: row.find('td:nth-child(3)').text().trim(),
|
||||
merk: row.find('td:nth-child(4)').text().trim(),
|
||||
};
|
||||
collectNopol.push(rowData);
|
||||
});
|
||||
|
||||
console.log(collectNopol);
|
||||
|
||||
$('#list-card tr').each(function () {
|
||||
var row = $(this);
|
||||
var rowCard = {
|
||||
nocard: row.find('td:nth-child(1)').text(),
|
||||
nourut: row.find('td:nth-child(2)').text(),
|
||||
};
|
||||
cardCollect.push(rowCard);
|
||||
});
|
||||
|
||||
console.log(cardCollect);
|
||||
|
||||
const formDataString = formCollect;
|
||||
|
||||
// Mengonversi query string menjadi objek
|
||||
const formDataObj = {};
|
||||
const searchParams = new URLSearchParams(formDataString);
|
||||
|
||||
searchParams.forEach((value, key) => {
|
||||
formDataObj[key] = value;
|
||||
});
|
||||
|
||||
console.log(formDataObj);
|
||||
|
||||
var allData = {
|
||||
formData: formDataObj,
|
||||
nopolData: collectNopol,
|
||||
cardNumber: cardCollect,
|
||||
};
|
||||
|
||||
if($('.tambah-member').valid()) {
|
||||
$.ajax({
|
||||
url: $('#add-member').attr('action'),
|
||||
type: 'POST',
|
||||
data: allData,
|
||||
headers: {'X-CSRF-token': $('meta[name="csrf-token"]').attr('content')},
|
||||
beforeSend: function () {
|
||||
tombol.attr('disabled',true);
|
||||
},
|
||||
success: function (r) {
|
||||
// alert('Data berhasil dikirim');
|
||||
$('#modal-member').modal('hide');
|
||||
if (r.response == true) {
|
||||
Swal.fire(
|
||||
{
|
||||
title: "Berhasil!!",
|
||||
text: "Member anda telah terdaftar !!",
|
||||
timer: 5000, showConfirmButton: !1
|
||||
}
|
||||
).then(function() {
|
||||
// Reload halaman setelah SweetAlert ditutup
|
||||
location.reload(); // Ini akan me-reload halaman
|
||||
});
|
||||
} else if (r.response == false) {
|
||||
Swal.fire("Oops...", "Terjadi kendala !!", "silahkan hubungi admin", "error");
|
||||
}
|
||||
console.log(r);
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
alert('Terjadi kesalahan: ' + error);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
17
public/js/plugins-init/bootstrap-multiselect-init.js
vendored
Normal file
17
public/js/plugins-init/bootstrap-multiselect-init.js
vendored
Normal file
@@ -0,0 +1,17 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
|
||||
$('.basic-multiselect').multiselect();
|
||||
|
||||
$('.basic-multiselect-optgroup').multiselect({
|
||||
enableClickableOptGroups: true
|
||||
});
|
||||
|
||||
$('.basic-multiselect-selectall').multiselect({
|
||||
enableClickableOptGroups: true,
|
||||
includeSelectAllOption: true
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
6
public/js/plugins-init/bootstrap-tagsinput-init.js
vendored
Normal file
6
public/js/plugins-init/bootstrap-tagsinput-init.js
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
$("#tags_1").tagsinput();
|
||||
|
||||
})(jQuery);
|
||||
49
public/js/plugins-init/bootstrap-touchpin-init.js
vendored
Normal file
49
public/js/plugins-init/bootstrap-touchpin-init.js
vendored
Normal file
@@ -0,0 +1,49 @@
|
||||
(function ($) {
|
||||
"use strict";
|
||||
|
||||
$("input[name='demo0']").TouchSpin()
|
||||
|
||||
$("input[name='demo1']").TouchSpin({
|
||||
min: 0,
|
||||
max: 100,
|
||||
step: .1,
|
||||
decimals: 2,
|
||||
boostat: 5,
|
||||
maxboostedstep: 10,
|
||||
postfix: "%"
|
||||
})
|
||||
|
||||
$("input[name='demo2']").TouchSpin({
|
||||
min: -1e9,
|
||||
max: 1e9,
|
||||
stepinterval: 50,
|
||||
maxboostedstep: 1e7,
|
||||
prefix: "$"
|
||||
})
|
||||
|
||||
$("input[name='demo_vertical']").TouchSpin({
|
||||
verticalbuttons: !0
|
||||
})
|
||||
|
||||
$("input[name='demo_vertical2']").TouchSpin({
|
||||
verticalbuttons: !0,
|
||||
verticalupclass: "fa fa-plus",
|
||||
verticaldownclass: "fa fa-minus"
|
||||
})
|
||||
|
||||
$("input[name='demo4']").TouchSpin({
|
||||
postfix: "a button",
|
||||
postfix_extraclass: "btn btn-default"
|
||||
})
|
||||
|
||||
$("input[name='demo4_2']").TouchSpin({
|
||||
postfix: "a button",
|
||||
postfix_extraclass: "btn btn-default"
|
||||
})
|
||||
|
||||
$("input[name='demo5']").TouchSpin({
|
||||
prefix: "pre",
|
||||
postfix: "post"
|
||||
})
|
||||
|
||||
})(jQuery);
|
||||
31
public/js/plugins-init/bs-daterange-picker-init.js
Normal file
31
public/js/plugins-init/bs-daterange-picker-init.js
Normal file
@@ -0,0 +1,31 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
// Daterange picker
|
||||
$('.input-daterange-datepicker').daterangepicker({
|
||||
buttonClasses: ['btn', 'btn-sm'],
|
||||
applyClass: 'btn-danger',
|
||||
cancelClass: 'btn-inverse'
|
||||
});
|
||||
$('.input-daterange-timepicker').daterangepicker({
|
||||
timePicker: true,
|
||||
format: 'MM/DD/YYYY h:mm A',
|
||||
timePickerIncrement: 30,
|
||||
timePicker12Hour: true,
|
||||
timePickerSeconds: false,
|
||||
buttonClasses: ['btn', 'btn-sm'],
|
||||
applyClass: 'btn-danger',
|
||||
cancelClass: 'btn-inverse'
|
||||
});
|
||||
$('.input-limit-datepicker').daterangepicker({
|
||||
format: 'MM/DD/YYYY',
|
||||
minDate: '06/01/2015',
|
||||
maxDate: '06/30/2015',
|
||||
buttonClasses: ['btn', 'btn-sm'],
|
||||
applyClass: 'btn-danger',
|
||||
cancelClass: 'btn-inverse',
|
||||
dateLimit: {
|
||||
days: 6
|
||||
}
|
||||
});
|
||||
})(jQuery);
|
||||
900
public/js/plugins-init/chartist-init.js
Normal file
900
public/js/plugins-init/chartist-init.js
Normal file
@@ -0,0 +1,900 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
|
||||
var dlabChartlist = function(){
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
var setChartWidth = function(){
|
||||
|
||||
if(screenWidth <= 768)
|
||||
{
|
||||
var chartBlockWidth = 0;
|
||||
if(screenWidth >= 500)
|
||||
{
|
||||
chartBlockWidth = 250;
|
||||
}else{
|
||||
chartBlockWidth = 300;
|
||||
}
|
||||
|
||||
jQuery('.chartlist-chart').css('min-width',chartBlockWidth - 31);
|
||||
}
|
||||
}
|
||||
|
||||
var lineAnimatedChart = function(){
|
||||
|
||||
var chart = new Chartist.Line('#smil-animations', {
|
||||
labels: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12'],
|
||||
series: [
|
||||
[12, 9, 7, 8, 5, 4, 6, 2, 3, 3, 4, 6],
|
||||
[4, 5, 3, 7, 3, 5, 5, 3, 4, 4, 5, 5],
|
||||
[5, 3, 4, 5, 6, 3, 3, 4, 5, 6, 3, 4],
|
||||
[3, 4, 5, 6, 7, 6, 4, 5, 6, 7, 6, 3]
|
||||
]
|
||||
}, {
|
||||
low: 0,
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
});
|
||||
|
||||
// Let's put a sequence number aside so we can use it in the event callbacks
|
||||
var seq = 0,
|
||||
delays = 80,
|
||||
durations = 500;
|
||||
|
||||
// Once the chart is fully created we reset the sequence
|
||||
chart.on('created', function() {
|
||||
seq = 0;
|
||||
});
|
||||
|
||||
// On each drawn element by Chartist we use the Chartist.Svg API to trigger SMIL animations
|
||||
chart.on('draw', function(data) {
|
||||
seq++;
|
||||
|
||||
if(data.type === 'line') {
|
||||
// If the drawn element is a line we do a simple opacity fade in. This could also be achieved using CSS3 animations.
|
||||
data.element.animate({
|
||||
opacity: {
|
||||
// The delay when we like to start the animation
|
||||
begin: seq * delays + 1000,
|
||||
// Duration of the animation
|
||||
dur: durations,
|
||||
// The value where the animation should start
|
||||
from: 0,
|
||||
// The value where it should end
|
||||
to: 1
|
||||
}
|
||||
});
|
||||
} else if(data.type === 'label' && data.axis === 'x') {
|
||||
data.element.animate({
|
||||
y: {
|
||||
begin: seq * delays,
|
||||
dur: durations,
|
||||
from: data.y + 100,
|
||||
to: data.y,
|
||||
// We can specify an easing function from Chartist.Svg.Easing
|
||||
easing: 'easeOutQuart'
|
||||
}
|
||||
});
|
||||
} else if(data.type === 'label' && data.axis === 'y') {
|
||||
data.element.animate({
|
||||
x: {
|
||||
begin: seq * delays,
|
||||
dur: durations,
|
||||
from: data.x - 100,
|
||||
to: data.x,
|
||||
easing: 'easeOutQuart'
|
||||
}
|
||||
});
|
||||
} else if(data.type === 'point') {
|
||||
data.element.animate({
|
||||
x1: {
|
||||
begin: seq * delays,
|
||||
dur: durations,
|
||||
from: data.x - 10,
|
||||
to: data.x,
|
||||
easing: 'easeOutQuart'
|
||||
},
|
||||
x2: {
|
||||
begin: seq * delays,
|
||||
dur: durations,
|
||||
from: data.x - 10,
|
||||
to: data.x,
|
||||
easing: 'easeOutQuart'
|
||||
},
|
||||
opacity: {
|
||||
begin: seq * delays,
|
||||
dur: durations,
|
||||
from: 0,
|
||||
to: 1,
|
||||
easing: 'easeOutQuart'
|
||||
}
|
||||
});
|
||||
} else if(data.type === 'grid') {
|
||||
// Using data.axis we get x or y which we can use to construct our animation definition objects
|
||||
var pos1Animation = {
|
||||
begin: seq * delays,
|
||||
dur: durations,
|
||||
from: data[data.axis.units.pos + '1'] - 30,
|
||||
to: data[data.axis.units.pos + '1'],
|
||||
easing: 'easeOutQuart'
|
||||
};
|
||||
|
||||
var pos2Animation = {
|
||||
begin: seq * delays,
|
||||
dur: durations,
|
||||
from: data[data.axis.units.pos + '2'] - 100,
|
||||
to: data[data.axis.units.pos + '2'],
|
||||
easing: 'easeOutQuart'
|
||||
};
|
||||
|
||||
var animations = {};
|
||||
animations[data.axis.units.pos + '1'] = pos1Animation;
|
||||
animations[data.axis.units.pos + '2'] = pos2Animation;
|
||||
animations['opacity'] = {
|
||||
begin: seq * delays,
|
||||
dur: durations,
|
||||
from: 0,
|
||||
to: 1,
|
||||
easing: 'easeOutQuart'
|
||||
};
|
||||
|
||||
data.element.animate(animations);
|
||||
}
|
||||
});
|
||||
|
||||
// For the sake of the example we update the chart every time it's created with a delay of 10 seconds
|
||||
chart.on('created', function() {
|
||||
if(window.__exampleAnimateTimeout) {
|
||||
clearTimeout(window.__exampleAnimateTimeout);
|
||||
window.__exampleAnimateTimeout = null;
|
||||
}
|
||||
window.__exampleAnimateTimeout = setTimeout(chart.update.bind(chart), 12000);
|
||||
});
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
var scatterChart = function(){
|
||||
//Line Scatter Diagram
|
||||
var times = function(n) {
|
||||
return Array.apply(null, new Array(n));
|
||||
};
|
||||
|
||||
var data = times(52).map(Math.random).reduce(function(data, rnd, index) {
|
||||
data.labels.push(index + 1);
|
||||
data.series.forEach(function(series) {
|
||||
series.push(Math.random() * 100)
|
||||
});
|
||||
|
||||
return data;
|
||||
}, {
|
||||
labels: [],
|
||||
series: times(4).map(function() { return new Array() })
|
||||
});
|
||||
|
||||
var options = {
|
||||
showLine: false,
|
||||
axisX: {
|
||||
labelInterpolationFnc: function(value, index) {
|
||||
return index % 13 === 0 ? 'W' + value : null;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
var responsiveOptions = [
|
||||
['screen and (min-width: 640px)', {
|
||||
axisX: {
|
||||
labelInterpolationFnc: function(value, index) {
|
||||
return index % 4 === 0 ? 'W' + value : null;
|
||||
}
|
||||
}
|
||||
}]
|
||||
];
|
||||
|
||||
new Chartist.Line('#scatter-diagram', data, options, responsiveOptions);
|
||||
}
|
||||
|
||||
var simpleLineChart = function(){
|
||||
//Simple line chart
|
||||
new Chartist.Line('#simple-line-chart', {
|
||||
labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'],
|
||||
series: [
|
||||
[12, 9, 7, 8, 5],
|
||||
[2, 1, 3.5, 7, 3],
|
||||
[1, 3, 4, 5, 6]
|
||||
]
|
||||
}, {
|
||||
fullWidth: true,
|
||||
chartPadding: {
|
||||
right: 40
|
||||
},
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
});
|
||||
|
||||
}
|
||||
var lineTooltipsChart = function(){
|
||||
//Line chart with tooltips
|
||||
|
||||
new Chartist.Line('#line-chart-tooltips', {
|
||||
labels: ['1', '2', '3', '4', '5', '6'],
|
||||
series: [
|
||||
{
|
||||
name: 'Fibonacci sequence',
|
||||
data: [1, 2, 3, 5, 8, 13]
|
||||
},
|
||||
{
|
||||
name: 'Golden section',
|
||||
data: [1, 1.618, 2.618, 4.236, 6.854, 11.09]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
}
|
||||
);
|
||||
|
||||
var $chart = $('#line-chart-tooltips');
|
||||
|
||||
var $toolTip = $chart
|
||||
.append('<div class="tooltip"></div>')
|
||||
.find('.tooltip')
|
||||
.hide();
|
||||
|
||||
$chart.on('mouseenter', '.ct-point', function() {
|
||||
var $point = $(this),
|
||||
value = $point.attr('ct:value'),
|
||||
seriesName = $point.parent().attr('ct:series-name');
|
||||
$toolTip.html(seriesName + '<br>' + value).show();
|
||||
});
|
||||
|
||||
$chart.on('mouseleave', '.ct-point', function() {
|
||||
$toolTip.hide();
|
||||
});
|
||||
|
||||
$chart.on('mousemove', function(event) {
|
||||
$toolTip.css({
|
||||
left: (event.offsetX || event.originalEvent.layerX) - $toolTip.width() / 2 - 10,
|
||||
top: (event.offsetY || event.originalEvent.layerY) - $toolTip.height() - 40
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
var withAreaChart = function(){
|
||||
//Line chart with area
|
||||
|
||||
new Chartist.Line('#chart-with-area', {
|
||||
labels: [1, 2, 3, 4, 5, 6, 7, 8],
|
||||
series: [
|
||||
[5, 9, 7, 8, 5, 3, 5, 4]
|
||||
]
|
||||
}, {
|
||||
low: 0,
|
||||
showArea: true,
|
||||
fullWidth: true,
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
});
|
||||
|
||||
}
|
||||
var biPolarLineChart = function(){
|
||||
//Bi-polar Line chart with area only
|
||||
|
||||
new Chartist.Line('#bi-polar-line', {
|
||||
labels: [1, 2, 3, 4, 5, 6, 7, 8],
|
||||
series: [
|
||||
[1, 2, 3, 1, -2, 0, 1, 0],
|
||||
[-2, -1, -2, -1, -2.5, -1, -2, -1],
|
||||
[0, 0, 0, 1, 2, 2.5, 2, 1],
|
||||
[2.5, 2, 1, 0.5, 1, 0.5, -1, -2.5]
|
||||
]
|
||||
}, {
|
||||
high: 3,
|
||||
low: -3,
|
||||
showArea: true,
|
||||
showLine: false,
|
||||
showPoint: false,
|
||||
fullWidth: true,
|
||||
axisX: {
|
||||
showLabel: false,
|
||||
showGrid: false
|
||||
},
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
});
|
||||
|
||||
}
|
||||
var svgAnimationChart = function(){
|
||||
//SVG Path animation
|
||||
|
||||
var chart = new Chartist.Line('#svg-animation', {
|
||||
labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
|
||||
series: [
|
||||
[1, 5, 2, 5, 4, 3],
|
||||
[2, 3, 4, 8, 1, 2],
|
||||
[5, 4, 3, 2, 1, 0.5]
|
||||
]
|
||||
}, {
|
||||
low: 0,
|
||||
showArea: true,
|
||||
showPoint: false,
|
||||
//fullWidth: true
|
||||
});
|
||||
|
||||
chart.on('draw', function(data) {
|
||||
if(data.type === 'line' || data.type === 'area') {
|
||||
data.element.animate({
|
||||
d: {
|
||||
begin: 2000 * data.index,
|
||||
dur: 2000,
|
||||
from: data.path.clone().scale(1, 0).translate(0, data.chartRect.height()).stringify(),
|
||||
to: data.path.clone().stringify(),
|
||||
easing: Chartist.Svg.Easing.easeOutQuint
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
var lineSmoothingChart = function(){
|
||||
//Line Interpolation / Smoothing
|
||||
|
||||
var chart = new Chartist.Line('#line-smoothing', {
|
||||
labels: [1, 2, 3, 4, 5],
|
||||
series: [
|
||||
[1, 5, 10, 0, 1],
|
||||
[10, 15, 0, 1, 2]
|
||||
]
|
||||
}, {
|
||||
// Remove this configuration to see that chart rendered with cardinal spline interpolation
|
||||
// Sometimes, on large jumps in data values, it's better to use simple smoothing.
|
||||
lineSmooth: Chartist.Interpolation.simple({
|
||||
divisor: 2
|
||||
}),
|
||||
fullWidth: true,
|
||||
chartPadding: {
|
||||
right: 20
|
||||
},
|
||||
low: 0
|
||||
});
|
||||
}
|
||||
var biPolarBarChart = function(){
|
||||
//Bi-polar bar chart
|
||||
var data = {
|
||||
labels: ['W1', 'W2', 'W3', 'W4', 'W5', 'W6', 'W7', 'W8', 'W9', 'W10'],
|
||||
series: [
|
||||
[1, 2, 4, 8, 6, -2, -1, -4, -6, -2]
|
||||
]
|
||||
};
|
||||
|
||||
var options = {
|
||||
high: 10,
|
||||
low: -10,
|
||||
axisX: {
|
||||
labelInterpolationFnc: function(value, index) {
|
||||
return index % 2 === 0 ? value : null;
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
};
|
||||
|
||||
new Chartist.Bar('#bi-polar-bar', data, options);
|
||||
|
||||
}
|
||||
var overlappingBarsChart = function(){
|
||||
//Overlapping bars on mobile
|
||||
var data = {
|
||||
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
|
||||
series: [
|
||||
[5, 4, 3, 7, 5, 10, 3, 4, 8, 10, 6, 8],
|
||||
[3, 2, 9, 5, 4, 6, 4, 6, 7, 8, 7, 4]
|
||||
]
|
||||
};
|
||||
var options = {
|
||||
seriesBarDistance: 10
|
||||
};
|
||||
var responsiveOptions = [
|
||||
['screen and (max-width: 640px)', {
|
||||
seriesBarDistance: 5,
|
||||
axisX: {
|
||||
labelInterpolationFnc: function (value) {
|
||||
return value[0];
|
||||
}
|
||||
}
|
||||
}]
|
||||
];
|
||||
new Chartist.Bar('#overlapping-bars', data, options, responsiveOptions);
|
||||
}
|
||||
var multiLineChart = function(){
|
||||
//Multi-line labels
|
||||
new Chartist.Bar('#multi-line-chart', {
|
||||
labels: ['First quarter of the year', 'Second quarter of the year', 'Third quarter of the year', 'Fourth quarter of the year'],
|
||||
series: [
|
||||
[60000, 40000, 80000, 70000],
|
||||
[40000, 30000, 70000, 65000],
|
||||
[8000, 3000, 10000, 6000]
|
||||
]
|
||||
}, {
|
||||
seriesBarDistance: 10,
|
||||
axisX: {
|
||||
offset: 60
|
||||
},
|
||||
axisY: {
|
||||
offset: 80,
|
||||
labelInterpolationFnc: function(value) {
|
||||
return value + ' CHF'
|
||||
},
|
||||
scaleMinSpace: 15
|
||||
},
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
});
|
||||
}
|
||||
var stackedBarChart = function(){
|
||||
//Stacked bar chart
|
||||
new Chartist.Bar('#stacked-bar-chart', {
|
||||
labels: ['Q1', 'Q2', 'Q3', 'Q4'],
|
||||
series: [
|
||||
[800000, 1200000, 1400000, 1300000],
|
||||
[200000, 400000, 500000, 300000],
|
||||
[160000, 290000, 410000, 600000]
|
||||
]
|
||||
}, {
|
||||
stackBars: true,
|
||||
axisY: {
|
||||
labelInterpolationFnc: function(value) {
|
||||
return (value / 1000) + 'k';
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
}).on('draw', function(data) {
|
||||
if(data.type === 'bar') {
|
||||
data.element.attr({
|
||||
style: 'stroke-width: 30px'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
var horizontalBarChart = function(){
|
||||
//Horizontal bar chart
|
||||
|
||||
new Chartist.Bar('#horizontal-bar-chart', {
|
||||
labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
|
||||
series: [
|
||||
[5, 4, 3, 7, 5, 10, 3],
|
||||
[3, 2, 9, 5, 4, 6, 4]
|
||||
]
|
||||
}, {
|
||||
seriesBarDistance: 10,
|
||||
reverseData: true,
|
||||
horizontalBars: true,
|
||||
axisY: {
|
||||
offset: 70
|
||||
},
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
});
|
||||
}
|
||||
var extremeChart = function(){
|
||||
// Extreme responsive configuration
|
||||
|
||||
new Chartist.Bar('#extreme-chart', {
|
||||
labels: ['Quarter 1', 'Quarter 2', 'Quarter 3', 'Quarter 4'],
|
||||
series: [
|
||||
[5, 4, 3, 7],
|
||||
[3, 2, 9, 5],
|
||||
[1, 5, 8, 4],
|
||||
[2, 3, 4, 6],
|
||||
[4, 1, 2, 1]
|
||||
]
|
||||
}, {
|
||||
// Default mobile configuration
|
||||
stackBars: true,
|
||||
axisX: {
|
||||
labelInterpolationFnc: function(value) {
|
||||
return value.split(/\s+/).map(function(word) {
|
||||
return word[0];
|
||||
}).join('');
|
||||
}
|
||||
},
|
||||
axisY: {
|
||||
offset: 20
|
||||
},
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
}, [
|
||||
// Options override for media > 400px
|
||||
['screen and (min-width: 400px)', {
|
||||
reverseData: true,
|
||||
horizontalBars: true,
|
||||
axisX: {
|
||||
labelInterpolationFnc: Chartist.noop
|
||||
},
|
||||
axisY: {
|
||||
offset: 60
|
||||
}
|
||||
}],
|
||||
// Options override for media > 800px
|
||||
['screen and (min-width: 800px)', {
|
||||
stackBars: false,
|
||||
seriesBarDistance: 10
|
||||
}],
|
||||
// Options override for media > 1000px
|
||||
['screen and (min-width: 1000px)', {
|
||||
reverseData: false,
|
||||
horizontalBars: false,
|
||||
seriesBarDistance: 15
|
||||
}]
|
||||
]);
|
||||
}
|
||||
var labelPlacementChart = function(){
|
||||
//Label placement
|
||||
|
||||
new Chartist.Bar('#label-placement-chart', {
|
||||
labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
|
||||
series: [
|
||||
[5, 4, 3, 7, 5, 10, 3],
|
||||
[3, 2, 9, 5, 4, 6, 4]
|
||||
]
|
||||
}, {
|
||||
axisX: {
|
||||
// On the x-axis start means top and end means bottom
|
||||
position: 'start'
|
||||
},
|
||||
axisY: {
|
||||
// On the y-axis start means left and end means right
|
||||
position: 'end'
|
||||
},
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
});
|
||||
}
|
||||
var animatingDonutChart = function(){
|
||||
//Animating a Donut with Svg.animate
|
||||
|
||||
var chart = new Chartist.Pie('#animating-donut', {
|
||||
series: [10, 20, 50, 20, 5, 50, 15],
|
||||
labels: [1, 2, 3, 4, 5, 6, 7]
|
||||
}, {
|
||||
donut: true,
|
||||
showLabel: false,
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
});
|
||||
|
||||
chart.on('draw', function(data) {
|
||||
if(data.type === 'slice') {
|
||||
// Get the total path length in order to use for dash array animation
|
||||
var pathLength = data.element._node.getTotalLength();
|
||||
|
||||
// Set a dasharray that matches the path length as prerequisite to animate dashoffset
|
||||
data.element.attr({
|
||||
'stroke-dasharray': pathLength + 'px ' + pathLength + 'px'
|
||||
});
|
||||
|
||||
// Create animation definition while also assigning an ID to the animation for later sync usage
|
||||
var animationDefinition = {
|
||||
'stroke-dashoffset': {
|
||||
id: 'anim' + data.index,
|
||||
dur: 1000,
|
||||
from: -pathLength + 'px',
|
||||
to: '0px',
|
||||
easing: Chartist.Svg.Easing.easeOutQuint,
|
||||
// We need to use `fill: 'freeze'` otherwise our animation will fall back to initial (not visible)
|
||||
fill: 'freeze'
|
||||
}
|
||||
};
|
||||
|
||||
// If this was not the first slice, we need to time the animation so that it uses the end sync event of the previous animation
|
||||
if(data.index !== 0) {
|
||||
animationDefinition['stroke-dashoffset'].begin = 'anim' + (data.index - 1) + '.end';
|
||||
}
|
||||
|
||||
// We need to set an initial value before the animation starts as we are not in guided mode which would do that for us
|
||||
data.element.attr({
|
||||
'stroke-dashoffset': -pathLength + 'px'
|
||||
});
|
||||
|
||||
// We can't use guided mode as the animations need to rely on setting begin manually
|
||||
// See http://gionkunz.github.io/chartist-js/api-documentation.html#chartistsvg-function-animate
|
||||
data.element.animate(animationDefinition, false);
|
||||
}
|
||||
});
|
||||
|
||||
// For the sake of the example we update the chart every time it's created with a delay of 8 seconds
|
||||
chart.on('created', function() {
|
||||
if(window.__anim21278907124) {
|
||||
clearTimeout(window.__anim21278907124);
|
||||
window.__anim21278907124 = null;
|
||||
}
|
||||
window.__anim21278907124 = setTimeout(chart.update.bind(chart), 10000);
|
||||
});
|
||||
|
||||
}
|
||||
var simplePieChart = function(){
|
||||
//Simple pie chart
|
||||
|
||||
var data1 = {
|
||||
series: [5, 3, 4]
|
||||
};
|
||||
|
||||
var sum = function(a, b) { return a + b };
|
||||
|
||||
new Chartist.Pie('#simple-pie', data1, {
|
||||
labelInterpolationFnc: function(value) {
|
||||
return Math.round(value / data1.series.reduce(sum) * 100) + '%';
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
var pieChart = function(){
|
||||
//Pie chart with custom labels
|
||||
|
||||
var data = {
|
||||
labels: ['35%', '55%', '10%'],
|
||||
series: [20, 15, 40]
|
||||
};
|
||||
|
||||
var options = {
|
||||
labelInterpolationFnc: function(value) {
|
||||
return value[0]
|
||||
}
|
||||
};
|
||||
|
||||
var responsiveOptions = [
|
||||
['screen and (min-width: 640px)', {
|
||||
chartPadding: 30,
|
||||
donut: true,
|
||||
labelOffset: 100,
|
||||
donutWidth: 60,
|
||||
labelDirection: 'explode',
|
||||
labelInterpolationFnc: function(value) {
|
||||
return value;
|
||||
}
|
||||
}],
|
||||
['screen and (min-width: 1024px)', {
|
||||
labelOffset: 60,
|
||||
chartPadding: 20
|
||||
}]
|
||||
];
|
||||
|
||||
new Chartist.Pie('#pie-chart', data, options, responsiveOptions);
|
||||
|
||||
}
|
||||
var gaugeChart = function(){
|
||||
//Gauge chart
|
||||
|
||||
new Chartist.Pie('#gauge-chart', {
|
||||
series: [20, 10, 30, 40]
|
||||
}, {
|
||||
donut: true,
|
||||
donutWidth: 60,
|
||||
startAngle: 270,
|
||||
total: 200,
|
||||
showLabel: false,
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
});
|
||||
}
|
||||
var differentSeriesChart = function(){
|
||||
// Different configuration for different series
|
||||
|
||||
var chart = new Chartist.Line('#different-series', {
|
||||
labels: ['1', '2', '3', '4', '5', '6', '7', '8'],
|
||||
// Naming the series with the series object array notation
|
||||
series: [{
|
||||
name: 'series-1',
|
||||
data: [5, 2, -4, 2, 0, -2, 5, -3]
|
||||
}, {
|
||||
name: 'series-2',
|
||||
data: [4, 3, 5, 3, 1, 3, 6, 4]
|
||||
}, {
|
||||
name: 'series-3',
|
||||
data: [2, 4, 3, 1, 4, 5, 3, 2]
|
||||
}]
|
||||
}, {
|
||||
fullWidth: true,
|
||||
// Within the series options you can use the series names
|
||||
// to specify configuration that will only be used for the
|
||||
// specific series.
|
||||
series: {
|
||||
'series-1': {
|
||||
lineSmooth: Chartist.Interpolation.step()
|
||||
},
|
||||
'series-2': {
|
||||
lineSmooth: Chartist.Interpolation.simple(),
|
||||
showArea: true
|
||||
},
|
||||
'series-3': {
|
||||
showPoint: false
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
}, [
|
||||
// You can even use responsive configuration overrides to
|
||||
// customize your series configuration even further!
|
||||
['screen and (max-width: 320px)', {
|
||||
series: {
|
||||
'series-1': {
|
||||
lineSmooth: Chartist.Interpolation.none()
|
||||
},
|
||||
'series-2': {
|
||||
lineSmooth: Chartist.Interpolation.none(),
|
||||
showArea: false
|
||||
},
|
||||
'series-3': {
|
||||
lineSmooth: Chartist.Interpolation.none(),
|
||||
showPoint: true
|
||||
}
|
||||
}
|
||||
}]
|
||||
]);
|
||||
|
||||
}
|
||||
var svgDotAnimationChart = function(){
|
||||
//SVG Animations chart
|
||||
|
||||
var chart = new Chartist.Line('#svg-dot-animation', {
|
||||
labels: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12'],
|
||||
series: [
|
||||
[12, 4, 2, 8, 5, 4, 6, 2, 3, 3, 4, 6],
|
||||
[4, 8, 9, 3, 7, 2, 10, 5, 8, 1, 7, 10]
|
||||
]
|
||||
}, {
|
||||
low: 0,
|
||||
showLine: false,
|
||||
axisX: {
|
||||
showLabel: false,
|
||||
offset: 0
|
||||
},
|
||||
axisY: {
|
||||
showLabel: false,
|
||||
offset: 0
|
||||
},
|
||||
plugins: [
|
||||
Chartist.plugins.tooltip()
|
||||
]
|
||||
});
|
||||
|
||||
// Let's put a sequence number aside so we can use it in the event callbacks
|
||||
var seq = 0;
|
||||
|
||||
// Once the chart is fully created we reset the sequence
|
||||
chart.on('created', function() {
|
||||
seq = 0;
|
||||
});
|
||||
|
||||
// On each drawn element by Chartist we use the Chartist.Svg API to trigger SMIL animations
|
||||
chart.on('draw', function(data) {
|
||||
if(data.type === 'point') {
|
||||
// If the drawn element is a line we do a simple opacity fade in. This could also be achieved using CSS3 animations.
|
||||
data.element.animate({
|
||||
opacity: {
|
||||
// The delay when we like to start the animation
|
||||
begin: seq++ * 80,
|
||||
// Duration of the animation
|
||||
dur: 500,
|
||||
// The value where the animation should start
|
||||
from: 0,
|
||||
// The value where it should end
|
||||
to: 1
|
||||
},
|
||||
x1: {
|
||||
begin: seq++ * 80,
|
||||
dur: 500,
|
||||
from: data.x - 100,
|
||||
to: data.x,
|
||||
// You can specify an easing function name or use easing functions from Chartist.Svg.Easing directly
|
||||
easing: Chartist.Svg.Easing.easeOutQuart
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// For the sake of the example we update the chart every time it's created with a delay of 8 seconds
|
||||
chart.on('created', function() {
|
||||
if(window.__anim0987432598723) {
|
||||
clearTimeout(window.__anim0987432598723);
|
||||
window.__anim0987432598723 = null;
|
||||
}
|
||||
window.__anim0987432598723 = setTimeout(chart.update.bind(chart), 8000);
|
||||
});
|
||||
}
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
},
|
||||
|
||||
|
||||
load:function(){
|
||||
setChartWidth();
|
||||
lineAnimatedChart();
|
||||
scatterChart();
|
||||
simpleLineChart();
|
||||
lineTooltipsChart();
|
||||
withAreaChart();
|
||||
biPolarLineChart();
|
||||
svgAnimationChart();
|
||||
lineSmoothingChart();
|
||||
biPolarBarChart();
|
||||
overlappingBarsChart();
|
||||
multiLineChart();
|
||||
stackedBarChart();
|
||||
horizontalBarChart();
|
||||
extremeChart();
|
||||
labelPlacementChart();
|
||||
animatingDonutChart();
|
||||
simplePieChart();
|
||||
pieChart();
|
||||
gaugeChart();
|
||||
differentSeriesChart();
|
||||
svgDotAnimationChart();
|
||||
},
|
||||
|
||||
resize:function(){
|
||||
setChartWidth();
|
||||
lineAnimatedChart();
|
||||
scatterChart();
|
||||
simpleLineChart();
|
||||
lineTooltipsChart();
|
||||
withAreaChart();
|
||||
biPolarLineChart();
|
||||
svgAnimationChart();
|
||||
lineSmoothingChart();
|
||||
biPolarBarChart();
|
||||
overlappingBarsChart();
|
||||
multiLineChart();
|
||||
stackedBarChart();
|
||||
horizontalBarChart();
|
||||
extremeChart();
|
||||
labelPlacementChart();
|
||||
animatingDonutChart();
|
||||
simplePieChart();
|
||||
pieChart();
|
||||
gaugeChart();
|
||||
differentSeriesChart();
|
||||
svgDotAnimationChart();
|
||||
}
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
jQuery(document).ready(function(){
|
||||
});
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
setTimeout(function(){
|
||||
dlabChartlist.resize();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
jQuery(window).on('resize',function(){
|
||||
setTimeout(function(){
|
||||
dlabChartlist.resize();
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
875
public/js/plugins-init/chartjs-init.js
Normal file
875
public/js/plugins-init/chartjs-init.js
Normal file
@@ -0,0 +1,875 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
|
||||
/* function draw() {
|
||||
|
||||
} */
|
||||
|
||||
var dlabSparkLine = function(){
|
||||
//let draw = Chart.controllers.line.__super__.draw; //draw shadow
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
var barChart1 = function(){
|
||||
if(jQuery('#barChart_1').length > 0 ){
|
||||
const barChart_1 = document.getElementById("barChart_1").getContext('2d');
|
||||
|
||||
barChart_1.height = 100;
|
||||
|
||||
new Chart(barChart_1, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul"],
|
||||
datasets: [
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [65, 59, 80, 81, 56, 55, 40],
|
||||
borderColor: 'rgba(249, 58, 11, 1)',
|
||||
borderWidth: "0",
|
||||
barPercentage: 0.5,
|
||||
backgroundColor: 'rgba(249, 58, 11, 1)'
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
scales: {
|
||||
y: {
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
var barChart2 = function(){
|
||||
if(jQuery('#barChart_2').length > 0 ){
|
||||
|
||||
//gradient bar chart
|
||||
const barChart_2 = document.getElementById("barChart_2").getContext('2d');
|
||||
//generate gradient
|
||||
const barChart_2gradientStroke = barChart_2.createLinearGradient(0, 0, 0, 250);
|
||||
barChart_2gradientStroke.addColorStop(0, "rgba(249, 58, 11, 1)");
|
||||
barChart_2gradientStroke.addColorStop(1, "rgba(249, 58, 11, 0.5)");
|
||||
|
||||
barChart_2.height = 100;
|
||||
|
||||
new Chart(barChart_2, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul"],
|
||||
datasets: [
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [65, 59, 80, 81, 56, 55, 40],
|
||||
borderColor: barChart_2gradientStroke,
|
||||
borderWidth: "0",
|
||||
barPercentage: 0.5,
|
||||
backgroundColor: barChart_2gradientStroke,
|
||||
hoverBackgroundColor: barChart_2gradientStroke
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
scales: {
|
||||
y: {
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var barChart3 = function(){
|
||||
//stalked bar chart
|
||||
if(jQuery('#barChart_3').length > 0 ){
|
||||
const barChart_3 = document.getElementById("barChart_3").getContext('2d');
|
||||
//generate gradient
|
||||
const barChart_3gradientStroke = barChart_3.createLinearGradient(50, 100, 50, 50);
|
||||
barChart_3gradientStroke.addColorStop(0, "rgba(249, 58, 11, 1)");
|
||||
barChart_3gradientStroke.addColorStop(1, "rgba(249, 58, 11, 0.5)");
|
||||
|
||||
const barChart_3gradientStroke2 = barChart_3.createLinearGradient(50, 100, 50, 50);
|
||||
barChart_3gradientStroke2.addColorStop(0, "rgba(98, 126, 234, 1)");
|
||||
barChart_3gradientStroke2.addColorStop(1, "rgba(98, 126, 234, 1)");
|
||||
|
||||
const barChart_3gradientStroke3 = barChart_3.createLinearGradient(50, 100, 50, 50);
|
||||
barChart_3gradientStroke3.addColorStop(0, "rgba(238, 60, 60, 1)");
|
||||
barChart_3gradientStroke3.addColorStop(1, "rgba(238, 60, 60, 1)");
|
||||
|
||||
barChart_3.height = 100;
|
||||
|
||||
let barChartData = {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: ['Mon', 'Tue', 'Wed', 'Thur', 'Fri', 'Sat', 'Sun'],
|
||||
datasets: [{
|
||||
label: 'Red',
|
||||
backgroundColor: barChart_3gradientStroke,
|
||||
hoverBackgroundColor: barChart_3gradientStroke,
|
||||
data: [
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12'
|
||||
]
|
||||
}, {
|
||||
label: 'Green',
|
||||
backgroundColor: barChart_3gradientStroke2,
|
||||
hoverBackgroundColor: barChart_3gradientStroke2,
|
||||
data: [
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12'
|
||||
]
|
||||
}, {
|
||||
label: 'Blue',
|
||||
backgroundColor: barChart_3gradientStroke3,
|
||||
hoverBackgroundColor: barChart_3gradientStroke3,
|
||||
data: [
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12',
|
||||
'12'
|
||||
]
|
||||
}]
|
||||
|
||||
};
|
||||
|
||||
new Chart(barChart_3, {
|
||||
type: 'bar',
|
||||
data: barChartData,
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: false
|
||||
},
|
||||
tooltips: {
|
||||
mode: 'index',
|
||||
intersect: false
|
||||
},
|
||||
responsive: true,
|
||||
scales: {
|
||||
x: {
|
||||
stacked: true,
|
||||
},
|
||||
y: {
|
||||
stacked: true
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
var lineChart1 = function(){
|
||||
|
||||
|
||||
if(jQuery('#lineChart_1').length > 0 ){
|
||||
|
||||
|
||||
//basic line chart
|
||||
const lineChart_1 = document.getElementById("lineChart_1").getContext('2d');
|
||||
|
||||
// Chart.controllers.line = Chart.controllers.line.extend({
|
||||
// draw: function () {
|
||||
// draw.apply(this, arguments);
|
||||
// let nk = this.chart.chart.ctx;
|
||||
// let _stroke = nk.stroke;
|
||||
// nk.stroke = function () {
|
||||
// nk.save();
|
||||
// nk.shadowColor = 'rgba(255, 0, 0, .2)';
|
||||
// nk.shadowBlur = 10;
|
||||
// nk.shadowOffsetX = 0;
|
||||
// nk.shadowOffsetY = 10;
|
||||
// _stroke.apply(this, arguments)
|
||||
// nk.restore();
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
|
||||
lineChart_1.height = 100;
|
||||
|
||||
new Chart(lineChart_1, {
|
||||
type: 'line',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: ["Jan", "Febr", "Mar", "Apr", "May", "Jun", "Jul"],
|
||||
datasets: [
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [25, 20, 60, 41, 66, 45, 80],
|
||||
borderColor: 'rgba(249, 58, 11, 1)',
|
||||
borderWidth: "2",
|
||||
backgroundColor: 'transparent',
|
||||
pointBackgroundColor: 'rgba(249, 58, 11, 1)',
|
||||
tension: 0.5,
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
scales: {
|
||||
y: {
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
max: 100,
|
||||
min: 0,
|
||||
stepSize: 20,
|
||||
padding: 10
|
||||
}
|
||||
},
|
||||
x: {
|
||||
ticks: {
|
||||
padding: 5
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
var lineChart2 = function(){
|
||||
//gradient line chart
|
||||
if(jQuery('#lineChart_2').length > 0 ){
|
||||
|
||||
const lineChart_2 = document.getElementById("lineChart_2").getContext('2d');
|
||||
//generate gradient
|
||||
const lineChart_2gradientStroke = lineChart_2.createLinearGradient(500, 0, 100, 0);
|
||||
lineChart_2gradientStroke.addColorStop(0, "rgba(249, 58, 11, 1)");
|
||||
lineChart_2gradientStroke.addColorStop(1, "rgba(249, 58, 11, 0.5)");
|
||||
|
||||
// Chart.controllers.line = Chart.controllers.line.extend({
|
||||
// draw: function () {
|
||||
// draw.apply(this, arguments);
|
||||
// let nk = this.chart.chart.ctx;
|
||||
// let _stroke = nk.stroke;
|
||||
// nk.stroke = function () {
|
||||
// nk.save();
|
||||
// nk.shadowColor = 'rgba(0, 0, 128, .2)';
|
||||
// nk.shadowBlur = 10;
|
||||
// nk.shadowOffsetX = 0;
|
||||
// nk.shadowOffsetY = 10;
|
||||
// _stroke.apply(this, arguments)
|
||||
// nk.restore();
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
|
||||
lineChart_2.height = 100;
|
||||
|
||||
new Chart(lineChart_2, {
|
||||
type: 'line',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul"],
|
||||
datasets: [
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [25, 20, 60, 41, 66, 45, 80],
|
||||
borderColor: lineChart_2gradientStroke,
|
||||
borderWidth: "2",
|
||||
backgroundColor: 'transparent',
|
||||
pointBackgroundColor: 'rgba(249, 58, 11, 0.5)',
|
||||
tension: 0.5,
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
scales: {
|
||||
y: {
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
max: 100,
|
||||
min: 0,
|
||||
stepSize: 20,
|
||||
padding: 10
|
||||
}
|
||||
},
|
||||
x: {
|
||||
ticks: {
|
||||
padding: 5
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
var lineChart3 = function(){
|
||||
//dual line chart
|
||||
if(jQuery('#lineChart_3').length > 0 ){
|
||||
const lineChart_3 = document.getElementById("lineChart_3").getContext('2d');
|
||||
//generate gradient
|
||||
const lineChart_3gradientStroke1 = lineChart_3.createLinearGradient(500, 0, 100, 0);
|
||||
lineChart_3gradientStroke1.addColorStop(0, "rgba(249, 58, 11, 1)");
|
||||
lineChart_3gradientStroke1.addColorStop(1, "rgba(249, 58, 11, 0.5)");
|
||||
|
||||
const lineChart_3gradientStroke2 = lineChart_3.createLinearGradient(500, 0, 100, 0);
|
||||
lineChart_3gradientStroke2.addColorStop(0, "rgba(255, 92, 0, 1)");
|
||||
lineChart_3gradientStroke2.addColorStop(1, "rgba(255, 92, 0, 1)");
|
||||
|
||||
// Chart.controllers.line = Chart.controllers.line.extend({
|
||||
// draw: function () {
|
||||
// draw.apply(this, arguments);
|
||||
// let nk = this.chart.chart.ctx;
|
||||
// let _stroke = nk.stroke;
|
||||
// nk.stroke = function () {
|
||||
// nk.save();
|
||||
// nk.shadowColor = 'rgba(0, 0, 0, 0)';
|
||||
// nk.shadowBlur = 10;
|
||||
// nk.shadowOffsetX = 0;
|
||||
// nk.shadowOffsetY = 10;
|
||||
// _stroke.apply(this, arguments)
|
||||
// nk.restore();
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
|
||||
lineChart_3.height = 100;
|
||||
|
||||
new Chart(lineChart_3, {
|
||||
type: 'line',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul"],
|
||||
datasets: [
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [25, 20, 60, 41, 66, 45, 80],
|
||||
borderColor: lineChart_3gradientStroke1,
|
||||
borderWidth: "2",
|
||||
backgroundColor: 'transparent',
|
||||
pointBackgroundColor: 'rgba(249, 58, 11, 0.5)',
|
||||
tension: 0.5,
|
||||
}, {
|
||||
label: "My First dataset",
|
||||
data: [5, 20, 15, 41, 35, 65, 80],
|
||||
borderColor: lineChart_3gradientStroke2,
|
||||
borderWidth: "2",
|
||||
backgroundColor: 'transparent',
|
||||
pointBackgroundColor: 'rgba(254, 176, 25, 1)',
|
||||
tension: 0.5,
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
scales: {
|
||||
y: {
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
max: 100,
|
||||
min: 0,
|
||||
stepSize: 20,
|
||||
padding: 10
|
||||
}
|
||||
},
|
||||
x: {
|
||||
ticks: {
|
||||
padding: 5
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
var lineChart03 = function(){
|
||||
//dual line chart
|
||||
if(jQuery('#lineChart_3Kk').length > 0 ){
|
||||
const lineChart_3Kk = document.getElementById("lineChart_3Kk").getContext('2d');
|
||||
//generate gradient
|
||||
|
||||
Chart.controllers.line = Chart.controllers.line.extend({
|
||||
draw: function () {
|
||||
draw.apply(this, arguments);
|
||||
let nk = this.chart.chart.ctx;
|
||||
let _stroke = nk.stroke;
|
||||
nk.stroke = function () {
|
||||
nk.save();
|
||||
nk.shadowColor = 'rgba(0, 0, 0, 0)';
|
||||
nk.shadowBlur = 10;
|
||||
nk.shadowOffsetX = 0;
|
||||
nk.shadowOffsetY = 10;
|
||||
_stroke.apply(this, arguments)
|
||||
nk.restore();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
lineChart_3Kk.height = 100;
|
||||
|
||||
new Chart(lineChart_3Kk, {
|
||||
type: 'line',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul"],
|
||||
datasets: [
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [90, 60, 80, 50, 60, 55, 80],
|
||||
borderColor: 'rgba(58,122,254,1)',
|
||||
borderWidth: "3",
|
||||
backgroundColor: 'rgba(0,0,0,0)',
|
||||
pointBackgroundColor: 'rgba(0, 0, 0, 0)',
|
||||
tension: 0.5,
|
||||
fill:true,
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
elements: {
|
||||
point:{
|
||||
radius: 0
|
||||
}
|
||||
},
|
||||
scales: {
|
||||
y: {
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
max: 100,
|
||||
min: 0,
|
||||
stepSize: 20,
|
||||
padding: 10
|
||||
},
|
||||
borderWidth:3,
|
||||
display:false,
|
||||
lineTension:0.4,
|
||||
},
|
||||
x: {
|
||||
ticks: {
|
||||
padding: 5
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
var areaChart1 = function(){
|
||||
//basic area chart
|
||||
if(jQuery('#areaChart_1').length > 0 ){
|
||||
const areaChart_1 = document.getElementById("areaChart_1").getContext('2d');
|
||||
|
||||
areaChart_1.height = 100;
|
||||
|
||||
new Chart(areaChart_1, {
|
||||
type: 'line',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul"],
|
||||
datasets: [
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [25, 20, 60, 41, 66, 45, 80],
|
||||
borderColor: 'rgba(0, 0, 1128, .3)',
|
||||
borderWidth: "1",
|
||||
backgroundColor: 'rgba(249, 58, 11, .5)',
|
||||
pointBackgroundColor: 'rgba(0, 0, 1128, .3)',
|
||||
tension: 0.5,
|
||||
fill:true,
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
scales: {
|
||||
y: {
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
max: 100,
|
||||
min: 0,
|
||||
stepSize: 20,
|
||||
padding: 10
|
||||
}
|
||||
},
|
||||
x: {
|
||||
ticks: {
|
||||
padding: 5
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
var areaChart2 = function(){
|
||||
//gradient area chart
|
||||
if(jQuery('#areaChart_2').length > 0 ){
|
||||
const areaChart_2 = document.getElementById("areaChart_2").getContext('2d');
|
||||
//generate gradient
|
||||
const areaChart_2gradientStroke = areaChart_2.createLinearGradient(0, 1, 0, 500);
|
||||
areaChart_2gradientStroke.addColorStop(0, "rgba(238, 60, 60, 0.2)");
|
||||
areaChart_2gradientStroke.addColorStop(1, "rgba(238, 60, 60, 0)");
|
||||
|
||||
areaChart_2.height = 100;
|
||||
|
||||
new Chart(areaChart_2, {
|
||||
type: 'line',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul"],
|
||||
datasets: [
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [25, 20, 60, 41, 66, 45, 80],
|
||||
borderColor: "#ff2625",
|
||||
borderWidth: "4",
|
||||
backgroundColor: areaChart_2gradientStroke,
|
||||
tension: 0.5,
|
||||
fill:true,
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
scales: {
|
||||
y: {
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
max: 100,
|
||||
min: 0,
|
||||
stepSize: 20,
|
||||
padding: 5
|
||||
}
|
||||
},
|
||||
x: {
|
||||
ticks: {
|
||||
padding: 5
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var areaChart3 = function(){
|
||||
//gradient area chart
|
||||
if(jQuery('#areaChart_3').length > 0 ){
|
||||
const areaChart_3 = document.getElementById("areaChart_3").getContext('2d');
|
||||
|
||||
areaChart_3.height = 100;
|
||||
|
||||
new Chart(areaChart_3, {
|
||||
type: 'line',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul"],
|
||||
datasets: [
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [25, 20, 60, 41, 66, 45, 80],
|
||||
borderColor: 'rgb(249, 58, 11)',
|
||||
borderWidth: "1",
|
||||
backgroundColor: 'rgba(249, 58, 11, .5)',
|
||||
tension: 0.5,
|
||||
fill:true,
|
||||
},
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [5, 25, 20, 41, 36, 75, 70],
|
||||
borderColor: 'rgb(255, 92, 0)',
|
||||
borderWidth: "1",
|
||||
backgroundColor: 'rgba(255, 92, 0, .5)',
|
||||
tension: 0.5,
|
||||
fill:true,
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
|
||||
scales: {
|
||||
y: {
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
max: 100,
|
||||
min: 0,
|
||||
stepSize: 20,
|
||||
padding: 10
|
||||
}
|
||||
},
|
||||
x: {
|
||||
ticks: {
|
||||
padding: 5
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var radarChart = function(){
|
||||
if(jQuery('#radar_chart').length > 0 ){
|
||||
//radar chart
|
||||
const radar_chart = document.getElementById("radar_chart").getContext('2d');
|
||||
|
||||
const radar_chartgradientStroke1 = radar_chart.createLinearGradient(500, 0, 100, 0);
|
||||
radar_chartgradientStroke1.addColorStop(0, "rgba(54, 185, 216, .5)");
|
||||
radar_chartgradientStroke1.addColorStop(1, "rgba(75, 255, 162, .5)");
|
||||
|
||||
const radar_chartgradientStroke2 = radar_chart.createLinearGradient(500, 0, 100, 0);
|
||||
radar_chartgradientStroke2.addColorStop(0, "rgba(68, 0, 235, .5");
|
||||
radar_chartgradientStroke2.addColorStop(1, "rgba(68, 236, 245, .5");
|
||||
|
||||
// radar_chart.height = 100;
|
||||
new Chart(radar_chart, {
|
||||
type: 'radar',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
labels: [["Eating", "Dinner"], ["Drinking", "Water"], "Sleeping", ["Designing", "Graphics"], "Coding", "Cycling", "Running"],
|
||||
datasets: [
|
||||
{
|
||||
label: "My First dataset",
|
||||
data: [65, 59, 66, 45, 56, 55, 40],
|
||||
borderColor: '#f21780',
|
||||
borderWidth: "1",
|
||||
backgroundColor: radar_chartgradientStroke2
|
||||
},
|
||||
{
|
||||
label: "My Second dataset",
|
||||
data: [28, 12, 40, 19, 63, 27, 87],
|
||||
borderColor: '#f21780',
|
||||
borderWidth: "1",
|
||||
backgroundColor: radar_chartgradientStroke1
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
maintainAspectRatio: false,
|
||||
scale: {
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
var pieChart = function(){
|
||||
//pie chart
|
||||
if(jQuery('#pie_chart').length > 0 ){
|
||||
//pie chart
|
||||
const pie_chart = document.getElementById("pie_chart").getContext('2d');
|
||||
// pie_chart.height = 100;
|
||||
new Chart(pie_chart, {
|
||||
type: 'pie',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
datasets: [{
|
||||
data: [45, 25, 20, 10],
|
||||
borderWidth: 0,
|
||||
backgroundColor: [
|
||||
"rgba(249, 58, 11, .9)",
|
||||
"rgba(249, 58, 11, .7)",
|
||||
"rgba(249, 58, 11, .5)",
|
||||
"rgba(0,0,0,0.07)"
|
||||
],
|
||||
hoverBackgroundColor: [
|
||||
"rgba(249, 58, 11, .9)",
|
||||
"rgba(249, 58, 11, .7)",
|
||||
"rgba(249, 58, 11, .5)",
|
||||
"rgba(0,0,0,0.07)"
|
||||
]
|
||||
|
||||
}],
|
||||
labels: [
|
||||
"one",
|
||||
"two",
|
||||
"three",
|
||||
"four"
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins:{
|
||||
legend: false,
|
||||
},
|
||||
legend: false,
|
||||
maintainAspectRatio: false
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
var doughnutChart = function(){
|
||||
if(jQuery('#doughnut_chart').length > 0 ){
|
||||
//doughut chart
|
||||
const doughnut_chart = document.getElementById("doughnut_chart").getContext('2d');
|
||||
// doughnut_chart.height = 100;
|
||||
new Chart(doughnut_chart, {
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
weight: 5,
|
||||
defaultFontFamily: 'Poppins',
|
||||
datasets: [{
|
||||
data: [45, 25, 20],
|
||||
borderWidth: 3,
|
||||
borderColor: "rgba(255,255,255,1)",
|
||||
backgroundColor: [
|
||||
"rgba(249, 58, 11, 1)",
|
||||
"rgba(98, 126, 234, 1)",
|
||||
"rgba(238, 60, 60, 1)"
|
||||
],
|
||||
hoverBackgroundColor: [
|
||||
"rgba(249, 58, 11, 0.9)",
|
||||
"rgba(98, 126, 234, .9)",
|
||||
"rgba(238, 60, 60, .9)"
|
||||
]
|
||||
|
||||
}],
|
||||
// labels: [
|
||||
// "green",
|
||||
// "green",
|
||||
// "green",
|
||||
// "green"
|
||||
// ]
|
||||
},
|
||||
options: {
|
||||
weight: 1,
|
||||
cutoutPercentage: 70,
|
||||
responsive: true,
|
||||
maintainAspectRatio: false
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
var polarChart = function(){
|
||||
if(jQuery('#polar_chart').length > 0 ){
|
||||
//polar chart
|
||||
const polar_chart = document.getElementById("polar_chart").getContext('2d');
|
||||
// polar_chart.height = 100;
|
||||
new Chart(polar_chart, {
|
||||
type: 'polarArea',
|
||||
data: {
|
||||
defaultFontFamily: 'Poppins',
|
||||
datasets: [{
|
||||
data: [15, 18, 9, 6, 19],
|
||||
borderWidth: 0,
|
||||
backgroundColor: [
|
||||
"rgba(249, 58, 11, 1)",
|
||||
"rgba(98, 126, 234, 1)",
|
||||
"rgba(238, 60, 60, 1)",
|
||||
"rgba(54, 147, 255, 1)",
|
||||
"rgba(255, 92, 0, 1)"
|
||||
]
|
||||
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
},
|
||||
|
||||
|
||||
load:function(){
|
||||
barChart1();
|
||||
barChart2();
|
||||
barChart3();
|
||||
lineChart1();
|
||||
lineChart2();
|
||||
lineChart3();
|
||||
lineChart03();
|
||||
areaChart1();
|
||||
areaChart2();
|
||||
areaChart3();
|
||||
radarChart();
|
||||
pieChart();
|
||||
doughnutChart();
|
||||
polarChart();
|
||||
},
|
||||
|
||||
resize:function(){
|
||||
// barChart1();
|
||||
// barChart2();
|
||||
// barChart3();
|
||||
// lineChart1();
|
||||
// lineChart2();
|
||||
// lineChart3();
|
||||
// lineChart03();
|
||||
// areaChart1();
|
||||
// areaChart2();
|
||||
// areaChart3();
|
||||
// radarChart();
|
||||
// pieChart();
|
||||
// doughnutChart();
|
||||
// polarChart();
|
||||
}
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
jQuery(document).ready(function(){
|
||||
});
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
dlabSparkLine.load();
|
||||
});
|
||||
|
||||
jQuery(window).on('resize',function(){
|
||||
//dlabSparkLine.resize();
|
||||
setTimeout(function(){ dlabSparkLine.resize(); }, 1000);
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
24
public/js/plugins-init/clock-picker-init.js
Normal file
24
public/js/plugins-init/clock-picker-init.js
Normal file
@@ -0,0 +1,24 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
// Clock pickers
|
||||
var input = $('#single-input').clockpicker({
|
||||
placement: 'bottom',
|
||||
align: 'left',
|
||||
autoclose: true,
|
||||
'default': 'now'
|
||||
});
|
||||
|
||||
$('.clockpicker').clockpicker({
|
||||
donetext: 'Done',
|
||||
}).find('input').change(function () {
|
||||
console.log(this.value);
|
||||
});
|
||||
|
||||
$('#check-minutes').click(function (e) {
|
||||
// Have to stop propagation here
|
||||
e.stopPropagation();
|
||||
input.clockpicker('show').clockpicker('toggleView', 'minutes');
|
||||
});
|
||||
|
||||
})(jQuery)
|
||||
12
public/js/plugins-init/color-picker-init.js
Normal file
12
public/js/plugins-init/color-picker-init.js
Normal file
@@ -0,0 +1,12 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
// Colorpicker
|
||||
$(".colorpicker").asColorPicker();
|
||||
$(".complex-colorpicker").asColorPicker({
|
||||
mode: 'complex'
|
||||
});
|
||||
$(".gradient-colorpicker").asColorPicker({
|
||||
mode: 'gradient'
|
||||
});
|
||||
})(jQuery);
|
||||
13
public/js/plugins-init/counter-init.js
Normal file
13
public/js/plugins-init/counter-init.js
Normal file
@@ -0,0 +1,13 @@
|
||||
(function ($) {
|
||||
"use strict"
|
||||
|
||||
/*******************
|
||||
Counter Up
|
||||
*******************/
|
||||
|
||||
$('.counter').counterUp({
|
||||
delay: 10,
|
||||
time: 1000
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
223
public/js/plugins-init/datatables.init.js
Normal file
223
public/js/plugins-init/datatables.init.js
Normal file
@@ -0,0 +1,223 @@
|
||||
let dataSet = [
|
||||
[ "Tiger Nixon", "System Architect", "Edinburgh", "5421", "2011/04/25", "$320,800" ],
|
||||
[ "Garrett Winters", "Accountant", "Tokyo", "8422", "2011/07/25", "$170,750" ],
|
||||
[ "Ashton Cox", "Junior Technical Author", "San Francisco", "1562", "2009/01/12", "$86,000" ],
|
||||
[ "Cedric Kelly", "Senior Javascript Developer", "Edinburgh", "6224", "2012/03/29", "$433,060" ],
|
||||
[ "Airi Satou", "Accountant", "Tokyo", "5407", "2008/11/28", "$162,700" ],
|
||||
[ "Brielle Williamson", "Integration Specialist", "New York", "4804", "2012/12/02", "$372,000" ],
|
||||
[ "Herrod Chandler", "Sales Assistant", "San Francisco", "9608", "2012/08/06", "$137,500" ],
|
||||
[ "Rhona Davidson", "Integration Specialist", "Tokyo", "6200", "2010/10/14", "$327,900" ],
|
||||
[ "Colleen Hurst", "Javascript Developer", "San Francisco", "2360", "2009/09/15", "$205,500" ],
|
||||
[ "Sonya Frost", "Software Engineer", "Edinburgh", "1667", "2008/12/13", "$103,600" ],
|
||||
[ "Jena Gaines", "Office Manager", "London", "3814", "2008/12/19", "$90,560" ],
|
||||
[ "Quinn Flynn", "Support Lead", "Edinburgh", "9497", "2013/03/03", "$342,000" ],
|
||||
[ "Charde Marshall", "Regional Director", "San Francisco", "6741", "2008/10/16", "$470,600" ],
|
||||
[ "Haley Kennedy", "Senior Marketing Designer", "London", "3597", "2012/12/18", "$313,500" ],
|
||||
[ "Tatyana Fitzpatrick", "Regional Director", "London", "1965", "2010/03/17", "$385,750" ],
|
||||
[ "Michael Silva", "Marketing Designer", "London", "1581", "2012/11/27", "$198,500" ],
|
||||
[ "Paul Byrd", "Chief Financial Officer (CFO)", "New York", "3059", "2010/06/09", "$725,000" ],
|
||||
[ "Gloria Little", "Systems Administrator", "New York", "1721", "2009/04/10", "$237,500" ],
|
||||
[ "Bradley Greer", "Software Engineer", "London", "2558", "2012/10/13", "$132,000" ],
|
||||
[ "Dai Rios", "Personnel Lead", "Edinburgh", "2290", "2012/09/26", "$217,500" ],
|
||||
[ "Jenette Caldwell", "Development Lead", "New York", "1937", "2011/09/03", "$345,000" ],
|
||||
[ "Yuri Berry", "Chief Marketing Officer (CMO)", "New York", "6154", "2009/06/25", "$675,000" ],
|
||||
[ "Caesar Vance", "Pre-Sales Support", "New York", "8330", "2011/12/12", "$106,450" ],
|
||||
[ "Doris Wilder", "Sales Assistant", "Sidney", "3023", "2010/09/20", "$85,600" ],
|
||||
[ "Angelica Ramos", "Chief Executive Officer (CEO)", "London", "5797", "2009/10/09", "$1,200,000" ],
|
||||
[ "Gavin Joyce", "Developer", "Edinburgh", "8822", "2010/12/22", "$92,575" ],
|
||||
[ "Jennifer Chang", "Regional Director", "Singapore", "9239", "2010/11/14", "$357,650" ],
|
||||
[ "Brenden Wagner", "Software Engineer", "San Francisco", "1314", "2011/06/07", "$206,850" ],
|
||||
[ "Fiona Green", "Chief Operating Officer (COO)", "San Francisco", "2947", "2010/03/11", "$850,000" ],
|
||||
[ "Shou Itou", "Regional Marketing", "Tokyo", "8899", "2011/08/14", "$163,000" ],
|
||||
[ "Michelle House", "Integration Specialist", "Sidney", "2769", "2011/06/02", "$95,400" ],
|
||||
[ "Suki Burks", "Developer", "London", "6832", "2009/10/22", "$114,500" ],
|
||||
[ "Prescott Bartlett", "Technical Author", "London", "3606", "2011/05/07", "$145,000" ],
|
||||
[ "Gavin Cortez", "Team Leader", "San Francisco", "2860", "2008/10/26", "$235,500" ],
|
||||
[ "Martena Mccray", "Post-Sales support", "Edinburgh", "8240", "2011/03/09", "$324,050" ],
|
||||
[ "Unity Butler", "Marketing Designer", "San Francisco", "5384", "2009/12/09", "$85,675" ]
|
||||
];
|
||||
|
||||
|
||||
|
||||
|
||||
(function($) {
|
||||
"use strict"
|
||||
//example 1
|
||||
var table = $('#example').DataTable({
|
||||
createdRow: function ( row, data, index ) {
|
||||
$(row).addClass('selected')
|
||||
} ,
|
||||
language: {
|
||||
paginate: {
|
||||
next: '<i class="fa fa-angle-double-right" aria-hidden="true"></i>',
|
||||
previous: '<i class="fa fa-angle-double-left" aria-hidden="true"></i>'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
table.on('click', 'tbody tr', function() {
|
||||
var $row = table.row(this).nodes().to$();
|
||||
var hasClass = $row.hasClass('selected');
|
||||
if (hasClass) {
|
||||
$row.removeClass('selected')
|
||||
} else {
|
||||
$row.addClass('selected')
|
||||
}
|
||||
})
|
||||
|
||||
table.rows().every(function() {
|
||||
this.nodes().to$().removeClass('selected')
|
||||
});
|
||||
|
||||
|
||||
|
||||
//example 2
|
||||
var table2 = $('#example2').DataTable( {
|
||||
createdRow: function ( row, data, index ) {
|
||||
$(row).addClass('selected')
|
||||
},
|
||||
|
||||
"scrollY": "42vh",
|
||||
"scrollCollapse": true,
|
||||
"paging": false
|
||||
});
|
||||
|
||||
table2.on('click', 'tbody tr', function() {
|
||||
var $row = table2.row(this).nodes().to$();
|
||||
var hasClass = $row.hasClass('selected');
|
||||
if (hasClass) {
|
||||
$row.removeClass('selected')
|
||||
} else {
|
||||
$row.addClass('selected')
|
||||
}
|
||||
})
|
||||
|
||||
table2.rows().every(function() {
|
||||
this.nodes().to$().removeClass('selected')
|
||||
});
|
||||
|
||||
// dataTable1
|
||||
var table = $('#dataTable1').DataTable({
|
||||
searching: false,
|
||||
paging:true,
|
||||
select: false,
|
||||
lengthChange:false ,
|
||||
|
||||
});
|
||||
// dataTable2
|
||||
var table = $('#dataTable2').DataTable({
|
||||
searching: false,
|
||||
paging:true,
|
||||
select: false,
|
||||
lengthChange:false ,
|
||||
|
||||
});
|
||||
// dataTable3
|
||||
var table = $('#dataTable3').DataTable({
|
||||
searching: false,
|
||||
paging:true,
|
||||
select: false,
|
||||
lengthChange:false ,
|
||||
|
||||
});
|
||||
// dataTable4
|
||||
var table = $('#dataTable4').DataTable({
|
||||
searching: false,
|
||||
paging:true,
|
||||
select: false,
|
||||
lengthChange:false,
|
||||
|
||||
});
|
||||
|
||||
// dataTable5
|
||||
var table = $('#example5').DataTable({
|
||||
searching: false,
|
||||
paging:true,
|
||||
select: false,
|
||||
info: true,
|
||||
lengthChange:false ,
|
||||
language: {
|
||||
paginate: {
|
||||
next: '<i class="fa fa-angle-double-right" aria-hidden="true"></i>',
|
||||
previous: '<i class="fa fa-angle-double-left" aria-hidden="true"></i>'
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// dataTable6
|
||||
var table = $('#example6').DataTable({
|
||||
searching: false,
|
||||
paging:true,
|
||||
select: false,
|
||||
info: false,
|
||||
lengthChange:false ,
|
||||
language: {
|
||||
paginate: {
|
||||
previous: "Previous",
|
||||
next: "Next"
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
// dataTable7
|
||||
var table = $('#example7').DataTable({
|
||||
searching: false,
|
||||
paging:true,
|
||||
select: false,
|
||||
info: true,
|
||||
lengthChange:false ,
|
||||
language: {
|
||||
paginate: {
|
||||
previous: "Previous",
|
||||
next: "Next"
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
// dataTable9
|
||||
|
||||
|
||||
var table = $('#responsiveTable').DataTable( {
|
||||
responsive: true,
|
||||
language: {
|
||||
paginate: {
|
||||
next: '<i class="fa fa-angle-double-right" aria-hidden="true"></i>',
|
||||
previous: '<i class="fa fa-angle-double-left" aria-hidden="true"></i>'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// table row
|
||||
var table = $('#dataTable1, #dataTable2, #dataTable3, #dataTable4, #example3, #example4').DataTable({
|
||||
language: {
|
||||
paginate: {
|
||||
next: '<i class="fa fa-angle-double-right" aria-hidden="true"></i>',
|
||||
previous: '<i class="fa fa-angle-double-left" aria-hidden="true"></i>'
|
||||
}
|
||||
}
|
||||
});
|
||||
$('#example tbody').on('click', 'tr', function () {
|
||||
var data = table.row( this ).data();
|
||||
});
|
||||
|
||||
// application table
|
||||
var table = $('#application-tbl1,#application-tbl2,#application-tbl3,#application-tbl4 ').DataTable({
|
||||
searching: false,
|
||||
lengthChange:false ,
|
||||
language: {
|
||||
paginate: {
|
||||
next: '<i class="fa fa-angle-double-right" aria-hidden="true"></i>',
|
||||
previous: '<i class="fa fa-angle-double-left" aria-hidden="true"></i>'
|
||||
}
|
||||
},
|
||||
'aoColumnDefs': [{
|
||||
'bSortable': false,
|
||||
'aTargets': [0,-1]
|
||||
}]
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
605
public/js/plugins-init/flot-init.js
Normal file
605
public/js/plugins-init/flot-init.js
Normal file
@@ -0,0 +1,605 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
|
||||
var dzChartlist = function(){
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
var flotBar1 = function(){
|
||||
$.plot("#flotBar1", [{
|
||||
data: [[0, 3], [2, 8], [4, 5], [6, 13], [8, 5], [10, 7], [12, 4], [14, 6]]
|
||||
}], {
|
||||
series: {
|
||||
bars: {
|
||||
show: true,
|
||||
lineWidth: 0,
|
||||
barWidth: 0.5,
|
||||
fillColor: '#F93A0B'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
borderWidth: 1,
|
||||
tickColor: 'transparent',
|
||||
borderColor: 'transparent'
|
||||
},
|
||||
yaxis: {
|
||||
tickLength:0,
|
||||
font: {
|
||||
fill: '#888',
|
||||
size: 10
|
||||
}
|
||||
},
|
||||
xaxis: {
|
||||
tickLength:0,
|
||||
font: {
|
||||
fill: '#888',
|
||||
size: 10
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var flotBar2 = function(){
|
||||
$.plot("#flotBar2", [{
|
||||
data: [[0, 3], [2, 8], [4, 5], [6, 13], [8, 5], [10, 7], [12, 8], [14, 10]],
|
||||
bars: {
|
||||
show: true,
|
||||
lineWidth: 0,
|
||||
barWidth:0.5,
|
||||
fillColor: '#F93A0B'
|
||||
}
|
||||
}, {
|
||||
data: [[1, 5], [3, 7], [5, 10], [7, 7], [9, 9], [11, 5], [13, 4], [15, 6]],
|
||||
bars: {
|
||||
show: true,
|
||||
lineWidth: 0,
|
||||
barWidth:0.5,
|
||||
fillColor: '#145650'
|
||||
}
|
||||
}],
|
||||
{
|
||||
grid: {
|
||||
borderWidth: 1,
|
||||
tickColor: 'transparent',
|
||||
borderColor: 'transparent'
|
||||
},
|
||||
yaxis: {
|
||||
tickLength:0,
|
||||
font: {
|
||||
fill: '#888',
|
||||
size: 10
|
||||
}
|
||||
},
|
||||
xaxis: {
|
||||
tickLength:0,
|
||||
font: {
|
||||
fill: '#888',
|
||||
size: 10
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var flotLine1 = function(){
|
||||
var newCust = [[0, 2], [1, 3], [2, 6], [3, 5], [4, 7], [5, 8], [6, 10]];
|
||||
var retCust = [[0, 1], [1, 2], [2, 5], [3, 3], [4, 5], [5, 6], [6, 9]];
|
||||
|
||||
var plot = $.plot($('#flotLine1'), [
|
||||
{
|
||||
data: newCust,
|
||||
label: 'New Customer',
|
||||
color: '#F93A0B'
|
||||
},
|
||||
{
|
||||
data: retCust,
|
||||
label: 'Returning Customer',
|
||||
color: '#145650'
|
||||
}
|
||||
],
|
||||
{
|
||||
series: {
|
||||
lines: {
|
||||
show: true,
|
||||
lineWidth: 1
|
||||
},
|
||||
shadowSize: 0
|
||||
},
|
||||
points: {
|
||||
show: false,
|
||||
},
|
||||
legend: {
|
||||
noColumns: 1,
|
||||
position: 'nw'
|
||||
},
|
||||
grid: {
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
borderColor: '#ddd',
|
||||
borderWidth: 0,
|
||||
labelMargin: 5,
|
||||
tickColor: 'transparent',
|
||||
backgroundColor: 'transparent'
|
||||
},
|
||||
yaxis: {
|
||||
min: 0,
|
||||
max: 15,
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#999'
|
||||
}
|
||||
},
|
||||
xaxis: {
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#999'
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var flotLine2 = function(){
|
||||
var newCust = [[0, 2], [1, 3], [2, 6], [3, 5], [4, 7], [5, 8], [6, 10]];
|
||||
var retCust = [[0, 1], [1, 2], [2, 5], [3, 3], [4, 5], [5, 6], [6, 9]];
|
||||
|
||||
var plot = $.plot($('#flotLine2'), [
|
||||
{
|
||||
data: newCust,
|
||||
label: 'New Customer',
|
||||
color: '#F93A0B'
|
||||
},
|
||||
{
|
||||
data: retCust,
|
||||
label: 'Returning Customer',
|
||||
color: '#145650'
|
||||
}
|
||||
],
|
||||
{
|
||||
series: {
|
||||
lines: {
|
||||
show: false
|
||||
},
|
||||
splines: {
|
||||
show: true,
|
||||
tension: 0.4,
|
||||
lineWidth: 1,
|
||||
//fill: 0.4
|
||||
},
|
||||
shadowSize: 0
|
||||
},
|
||||
points: {
|
||||
show: false,
|
||||
},
|
||||
legend: {
|
||||
noColumns: 1,
|
||||
position: 'nw'
|
||||
},
|
||||
grid: {
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
borderColor: '#ddd',
|
||||
borderWidth: 0,
|
||||
labelMargin: 5,
|
||||
tickColor: 'transparent',
|
||||
backgroundColor: 'transparent'
|
||||
},
|
||||
yaxis: {
|
||||
min: 0,
|
||||
max: 15,
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
},
|
||||
xaxis: {
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var flotLine3 = function(){
|
||||
var newCust2 = [[0, 10], [1, 7], [2, 8], [3, 9], [4, 6], [5, 5], [6, 7]];
|
||||
var retCust2 = [[0, 8], [1, 5], [2, 6], [3, 8], [4, 4], [5, 3], [6, 6]];
|
||||
|
||||
var plot = $.plot($('#flotLine3'), [
|
||||
{
|
||||
data: newCust2,
|
||||
label: 'New Customer',
|
||||
color: '#F93A0B'
|
||||
},
|
||||
{
|
||||
data: retCust2,
|
||||
label: 'Returning Customer',
|
||||
color: '#145650'
|
||||
}
|
||||
],
|
||||
{
|
||||
series: {
|
||||
lines: {
|
||||
show: true,
|
||||
lineWidth: 1
|
||||
},
|
||||
shadowSize: 0
|
||||
},
|
||||
points: {
|
||||
show: true,
|
||||
},
|
||||
legend: {
|
||||
noColumns: 1,
|
||||
position: 'nw'
|
||||
},
|
||||
grid: {
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
borderColor: '#ddd',
|
||||
borderWidth: 0,
|
||||
labelMargin: 5,
|
||||
tickColor: 'transparent',
|
||||
backgroundColor: 'transparent'
|
||||
},
|
||||
yaxis: {
|
||||
min: 0,
|
||||
max: 15,
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
},
|
||||
xaxis: {
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var flotArea1 = function(){
|
||||
var newCust = [[0, 2], [1, 3], [2, 6], [3, 5], [4, 7], [5, 8], [6, 10]];
|
||||
var retCust = [[0, 1], [1, 2], [2, 5], [3, 3], [4, 5], [5, 6], [6, 9]];
|
||||
|
||||
var plot = $.plot($('#flotArea1'), [
|
||||
{
|
||||
data: newCust,
|
||||
label: 'New Customer',
|
||||
color: '#F93A0B'
|
||||
},
|
||||
{
|
||||
data: retCust,
|
||||
label: 'Returning Customer',
|
||||
color: '#145650'
|
||||
}
|
||||
],
|
||||
{
|
||||
series: {
|
||||
lines: {
|
||||
show: true,
|
||||
lineWidth: 0,
|
||||
fill: 1
|
||||
},
|
||||
shadowSize: 0
|
||||
},
|
||||
points: {
|
||||
show: false,
|
||||
},
|
||||
legend: {
|
||||
noColumns: 1,
|
||||
position: 'nw'
|
||||
},
|
||||
grid: {
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
borderColor: '#ddd',
|
||||
borderWidth: 0,
|
||||
labelMargin: 5,
|
||||
tickColor: 'transparent',
|
||||
backgroundColor: 'transparent'
|
||||
},
|
||||
yaxis: {
|
||||
min: 0,
|
||||
max: 15,
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
},
|
||||
xaxis: {
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var flotArea2 = function(){
|
||||
var newCust = [[0, 2], [1, 3], [2, 6], [3, 5], [4, 7], [5, 8], [6, 10]];
|
||||
var retCust = [[0, 1], [1, 2], [2, 5], [3, 3], [4, 5], [5, 6], [6, 9]];
|
||||
|
||||
var plot = $.plot($('#flotArea2'), [
|
||||
{
|
||||
data: newCust,
|
||||
label: 'New Customer',
|
||||
color: '#F93A0B'
|
||||
},
|
||||
{
|
||||
data: retCust,
|
||||
label: 'Returning Customer',
|
||||
color: '#145650'
|
||||
}
|
||||
],
|
||||
{
|
||||
series: {
|
||||
lines: {
|
||||
show: false
|
||||
},
|
||||
splines: {
|
||||
show: true,
|
||||
tension: 0.4,
|
||||
lineWidth: 0,
|
||||
fill: 1
|
||||
},
|
||||
shadowSize: 0
|
||||
},
|
||||
points: {
|
||||
show: false,
|
||||
},
|
||||
legend: {
|
||||
noColumns: 1,
|
||||
position: 'nw'
|
||||
},
|
||||
grid: {
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
borderColor: '#ddd',
|
||||
borderWidth: 0,
|
||||
labelMargin: 5,
|
||||
tickColor: 'transparent',
|
||||
backgroundColor: 'transparent'
|
||||
},
|
||||
yaxis: {
|
||||
min: 0,
|
||||
max: 15,
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
},
|
||||
xaxis: {
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var flotLine4 = function(){
|
||||
var previousPoint = null;
|
||||
|
||||
$('#flotLine4, #flotLine4').bind('plothover', function (event, pos, item) {
|
||||
$('#x').text(pos.x.toFixed(2));
|
||||
$('#y').text(pos.y.toFixed(2));
|
||||
|
||||
if (item) {
|
||||
if (previousPoint != item.dataIndex) {
|
||||
previousPoint = item.dataIndex;
|
||||
|
||||
$('#tooltip').remove();
|
||||
var x = item.datapoint[0].toFixed(2),
|
||||
y = item.datapoint[1].toFixed(2);
|
||||
|
||||
showTooltip(item.pageX, item.pageY, item.series.label + ' of ' + x + ' = ' + y);
|
||||
}
|
||||
} else {
|
||||
|
||||
$('#tooltip').remove();
|
||||
previousPoint = null;
|
||||
}
|
||||
});
|
||||
$('#flotLine4, #flotLine4').bind('plotclick', function (event, pos, item) {
|
||||
if (item) {
|
||||
plot.highlight(item.series, item.datapoint);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function showTooltip(x, y, contents) {
|
||||
$('<div id="tooltip" class="tooltipflot">' + contents + '</div>').css({
|
||||
position: 'absolute',
|
||||
display: 'none',
|
||||
top: y + 5,
|
||||
left: x + 5
|
||||
}).appendTo('body').fadeIn(200);
|
||||
}
|
||||
|
||||
var flotRealtime1 = function(){
|
||||
/*********** REAL TIME UPDATES **************/
|
||||
|
||||
var data = [], totalPoints = 50;
|
||||
|
||||
function getRandomData() {
|
||||
if (data.length > 0)
|
||||
data = data.slice(1);
|
||||
while (data.length < totalPoints) {
|
||||
var prev = data.length > 0 ? data[data.length - 1] : 50,
|
||||
y = prev + Math.random() * 10 - 5;
|
||||
if (y < 0) {
|
||||
y = 0;
|
||||
} else if (y > 100) {
|
||||
y = 100;
|
||||
}
|
||||
data.push(y);
|
||||
}
|
||||
var res = [];
|
||||
for (var i = 0; i < data.length; ++i) {
|
||||
res.push([i, data[i]])
|
||||
}
|
||||
return res;
|
||||
}
|
||||
|
||||
|
||||
// Set up the control widget
|
||||
var updateInterval = 1000;
|
||||
|
||||
var plot4 = $.plot('#flotRealtime1', [getRandomData()], {
|
||||
colors: ['#F93A0B'],
|
||||
series: {
|
||||
lines: {
|
||||
show: true,
|
||||
lineWidth: 1
|
||||
},
|
||||
shadowSize: 0 // Drawing is faster without shadows
|
||||
},
|
||||
grid: {
|
||||
borderColor: 'transparent',
|
||||
borderWidth: 1,
|
||||
tickColor: 'transparent',
|
||||
labelMargin: 5
|
||||
},
|
||||
xaxis: {
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
},
|
||||
yaxis: {
|
||||
min: 0,
|
||||
max: 100,
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
}
|
||||
});
|
||||
update_plot4();
|
||||
function update_plot4() {
|
||||
plot4.setData([getRandomData()]);
|
||||
plot4.draw();
|
||||
setTimeout(update_plot4, updateInterval);
|
||||
}
|
||||
}
|
||||
|
||||
var flotRealtime2 = function(){
|
||||
var data = [], totalPoints = 50;
|
||||
|
||||
function getRandomData() {
|
||||
if (data.length > 0)
|
||||
data = data.slice(1);
|
||||
while (data.length < totalPoints) {
|
||||
var prev = data.length > 0 ? data[data.length - 1] : 50,
|
||||
y = prev + Math.random() * 10 - 5;
|
||||
if (y < 0) {
|
||||
y = 0;
|
||||
} else if (y > 100) {
|
||||
y = 100;
|
||||
}
|
||||
data.push(y);
|
||||
}
|
||||
var res = [];
|
||||
for (var i = 0; i < data.length; ++i) {
|
||||
res.push([i, data[i]])
|
||||
}
|
||||
return res;
|
||||
}
|
||||
|
||||
// Set up the control widget
|
||||
var updateInterval = 1000;
|
||||
|
||||
var plot5 = $.plot('#flotRealtime2', [getRandomData()], {
|
||||
colors: ['#F93A0B'],
|
||||
series: {
|
||||
lines: {
|
||||
show: true,
|
||||
lineWidth: 0,
|
||||
fill: 0.9
|
||||
},
|
||||
shadowSize: 0 // Drawing is faster without shadows
|
||||
},
|
||||
grid: {
|
||||
borderColor: 'transparent',
|
||||
borderWidth: 1,
|
||||
tickColor: 'transparent',
|
||||
labelMargin: 5
|
||||
},
|
||||
xaxis: {
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
},
|
||||
yaxis: {
|
||||
min: 0,
|
||||
max: 100,
|
||||
color: 'transparent',
|
||||
font: {
|
||||
size: 10,
|
||||
fill: '#888'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
update_plot5();
|
||||
function update_plot5() {
|
||||
plot5.setData([getRandomData()]);
|
||||
plot5.draw();
|
||||
setTimeout(update_plot5, updateInterval);
|
||||
}
|
||||
}
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
},
|
||||
|
||||
|
||||
load:function(){
|
||||
flotBar1();
|
||||
flotBar2();
|
||||
flotLine1();
|
||||
flotLine2();
|
||||
flotLine3();
|
||||
flotArea1();
|
||||
flotArea2();
|
||||
flotLine4();
|
||||
flotRealtime1();
|
||||
flotRealtime2();
|
||||
},
|
||||
|
||||
resize:function(){
|
||||
}
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
jQuery(document).ready(function(){
|
||||
});
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
dzChartlist.load();
|
||||
});
|
||||
|
||||
jQuery(window).on('resize',function(){
|
||||
dzChartlist.resize();
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
132
public/js/plugins-init/fullcalendar-init.js
Normal file
132
public/js/plugins-init/fullcalendar-init.js
Normal file
@@ -0,0 +1,132 @@
|
||||
|
||||
"use strict"
|
||||
|
||||
function fullCalender(){
|
||||
|
||||
/* initialize the external events
|
||||
-----------------------------------------------------------------*/
|
||||
|
||||
var containerEl = document.getElementById('external-events');
|
||||
new FullCalendar.Draggable(containerEl, {
|
||||
itemSelector: '.external-event',
|
||||
eventData: function(eventEl) {
|
||||
return {
|
||||
title: eventEl.innerText.trim()
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
/* initialize the calendar
|
||||
-----------------------------------------------------------------*/
|
||||
|
||||
var calendarEl = document.getElementById('calendar');
|
||||
var calendar = new FullCalendar.Calendar(calendarEl, {
|
||||
headerToolbar: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'dayGridMonth,timeGridWeek,timeGridDay'
|
||||
},
|
||||
|
||||
selectable: true,
|
||||
selectMirror: true,
|
||||
select: function(arg) {
|
||||
var title = prompt('Event Title:');
|
||||
if (title) {
|
||||
calendar.addEvent({
|
||||
title: title,
|
||||
start: arg.start,
|
||||
end: arg.end,
|
||||
allDay: arg.allDay
|
||||
})
|
||||
}
|
||||
calendar.unselect()
|
||||
},
|
||||
|
||||
editable: true,
|
||||
droppable: true, // this allows things to be dropped onto the calendar
|
||||
drop: function(arg) {
|
||||
// is the "remove after drop" checkbox checked?
|
||||
if (document.getElementById('drop-remove').checked) {
|
||||
// if so, remove the element from the "Draggable Events" list
|
||||
arg.draggedEl.parentNode.removeChild(arg.draggedEl);
|
||||
}
|
||||
},
|
||||
initialDate: '2021-02-13',
|
||||
weekNumbers: true,
|
||||
navLinks: true, // can click day/week names to navigate views
|
||||
editable: true,
|
||||
selectable: true,
|
||||
nowIndicator: true,
|
||||
events: [
|
||||
{
|
||||
title: 'All Day Event',
|
||||
start: '2021-02-01'
|
||||
},
|
||||
{
|
||||
title: 'Long Event',
|
||||
start: '2021-02-07',
|
||||
end: '2021-02-10',
|
||||
className: "bg-danger"
|
||||
},
|
||||
{
|
||||
groupId: 999,
|
||||
title: 'Repeating Event',
|
||||
start: '2021-02-09T16:00:00'
|
||||
},
|
||||
{
|
||||
groupId: 999,
|
||||
title: 'Repeating Event',
|
||||
start: '2021-02-16T16:00:00'
|
||||
},
|
||||
{
|
||||
title: 'Conference',
|
||||
start: '2021-02-11',
|
||||
end: '2021-02-13',
|
||||
className: "bg-danger"
|
||||
},
|
||||
{
|
||||
title: 'Lunch',
|
||||
start: '2021-02-12T12:00:00'
|
||||
},
|
||||
{
|
||||
title: 'Meeting',
|
||||
start: '2021-04-12T14:30:00'
|
||||
},
|
||||
{
|
||||
title: 'Happy Hour',
|
||||
start: '2021-07-12T17:30:00'
|
||||
},
|
||||
{
|
||||
title: 'Dinner',
|
||||
start: '2021-02-12T20:00:00',
|
||||
className: "bg-warning"
|
||||
},
|
||||
{
|
||||
title: 'Birthday Party',
|
||||
start: '2021-02-13T07:00:00',
|
||||
className: "bg-secondary"
|
||||
},
|
||||
{
|
||||
title: 'Click for Google',
|
||||
url: 'http://google.com/',
|
||||
start: '2021-02-28'
|
||||
}
|
||||
]
|
||||
});
|
||||
calendar.render();
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
setTimeout(function(){
|
||||
fullCalender();
|
||||
}, 1000);
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
12
public/js/plugins-init/jquery-ascolorpicker.init.js
Normal file
12
public/js/plugins-init/jquery-ascolorpicker.init.js
Normal file
@@ -0,0 +1,12 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
// Colorpicker
|
||||
$(".as_colorpicker").asColorPicker();
|
||||
$(".complex-colorpicker").asColorPicker({
|
||||
mode: 'complex'
|
||||
});
|
||||
$(".gradient-colorpicker").asColorPicker({
|
||||
mode: 'gradient'
|
||||
});
|
||||
})(jQuery);
|
||||
18
public/js/plugins-init/jquery-steps-init.js
vendored
Normal file
18
public/js/plugins-init/jquery-steps-init.js
vendored
Normal file
@@ -0,0 +1,18 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
var form = $("#step-form-horizontal");
|
||||
form.children('div').steps({
|
||||
headerTag: "h4",
|
||||
bodyTag: "section",
|
||||
transitionEffect: "slideLeft",
|
||||
autoFocus: true,
|
||||
transitionEffect: "slideLeft",
|
||||
onStepChanging: function (event, currentIndex, newIndex)
|
||||
{
|
||||
form.validate().settings.ignore = ":disabled,:hidden";
|
||||
return form.valid();
|
||||
}
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
19
public/js/plugins-init/jquery.validate-init.js
Normal file
19
public/js/plugins-init/jquery.validate-init.js
Normal file
@@ -0,0 +1,19 @@
|
||||
(function () {
|
||||
'use strict'
|
||||
|
||||
// Fetch all the forms we want to apply custom Bootstrap validation styles to
|
||||
var forms = document.querySelectorAll('.needs-validation')
|
||||
|
||||
// Loop over them and prevent submission
|
||||
Array.prototype.slice.call(forms)
|
||||
.forEach(function (form) {
|
||||
form.addEventListener('submit', function (event) {
|
||||
if (!form.checkValidity()) {
|
||||
event.preventDefault()
|
||||
event.stopPropagation()
|
||||
}
|
||||
|
||||
form.classList.add('was-validated')
|
||||
}, false)
|
||||
})
|
||||
})()
|
||||
114
public/js/plugins-init/jqvmap-init.js
Normal file
114
public/js/plugins-init/jqvmap-init.js
Normal file
@@ -0,0 +1,114 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
|
||||
var dlabVectorMap = function(){
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
var handleWorldMap = function(trigger = 'load'){
|
||||
var vmapSelector = $('#world-map');
|
||||
if(trigger == 'resize')
|
||||
{
|
||||
vmapSelector.empty();
|
||||
vmapSelector.removeAttr('style');
|
||||
}
|
||||
|
||||
vmapSelector.delay( 500 ).unbind().vectorMap({
|
||||
map: 'world_en',
|
||||
backgroundColor: 'transparent',
|
||||
borderColor: 'var(--border)',
|
||||
borderOpacity: 0.25,
|
||||
borderWidth: 1,
|
||||
color: 'var(--border)',
|
||||
enableZoom: true,
|
||||
hoverColor: 'var(--primary)',
|
||||
hoverOpacity: null,
|
||||
normalizeFunction: 'linear',
|
||||
scaleColors: ['#b6d6ff', '#005ace'],
|
||||
selectedColor: 'var(--primary)',
|
||||
selectedRegions: null,
|
||||
showTooltip: true,
|
||||
onRegionClick: function(element, code, region)
|
||||
{
|
||||
var message = 'You clicked "'
|
||||
+ region
|
||||
+ '" which has the code: '
|
||||
+ code.toUpperCase();
|
||||
|
||||
alert(message);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var handleUsaMap = function(trigger = 'load'){
|
||||
var vmapSelector = $('#usa');
|
||||
if(trigger == 'resize')
|
||||
{
|
||||
vmapSelector.empty();
|
||||
vmapSelector.removeAttr('style');
|
||||
}
|
||||
|
||||
vmapSelector.delay(500).unbind().vectorMap({
|
||||
map: 'usa_en',
|
||||
backgroundColor: 'transparent',
|
||||
borderColor: 'var(--border)',
|
||||
borderOpacity: 0.25,
|
||||
borderWidth: 1,
|
||||
color: 'var(--border)',
|
||||
enableZoom: true,
|
||||
hoverColor: 'var(--primary)',
|
||||
hoverOpacity: null,
|
||||
normalizeFunction: 'linear',
|
||||
scaleColors: ['#b6d6ff', '#005ace'],
|
||||
selectedColor: 'var(--primary)',
|
||||
selectedRegions: null,
|
||||
showTooltip: true,
|
||||
onRegionClick: function(element, code, region)
|
||||
{
|
||||
var message = 'You clicked "'
|
||||
+ region
|
||||
+ '" which has the code: '
|
||||
+ code.toUpperCase();
|
||||
|
||||
alert(message);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
init:function(){
|
||||
},
|
||||
|
||||
|
||||
load:function(){
|
||||
handleWorldMap();
|
||||
handleUsaMap();
|
||||
},
|
||||
|
||||
resize:function(){
|
||||
handleWorldMap('resize');
|
||||
handleUsaMap('resize');
|
||||
}
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
jQuery(document).ready(function(){
|
||||
});
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
setTimeout(function(){
|
||||
dlabVectorMap.load();
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
|
||||
jQuery(window).on('resize',function(){
|
||||
setTimeout(function(){
|
||||
dlabVectorMap.resize();
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
23
public/js/plugins-init/material-date-picker-init.js
Normal file
23
public/js/plugins-init/material-date-picker-init.js
Normal file
@@ -0,0 +1,23 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
// MAterial Date picker
|
||||
$('#mdate').bootstrapMaterialDatePicker({
|
||||
weekStart: 0,
|
||||
time: false
|
||||
});
|
||||
$('#timepicker').bootstrapMaterialDatePicker({
|
||||
format: 'HH:mm',
|
||||
time: true,
|
||||
date: false
|
||||
});
|
||||
$('#date-format').bootstrapMaterialDatePicker({
|
||||
format: 'dddd DD MMMM YYYY - HH:mm'
|
||||
});
|
||||
|
||||
$('#min-date').bootstrapMaterialDatePicker({
|
||||
format: 'DD/MM/YYYY HH:mm',
|
||||
minDate: new Date()
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
457
public/js/plugins-init/morris-init.js
Normal file
457
public/js/plugins-init/morris-init.js
Normal file
@@ -0,0 +1,457 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
var dlabMorris = function(){
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
var setChartWidth = function(){
|
||||
if(screenWidth <= 768)
|
||||
{
|
||||
var chartBlockWidth = 0;
|
||||
chartBlockWidth = (screenWidth < 300 )?screenWidth:300;
|
||||
jQuery('.morris_chart_height').css('min-width',chartBlockWidth - 31);
|
||||
}
|
||||
}
|
||||
|
||||
var donutChart = function(){
|
||||
Morris.Donut({
|
||||
element: 'morris_donught',
|
||||
data: [{
|
||||
label: "\xa0 \xa0 Download Sales \xa0 \xa0",
|
||||
value: 12,
|
||||
|
||||
}, {
|
||||
label: "\xa0 \xa0 In-Store Sales \xa0 \xa0",
|
||||
value: 30
|
||||
}, {
|
||||
label: "\xa0 \xa0 Mail-Order Sales \xa0 \xa0",
|
||||
value: 20
|
||||
}],
|
||||
resize: true,
|
||||
redraw: true,
|
||||
colors: ['#f93a0b', 'rgb(255, 92, 0)', '#145650'],
|
||||
//responsive:true,
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
var lineChart = function(){
|
||||
//line chart
|
||||
let line = new Morris.Line({
|
||||
element: 'morris_line',
|
||||
resize: true,
|
||||
data: [{
|
||||
y: '2011 Q1',
|
||||
item1: 2666
|
||||
},
|
||||
{
|
||||
y: '2011 Q2',
|
||||
item1: 2778
|
||||
},
|
||||
{
|
||||
y: '2011 Q3',
|
||||
item1: 4912
|
||||
},
|
||||
{
|
||||
y: '2011 Q4',
|
||||
item1: 3767
|
||||
},
|
||||
{
|
||||
y: '2012 Q1',
|
||||
item1: 6810
|
||||
},
|
||||
{
|
||||
y: '2012 Q2',
|
||||
item1: 5670
|
||||
},
|
||||
{
|
||||
y: '2012 Q3',
|
||||
item1: 4820
|
||||
},
|
||||
{
|
||||
y: '2012 Q4',
|
||||
item1: 15073
|
||||
},
|
||||
{
|
||||
y: '2013 Q1',
|
||||
item1: 10687
|
||||
},
|
||||
{
|
||||
y: '2013 Q2',
|
||||
item1: 8432
|
||||
}
|
||||
],
|
||||
xkey: 'y',
|
||||
ykeys: ['item1'],
|
||||
labels: ['Item 1'],
|
||||
gridLineColor: 'transparent',
|
||||
lineColors: ['rgb(238, 60, 60)'], //here
|
||||
lineWidth: 1,
|
||||
hideHover: 'auto',
|
||||
pointSize: 0,
|
||||
axes: false
|
||||
});
|
||||
}
|
||||
|
||||
var lineChart2 = function(){
|
||||
//Area chart
|
||||
Morris.Area({
|
||||
element: 'line_chart_2',
|
||||
data: [{
|
||||
period: '2001',
|
||||
smartphone: 0,
|
||||
windows: 0,
|
||||
mac: 0
|
||||
}, {
|
||||
period: '2002',
|
||||
smartphone: 90,
|
||||
windows: 60,
|
||||
mac: 25
|
||||
}, {
|
||||
period: '2003',
|
||||
smartphone: 40,
|
||||
windows: 80,
|
||||
mac: 35
|
||||
}, {
|
||||
period: '2004',
|
||||
smartphone: 30,
|
||||
windows: 47,
|
||||
mac: 17
|
||||
}, {
|
||||
period: '2005',
|
||||
smartphone: 150,
|
||||
windows: 40,
|
||||
mac: 120
|
||||
}, {
|
||||
period: '2006',
|
||||
smartphone: 25,
|
||||
windows: 80,
|
||||
mac: 40
|
||||
}, {
|
||||
period: '2007',
|
||||
smartphone: 10,
|
||||
windows: 10,
|
||||
mac: 10
|
||||
}
|
||||
|
||||
|
||||
],
|
||||
xkey: 'period',
|
||||
ykeys: ['smartphone', 'windows', 'mac'],
|
||||
labels: ['Phone', 'Windows', 'Mac'],
|
||||
pointSize: 3,
|
||||
fillOpacity: 0,
|
||||
pointStrokeColors: ['#EE3C3C', '#145650', '#f93a0b'],
|
||||
behaveLikeLine: true,
|
||||
gridLineColor: 'transparent',
|
||||
lineWidth: 3,
|
||||
hideHover: 'auto',
|
||||
lineColors: ['rgb(238, 60, 60)', 'rgb(0, 171, 197)', '#f93a0b'],
|
||||
resize: true
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
var barChart = function(){
|
||||
if(jQuery('#morris_bar').length > 0)
|
||||
{
|
||||
//bar chart
|
||||
Morris.Bar({
|
||||
element: 'morris_bar',
|
||||
data: [{
|
||||
y: '2006',
|
||||
a: 100,
|
||||
b: 90,
|
||||
c: 60
|
||||
}, {
|
||||
y: '2007',
|
||||
a: 75,
|
||||
b: 65,
|
||||
c: 40
|
||||
}, {
|
||||
y: '2008',
|
||||
a: 50,
|
||||
b: 40,
|
||||
c: 30
|
||||
}, {
|
||||
y: '2009',
|
||||
a: 75,
|
||||
b: 65,
|
||||
c: 40
|
||||
}, {
|
||||
y: '2010',
|
||||
a: 50,
|
||||
b: 40,
|
||||
c: 30
|
||||
}, {
|
||||
y: '2011',
|
||||
a: 75,
|
||||
b: 65,
|
||||
c: 40
|
||||
}, {
|
||||
y: '2012',
|
||||
a: 100,
|
||||
b: 90,
|
||||
c: 40
|
||||
}],
|
||||
xkey: 'y',
|
||||
ykeys: ['a', 'b', 'c'],
|
||||
labels: ['A', 'B', 'C'],
|
||||
barColors: ['#f93a0b', '#145650', '#ff9f00'],
|
||||
hideHover: 'auto',
|
||||
gridLineColor: 'transparent',
|
||||
resize: true,
|
||||
barSizeRatio: 0.25,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var barStalkChart = function(){
|
||||
//bar chart
|
||||
Morris.Bar({
|
||||
element: 'morris_bar_stalked',
|
||||
data: [{
|
||||
y: 'S',
|
||||
a: 66,
|
||||
b: 34
|
||||
}, {
|
||||
y: 'M',
|
||||
a: 75,
|
||||
b: 25
|
||||
}, {
|
||||
y: 'T',
|
||||
a: 50,
|
||||
b: 50
|
||||
}, {
|
||||
y: 'W',
|
||||
a: 75,
|
||||
b: 25
|
||||
}, {
|
||||
y: 'T',
|
||||
a: 50,
|
||||
b: 50
|
||||
}, {
|
||||
y: 'F',
|
||||
a: 16,
|
||||
b: 84
|
||||
}, {
|
||||
y: 'S',
|
||||
a: 70,
|
||||
b: 30
|
||||
}, {
|
||||
y: 'S',
|
||||
a: 30,
|
||||
b: 70
|
||||
}, {
|
||||
y: 'M',
|
||||
a: 40,
|
||||
b: 60
|
||||
}, {
|
||||
y: 'T',
|
||||
a: 29,
|
||||
b: 71
|
||||
}, {
|
||||
y: 'W',
|
||||
a: 44,
|
||||
b: 56
|
||||
}, {
|
||||
y: 'T',
|
||||
a: 30,
|
||||
b: 70
|
||||
}, {
|
||||
y: 'F',
|
||||
a: 60,
|
||||
b: 40
|
||||
}, {
|
||||
y: 'G',
|
||||
a: 40,
|
||||
b: 60
|
||||
}, {
|
||||
y: 'S',
|
||||
a: 46,
|
||||
b: 54
|
||||
}],
|
||||
xkey: 'y',
|
||||
ykeys: ['a', 'b'],
|
||||
labels: ['A', 'B'],
|
||||
barColors: ['#f93a0b', "#F1F3F7"],
|
||||
hideHover: 'auto',
|
||||
gridLineColor: 'transparent',
|
||||
resize: true,
|
||||
barSizeRatio: 0.25,
|
||||
stacked: true,
|
||||
behaveLikeLine: true,
|
||||
//redraw: true
|
||||
|
||||
// barRadius: [6, 6, 0, 0]
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
var areaChart = function(){
|
||||
//area chart
|
||||
Morris.Area({
|
||||
element: 'morris_area',
|
||||
data: [{
|
||||
period: '2001',
|
||||
smartphone: 0,
|
||||
windows: 0,
|
||||
mac: 0
|
||||
}, {
|
||||
period: '2002',
|
||||
smartphone: 90,
|
||||
windows: 60,
|
||||
mac: 25
|
||||
}, {
|
||||
period: '2003',
|
||||
smartphone: 40,
|
||||
windows: 80,
|
||||
mac: 35
|
||||
}, {
|
||||
period: '2004',
|
||||
smartphone: 30,
|
||||
windows: 47,
|
||||
mac: 17
|
||||
}, {
|
||||
period: '2005',
|
||||
smartphone: 150,
|
||||
windows: 40,
|
||||
mac: 120
|
||||
}, {
|
||||
period: '2006',
|
||||
smartphone: 25,
|
||||
windows: 80,
|
||||
mac: 40
|
||||
}, {
|
||||
period: '2007',
|
||||
smartphone: 10,
|
||||
windows: 10,
|
||||
mac: 10
|
||||
}
|
||||
|
||||
|
||||
],
|
||||
lineColors: ['#f93a0b', 'rgb(16, 202, 147)', 'rgb(255, 92, 0)'],
|
||||
xkey: 'period',
|
||||
ykeys: ['smartphone', 'windows', 'mac'],
|
||||
labels: ['Phone', 'Windows', 'Mac'],
|
||||
pointSize: 0,
|
||||
lineWidth: 0,
|
||||
resize: true,
|
||||
fillOpacity: 0.95,
|
||||
behaveLikeLine: true,
|
||||
gridLineColor: 'transparent',
|
||||
hideHover: 'auto'
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
var areaChart2 = function(){
|
||||
if(jQuery('#morris_area_2').length > 0)
|
||||
{
|
||||
//area chart
|
||||
Morris.Area({
|
||||
element: 'morris_area_2',
|
||||
data: [{
|
||||
period: '2010',
|
||||
SiteA: 0,
|
||||
SiteB: 0,
|
||||
|
||||
}, {
|
||||
period: '2011',
|
||||
SiteA: 130,
|
||||
SiteB: 100,
|
||||
|
||||
}, {
|
||||
period: '2012',
|
||||
SiteA: 80,
|
||||
SiteB: 60,
|
||||
|
||||
}, {
|
||||
period: '2013',
|
||||
SiteA: 70,
|
||||
SiteB: 200,
|
||||
|
||||
}, {
|
||||
period: '2014',
|
||||
SiteA: 180,
|
||||
SiteB: 150,
|
||||
|
||||
}, {
|
||||
period: '2015',
|
||||
SiteA: 105,
|
||||
SiteB: 90,
|
||||
|
||||
},
|
||||
{
|
||||
period: '2016',
|
||||
SiteA: 250,
|
||||
SiteB: 150,
|
||||
|
||||
}
|
||||
],
|
||||
xkey: 'period',
|
||||
ykeys: ['SiteA', 'SiteB'],
|
||||
labels: ['Site A', 'Site B'],
|
||||
pointSize: 0,
|
||||
fillOpacity: 0.6,
|
||||
pointStrokeColors: ['#b4becb', '#00A2FF'], //here
|
||||
behaveLikeLine: true,
|
||||
gridLineColor: 'transparent',
|
||||
lineWidth: 0,
|
||||
smooth: false,
|
||||
hideHover: 'auto',
|
||||
lineColors: ['rgb(0, 171, 197)', 'rgb(0, 0, 128)'],
|
||||
resize: true
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
setChartWidth();
|
||||
donutChart();
|
||||
lineChart();
|
||||
lineChart2();
|
||||
barChart();
|
||||
barStalkChart();
|
||||
areaChart();
|
||||
areaChart2();
|
||||
},
|
||||
|
||||
|
||||
resize:function(){
|
||||
screenWidth = $(window).width();
|
||||
setChartWidth();
|
||||
donutChart();
|
||||
lineChart();
|
||||
lineChart2();
|
||||
barChart();
|
||||
barStalkChart();
|
||||
areaChart();
|
||||
areaChart2();
|
||||
}
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
jQuery(document).ready(function(){
|
||||
dlabMorris.init();
|
||||
//dlabMorris.resize();
|
||||
|
||||
});
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
//dlabMorris.init();
|
||||
});
|
||||
|
||||
jQuery( window ).resize(function() {
|
||||
//dlabMorris.resize();
|
||||
//dlabMorris.init();
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
24
public/js/plugins-init/nestable-init.js
Normal file
24
public/js/plugins-init/nestable-init.js
Normal file
@@ -0,0 +1,24 @@
|
||||
(function ($) {
|
||||
"use strict"
|
||||
|
||||
|
||||
/*******************
|
||||
Nestable
|
||||
*******************/
|
||||
|
||||
var e = function (e) {
|
||||
var t = e.length ? e : $(e.target)
|
||||
};
|
||||
$("#nestable").nestable({
|
||||
group: 1
|
||||
}).on("change", e),
|
||||
$("#nestable2").nestable({
|
||||
group: 1
|
||||
}).on("change", e), e($("#nestable").data("output", $("#nestable-output"))), e($("#nestable2").data("output", $("#nestable2-output"))), $("#nestable-menu").on("click", function (e) {
|
||||
var t = $(e.target).data("action");
|
||||
"expand-all" === t && $(".dd").nestable("expandAll"), "collapse-all" === t && $(".dd").nestable("collapseAll")
|
||||
}), $("#nestable3").nestable();
|
||||
|
||||
|
||||
|
||||
})(jQuery);
|
||||
1154
public/js/plugins-init/nouislider-init.js
Normal file
1154
public/js/plugins-init/nouislider-init.js
Normal file
File diff suppressed because it is too large
Load Diff
7
public/js/plugins-init/pickadate-init.js
Normal file
7
public/js/plugins-init/pickadate-init.js
Normal file
@@ -0,0 +1,7 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
//date picker classic default
|
||||
$('.datepicker-default').pickadate();
|
||||
|
||||
})(jQuery);
|
||||
255
public/js/plugins-init/piety-init.js
Normal file
255
public/js/plugins-init/piety-init.js
Normal file
@@ -0,0 +1,255 @@
|
||||
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
|
||||
/****************
|
||||
Piety chart
|
||||
*****************/
|
||||
var dlabPiety = function(){
|
||||
|
||||
var getGraphBlockSize = function (selector) {
|
||||
var screenWidth = $(window).width();
|
||||
var graphBlockSize = '100%';
|
||||
|
||||
if(screenWidth <= 768)
|
||||
{
|
||||
screenWidth = (screenWidth < 300 )?screenWidth:300;
|
||||
|
||||
var blockWidth = jQuery(selector).parent().innerWidth() - jQuery(selector).parent().width();
|
||||
|
||||
blockWidth = Math.abs(blockWidth);
|
||||
|
||||
var graphBlockSize = screenWidth - blockWidth - 10;
|
||||
}
|
||||
|
||||
return graphBlockSize;
|
||||
|
||||
}
|
||||
|
||||
var handlePietyBarLine = function(){
|
||||
if(jQuery('.bar-line').length > 0 ){
|
||||
$(".bar-line").peity("bar", {
|
||||
width: "100",
|
||||
height: "100"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyPie = function(){
|
||||
if(jQuery('span.pie').length > 0 ){
|
||||
$("span.pie").peity("pie", {
|
||||
fill: ['#f93a0b', 'rgba(249, 58, 11, .3)'],
|
||||
width: "100",
|
||||
height: "100"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyDonut = function(){
|
||||
if(jQuery('span.donut').length > 0 ){
|
||||
$("span.donut").peity("donut", {
|
||||
width: "100",
|
||||
height: "100"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyLine = function(){
|
||||
if(jQuery('.peity-line').length > 0 ){
|
||||
$(".peity-line").peity("line", {
|
||||
fill: ["rgba(249, 58, 11, .5)"],
|
||||
stroke: '#f93a0b',
|
||||
width: "100%",
|
||||
height: "100"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyLine2 = function(){
|
||||
if(jQuery('.peity-line-2').length > 0 ){
|
||||
$(".peity-line-2").peity("line", {
|
||||
fill: "#fa707e",
|
||||
stroke: "#f77f8b",
|
||||
//width: "100%",
|
||||
width: getGraphBlockSize('.peity-line-2'),
|
||||
strokeWidth: "3",
|
||||
height: "150"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyLine3 = function(){
|
||||
if(jQuery('.peity-line-3').length > 0 ){
|
||||
$(".peity-line-3").peity("line", {
|
||||
fill: "#673bb7",
|
||||
stroke: "#ab84f3",
|
||||
width: "100%",
|
||||
strokeWidth: "3",
|
||||
height: "150"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyBar = function(){
|
||||
if(jQuery('.bar').length > 0 ){
|
||||
$(".bar").peity("bar", {
|
||||
fill: ["#f93a0b", "#145650", "#3693FF"],
|
||||
width: "100%",
|
||||
height: "100",
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyBar1 = function(){
|
||||
if(jQuery('.bar1').length > 0 ){
|
||||
$(".bar1").peity("bar", {
|
||||
fill: ["#f93a0b", "#145650", "#3693FF"],
|
||||
//width: "100%",
|
||||
width: getGraphBlockSize('.bar1'),
|
||||
height: "140"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyBarColours1 = function(){
|
||||
if(jQuery('.bar-colours-1').length > 0 ){
|
||||
$(".bar-colours-1").peity("bar", {
|
||||
fill: ["#f93a0b", "#145650", "#3693FF"],
|
||||
width: "100",
|
||||
height: "100"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyBarColours2 = function(){
|
||||
if(jQuery('.bar-colours-2').length > 0 ){
|
||||
$(".bar-colours-2").peity("bar", {
|
||||
fill: function(t, e, i) {
|
||||
return "rgb(58, " + parseInt(e / i.length * 122) + ", 254)"
|
||||
},
|
||||
width: "100",
|
||||
height: "100"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyBarColours3 = function(){
|
||||
if(jQuery('.bar-colours-3').length > 0 ){
|
||||
$(".bar-colours-3").peity("bar", {
|
||||
fill: function(t, e, i) {
|
||||
return "rgb(16, " + parseInt(e / i.length * 202) + ", 147)"
|
||||
},
|
||||
width: "100",
|
||||
height: "100"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyColours1 = function(){
|
||||
if(jQuery('.pie-colours-1').length > 0 ){
|
||||
$(".pie-colours-1").peity("pie", {
|
||||
fill: ["cyan", "magenta", "yellow", "black"],
|
||||
width: "100",
|
||||
height: "100"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyColours2 = function(){
|
||||
if(jQuery('.pie-colours-2').length > 0 ){
|
||||
$(".pie-colours-2").peity("pie", {
|
||||
fill: ["#f93a0b", "#145650", "#3693FF", "#ff5c00", "#EE3C3C"],
|
||||
width: "100",
|
||||
height: "100"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyDataAttr = function(){
|
||||
if(jQuery('.data-attr').length > 0 ){
|
||||
$(".data-attr").peity("donut");
|
||||
}
|
||||
}
|
||||
|
||||
var handlePietyUpdatingChart = function(){
|
||||
var t = $(".updating-chart").peity("line", {
|
||||
fill: ['rgba(249, 58, 11, .5)'],
|
||||
stroke: 'rgb(249, 58, 11)',
|
||||
width: "100%",
|
||||
height: 100
|
||||
});
|
||||
|
||||
setInterval(function() {
|
||||
var e = Math.round(10 * Math.random()),
|
||||
i = t.text().split(",");
|
||||
i.shift(), i.push(e), t.text(i.join(",")).change()
|
||||
}, 1e3);
|
||||
}
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
},
|
||||
|
||||
|
||||
load:function(){
|
||||
handlePietyBarLine();
|
||||
handlePietyPie();
|
||||
handlePietyDonut();
|
||||
handlePietyLine();
|
||||
handlePietyLine2();
|
||||
handlePietyLine3();
|
||||
handlePietyBar();
|
||||
handlePietyBar1();
|
||||
handlePietyBarColours1();
|
||||
handlePietyBarColours2();
|
||||
handlePietyBarColours3();
|
||||
handlePietyColours1();
|
||||
handlePietyColours2();
|
||||
handlePietyDataAttr();
|
||||
handlePietyUpdatingChart();
|
||||
},
|
||||
|
||||
resize:function(){
|
||||
handlePietyBarLine();
|
||||
handlePietyPie();
|
||||
handlePietyDonut();
|
||||
handlePietyLine();
|
||||
handlePietyLine2();
|
||||
handlePietyLine3();
|
||||
handlePietyBar();
|
||||
handlePietyBar1();
|
||||
handlePietyBarColours1();
|
||||
handlePietyBarColours2();
|
||||
handlePietyBarColours3();
|
||||
handlePietyColours1();
|
||||
handlePietyColours2();
|
||||
handlePietyDataAttr();
|
||||
//handlePietyUpdatingChart();
|
||||
}
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
jQuery(document).ready(function(){
|
||||
|
||||
|
||||
|
||||
});
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
setTimeout(function(){
|
||||
dlabPiety.load();
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
|
||||
jQuery(window).on('resize',function(){
|
||||
setTimeout(function(){
|
||||
dlabPiety.resize();
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
386
public/js/plugins-init/select2-init.js
Normal file
386
public/js/plugins-init/select2-init.js
Normal file
@@ -0,0 +1,386 @@
|
||||
|
||||
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
// single select box
|
||||
$("#single-select").select2();
|
||||
|
||||
// multi select box
|
||||
$('.multi-select').select2();
|
||||
|
||||
// dropdown option groups
|
||||
$('.dropdown-groups').select2();
|
||||
|
||||
//disabling options
|
||||
$('.disabling-options').select2();
|
||||
|
||||
//disabling a select2 control
|
||||
$(".js-example-disabled").select2();
|
||||
$(".js-example-disabled-multi").select2();
|
||||
$("#js-programmatic-enable").on("click", function () {
|
||||
$(".js-example-disabled").prop("disabled", false);
|
||||
$(".js-example-disabled-multi").prop("disabled", false);
|
||||
});
|
||||
$("#js-programmatic-disable").on("click", function () {
|
||||
$(".js-example-disabled").prop("disabled", true);
|
||||
$(".js-example-disabled-multi").prop("disabled", true);
|
||||
});
|
||||
|
||||
|
||||
// select2 with labels
|
||||
$(".select2-with-label-single").select2();
|
||||
$(".select2-with-label-multiple").select2();
|
||||
|
||||
|
||||
//select2 container width
|
||||
$(".select2-width-50").select2();
|
||||
$(".select2-width-75").select2();
|
||||
|
||||
|
||||
//select2 themes
|
||||
$(".js-example-theme-single").select2({
|
||||
theme: "classic"
|
||||
});
|
||||
$(".js-example-theme-multiple").select2({
|
||||
theme: "classic"
|
||||
});
|
||||
|
||||
|
||||
//ajax remote data
|
||||
$(".js-data-example-ajax").select2({
|
||||
width: "100%",
|
||||
ajax: {
|
||||
url: "https://api.github.com/search/repositories",
|
||||
dataType: 'json',
|
||||
delay: 250,
|
||||
data: function (params) {
|
||||
return {
|
||||
q: params.term, // search term
|
||||
page: params.page
|
||||
};
|
||||
},
|
||||
processResults: function (data, params) {
|
||||
// parse the results into the format expected by Select2
|
||||
// since we are using custom formatting functions we do not need to
|
||||
// alter the remote JSON data, except to indicate that infinite
|
||||
// scrolling can be used
|
||||
params.page = params.page || 1;
|
||||
|
||||
return {
|
||||
results: data.items,
|
||||
pagination: {
|
||||
more: (params.page * 30) < data.total_count
|
||||
}
|
||||
};
|
||||
},
|
||||
cache: true
|
||||
},
|
||||
placeholder: 'Search for a repository',
|
||||
escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
|
||||
minimumInputLength: 1,
|
||||
templateResult: formatRepo,
|
||||
templateSelection: formatRepoSelection
|
||||
});
|
||||
|
||||
function formatRepo (repo) {
|
||||
if (repo.loading) {
|
||||
return repo.text;
|
||||
}
|
||||
|
||||
var markup = "<div class='select2-result-repository clearfix'>" +
|
||||
"<div class='select2-result-repository__avatar'><img src='" + repo.owner.avatar_url + "' /></div>" +
|
||||
"<div class='select2-result-repository__meta'>" +
|
||||
"<div class='select2-result-repository__title'>" + repo.full_name + "</div>";
|
||||
|
||||
if (repo.description) {
|
||||
markup += "<div class='select2-result-repository__description'>" + repo.description + "</div>";
|
||||
}
|
||||
|
||||
markup += "<div class='select2-result-repository__statistics'>" +
|
||||
"<div class='select2-result-repository__forks'><i class='fa fa-flash'></i> " + repo.forks_count + " Forks</div>" +
|
||||
"<div class='select2-result-repository__stargazers'><i class='fa fa-star'></i> " + repo.stargazers_count + " Stars</div>" +
|
||||
"<div class='select2-result-repository__watchers'><i class='fa fa-eye'></i> " + repo.watchers_count + " Watchers</div>" +
|
||||
"</div>" +
|
||||
"</div></div>";
|
||||
|
||||
return markup;
|
||||
}
|
||||
|
||||
function formatRepoSelection (repo) {
|
||||
return repo.full_name || repo.text;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// loading array data
|
||||
var data = [
|
||||
{
|
||||
id: 0,
|
||||
text: 'enhancement'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
text: 'bug'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
text: 'duplicate'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
text: 'invalid'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
text: 'wontfix'
|
||||
}
|
||||
];
|
||||
$(".js-example-data-array").select2({
|
||||
data: data
|
||||
})
|
||||
|
||||
|
||||
//automatic selection
|
||||
$('#automatic-selection').select2({
|
||||
selectOnClose: true
|
||||
});
|
||||
|
||||
|
||||
//remain open after selection
|
||||
$('#remain-open').select2({
|
||||
closeOnSelect: false
|
||||
});
|
||||
|
||||
|
||||
//dropdown-placement
|
||||
$('#dropdown-placement').select2({
|
||||
dropdownParent: $('#select2-modal')
|
||||
});
|
||||
|
||||
|
||||
// limit the number of selection
|
||||
$('#limit-selection').select2({
|
||||
maximumSelectionLength: 2
|
||||
});
|
||||
|
||||
|
||||
// dynamic option
|
||||
$('#dynamic-option-creation').select2({
|
||||
tags: true
|
||||
});
|
||||
|
||||
|
||||
// tagging with multi value select box
|
||||
$('#multi-value-select').select2({
|
||||
tags: true
|
||||
});
|
||||
|
||||
|
||||
// single-select-placeholder
|
||||
$(".single-select-placeholder").select2({
|
||||
placeholder: "Select a state",
|
||||
allowClear: true
|
||||
});
|
||||
|
||||
|
||||
// multi select placeholder
|
||||
$(".multi-select-placeholder").select2({
|
||||
placeholder: "Select a state"
|
||||
});
|
||||
|
||||
|
||||
//default selection placeholder
|
||||
$(".default-placeholder").select2({
|
||||
placeholder: {
|
||||
id: '-1', // the value of the option
|
||||
text: 'Select an option'
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// customizing how results are matched
|
||||
function matchCustom(params, data) {
|
||||
// If there are no search terms, return all of the data
|
||||
if ($.trim(params.term) === '') {
|
||||
return data;
|
||||
}
|
||||
|
||||
// Do not display the item if there is no 'text' property
|
||||
if (typeof data.text === 'undefined') {
|
||||
return null;
|
||||
}
|
||||
|
||||
// `params.term` should be the term that is used for searching
|
||||
// `data.text` is the text that is displayed for the data object
|
||||
if (data.text.indexOf(params.term) > -1) {
|
||||
var modifiedData = $.extend({}, data, true);
|
||||
modifiedData.text += ' (matched)';
|
||||
|
||||
// You can return modified objects from here
|
||||
// This includes matching the `children` how you want in nested data sets
|
||||
return modifiedData;
|
||||
}
|
||||
|
||||
// Return `null` if the term should not be displayed
|
||||
return null;
|
||||
}
|
||||
$(".customize-result").select2({
|
||||
matcher: matchCustom
|
||||
});
|
||||
|
||||
|
||||
// matching grouped options
|
||||
|
||||
function matchStart(params, data) {
|
||||
// If there are no search terms, return all of the data
|
||||
if ($.trim(params.term) === '') {
|
||||
return data;
|
||||
}
|
||||
|
||||
// Skip if there is no 'children' property
|
||||
if (typeof data.children === 'undefined') {
|
||||
return null;
|
||||
}
|
||||
|
||||
// `data.children` contains the actual options that we are matching against
|
||||
var filteredChildren = [];
|
||||
$.each(data.children, function (idx, child) {
|
||||
if (child.text.toUpperCase().indexOf(params.term.toUpperCase()) == 0) {
|
||||
filteredChildren.push(child);
|
||||
}
|
||||
});
|
||||
|
||||
// If we matched any of the timezone group's children, then set the matched children on the group
|
||||
// and return the group object
|
||||
if (filteredChildren.length) {
|
||||
var modifiedData = $.extend({}, data, true);
|
||||
modifiedData.children = filteredChildren;
|
||||
|
||||
// You can return modified objects from here
|
||||
// This includes matching the `children` how you want in nested data sets
|
||||
return modifiedData;
|
||||
}
|
||||
|
||||
// Return `null` if the term should not be displayed
|
||||
return null;
|
||||
}
|
||||
$(".match-grouped-options").select2({
|
||||
matcher: matchStart
|
||||
});
|
||||
|
||||
|
||||
//minimum search term length
|
||||
$(".minimum-search-length").select2({
|
||||
minimumInputLength: 3 // only start searching when the user has input 3 or more characters
|
||||
});
|
||||
|
||||
//maximum search term length
|
||||
$(".maximum-search-length").select2({
|
||||
maximumInputLength: 20 // only allow terms up to 20 characters long
|
||||
});
|
||||
|
||||
|
||||
// programmatically add new option
|
||||
var data = {
|
||||
id: 1,
|
||||
text: 'New Item'
|
||||
};
|
||||
var newOption = new Option(data.text, data.id, false, false);
|
||||
$(".add-new-options").append(newOption).trigger('change').select2();
|
||||
|
||||
|
||||
// create if not exists
|
||||
|
||||
// Set the value, creating a new option if necessary
|
||||
if ($('.create-if-not-exists').find("option[value='" + data.id + "']").length) {
|
||||
$('.create-if-not-exists').val(data.id).trigger('change');
|
||||
} else {
|
||||
// Create a DOM Option and pre-select by default
|
||||
var newOption = new Option(data.text, data.id, true, true);
|
||||
// Append it to the select
|
||||
$('.create-if-not-exists').append(newOption).trigger('change').select2();
|
||||
}
|
||||
|
||||
|
||||
|
||||
// using jquery selector
|
||||
|
||||
$('.jquery-selector').select2();
|
||||
$('.jquery-selector').on("change", function(){
|
||||
var selectData = $(this).find(':selected');
|
||||
var value = selectData.val();
|
||||
alert("you select " + value);
|
||||
});
|
||||
|
||||
|
||||
// select2 rtl support
|
||||
$(".rtl-select2").select2({
|
||||
dir: "rtl"
|
||||
});
|
||||
|
||||
|
||||
// destroy selector
|
||||
$(".destroy-selector").select2();
|
||||
|
||||
$("#destroy-selector-trigger").on("click", function(){
|
||||
var selectDestroy = $(".destroy-selector").select2();
|
||||
selectDestroy.select2('destroy');
|
||||
});
|
||||
|
||||
|
||||
// opening options
|
||||
var selectOpen = $(".opening-dropdown").select2();
|
||||
$("#dropdown-trigger-open").on("click", function(){
|
||||
selectOpen.select2('open');
|
||||
});
|
||||
|
||||
|
||||
// open or close dropdown
|
||||
var selectToggle = $(".open-close-dropdown").select2();
|
||||
$("#opening-dropdown-trigger").on("click", function(){
|
||||
selectToggle.select2('open');
|
||||
});
|
||||
$("#closing-dropdown-trigger").on("click", function(){
|
||||
selectToggle.select2('close');
|
||||
});
|
||||
|
||||
|
||||
// select2 methods
|
||||
var singleOption = $(".single-event-unbind").select2();
|
||||
|
||||
$(".js-programmatic-set-val").on("click", function () {
|
||||
singleOption.val("CA").trigger("change");
|
||||
});
|
||||
|
||||
$(".js-programmatic-open").on("click", function () {
|
||||
singleOption.select2("open");
|
||||
});
|
||||
|
||||
$(".js-programmatic-close").on("click", function () {
|
||||
singleOption.select2("close");
|
||||
});
|
||||
|
||||
$(".js-programmatic-init").on("click", function () {
|
||||
singleOption.select2({
|
||||
width: "400px"
|
||||
});
|
||||
});
|
||||
|
||||
$(".js-programmatic-destroy").on("click", function () {
|
||||
singleOption.select2("destroy");
|
||||
});
|
||||
|
||||
|
||||
var $unbindMulti = $(".js-example-programmatic-multi").select2();
|
||||
$(".js-programmatic-multi-set-val").on("click", function () {
|
||||
$unbindMulti.val(["CA", "HA"]).trigger("change");
|
||||
});
|
||||
|
||||
$(".js-programmatic-multi-clear").on("click", function () {
|
||||
$unbindMulti.val(null).trigger("change");
|
||||
});
|
||||
|
||||
|
||||
})(jQuery);
|
||||
284
public/js/plugins-init/sparkline-init.js
Normal file
284
public/js/plugins-init/sparkline-init.js
Normal file
@@ -0,0 +1,284 @@
|
||||
(function($) {
|
||||
"use strict"
|
||||
|
||||
var dlabSparkLine = function(){
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
function getSparkLineGraphBlockSize(selector)
|
||||
{
|
||||
var screenWidth = $(window).width();
|
||||
var graphBlockSize = '100%';
|
||||
|
||||
if(screenWidth <= 768)
|
||||
{
|
||||
screenWidth = (screenWidth < 300 )?screenWidth:300;
|
||||
|
||||
var blockWidth = jQuery(selector).parent().innerWidth() - jQuery(selector).parent().width();
|
||||
|
||||
blockWidth = Math.abs(blockWidth);
|
||||
|
||||
var graphBlockSize = screenWidth - blockWidth - 10;
|
||||
}
|
||||
|
||||
|
||||
|
||||
return graphBlockSize;
|
||||
|
||||
}
|
||||
|
||||
var sparkLineDash = function(){
|
||||
// Line Chart
|
||||
if(jQuery('#sparklinedash').length > 0 ){
|
||||
$("#sparklinedash").sparkline([10, 15, 26, 27, 28, 31, 34, 40, 41, 44, 49, 64, 68, 69, 72], {
|
||||
type: "bar",
|
||||
height: "50",
|
||||
barWidth: "4",
|
||||
resize: !0,
|
||||
barSpacing: "5",
|
||||
barColor: "#f93a0b"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var sparkLine8 = function(){
|
||||
if(jQuery('#sparkline8').length > 0 ){
|
||||
$("#sparkline8").sparkline([79, 72, 29, 6, 52, 32, 73, 40, 14, 75, 77, 39, 9, 15, 10], {
|
||||
type: "line",
|
||||
//width: "100%",
|
||||
width: getSparkLineGraphBlockSize('#sparkline8'),
|
||||
height: "50",
|
||||
lineColor: "#f93a0b",
|
||||
fillColor: "rgba(249, 58, 11, .5)",
|
||||
minSpotColor: "#f93a0b",
|
||||
maxSpotColor: "#f93a0b",
|
||||
highlightLineColor: "#f93a0b",
|
||||
highlightSpotColor: "#f93a0b",
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var sparkLine9 = function(){
|
||||
if(jQuery('#sparkline9').length > 0 ){
|
||||
$("#sparkline9").sparkline([27, 31, 35, 28, 45, 52, 24, 4, 50, 11, 54, 49, 72, 59, 75], {
|
||||
type: "line",
|
||||
//width: "100%",
|
||||
width: getSparkLineGraphBlockSize('#sparkline9'),
|
||||
height: "50",
|
||||
lineColor: "#ff5c00",
|
||||
fillColor: "rgba(255, 92, 0, .5)",
|
||||
minSpotColor: "#ff5c00",
|
||||
maxSpotColor: "#ff5c00",
|
||||
highlightLineColor: "rgb(255, 159, 0)",
|
||||
highlightSpotColor: "#ff5c00"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Bar Chart
|
||||
var sparkBar = function(){
|
||||
if(jQuery('#spark-bar').length > 0 ){
|
||||
$("#spark-bar").sparkline([33, 22, 68, 54, 8, 30, 74, 7, 36, 5, 41, 19, 43, 29, 38], {
|
||||
type: "bar",
|
||||
height: "200",
|
||||
barWidth: 6,
|
||||
barSpacing: 7,
|
||||
barColor: "#145650"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var sparkBar2 = function(){
|
||||
if(jQuery('#spark-bar-2').length > 0 ){
|
||||
$("#spark-bar-2").sparkline([33, 22, 68, 54, 8, 30, 74, 7, 36, 5, 41, 19, 43, 29, 38], {
|
||||
type: "bar",
|
||||
height: "140",
|
||||
width: 100,
|
||||
barWidth: 10,
|
||||
barSpacing: 10,
|
||||
barColor: "rgb(255, 206, 120)"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var stackedBarChart = function(){
|
||||
if(jQuery('#StackedBarChart').length > 0 ){
|
||||
$('#StackedBarChart').sparkline([
|
||||
[1, 4, 2],
|
||||
[2, 3, 2],
|
||||
[3, 2, 2],
|
||||
[4, 1, 2]
|
||||
], {
|
||||
type: "bar",
|
||||
height: "200",
|
||||
barWidth: 10,
|
||||
barSpacing: 7,
|
||||
stackedBarColor: ['#f93a0b', '#145650', '#ff5c00']
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var triState = function(){
|
||||
if(jQuery('#tristate').length > 0 ){
|
||||
|
||||
$("#tristate").sparkline([1, 1, 0, 1, -1, -1, 1, -1, 0, 0, 1, 1], {
|
||||
type: 'tristate',
|
||||
height: "200",
|
||||
barWidth: 10,
|
||||
barSpacing: 7,
|
||||
colorMap: ['#f93a0b', '#145650', '#ff5c00'],
|
||||
negBarColor: '#ff5c00'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var compositeBar = function(){
|
||||
// Composite
|
||||
if(jQuery('#composite-bar').length > 0 ){
|
||||
$("#composite-bar").sparkline([73, 53, 50, 67, 3, 56, 19, 59, 37, 32, 40, 26, 71, 19, 4, 53, 55, 31, 37], {
|
||||
type: "bar",
|
||||
height: "200",
|
||||
barWidth: "10",
|
||||
resize: true,
|
||||
// barSpacing: "7",
|
||||
barColor: "#f93a0b",
|
||||
width: '100%',
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var sparklineCompositeChart = function(){
|
||||
if(jQuery('#sparkline-composite-chart').length > 0 ){
|
||||
$("#sparkline-composite-chart").sparkline([5, 6, 7, 2, 0, 3, 6, 8, 1, 2, 2, 0, 3, 6], {
|
||||
type: 'line',
|
||||
width: '100%',
|
||||
height: '200',
|
||||
barColor: '#145650',
|
||||
colorMap: ['#145650', '#ff5c00']
|
||||
});
|
||||
}
|
||||
if(jQuery('#sparkline-composite-chart').length > 0 ){
|
||||
$("#sparkline-composite-chart").sparkline([5, 6, 7, 2, 0, 3, 6, 8, 1, 2, 2, 0, 3, 6], {
|
||||
type: 'bar',
|
||||
height: '150px',
|
||||
width: '100%',
|
||||
barWidth: 10,
|
||||
barSpacing: 5,
|
||||
barColor: '#34C73B',
|
||||
negBarColor: '#34C73B',
|
||||
composite: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var sparkLine11 = function(){
|
||||
if(jQuery('#sparkline11').length > 0 ){
|
||||
//Pie
|
||||
$("#sparkline11").sparkline([24, 61, 51], {
|
||||
type: "pie",
|
||||
height: "100px",
|
||||
resize: !0,
|
||||
sliceColors: ["rgba(192, 10, 39, .5)", "rgba(0, 0, 128, .5)", "rgba(249, 58, 11, .5)"]
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var sparkLine12 = function(){
|
||||
if(jQuery('#sparkline12').length > 0 ){
|
||||
//Pie
|
||||
$("#sparkline12").sparkline([24, 61, 51], {
|
||||
type: "pie",
|
||||
height: "100",
|
||||
resize: !0,
|
||||
sliceColors: ["rgba(179, 204, 255, 1)", "rgba(157, 189, 255, 1)", "rgba(112, 153, 237, 1)"]
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var bulletChart = function(){
|
||||
if(jQuery('#bullet-chart').length > 0 ){
|
||||
// Bullet
|
||||
$("#bullet-chart").sparkline([10, 12, 12, 9, 7], {
|
||||
type: 'bullet',
|
||||
height: '100',
|
||||
width: '100%',
|
||||
targetOptions: { // Options related with look and position of targets
|
||||
width: '100%', // The width of the target
|
||||
height: 3, // The height of the target
|
||||
borderWidth: 0, // The border width of the target
|
||||
borderColor: 'black', // The border color of the target
|
||||
color: 'black' // The color of the target
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var boxPlot = function(){
|
||||
if(jQuery('#boxplot').length > 0 ){
|
||||
//Boxplot
|
||||
$("#boxplot").sparkline([4,27,34,52,54,59,61,68,78,82,85,87,91,93,100], {
|
||||
type: 'box'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Function ============ */
|
||||
return {
|
||||
init:function(){
|
||||
},
|
||||
|
||||
|
||||
load:function(){
|
||||
sparkLineDash();
|
||||
sparkLine8();
|
||||
sparkLine9();
|
||||
sparkBar();
|
||||
sparkBar2();
|
||||
stackedBarChart();
|
||||
triState();
|
||||
compositeBar();
|
||||
sparklineCompositeChart();
|
||||
bulletChart();
|
||||
sparkLine11();
|
||||
sparkLine12();
|
||||
boxPlot();
|
||||
},
|
||||
|
||||
resize:function(){
|
||||
sparkLineDash();
|
||||
sparkLine8();
|
||||
sparkLine9();
|
||||
sparkBar();
|
||||
sparkBar2();
|
||||
stackedBarChart();
|
||||
triState();
|
||||
compositeBar();
|
||||
sparklineCompositeChart();
|
||||
bulletChart();
|
||||
sparkLine11();
|
||||
sparkLine12();
|
||||
boxPlot();
|
||||
}
|
||||
}
|
||||
|
||||
}();
|
||||
|
||||
jQuery(document).ready(function(){
|
||||
});
|
||||
|
||||
jQuery(window).on('load',function(){
|
||||
setTimeout(function(){
|
||||
dlabSparkLine.resize();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
jQuery(window).on('resize',function(){
|
||||
setTimeout(function(){
|
||||
dlabSparkLine.resize();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
16
public/js/plugins-init/summernote-init.js
Normal file
16
public/js/plugins-init/summernote-init.js
Normal file
@@ -0,0 +1,16 @@
|
||||
"use strict"
|
||||
|
||||
jQuery(document).ready(function() {
|
||||
$(".summernote").summernote({
|
||||
height: 190,
|
||||
minHeight: null,
|
||||
maxHeight: null,
|
||||
focus: !1
|
||||
}), $(".inline-editor").summernote({
|
||||
airMode: !0
|
||||
})
|
||||
}), window.edit = function() {
|
||||
$(".click2edit").summernote()
|
||||
}, window.save = function() {
|
||||
$(".click2edit").summernote("destroy")
|
||||
};
|
||||
88
public/js/plugins-init/sweetalert-init.js
Normal file
88
public/js/plugins-init/sweetalert-init.js
Normal file
@@ -0,0 +1,88 @@
|
||||
(function ($) {
|
||||
"use strict"
|
||||
|
||||
/*******************
|
||||
Sweet-alert JS
|
||||
*******************/
|
||||
|
||||
document.querySelector(".sweet-wrong").onclick = function () {
|
||||
sweetAlert("Oops...", "Something went wrong !!", "error")
|
||||
}, document.querySelector(".sweet-message").onclick = function () {
|
||||
swal("Hey, Here's a message !!")
|
||||
}, document.querySelector(".sweet-text").onclick = function () {
|
||||
swal("Hey, Here's a message !!", "It's pretty, isn't it?")
|
||||
}, document.querySelector(".sweet-success").onclick = function () {
|
||||
swal("Hey, Good job !!", "You clicked the button !!", "success")
|
||||
}, document.querySelector(".sweet-confirm").onclick = function () {
|
||||
swal({
|
||||
title: "Are you sure to delete ?",
|
||||
text: "You will not be able to recover this imaginary file !!",
|
||||
type: "warning",
|
||||
showCancelButton: !0,
|
||||
confirmButtonColor: "#DD6B55",
|
||||
confirmButtonText: "Yes, delete it !!",
|
||||
closeOnConfirm: !1
|
||||
}, function () {
|
||||
swal("Deleted !!", "Hey, your imaginary file has been deleted !!", "success")
|
||||
})
|
||||
}, document.querySelector(".sweet-success-cancel").onclick = function () {
|
||||
swal({
|
||||
title: "Are you sure to delete ?",
|
||||
text: "You will not be able to recover this imaginary file !!",
|
||||
type: "warning",
|
||||
showCancelButton: !0,
|
||||
confirmButtonColor: "#DD6B55",
|
||||
confirmButtonText: "Yes, delete it !!",
|
||||
cancelButtonText: "No, cancel it !!",
|
||||
closeOnConfirm: !1,
|
||||
closeOnCancel: !1
|
||||
}, function (e) {
|
||||
e ? swal("Deleted !!", "Hey, your imaginary file has been deleted !!", "success") : swal("Cancelled !!", "Hey, your imaginary file is safe !!", "error")
|
||||
})
|
||||
}, document.querySelector(".sweet-image-message").onclick = function () {
|
||||
swal({
|
||||
title: "Sweet !!",
|
||||
text: "Hey, Here's a custom image !!",
|
||||
imageUrl: "../assets/images/hand.jpg"
|
||||
})
|
||||
}, document.querySelector(".sweet-html").onclick = function () {
|
||||
swal({
|
||||
title: "Sweet !!",
|
||||
text: "<span style='color:#ff0000'>Hey, you are using HTML !!<span>",
|
||||
html: !0
|
||||
})
|
||||
}, document.querySelector(".sweet-auto").onclick = function () {
|
||||
swal({
|
||||
title: "Sweet auto close alert !!",
|
||||
text: "Hey, i will close in 2 seconds !!",
|
||||
timer: 2e3,
|
||||
showConfirmButton: !1
|
||||
})
|
||||
}, document.querySelector(".sweet-prompt").onclick = function () {
|
||||
swal({
|
||||
title: "Enter an input !!",
|
||||
text: "Write something interesting !!",
|
||||
type: "input",
|
||||
showCancelButton: !0,
|
||||
closeOnConfirm: !1,
|
||||
animation: "slide-from-top",
|
||||
inputPlaceholder: "Write something"
|
||||
}, function (e) {
|
||||
return !1 !== e && ("" === e ? (swal.showInputError("You need to write something!"), !1) : void swal("Hey !!", "You wrote: " + e, "success"))
|
||||
})
|
||||
}, document.querySelector(".sweet-ajax").onclick = function () {
|
||||
swal({
|
||||
title: "Sweet ajax request !!",
|
||||
text: "Submit to run ajax request !!",
|
||||
type: "info",
|
||||
showCancelButton: !0,
|
||||
closeOnConfirm: !1,
|
||||
showLoaderOnConfirm: !0
|
||||
}, function () {
|
||||
setTimeout(function () {
|
||||
swal("Hey, your ajax request finished !!")
|
||||
}, 2e3)
|
||||
})
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
2
public/js/plugins-init/sweetalert.init.js
Normal file
2
public/js/plugins-init/sweetalert.init.js
Normal file
@@ -0,0 +1,2 @@
|
||||
"use strict"
|
||||
document.querySelector(".sweet-wrong").onclick = function () { Swal.fire("Oops...", "Something went wrong !!", "error") }, document.querySelector(".sweet-message").onclick = function () { Swal.fire("Hey, Here's a message !!") }, document.querySelector(".sweet-text").onclick = function () { Swal.fire("Hey, Here's a message !!", "It's pretty, isn't it?") }, document.querySelector(".sweet-success").onclick = function () { Swal.fire("Hey, Good job !!", "You clicked the button !!", "success") }, document.querySelector(".sweet-confirm").onclick = function () { Swal.fire({ title: "Are you sure to delete ?", text: "You will not be able to recover this imaginary file !!", type: "warning", showCancelButton: !0, confirmButtonColor: "#DD6B55", confirmButtonText: "Yes, delete it !!", closeOnConfirm: !1 }, function () { Swal.fire("Deleted !!", "Hey, your imaginary file has been deleted !!", "success") }) }, document.querySelector(".sweet-success-cancel").onclick = function () { Swal.fire({ title: "Are you sure to delete ?", text: "You will not be able to recover this imaginary file !!", type: "warning", showCancelButton: !0, confirmButtonColor: "#DD6B55", confirmButtonText: "Yes, delete it !!", cancelButtonText: "No, cancel it !!", closeOnConfirm: !1, closeOnCancel: !1 }, function (e) { e ? Swal.fire("Deleted !!", "Hey, your imaginary file has been deleted !!", "success") : Swal.fire("Cancelled !!", "Hey, your imaginary file is safe !!", "error") }) }, document.querySelector(".sweet-image-message").onclick = function () { Swal.fire({ title: "Sweet !!", text: "Hey, Here's a custom image !!", imageUrl: "images/hand.png", imageWidth : 80, imageHeight : 80,imageClass : "sweet-image" }) }, document.querySelector(".sweet-html").onclick = function () { Swal.fire({ title: "Sweet !!", text: "<span style='color:#ff0000'>Hey, you are using HTML !!<span>", html: !0 }) }, document.querySelector(".sweet-auto").onclick = function () { Swal.fire({ title: "Sweet auto close alert !!", text: "Hey, i will close in 2 seconds !!", timer: 2e3, showConfirmButton: !1 }) }, document.querySelector(".sweet-prompt").onclick = function () { Swal.fire({ title: "Enter an input !!", text: "Write something interesting !!", type: "input", showCancelButton: !0, closeOnConfirm: !1, animation: "slide-from-top", inputPlaceholder: "Write something" }, function (e) { return !1 !== e && ("" === e ? (Swal.fire.showInputError("You need to write something!"), !1) : void Swal.fire("Hey !!", "You wrote: " + e, "success")) }) }, document.querySelector(".sweet-ajax").onclick = function () { Swal.fire({ title: "Sweet ajax request !!", text: "Submit to run ajax request !!", type: "info", showCancelButton: !0, closeOnConfirm: !1, showLoaderOnConfirm: !0 }, function () { setTimeout(function () { Swal.fire("Hey, your ajax request finished !!") }, 2e3) }) };
|
||||
711
public/js/plugins-init/toastr-init.js
Normal file
711
public/js/plugins-init/toastr-init.js
Normal file
@@ -0,0 +1,711 @@
|
||||
(function ($) {
|
||||
"use strict"
|
||||
|
||||
|
||||
/*******************
|
||||
Toastr
|
||||
*******************/
|
||||
|
||||
$("#toastr-success-top-right").on("click", function () {
|
||||
toastr.success("This Is Success Message", "Top Right", {
|
||||
timeOut: 500000000,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
positionClass: "toast-top-right",
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-success-bottom-right").on("click", function () {
|
||||
toastr.success("This Is Success Message", "Bottom Right", {
|
||||
positionClass: "toast-bottom-right",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-success-bottom-left").on("click", function () {
|
||||
toastr.success("This Is Success Message", "Bottom Left", {
|
||||
positionClass: "toast-bottom-left",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-success-top-left").on("click", function () {
|
||||
toastr.success("This Is Success Message", "Top Left", {
|
||||
positionClass: "toast-top-left",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-success-top-full-width").on("click", function () {
|
||||
toastr.success("This Is Success Message", "Top Full Width", {
|
||||
positionClass: "toast-top-full-width",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-success-bottom-full-width").on("click", function () {
|
||||
toastr.success("This Is Success Message", "Bottom Full Width", {
|
||||
positionClass: "toast-bottom-full-width",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-success-top-center").on("click", function () {
|
||||
toastr.success("This Is Success Message", "Top Center", {
|
||||
positionClass: "toast-top-center",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-success-bottom-center").on("click", function () {
|
||||
toastr.success("This Is Success Message", "Bottom Center", {
|
||||
positionClass: "toast-bottom-center",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-info-top-right").on("click", function () {
|
||||
toastr.info("This Is info Message", "Top Right", {
|
||||
positionClass: "toast-top-right",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-info-bottom-right").on("click", function () {
|
||||
toastr.info("This Is info Message", "Bottom Right", {
|
||||
positionClass: "toast-bottom-right",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-info-bottom-left").on("click", function () {
|
||||
toastr.info("This Is info Message", "Bottom Left", {
|
||||
positionClass: "toast-bottom-left",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-info-top-left").on("click", function () {
|
||||
toastr.info("This Is info Message", "Top Left", {
|
||||
positionClass: "toast-top-left",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-info-top-full-width").on("click", function () {
|
||||
toastr.info("This Is info Message", "Top Full Width", {
|
||||
positionClass: "toast-top-full-width",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-info-bottom-full-width").on("click", function () {
|
||||
toastr.info("This Is info Message", "Bottom Full Width", {
|
||||
positionClass: "toast-bottom-full-width",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-info-top-center").on("click", function () {
|
||||
toastr.info("This Is info Message", "Top Center", {
|
||||
positionClass: "toast-top-center",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-info-bottom-center").on("click", function () {
|
||||
toastr.info("This Is info Message", "Bottom Center", {
|
||||
positionClass: "toast-bottom-center",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-warning-top-right").on("click", function () {
|
||||
toastr.warning("This Is warning Message", "Top Right", {
|
||||
positionClass: "toast-top-right",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-warning-bottom-right").on("click", function () {
|
||||
toastr.warning("This Is warning Message", "Bottom Right", {
|
||||
positionClass: "toast-bottom-right",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-warning-bottom-left").on("click", function () {
|
||||
toastr.warning("This Is warning Message", "Bottom Left", {
|
||||
positionClass: "toast-bottom-left",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-warning-top-left").on("click", function () {
|
||||
toastr.warning("This Is warning Message", "Top Left", {
|
||||
positionClass: "toast-top-left",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-warning-top-full-width").on("click", function () {
|
||||
toastr.warning("This Is warning Message", "Top Full Width", {
|
||||
positionClass: "toast-top-full-width",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-warning-bottom-full-width").on("click", function () {
|
||||
toastr.warning("This Is warning Message", "Bottom Full Width", {
|
||||
positionClass: "toast-bottom-full-width",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-warning-top-center").on("click", function () {
|
||||
toastr.warning("This Is warning Message", "Top Center", {
|
||||
positionClass: "toast-top-center",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-warning-bottom-center").on("click", function () {
|
||||
toastr.warning("This Is warning Message", "Bottom Center", {
|
||||
positionClass: "toast-bottom-center",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-danger-top-right").on("click", function () {
|
||||
toastr.error("This Is error Message", "Top Right", {
|
||||
positionClass: "toast-top-right",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-danger-bottom-right").on("click", function () {
|
||||
toastr.error("This Is error Message", "Bottom Right", {
|
||||
positionClass: "toast-bottom-right",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-danger-bottom-left").on("click", function () {
|
||||
toastr.error("This Is error Message", "Bottom Left", {
|
||||
positionClass: "toast-bottom-left",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-danger-top-left").on("click", function () {
|
||||
toastr.error("This Is error Message", "Top Left", {
|
||||
positionClass: "toast-top-left",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-danger-top-full-width").on("click", function () {
|
||||
toastr.error("This Is error Message", "Top Full Width", {
|
||||
positionClass: "toast-top-full-width",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-danger-bottom-full-width").on("click", function () {
|
||||
toastr.error("This Is error Message", "Bottom Full Width", {
|
||||
positionClass: "toast-bottom-full-width",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-danger-top-center").on("click", function () {
|
||||
toastr.error("This Is error Message", "Top Center", {
|
||||
positionClass: "toast-top-center",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
}
|
||||
|
||||
),
|
||||
$("#toastr-danger-bottom-center").on("click", function () {
|
||||
toastr.error("This Is error Message", "Bottom Center", {
|
||||
positionClass: "toast-bottom-center",
|
||||
timeOut: 5e3,
|
||||
closeButton: !0,
|
||||
debug: !1,
|
||||
newestOnTop: !0,
|
||||
progressBar: !0,
|
||||
preventDuplicates: !0,
|
||||
onclick: null,
|
||||
showDuration: "300",
|
||||
hideDuration: "1000",
|
||||
extendedTimeOut: "1000",
|
||||
showEasing: "swing",
|
||||
hideEasing: "linear",
|
||||
showMethod: "fadeIn",
|
||||
hideMethod: "fadeOut",
|
||||
tapToDismiss: !1
|
||||
})
|
||||
});
|
||||
})(jQuery);
|
||||
1408
public/js/plugins-init/widgets-script-init.js
Normal file
1408
public/js/plugins-init/widgets-script-init.js
Normal file
File diff suppressed because it is too large
Load Diff
10
public/js/select2.js
Executable file
10
public/js/select2.js
Executable file
@@ -0,0 +1,10 @@
|
||||
(function($) {
|
||||
'use strict';
|
||||
|
||||
if ($(".js-example-basic-single").length) {
|
||||
$(".js-example-basic-single").select2();
|
||||
}
|
||||
if ($(".js-example-basic-multiple").length) {
|
||||
$(".js-example-basic-multiple").select2();
|
||||
}
|
||||
})(jQuery);
|
||||
381
public/js/settings.js
Normal file
381
public/js/settings.js
Normal file
@@ -0,0 +1,381 @@
|
||||
|
||||
var body = $('body');
|
||||
var html = $('html');
|
||||
|
||||
|
||||
|
||||
function dlabSettings({typography, version, layout, navheaderBg, headerBg, sidebarStyle, sidebarBg, sidebarPosition, headerPosition, containerLayout, direction, primary}) {
|
||||
this.typography = typography || "roboto";
|
||||
this.version = version || "light";
|
||||
this.layout = layout || "vertical";
|
||||
this.navheaderBg = navheaderBg || "color_1";
|
||||
this.headerBg = headerBg || "color_1";
|
||||
this.sidebarStyle = sidebarStyle || "full";
|
||||
this.sidebarBg = sidebarBg || "color_1";
|
||||
this.sidebarPosition = sidebarPosition || "static";
|
||||
this.headerPosition = headerPosition || "static";
|
||||
this.containerLayout = containerLayout || "wide";
|
||||
this.direction = direction || "ltr";
|
||||
this.primary = primary || "color_1";
|
||||
|
||||
// this.manageTypography();
|
||||
this.manageVersion();
|
||||
this.manageLayout();
|
||||
this.manageNavHeaderBg();
|
||||
this.manageHeaderBg();
|
||||
this.manageSidebarStyle();
|
||||
this.manageSidebarBg();
|
||||
this.manageSidebarPosition();
|
||||
this.manageHeaderPosition();
|
||||
this.manageContainerLayout();
|
||||
this.manageRtlLayout();
|
||||
this.manageResponsiveSidebar();
|
||||
this.managePrimaryColor();
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
dlabSettings.prototype.manageVersion = function() {
|
||||
switch(this.version) {
|
||||
case "light":
|
||||
body.attr("data-theme-version", "light");
|
||||
break;
|
||||
case "dark":
|
||||
body.attr("data-theme-version", "dark");
|
||||
break;
|
||||
case "transparent":
|
||||
body.attr("data-theme-version", "transparent");
|
||||
break;
|
||||
default:
|
||||
body.attr("data-theme-version", "light");
|
||||
}
|
||||
}
|
||||
|
||||
dlabSettings.prototype.manageTypography = function() {
|
||||
switch(this.version) {
|
||||
case "poppins":
|
||||
body.attr("data-typography", "poppins");
|
||||
break;
|
||||
case "roboto":
|
||||
body.attr("data-typography", "roboto");
|
||||
break;
|
||||
case "opensans":
|
||||
body.attr("data-typography", "opensans");
|
||||
break;
|
||||
case "helvetica":
|
||||
body.attr("data-typography", "helvetica");
|
||||
break;
|
||||
default:
|
||||
body.attr("data-typography", "roboto");
|
||||
}
|
||||
}
|
||||
|
||||
dlabSettings.prototype.manageLayout = function() {
|
||||
switch(this.layout) {
|
||||
case "horizontal":
|
||||
this.sidebarStyle === "overlay" ? body.attr("data-sidebar-style", "full") : body.attr("data-sidebar-style", `${this.sidebarStyle}`);
|
||||
body.attr("data-layout", "horizontal");
|
||||
break;
|
||||
case "vertical":
|
||||
body.attr("data-layout", "vertical");
|
||||
break;
|
||||
default:
|
||||
body.attr("data-layout", "vertical");
|
||||
}
|
||||
}
|
||||
|
||||
dlabSettings.prototype.manageNavHeaderBg = function() {
|
||||
switch(this.navheaderBg) {
|
||||
case "color_1":
|
||||
body.attr("data-nav-headerbg", "color_1");
|
||||
break;
|
||||
case "color_2":
|
||||
body.attr("data-nav-headerbg", "color_2");
|
||||
break;
|
||||
case "color_3":
|
||||
body.attr("data-nav-headerbg", "color_3");
|
||||
break;
|
||||
case "color_4":
|
||||
body.attr("data-nav-headerbg", "color_4");
|
||||
break;
|
||||
case "color_5":
|
||||
body.attr("data-nav-headerbg", "color_5");
|
||||
break;
|
||||
case "color_6":
|
||||
body.attr("data-nav-headerbg", "color_6");
|
||||
break;
|
||||
case "color_7":
|
||||
body.attr("data-nav-headerbg", "color_7");
|
||||
break;
|
||||
case "color_8":
|
||||
body.attr("data-nav-headerbg", "color_8");
|
||||
break;
|
||||
case "color_9":
|
||||
body.attr("data-nav-headerbg", "color_9");
|
||||
break;
|
||||
case "color_10":
|
||||
body.attr("data-nav-headerbg", "color_10");
|
||||
break;
|
||||
case "image_1":
|
||||
body.attr("data-nav-headerbg", "image_1");
|
||||
break;
|
||||
case "image_2":
|
||||
body.attr("data-nav-headerbg", "image_2");
|
||||
break;
|
||||
case "image_3":
|
||||
body.attr("data-nav-headerbg", "image_3");
|
||||
break;
|
||||
default:
|
||||
body.attr("data-nav-headerbg", "color_1");
|
||||
}
|
||||
}
|
||||
|
||||
dlabSettings.prototype.manageHeaderBg = function() {
|
||||
switch(this.headerBg) {
|
||||
case "color_1":
|
||||
body.attr("data-headerbg", "color_1");
|
||||
break;
|
||||
case "color_2":
|
||||
body.attr("data-headerbg", "color_2");
|
||||
break;
|
||||
case "color_3":
|
||||
body.attr("data-headerbg", "color_3");
|
||||
break;
|
||||
case "color_4":
|
||||
body.attr("data-headerbg", "color_4");
|
||||
break;
|
||||
case "color_5":
|
||||
body.attr("data-headerbg", "color_5");
|
||||
break;
|
||||
case "color_6":
|
||||
body.attr("data-headerbg", "color_6");
|
||||
break;
|
||||
case "color_7":
|
||||
body.attr("data-headerbg", "color_7");
|
||||
break;
|
||||
case "color_8":
|
||||
body.attr("data-headerbg", "color_8");
|
||||
break;
|
||||
case "color_9":
|
||||
body.attr("data-headerbg", "color_9");
|
||||
break;
|
||||
case "color_10":
|
||||
body.attr("data-headerbg", "color_10");
|
||||
break;
|
||||
case "transparent":
|
||||
body.attr("data-headerbg", "transparent");
|
||||
break;
|
||||
case "gradient_1":
|
||||
body.attr("data-headerbg", "gradient_1");
|
||||
break;
|
||||
case "gradient_2":
|
||||
body.attr("data-headerbg", "gradient_2");
|
||||
break;
|
||||
case "gradient_3":
|
||||
body.attr("data-headerbg", "gradient_3");
|
||||
break;
|
||||
default:
|
||||
body.attr("data-headerbg", "color_1");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
dlabSettings.prototype.manageSidebarStyle = function() {
|
||||
|
||||
switch(this.sidebarStyle) {
|
||||
case "full":
|
||||
body.attr("data-sidebar-style", "full");
|
||||
break;
|
||||
case "mini":
|
||||
body.attr("data-sidebar-style", "mini");
|
||||
break;
|
||||
case "compact":
|
||||
body.attr("data-sidebar-style", "compact");
|
||||
break;
|
||||
case "modern":
|
||||
body.attr("data-sidebar-style", "modern");
|
||||
break;
|
||||
case "icon-hover":
|
||||
body.attr("data-sidebar-style", "icon-hover");
|
||||
|
||||
$('.dlabnav').hover(function() {
|
||||
$('#main-wrapper').addClass('iconhover-toggle');
|
||||
}, function() {
|
||||
$('#main-wrapper').removeClass('iconhover-toggle');
|
||||
});
|
||||
break;
|
||||
case "overlay":
|
||||
this.layout === "horizontal" ? body.attr("data-sidebar-style", "full") : body.attr("data-sidebar-style", "overlay");
|
||||
break;
|
||||
default:
|
||||
body.attr("data-sidebar-style", "full");
|
||||
}
|
||||
}
|
||||
|
||||
dlabSettings.prototype.manageSidebarBg = function() {
|
||||
switch(this.sidebarBg) {
|
||||
case "color_1":
|
||||
body.attr("data-sidebarbg", "color_1");
|
||||
break;
|
||||
case "color_2":
|
||||
body.attr("data-sidebarbg", "color_2");
|
||||
break;
|
||||
case "color_3":
|
||||
body.attr("data-sidebarbg", "color_3");
|
||||
break;
|
||||
case "color_4":
|
||||
body.attr("data-sidebarbg", "color_4");
|
||||
break;
|
||||
case "color_5":
|
||||
body.attr("data-sidebarbg", "color_5");
|
||||
break;
|
||||
case "color_6":
|
||||
body.attr("data-sidebarbg", "color_6");
|
||||
break;
|
||||
case "color_7":
|
||||
body.attr("data-sidebarbg", "color_7");
|
||||
break;
|
||||
case "color_8":
|
||||
body.attr("data-sidebarbg", "color_8");
|
||||
break;
|
||||
case "color_9":
|
||||
body.attr("data-sidebarbg", "color_9");
|
||||
break;
|
||||
case "color_10":
|
||||
body.attr("data-sidebarbg", "color_10");
|
||||
break;
|
||||
case "image_1":
|
||||
body.attr("data-sidebarbg", "image_1");
|
||||
break;
|
||||
case "image_2":
|
||||
body.attr("data-sidebarbg", "image_2");
|
||||
break;
|
||||
case "image_3":
|
||||
body.attr("data-sidebarbg", "image_3");
|
||||
break;
|
||||
default:
|
||||
body.attr("data-sidebarbg", "color_1");
|
||||
}
|
||||
}
|
||||
|
||||
dlabSettings.prototype.manageSidebarPosition = function() {
|
||||
switch(this.sidebarPosition) {
|
||||
case "fixed":
|
||||
this.sidebarStyle === "overlay" && this.layout === "vertical" || this.sidebarStyle === "modern" ? body.attr("data-sidebar-position", "static") : body.attr("data-sidebar-position", "fixed");
|
||||
break;
|
||||
case "static":
|
||||
body.attr("data-sidebar-position", "static");
|
||||
break;
|
||||
default:
|
||||
body.attr("data-sidebar-position", "static");
|
||||
}
|
||||
}
|
||||
|
||||
dlabSettings.prototype.manageHeaderPosition = function() {
|
||||
switch(this.headerPosition) {
|
||||
case "fixed":
|
||||
body.attr("data-header-position", "fixed");
|
||||
break;
|
||||
case "static":
|
||||
body.attr("data-header-position", "static");
|
||||
break;
|
||||
default:
|
||||
body.attr("data-header-position", "static");
|
||||
}
|
||||
}
|
||||
|
||||
dlabSettings.prototype.manageContainerLayout = function() {
|
||||
switch(this.containerLayout) {
|
||||
case "boxed":
|
||||
if(this.layout === "vertical" && this.sidebarStyle === "full") {
|
||||
body.attr("data-sidebar-style", "overlay");
|
||||
}
|
||||
body.attr("data-container", "boxed");
|
||||
break;
|
||||
case "wide":
|
||||
body.attr("data-container", "wide");
|
||||
break;
|
||||
case "wide-boxed":
|
||||
body.attr("data-container", "wide-boxed");
|
||||
break;
|
||||
default:
|
||||
body.attr("data-container", "wide");
|
||||
}
|
||||
}
|
||||
|
||||
dlabSettings.prototype.manageRtlLayout = function() {
|
||||
switch(this.direction) {
|
||||
case "rtl":
|
||||
html.attr("dir", "rtl");
|
||||
html.addClass('rtl');
|
||||
body.attr("direction", "rtl");
|
||||
break;
|
||||
case "ltr":
|
||||
html.attr("dir", "ltr");
|
||||
html.removeClass('rtl');
|
||||
body.attr("direction", "ltr");
|
||||
break;
|
||||
default:
|
||||
html.attr("dir", "ltr");
|
||||
body.attr("direction", "ltr");
|
||||
}
|
||||
}
|
||||
|
||||
dlabSettings.prototype.manageResponsiveSidebar = function() {
|
||||
const innerWidth = $(window).innerWidth();
|
||||
if(innerWidth < 1200) {
|
||||
body.attr("data-layout", "vertical");
|
||||
body.attr("data-container", "wide");
|
||||
}
|
||||
|
||||
if(innerWidth > 767 && innerWidth < 1200) {
|
||||
body.attr("data-sidebar-style", "mini");
|
||||
}
|
||||
|
||||
if(innerWidth < 768) {
|
||||
body.attr("data-sidebar-style", "overlay");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
dlabSettings.prototype.managePrimaryColor = function() {
|
||||
switch(this.primary) {
|
||||
case "color_1":
|
||||
body.attr("data-primary", "color_1");
|
||||
break;
|
||||
case "color_2":
|
||||
body.attr("data-primary", "color_2");
|
||||
break;
|
||||
case "color_3":
|
||||
body.attr("data-primary", "color_3");
|
||||
break;
|
||||
case "color_4":
|
||||
body.attr("data-primary", "color_4");
|
||||
break;
|
||||
case "color_5":
|
||||
body.attr("data-primary", "color_5");
|
||||
break;
|
||||
case "color_6":
|
||||
body.attr("data-primary", "color_6");
|
||||
break;
|
||||
case "color_7":
|
||||
body.attr("data-primary", "color_7");
|
||||
break;
|
||||
case "color_8":
|
||||
body.attr("data-primary", "color_8");
|
||||
break;
|
||||
case "color_9":
|
||||
body.attr("data-primary", "color_9");
|
||||
break;
|
||||
case "color_10":
|
||||
body.attr("data-primary", "color_10");
|
||||
break;
|
||||
|
||||
default:
|
||||
body.attr("data-primary", "color_1");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
229
public/js/styleSwitcher.js
Normal file
229
public/js/styleSwitcher.js
Normal file
File diff suppressed because one or more lines are too long
126
public/js/template.js
Executable file
126
public/js/template.js
Executable file
@@ -0,0 +1,126 @@
|
||||
(function($) {
|
||||
'use strict';
|
||||
$(function() {
|
||||
var body = $('body');
|
||||
var contentWrapper = $('.content-wrapper');
|
||||
var scroller = $('.container-scroller');
|
||||
var footer = $('.footer');
|
||||
var sidebar = $('.sidebar');
|
||||
|
||||
//Add active class to nav-link based on url dynamically
|
||||
//Active class can be hard coded directly in html file also as required
|
||||
|
||||
function addActiveClass(element) {
|
||||
if (current === "") {
|
||||
//for root url
|
||||
if (element.attr('href').indexOf("index.html") !== -1) {
|
||||
element.parents('.nav-item').last().addClass('active');
|
||||
if (element.parents('.sub-menu').length) {
|
||||
element.closest('.collapse').addClass('show');
|
||||
element.addClass('active');
|
||||
}
|
||||
}
|
||||
} else {
|
||||
//for other url
|
||||
if (element.attr('href').indexOf(current) !== -1) {
|
||||
element.parents('.nav-item').last().addClass('active');
|
||||
if (element.parents('.sub-menu').length) {
|
||||
element.closest('.collapse').addClass('show');
|
||||
element.addClass('active');
|
||||
}
|
||||
if (element.parents('.submenu-item').length) {
|
||||
element.addClass('active');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var current = location.pathname.split("/").slice(-1)[0].replace(/^\/|\/$/g, '');
|
||||
$('.nav li a', sidebar).each(function() {
|
||||
var $this = $(this);
|
||||
addActiveClass($this);
|
||||
})
|
||||
|
||||
$('.horizontal-menu .nav li a').each(function() {
|
||||
var $this = $(this);
|
||||
addActiveClass($this);
|
||||
})
|
||||
|
||||
//Close other submenu in sidebar on opening any
|
||||
|
||||
sidebar.on('show.bs.collapse', '.collapse', function() {
|
||||
sidebar.find('.collapse.show').collapse('hide');
|
||||
});
|
||||
|
||||
|
||||
//Change sidebar and content-wrapper height
|
||||
applyStyles();
|
||||
|
||||
function applyStyles() {
|
||||
//Applying perfect scrollbar
|
||||
if (!body.hasClass("rtl")) {
|
||||
if ($('.settings-panel .tab-content .tab-pane.scroll-wrapper').length) {
|
||||
const settingsPanelScroll = new PerfectScrollbar('.settings-panel .tab-content .tab-pane.scroll-wrapper');
|
||||
}
|
||||
if ($('.chats').length) {
|
||||
const chatsScroll = new PerfectScrollbar('.chats');
|
||||
}
|
||||
if (body.hasClass("sidebar-fixed")) {
|
||||
if($('#sidebar').length) {
|
||||
var fixedSidebarScroll = new PerfectScrollbar('#sidebar .nav');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$('[data-toggle="minimize"]').on("click", function() {
|
||||
if ((body.hasClass('sidebar-toggle-display')) || (body.hasClass('sidebar-absolute'))) {
|
||||
body.toggleClass('sidebar-hidden');
|
||||
} else {
|
||||
body.toggleClass('sidebar-icon-only');
|
||||
}
|
||||
});
|
||||
|
||||
//checkbox and radios
|
||||
$(".form-check label,.form-radio label").append('<i class="input-helper"></i>');
|
||||
|
||||
//Horizontal menu in mobile
|
||||
$('[data-toggle="horizontal-menu-toggle"]').on("click", function() {
|
||||
$(".horizontal-menu .bottom-navbar").toggleClass("header-toggled");
|
||||
});
|
||||
// Horizontal menu navigation in mobile menu on click
|
||||
var navItemClicked = $('.horizontal-menu .page-navigation >.nav-item');
|
||||
navItemClicked.on("click", function(event) {
|
||||
if(window.matchMedia('(max-width: 991px)').matches) {
|
||||
if(!($(this).hasClass('show-submenu'))) {
|
||||
navItemClicked.removeClass('show-submenu');
|
||||
}
|
||||
$(this).toggleClass('show-submenu');
|
||||
}
|
||||
})
|
||||
|
||||
$(window).scroll(function() {
|
||||
if(window.matchMedia('(min-width: 992px)').matches) {
|
||||
var header = $('.horizontal-menu');
|
||||
if ($(window).scrollTop() >= 70) {
|
||||
$(header).addClass('fixed-on-scroll');
|
||||
} else {
|
||||
$(header).removeClass('fixed-on-scroll');
|
||||
}
|
||||
}
|
||||
});
|
||||
if ($.cookie('kapella-free-banner')!="true") {
|
||||
document.querySelector('#proBanner').classList.add('d-flex');
|
||||
}
|
||||
else {
|
||||
document.querySelector('#proBanner').classList.add('d-none');
|
||||
}
|
||||
document.querySelector('#bannerClose').addEventListener('click',function() {
|
||||
document.querySelector('#proBanner').classList.add('d-none');
|
||||
document.querySelector('#proBanner').classList.remove('d-flex');
|
||||
var date = new Date();
|
||||
date.setTime(date.getTime() + 24 * 60 * 60 * 1000);
|
||||
$.cookie('kapella-free-banner', "true", { expires: date });
|
||||
});
|
||||
});
|
||||
})(jQuery);
|
||||
60
public/js/typeahead.js
Executable file
60
public/js/typeahead.js
Executable file
@@ -0,0 +1,60 @@
|
||||
(function($) {
|
||||
'use strict';
|
||||
var substringMatcher = function(strs) {
|
||||
return function findMatches(q, cb) {
|
||||
var matches, substringRegex;
|
||||
|
||||
// an array that will be populated with substring matches
|
||||
matches = [];
|
||||
|
||||
// regex used to determine if a string contains the substring `q`
|
||||
var substrRegex = new RegExp(q, 'i');
|
||||
|
||||
// iterate through the pool of strings and for any string that
|
||||
// contains the substring `q`, add it to the `matches` array
|
||||
for (var i = 0; i < strs.length; i++) {
|
||||
if (substrRegex.test(strs[i])) {
|
||||
matches.push(strs[i]);
|
||||
}
|
||||
}
|
||||
|
||||
cb(matches);
|
||||
};
|
||||
};
|
||||
|
||||
var states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California',
|
||||
'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii',
|
||||
'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana',
|
||||
'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota',
|
||||
'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire',
|
||||
'New Jersey', 'New Mexico', 'New York', 'North Carolina', 'North Dakota',
|
||||
'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island',
|
||||
'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont',
|
||||
'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'
|
||||
];
|
||||
|
||||
$('#the-basics .typeahead').typeahead({
|
||||
hint: true,
|
||||
highlight: true,
|
||||
minLength: 1
|
||||
}, {
|
||||
name: 'states',
|
||||
source: substringMatcher(states)
|
||||
});
|
||||
// constructs the suggestion engine
|
||||
var states = new Bloodhound({
|
||||
datumTokenizer: Bloodhound.tokenizers.whitespace,
|
||||
queryTokenizer: Bloodhound.tokenizers.whitespace,
|
||||
// `states` is an array of state names defined in "The Basics"
|
||||
local: states
|
||||
});
|
||||
|
||||
$('#bloodhound .typeahead').typeahead({
|
||||
hint: true,
|
||||
highlight: true,
|
||||
minLength: 1
|
||||
}, {
|
||||
name: 'states',
|
||||
source: states
|
||||
});
|
||||
})(jQuery);
|
||||
216
public/js/verify.js
Normal file
216
public/js/verify.js
Normal file
@@ -0,0 +1,216 @@
|
||||
$(document).ready(function() {
|
||||
|
||||
var table = $('#verify-table').DataTable ({
|
||||
processing: false,
|
||||
serverSide: false,
|
||||
paging: false,
|
||||
order: [],
|
||||
searching: false,
|
||||
lengthMenu: [20],
|
||||
ajax: $('#verify-table').data('url'),
|
||||
columns: [
|
||||
{ data: 'DT_RowIndex',
|
||||
name: 'DT_RowIndex',
|
||||
orderable: false
|
||||
},
|
||||
{
|
||||
data: 'id',
|
||||
name: 'id',
|
||||
class: 'text-center'
|
||||
},
|
||||
{
|
||||
data: 'no_pol',
|
||||
name: 'no_pol',
|
||||
class: 'text-center',
|
||||
},
|
||||
{
|
||||
data: 'jenis_mobil',
|
||||
name: 'jenis_mobil',
|
||||
class: 'text-center',
|
||||
},
|
||||
{
|
||||
data: 'waktu_masuk',
|
||||
name: 'waktu_masuk',
|
||||
class: 'text-center',
|
||||
render: function(data, type, row) {
|
||||
return moment(data).format("DD-MM-YYYY HH:mm:ss")
|
||||
}
|
||||
},
|
||||
{
|
||||
data: 'waktu_keluar',
|
||||
name: 'waktu_keluar',
|
||||
class: 'text-center',
|
||||
render: function(data, type, row) {
|
||||
return moment(data).format("DD-MM-YYYY HH:mm:ss")
|
||||
}
|
||||
},
|
||||
{
|
||||
data: 'id_pintu_masuk',
|
||||
name: 'id_pintu_masuk',
|
||||
class: 'text-center'
|
||||
},
|
||||
{
|
||||
data: 'out_gate',
|
||||
name: 'out_gate',
|
||||
class: 'text-center'
|
||||
},
|
||||
{
|
||||
data: 'status',
|
||||
name: 'status',
|
||||
render: function (data, type, row) {
|
||||
if (data === 1) {
|
||||
return '<span class="badge badge-secondary light badge-danger">Pending</span></td>';
|
||||
} else {
|
||||
return '';
|
||||
}
|
||||
},
|
||||
class: 'text-center',
|
||||
},
|
||||
// { data: 'id', name: 'id' },
|
||||
{
|
||||
data: 'id',
|
||||
render: function(data, type, row) {
|
||||
return `
|
||||
<div class="action-buttons d-flex justify-content-end">
|
||||
<a href="javascript:void(0);" class="btn btn-light view-images light mr-2" data-id="${data}" data-no_pol="${row.no_pol}">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="svg-main-icon" width="24px" height="24px" viewBox="0 0 32 32" x="0px" y="0px">
|
||||
<g data-name="Layer 21">
|
||||
<path d="M29,14.47A15,15,0,0,0,3,14.47a3.07,3.07,0,0,0,0,3.06,15,15,0,0,0,26,0A3.07,3.07,0,0,0,29,14.47ZM16,21a5,5,0,1,1,5-5A5,5,0,0,1,16,21Z" fill="#000000" fill-rule="nonzero"></path>
|
||||
<circle cx="16" cy="16" r="3" fill="#000000" fill-rule="nonzero"></circle>
|
||||
</g>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="javascript:void(0);" class="btn btn-secondary verify-data light mr-2" data-id="${data}" data-no_pol="${row.no_pol}">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" fill="none">
|
||||
<path d="M9 12l2 2 4-4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="2"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="javascript:void(0);" class="btn btn-danger remove-item light mr-2" data-id="${data}" data-no_pol="${row.no_pol}">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" fill="none">
|
||||
<path d="M18 6L6 18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6 6L18 18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>`;
|
||||
// <button class="btn btn-primary btn-xs view-images" data-id="${data}">View</button>
|
||||
// <button class="btn btn-secondary btn-xs" edit-nopol data-id="${data}">Verify</button>
|
||||
},
|
||||
class: 'text-center'
|
||||
}
|
||||
],
|
||||
columnDefs: [
|
||||
{
|
||||
targets: '_all', // Mengatur semua kolom
|
||||
orderable: false // Tidak bisa diurutkan
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
$('#verify-table tbody').on('click', '.view-images', function() {
|
||||
var id = $(this).data('id');
|
||||
var no_pol = $(this).data('no_pol');
|
||||
console.log(no_pol);
|
||||
$.ajax({
|
||||
// url: '/verify/' + id,
|
||||
url: '/verify/show',
|
||||
type: 'POST',
|
||||
data: {
|
||||
id: id,
|
||||
no_pol: no_pol,
|
||||
_token: $('meta[name="csrf-token"]').attr('content')
|
||||
},
|
||||
success: function(response) {
|
||||
console.log(response);
|
||||
if (response.pic_masuk && response.pic_masuk !== '') {
|
||||
$('#pic_body_masuk').attr('src', 'data:image/jpeg;base64,' + response.pic_masuk).show();
|
||||
} else {
|
||||
$('#pic_body_masuk').attr('src', '/images/no-image.jpeg').show();
|
||||
}
|
||||
if (response.driver_masuk && response.driver_masuk !== '') {
|
||||
$('#pic_driver_masuk').attr('src', 'data:image/jpeg;base64,' + response.driver_masuk).show();
|
||||
} else {
|
||||
$('#pic_driver_masuk').attr('src', '/images/no-image.jpeg').show();
|
||||
}
|
||||
if (response.pic_keluar && response.pic_keluar !== '') {
|
||||
$('#pic_body_keluar').attr('src', 'data:image/jpeg;base64,' + response.pic_keluar).show();
|
||||
// $('#pic_body_keluar').attr('src', imgData).show();
|
||||
} else {
|
||||
$('#pic_body_keluar').attr('src', '/images/no-image.jpeg').show();
|
||||
}
|
||||
if (response.driver_keluar && response.driver_keluar !== '') {
|
||||
$('#pic_driver_keluar').attr('src', 'data:image/jpeg;base64,' + response.driver_keluar).show();
|
||||
} else {
|
||||
$('#pic_driver_keluar').attr('src', '/images/no-image.jpeg').show();
|
||||
}
|
||||
// $('#pic_body_masuk').attr('src', 'data:image/jpeg;base64,' + response.pic_masuk).show();
|
||||
// $('#time-in').text('Jam masuk : ' + data.waktu_masuk).show();
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
console.log(status, error);
|
||||
alert('Gagal mengambil data gambar');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// $('#verify-table tbody').on('click', '.verify-data', function() {
|
||||
$('#verify-table tbody').on('click', '.verify-data, .remove-item', function() {
|
||||
|
||||
var id = $(this).data('id');
|
||||
var no_pol = $(this).data('no_pol');
|
||||
// var veriCheckValue = $(this).hasClass('verify-data') ? 2 : 0;
|
||||
var veriCheckValue;
|
||||
if ($(this).hasClass('verify-data')) {
|
||||
veriCheckValue = 2;
|
||||
} else if ($(this).hasClass('remove-item')) {
|
||||
veriCheckValue = 0;
|
||||
}
|
||||
|
||||
console.log(id, no_pol, veriCheckValue);
|
||||
$.ajax({
|
||||
url: '/verify/' + id,
|
||||
type: 'PUT', // Sesuaikan dengan metode HTTP yang Anda gunakan untuk update
|
||||
data: {
|
||||
// Data yang dikirim untuk update, sesuaikan dengan kebutuhan Anda
|
||||
// Misalnya:
|
||||
// status: 'verified',
|
||||
// veri_check: 2,
|
||||
veri_check: veriCheckValue,
|
||||
no_pol: no_pol,
|
||||
// _token: '{{ csrf_token() }}' // Token CSRF untuk keamanan
|
||||
_token: $('meta[name="csrf-token"]').attr('content')
|
||||
},
|
||||
success: function(data) {
|
||||
var message = veriCheckValue === 2 ? 'Data berhasil diverifikasi' : 'Kendaran tidak sesuai';
|
||||
// alert(message);
|
||||
// alert('Data berhasil diverifikasi');
|
||||
// Bisa tambahkan logika untuk refresh tabel atau mengupdate tampilan
|
||||
table.ajax.reload(null, false); // Reload data table tanpa mereset pagination
|
||||
},
|
||||
error: function() {
|
||||
alert('Gagal memverifikasi data');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function refreshTable() {
|
||||
table.ajax.reload(null, false); // Mengambil data baru tanpa reset paging
|
||||
}
|
||||
|
||||
setInterval(refreshTable, 5000);
|
||||
// Menambahkan event listener untuk row click
|
||||
// $('#verify-table tbody').on('click', 'tr', function() {
|
||||
// var data = table.row(this).data();
|
||||
// console.log (data);
|
||||
// if (data) {
|
||||
// $.ajax({
|
||||
// url: '/verify/' + data.id,
|
||||
// // type: 'GET',
|
||||
// success: function(response) {
|
||||
// // Menampilkan card-body saat data ditemukan
|
||||
// $('.card-body').slideDown();
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
});
|
||||
Reference in New Issue
Block a user