first commit

This commit is contained in:
2022-04-13 13:51:55 +07:00
commit 47e209c023
3107 changed files with 238911 additions and 0 deletions

View 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);

View File

@ -0,0 +1,6 @@
(function($) {
"use strict"
$("#tags_1").tagsinput();
})(jQuery);

View 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);

View 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);

View File

@ -0,0 +1,875 @@
(function($) {
/* "use strict" */
var dzChartlist = 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: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
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()
],
fullWidth: true
}
);
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, 9],
series: [
[5, 9, 7, 8, 5, 3, 5, 4, 3]
]
}, {
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(){
}
}
}();
jQuery(document).ready(function(){
});
jQuery(window).on('load',function(){
dzChartlist.load();
});
jQuery(window).on('resize',function(){
dzChartlist.resize();
});
})(jQuery);

View File

@ -0,0 +1,851 @@
(function($) {
/* "use strict" */
/* function draw() {
} */
var dzSparkLine = 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(11, 42, 151, 1)',
borderWidth: "0",
backgroundColor: 'rgba(11, 42, 151, 1)'
}
]
},
options: {
legend: false,
scales: {
yAxes: [{
ticks: {
beginAtZero: true
}
}],
xAxes: [{
// Change here
barPercentage: 0.5
}]
}
}
});
}
}
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(11, 42, 151, 1)");
barChart_2gradientStroke.addColorStop(1, "rgba(11, 42, 151, 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",
backgroundColor: barChart_2gradientStroke,
hoverBackgroundColor: barChart_2gradientStroke
}
]
},
options: {
legend: false,
scales: {
yAxes: [{
ticks: {
beginAtZero: true
}
}],
xAxes: [{
// Change here
barPercentage: 0.5
}]
}
}
});
}
}
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(11, 42, 151, 1)");
barChart_3gradientStroke.addColorStop(1, "rgba(11, 42, 151, 0.5)");
const barChart_3gradientStroke2 = barChart_3.createLinearGradient(50, 100, 50, 50);
barChart_3gradientStroke2.addColorStop(0, "rgba(39, 188, 72, 1)");
barChart_3gradientStroke2.addColorStop(1, "rgba(39, 188, 72, 1)");
const barChart_3gradientStroke3 = barChart_3.createLinearGradient(50, 100, 50, 50);
barChart_3gradientStroke3.addColorStop(0, "rgba(139, 199, 64, 1)");
barChart_3gradientStroke3.addColorStop(1, "rgba(139, 199, 64, 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: {
legend: {
display: false
},
title: {
display: false
},
tooltips: {
mode: 'index',
intersect: false
},
responsive: true,
scales: {
xAxes: [{
stacked: true,
}],
yAxes: [{
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(11, 42, 151, 1)',
borderWidth: "2",
backgroundColor: 'transparent',
pointBackgroundColor: 'rgba(11, 42, 151, 1)'
}
]
},
options: {
legend: false,
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
max: 100,
min: 0,
stepSize: 20,
padding: 10
}
}],
xAxes: [{
ticks: {
padding: 5
}
}]
}
}
});
}
}
/* var draw = function(){
} */
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(11, 42, 151, 1)");
lineChart_2gradientStroke.addColorStop(1, "rgba(11, 42, 151, 0.5)");
//Chart.controllers.line.draw = function(){ };
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(11, 42, 151, 0.5)'
}
]
},
options: {
legend: false,
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
max: 100,
min: 0,
stepSize: 20,
padding: 10
}
}],
xAxes: [{
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(11, 42, 151, 1)");
lineChart_3gradientStroke1.addColorStop(1, "rgba(11, 42, 151, 0.5)");
const lineChart_3gradientStroke2 = lineChart_3.createLinearGradient(500, 0, 100, 0);
lineChart_3gradientStroke2.addColorStop(0, "rgba(255, 188, 17, 1)");
lineChart_3gradientStroke2.addColorStop(1, "rgba(255, 188, 17, 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(11, 42, 151, 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)'
}
]
},
options: {
legend: false,
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
max: 100,
min: 0,
stepSize: 20,
padding: 10
}
}],
xAxes: [{
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)'
}
]
},
options: {
legend: false,
elements: {
point:{
radius: 0
}
},
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
max: 100,
min: 0,
stepSize: 20,
padding: 10
},
borderWidth:3,
display:false,
lineTension:0.4,
}],
xAxes: [{
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(11, 42, 151, .5)',
pointBackgroundColor: 'rgba(0, 0, 1128, .3)'
}
]
},
options: {
legend: false,
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
max: 100,
min: 0,
stepSize: 20,
padding: 10
}
}],
xAxes: [{
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(139, 199, 64, 0.2)");
areaChart_2gradientStroke.addColorStop(1, "rgba(139, 199, 64, 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: "#FF2E2E",
borderWidth: "4",
backgroundColor: areaChart_2gradientStroke
}
]
},
options: {
legend: false,
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
max: 100,
min: 0,
stepSize: 20,
padding: 5
}
}],
xAxes: [{
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(11, 42, 151)',
borderWidth: "1",
backgroundColor: 'rgba(11, 42, 151, .5)'
},
{
label: "My First dataset",
data: [5, 25, 20, 41, 36, 75, 70],
borderColor: 'rgb(255, 188, 17)',
borderWidth: "1",
backgroundColor: 'rgba(255, 188, 17, .5)'
}
]
},
options: {
legend: false,
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
max: 100,
min: 0,
stepSize: 20,
padding: 10
}
}],
xAxes: [{
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: {
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(11, 42, 151, .9)",
"rgba(11, 42, 151, .7)",
"rgba(11, 42, 151, .5)",
"rgba(0,0,0,0.07)"
],
hoverBackgroundColor: [
"rgba(11, 42, 151, .9)",
"rgba(11, 42, 151, .7)",
"rgba(11, 42, 151, .5)",
"rgba(0,0,0,0.07)"
]
}],
labels: [
"one",
"two",
"three",
"four"
]
},
options: {
responsive: true,
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(11, 42, 151, 1)",
"rgba(39, 188, 72, 1)",
"rgba(139, 199, 64, 1)"
],
hoverBackgroundColor: [
"rgba(11, 42, 151, 0.9)",
"rgba(39, 188, 72, .9)",
"rgba(139, 199, 64, .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(11, 42, 151, 1)",
"rgba(39, 188, 72, 1)",
"rgba(139, 199, 64, 1)",
"rgba(255, 46, 46, 1)",
"rgba(255, 188, 17, 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(){
dzSparkLine.load();
});
jQuery(window).on('resize',function(){
//dzSparkLine.resize();
setTimeout(function(){ dzSparkLine.resize(); }, 1000);
});
})(jQuery);

View 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').on("click", function (e) {
// Have to stop propagation here
e.stopPropagation();
input.clockpicker('show').clockpicker('toggleView', 'minutes');
});
})(jQuery)

View File

@ -0,0 +1,12 @@
(function($) {
"use strict"
// Colorpicker
$(".colorpicker").asColorPicker();
$(".complex-colorpicker").asColorPicker({
mode: 'complex'
});
$(".gradient-colorpicker").asColorPicker({
mode: 'gradient'
});
})(jQuery);

View File

@ -0,0 +1,13 @@
(function ($) {
"use strict"
/*******************
Counter Up
*******************/
$('.counter').counterUp({
delay: 10,
time: 1000
});
})(jQuery);

View File

@ -0,0 +1,99 @@
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')
}
});
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')
});
//
var table = $('#example3, #example4, #example5').DataTable();
$('#example tbody').on('click', 'tr', function () {
var data = table.row( this ).data();
});
})(jQuery);

View File

@ -0,0 +1,591 @@
(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,
fillColor: '#0B2A97'
}
},
grid: {
borderWidth: 1,
borderColor: 'transparent'
},
yaxis: {
tickColor: 'transparent',
font: {
color: '#fff',
size: 10
}
},
xaxis: {
tickColor: 'transparent',
font: {
color: '#fff',
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,
fillColor: '#0B2A97'
}
}, {
data: [[1, 5], [3, 7], [5, 10], [7, 7], [9, 9], [11, 5], [13, 4], [15, 6]],
bars: {
show: true,
lineWidth: 0,
fillColor: '#1EA7C5'
}
}],
{
grid: {
borderWidth: 1,
borderColor: 'transparent'
},
yaxis: {
tickColor: 'transparent',
font: {
color: '#fff',
size: 10
}
},
xaxis: {
tickColor: 'transparent',
font: {
color: '#fff',
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: '#0B2A97'
},
{
data: retCust,
label: 'Returning Customer',
color: '#1EA7C5'
}
],
{
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,
backgroundColor: 'transparent'
},
yaxis: {
min: 0,
max: 15,
color: 'transparent',
font: {
size: 10,
color: '#999'
}
},
xaxis: {
color: 'transparent',
font: {
size: 10,
color: '#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: '#0B2A97'
},
{
data: retCust,
label: 'Returning Customer',
color: '#1EA7C5'
}
],
{
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,
backgroundColor: 'transparent'
},
yaxis: {
min: 0,
max: 15,
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
},
xaxis: {
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
}
});
}
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: '#0B2A97'
},
{
data: retCust2,
label: 'Returning Customer',
color: '#1EA7C5'
}
],
{
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,
backgroundColor: 'transparent'
},
yaxis: {
min: 0,
max: 15,
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
},
xaxis: {
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
}
});
}
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: '#0B2A97'
},
{
data: retCust,
label: 'Returning Customer',
color: '#1EA7C5'
}
],
{
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,
backgroundColor: 'transparent'
},
yaxis: {
min: 0,
max: 15,
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
},
xaxis: {
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
}
});
}
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: '#0B2A97'
},
{
data: retCust,
label: 'Returning Customer',
color: '#1EA7C5'
}
],
{
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,
backgroundColor: 'transparent'
},
yaxis: {
min: 0,
max: 15,
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
},
xaxis: {
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
}
});
}
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: ['#0B2A97'],
series: {
lines: {
show: true,
lineWidth: 1
},
shadowSize: 0 // Drawing is faster without shadows
},
grid: {
borderColor: 'transparent',
borderWidth: 1,
labelMargin: 5
},
xaxis: {
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
},
yaxis: {
min: 0,
max: 100,
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
}
});
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: ['#0B2A97'],
series: {
lines: {
show: true,
lineWidth: 0,
fill: 0.9
},
shadowSize: 0 // Drawing is faster without shadows
},
grid: {
borderColor: 'transparent',
borderWidth: 1,
labelMargin: 5
},
xaxis: {
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
},
yaxis: {
min: 0,
max: 100,
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
}
});
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);

View File

@ -0,0 +1,108 @@
! function(e) {
"use strict";
var t = function() {
this.$body = e("body"), this.$modal = e("#event-modal"), this.$event = "#external-events div.external-event", this.$calendar = e("#calendar"), this.$saveCategoryBtn = e(".save-category"), this.$categoryForm = e("#add-category form"), this.$extEvents = e("#external-events"), this.$calendarObj = null
};
t.prototype.onDrop = function(t, n) {
var a = t.data("eventObject"),
o = t.attr("data-class"),
i = e.extend({}, a);
i.start = n, o && (i.className = [o]), this.$calendar.fullCalendar("renderEvent", i, !0), e("#drop-remove").is(":checked") && t.remove()
}, t.prototype.onEventClick = function(t, n, a) {
var o = this,
i = e("<form></form>");
i.append("<label>Change event name</label>"), i.append("<div class='input-group'><input class='form-control' type=text value='" + t.title + "' /><span class='input-group-btn'><button type='submit' class='btn btn-success waves-effect waves-light'><i class='fa fa-check'></i> Save</button></span></div>"), o.$modal.modal({
backdrop: "static"
}), o.$modal.find(".delete-event").show().end().find(".save-event").hide().end().find(".modal-body").empty().prepend(i).end().find(".delete-event").unbind("click").on("click", function() {
o.$calendarObj.fullCalendar("removeEvents", function(e) {
return e._id == t._id
}), o.$modal.modal("hide")
}), o.$modal.find("form").on("submit", function() {
return t.title = i.find("input[type=text]").val(), o.$calendarObj.fullCalendar("updateEvent", t), o.$modal.modal("hide"), !1
})
}, t.prototype.onSelect = function(t, n, a) {
var o = this;
o.$modal.modal({
backdrop: "static"
});
var i = e("<form></form>");
i.append("<div class='row'></div>"), i.find(".row").append("<div class='col-md-6'><div class='form-group'><label class='control-label'>Event Name</label><input class='form-control' placeholder='Insert Event Name' type='text' name='title'/></div></div>").append("<div class='col-md-6'><div class='form-group'><label class='control-label'>Category</label><select class='form-control' name='category'></select></div></div>").find("select[name='category']").append("<option value='bg-danger'>Danger</option>").append("<option value='bg-success'>Success</option>").append("<option value='bg-dark'>Dark</option>").append("<option value='bg-primary'>Primary</option>").append("<option value='bg-pink'>Pink</option>").append("<option value='bg-info'>Info</option>").append("<option value='bg-warning'>Warning</option></div></div>"), o.$modal.find(".delete-event").hide().end().find(".save-event").show().end().find(".modal-body").empty().prepend(i).end().find(".save-event").unbind("click").on("click", function() {
i.submit()
}), o.$modal.find("form").on("submit", function() {
var e = i.find("input[name='title']").val(),
a = (i.find("input[name='beginning']").val(), i.find("input[name='ending']").val(), i.find("select[name='category'] option:checked").val());
return null !== e && 0 != e.length ? (o.$calendarObj.fullCalendar("renderEvent", {
title: e,
start: t,
end: n,
allDay: !1,
className: a
}, !0), o.$modal.modal("hide")) : alert("You have to give a title to your event"), !1
}), o.$calendarObj.fullCalendar("unselect")
}, t.prototype.enableDrag = function() {
e(this.$event).each(function() {
var t = {
title: e.trim(e(this).text())
};
e(this).data("eventObject", t), e(this).draggable({
zIndex: 999,
revert: !0,
revertDuration: 0
})
})
}, t.prototype.init = function() {
this.enableDrag();
var t = new Date,
n = (t.getDate(), t.getMonth(), t.getFullYear(), new Date(e.now())),
a = [{
title: "Chicken Burger",
start: new Date(e.now() + 158e6),
className: "bg-dark"
}, {
title: "Soft drinks",
start: n,
end: n,
className: "bg-danger"
}, {
title: "Hot dog",
start: new Date(e.now() + 338e6),
className: "bg-primary"
}],
o = this;
o.$calendarObj = o.$calendar.fullCalendar({
slotDuration: "00:15:00",
minTime: "08:00:00",
maxTime: "19:00:00",
defaultView: "month",
handleWindowResize: !0,
height: e(window).height() - 100,
header: {
left: "prev,next today",
center: "title",
right: "month,agendaWeek,agendaDay"
},
events: a,
editable: !0,
droppable: !0,
eventLimit: !0,
selectable: !0,
drop: function(t) {
o.onDrop(e(this), t)
},
select: function(e, t, n) {
o.onSelect(e, t, n)
},
eventClick: function(e, t, n) {
o.onEventClick(e, t, n)
}
}), this.$saveCategoryBtn.on("click", function() {
var e = o.$categoryForm.find("input[name='category-name']").val(),
t = o.$categoryForm.find("select[name='category-color']").val();
null !== e && 0 != e.length && (o.$extEvents.append('<div class="external-event bg-' + t + '" data-class="bg-' + t + '" style="position: relative;"><i class="fa fa-move"></i>' + e + "</div>"), o.enableDrag())
})
}, e.CalendarApp = new t, e.CalendarApp.Constructor = t
}(window.jQuery),
function(e) {
"use strict";
e.CalendarApp.init()
}(window.jQuery);

View File

@ -0,0 +1,12 @@
(function($) {
"use strict"
// Colorpicker
$(".as_colorpicker").asColorPicker();
$(".complex-colorpicker").asColorPicker({
mode: 'complex'
});
$(".gradient-colorpicker").asColorPicker({
mode: 'gradient'
});
})(jQuery);

View 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);

View File

@ -0,0 +1,142 @@
jQuery(".form-valide").validate({
rules: {
"val-username": {
required: !0,
minlength: 3
},
"val-email": {
required: !0,
email: !0
},
"val-password": {
required: !0,
minlength: 5
},
"val-confirm-password": {
required: !0,
equalTo: "#val-password"
},
"val-select2": {
required: !0
},
"val-select2-multiple": {
required: !0,
minlength: 2
},
"val-suggestions": {
required: !0,
minlength: 5
},
"val-skill": {
required: !0
},
"val-currency": {
required: !0,
currency: ["$", !0]
},
"val-website": {
required: !0,
url: !0
},
"val-phoneus": {
required: !0,
phoneUS: !0
},
"val-digits": {
required: !0,
digits: !0
},
"val-number": {
required: !0,
number: !0
},
"val-range": {
required: !0,
range: [1, 5]
},
"val-terms": {
required: !0
}
},
messages: {
"val-username": {
required: "Please enter a username",
minlength: "Your username must consist of at least 3 characters"
},
"val-email": "Please enter a valid email address",
"val-password": {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long"
},
"val-confirm-password": {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long",
equalTo: "Please enter the same password as above"
},
"val-select2": "Please select a value!",
"val-select2-multiple": "Please select at least 2 values!",
"val-suggestions": "What can we do to become better?",
"val-skill": "Please select a skill!",
"val-currency": "Please enter a price!",
"val-website": "Please enter your website!",
"val-phoneus": "Please enter a US phone!",
"val-digits": "Please enter only digits!",
"val-number": "Please enter a number!",
"val-range": "Please enter a number between 1 and 5!",
"val-terms": "You must agree to the service terms!"
},
ignore: [],
errorClass: "invalid-feedback animated fadeInUp",
errorElement: "div",
errorPlacement: function(e, a) {
jQuery(a).parents(".form-group > div").append(e)
},
highlight: function(e) {
jQuery(e).closest(".form-group").removeClass("is-invalid").addClass("is-invalid")
},
success: function(e) {
jQuery(e).closest(".form-group").removeClass("is-invalid"), jQuery(e).remove()
},
});
jQuery(".form-valide-with-icon").validate({
rules: {
"val-username": {
required: !0,
minlength: 3
},
"val-password": {
required: !0,
minlength: 5
}
},
messages: {
"val-username": {
required: "Please enter a username",
minlength: "Your username must consist of at least 3 characters"
},
"val-password": {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long"
}
},
ignore: [],
errorClass: "invalid-feedback animated fadeInUp",
errorElement: "div",
errorPlacement: function(e, a) {
jQuery(a).parents(".form-group > div").append(e)
},
highlight: function(e) {
jQuery(e).closest(".form-group").removeClass("is-invalid").addClass("is-invalid")
},
success: function(e) {
jQuery(e).closest(".form-group").removeClass("is-invalid").addClass("is-valid")
}
});

View File

@ -0,0 +1,114 @@
(function($) {
/* "use strict" */
var dzVectorMap = 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: 'rgb(239, 242, 244)',
borderOpacity: 0.25,
borderWidth: 1,
color: 'rgb(239, 242, 244)',
enableZoom: true,
hoverColor: 'rgba(239, 242, 244 0.9)',
hoverOpacity: null,
normalizeFunction: 'linear',
scaleColors: ['#b6d6ff', '#005ace'],
selectedColor: 'rgba(239, 242, 244 0.9)',
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: 'rgb(239, 242, 244)',
borderOpacity: 0.25,
borderWidth: 1,
color: 'rgb(239, 242, 244)',
enableZoom: true,
hoverColor: 'rgba(239, 242, 244 0.9)',
hoverOpacity: null,
normalizeFunction: 'linear',
scaleColors: ['#b6d6ff', '#005ace'],
selectedColor: 'rgba(239, 242, 244 0.9)',
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(){
dzVectorMap.load();
}, 1000);
});
jQuery(window).on('resize',function(){
setTimeout(function(){
dzVectorMap.resize();
}, 1000);
});
})(jQuery);

View 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);

View File

@ -0,0 +1,457 @@
(function($) {
"use strict"
var dzMorris = 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: ['#1EA7C5', 'rgb(11, 42, 151)', '#1bd084'],
//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(11, 42, 151)'], //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: ['#ff6746', '#1bd084', '#1EA7C5'],
behaveLikeLine: true,
gridLineColor: 'transparent',
lineWidth: 3,
hideHover: 'auto',
lineColors: ['rgb(11, 42, 151)', 'rgb(27, 208, 132)', '#1EA7C5'],
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: ['#0B2A97', '#1bd084', '#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: ['#0B2A97', "#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: ['#1EA7C5', 'rgb(16, 202, 147)', 'rgb(11, 42, 151)'],
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(){
dzMorris.init();
//dzMorris.resize();
});
jQuery(window).on('load',function(){
//dzMorris.init();
});
jQuery( window ).resize(function() {
//dzMorris.resize();
//dzMorris.init();
});
})(jQuery);

View File

@ -0,0 +1,26 @@
(function ($) {
"use strict"
/*******************
Nestable
*******************/
var e = function (e) {
var t = e.length ? e : $(e.target),
a = t.data("output");
window.JSON ? a.val(window.JSON.stringify(t.nestable("serialize"))) : a.val("JSON browser support required for this demo.")
};
$("#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);

View File

@ -0,0 +1,1163 @@
(function($) {
"use strict"
//basic slider
let basicSlide = document.getElementById('basic-slider');
noUiSlider.create(basicSlide, {
start: [20, 80],
connect: true,
range: {
'min': 0,
'max': 100
}
});
//basic slider ^
//keyboard slider
let keyboardslider = document.getElementById('keyboardslider');
noUiSlider.create(keyboardslider, {
start: 10,
step: 10,
range: {
'min': 0,
'max': 100
}
});
var handle = keyboardslider.querySelector('.noUi-handle');
handle.addEventListener('keydown', function (e) {
var value = Number(keyboardslider.noUiSlider.get());
if (e.which === 37) {
keyboardslider.noUiSlider.set(value - 10);
}
console.log(e)
console.log(e.which)
if (e.which === 39) {
keyboardslider.noUiSlider.set(value + 10);
}
});
//keyboard slider ^
//working with date
// Create a new date from a string, return as a timestamp.
function timestamp(str) {
return new Date(str).getTime();
}
var dateSlider = document.getElementById('slider-date');
noUiSlider.create(dateSlider, {
// Create two timestamps to define a range.
range: {
min: timestamp('2010'),
max: timestamp('2016')
},
// Steps of one week
step: 7 * 24 * 60 * 60 * 1000,
// Two more timestamps indicate the handle starting positions.
start: [timestamp('2011'), timestamp('2015')],
// No decimals
format: wNumb({
decimals: 0
})
});
var dateValues = [
document.getElementById('event-start'),
document.getElementById('event-end')
];
// Create a list of day and month names.
var weekdays = [
"Sunday", "Monday", "Tuesday",
"Wednesday", "Thursday", "Friday",
"Saturday"
];
var months = [
"January", "February", "March",
"April", "May", "June", "July",
"August", "September", "October",
"November", "December"
];
dateSlider.noUiSlider.on('update', function (values, handle) {
dateValues[handle].innerHTML = formatDate(new Date(+values[handle]));
});
// Append a suffix to dates.
// Example: 23 => 23rd, 1 => 1st.
function nth(d) {
if (d > 3 && d < 21) return 'th';
switch (d % 10) {
case 1:
return "st";
case 2:
return "nd";
case 3:
return "rd";
default:
return "th";
}
}
// Create a string representation of the date.
function formatDate(date) {
return weekdays[date.getDay()] + ", " +
date.getDate() + nth(date.getDate()) + " " +
months[date.getMonth()] + " " +
date.getFullYear();
}
//working with date ^
//html5 input element
var select = document.getElementById('input-select');
// Append the option elements
for (var i = -20; i <= 40; i++) {
var option = document.createElement("option");
option.text = i;
option.value = i;
select.appendChild(option);
}
var html5Slider = document.getElementById('html5');
noUiSlider.create(html5Slider, {
start: [10, 30],
connect: true,
range: {
'min': -20,
'max': 40
}
});
var inputNumber = document.getElementById('input-number');
html5Slider.noUiSlider.on('update', function (values, handle) {
var value = values[handle];
if (handle) {
inputNumber.value = value;
} else {
select.value = Math.round(value);
}
});
select.addEventListener('change', function () {
html5Slider.noUiSlider.set([this.value, null]);
});
inputNumber.addEventListener('change', function () {
html5Slider.noUiSlider.set([null, this.value]);
});
//html5 input element ^
//non-linear slider
var nonLinearSlider = document.getElementById('nonlinear');
noUiSlider.create(nonLinearSlider, {
connect: true,
behaviour: 'tap',
start: [500, 4000],
range: {
// Starting at 500, step the value by 500,
// until 4000 is reached. From there, step by 1000.
'min': [0],
'10%': [500, 500],
'50%': [4000, 1000],
'max': [10000]
}
});
var nodes = [
document.getElementById('lower-value'), // 0
document.getElementById('upper-value') // 1
];
// Display the slider value and how far the handle moved
// from the left edge of the slider.
nonLinearSlider.noUiSlider.on('update', function (values, handle, unencoded, isTap, positions) {
nodes[handle].innerHTML = values[handle] + ', ' + positions[handle].toFixed(2) + '%';
});
//non-linear slider ^
//locking sliders together
var lockedState = false;
var lockedSlider = false;
var lockedValues = [60, 80];
var slider1 = document.getElementById('slider1');
var slider2 = document.getElementById('slider2');
var lockButton = document.getElementById('lockbutton');
var slider1Value = document.getElementById('slider1-span');
var slider2Value = document.getElementById('slider2-span');
// When the button is clicked, the locked state is inverted.
lockButton.addEventListener('click', function () {
lockedState = !lockedState;
this.textContent = lockedState ? 'unlock' : 'lock';
});
function crossUpdate(value, slider) {
// If the sliders aren't interlocked, don't
// cross-update.
if (!lockedState) return;
// Select whether to increase or decrease
// the other slider value.
var a = slider1 === slider ? 0 : 1;
// Invert a
var b = a ? 0 : 1;
// Offset the slider value.
value -= lockedValues[b] - lockedValues[a];
// Set the value
slider.noUiSlider.set(value);
}
noUiSlider.create(slider1, {
start: 60,
// Disable animation on value-setting,
// so the sliders respond immediately.
animate: false,
range: {
min: 50,
max: 100
}
});
noUiSlider.create(slider2, {
start: 80,
animate: false,
range: {
min: 50,
max: 100
}
});
slider1.noUiSlider.on('update', function (values, handle) {
slider1Value.innerHTML = values[handle];
});
slider2.noUiSlider.on('update', function (values, handle) {
slider2Value.innerHTML = values[handle];
});
function setLockedValues() {
lockedValues = [
Number(slider1.noUiSlider.get()),
Number(slider2.noUiSlider.get())
];
}
slider1.noUiSlider.on('change', setLockedValues);
slider2.noUiSlider.on('change', setLockedValues);
slider1.noUiSlider.on('slide', function (values, handle) {
crossUpdate(values[handle], slider2);
});
slider2.noUiSlider.on('slide', function (values, handle) {
crossUpdate(values[handle], slider1);
});
//locking sliders together ^
//Moving the slider by clicking pips
var pipsSlider = document.getElementById('slider-pips');
noUiSlider.create(pipsSlider, {
range: {
min: 0,
max: 100
},
start: [50],
pips: {mode: 'count', values: 5}
});
var pips = pipsSlider.querySelectorAll('.noUi-value');
function clickOnPip() {
var value = Number(this.getAttribute('data-value'));
pipsSlider.noUiSlider.set(value);
}
for (var i = 0; i < pips.length; i++) {
// For this example. Do this in CSS!
pips[i].style.cursor = 'pointer';
pips[i].addEventListener('click', clickOnPip);
}
//Moving the slider by clicking pips ^
//Colored Connect Elements
var slider = document.getElementById('slider-color');
noUiSlider.create(slider, {
start: [4000, 8000, 12000, 16000],
connect: [false, true, true, true, true],
range: {
'min': [2000],
'max': [20000]
}
});
var connect = slider.querySelectorAll('.noUi-connect');
var classes = ['c-1-color', 'c-2-color', 'c-3-color', 'c-4-color', 'c-5-color'];
for (var i = 0; i < connect.length; i++) {
connect[i].classList.add(classes[i]);
}
//Colored Connect Elements ^
//keypress slider
var keypressSlider = document.getElementById('keypress');
var input0 = document.getElementById('input-with-keypress-0');
var input1 = document.getElementById('input-with-keypress-1');
var inputs = [input0, input1];
noUiSlider.create(keypressSlider, {
start: [20, 80],
connect: true,
tooltips: [true, wNumb({decimals: 1})],
range: {
'min': [0],
'10%': [10, 10],
'50%': [80, 50],
'80%': 150,
'max': 200
}
});
keypressSlider.noUiSlider.on('update', function (values, handle) {
inputs[handle].value = values[handle];
});
// Listen to keydown events on the input field.
inputs.forEach(function (input, handle) {
input.addEventListener('change', function () {
keypressSlider.noUiSlider.setHandle(handle, this.value);
});
input.addEventListener('keydown', function (e) {
var values = keypressSlider.noUiSlider.get();
var value = Number(values[handle]);
// [[handle0_down, handle0_up], [handle1_down, handle1_up]]
var steps = keypressSlider.noUiSlider.steps();
// [down, up]
var step = steps[handle];
var position;
// 13 is enter,
// 38 is key up,
// 40 is key down.
switch (e.which) {
case 13:
keypressSlider.noUiSlider.setHandle(handle, this.value);
break;
case 38:
// Get step to go increase slider value (up)
position = step[1];
// false = no step is set
if (position === false) {
position = 1;
}
// null = edge of slider
if (position !== null) {
keypressSlider.noUiSlider.setHandle(handle, value + position);
}
break;
case 40:
position = step[0];
if (position === false) {
position = 1;
}
if (position !== null) {
keypressSlider.noUiSlider.setHandle(handle, value - position);
}
break;
}
});
});
//keypress slider ^
//skipstep slider
var skipSlider = document.getElementById('skipstep');
noUiSlider.create(skipSlider, {
range: {
'min': 0,
'10%': 10,
'20%': 20,
'30%': 30,
// Nope, 40 is no fun.
'50%': 50,
'60%': 60,
'70%': 70,
// I never liked 80.
'90%': 90,
'max': 100
},
snap: true,
start: [20, 90]
});
var skipValues = [
document.getElementById('skip-value-lower'),
document.getElementById('skip-value-upper')
];
skipSlider.noUiSlider.on('update', function (values, handle) {
skipValues[handle].innerHTML = values[handle];
});
//skipstep slider ^
//Using the slider with huge numbers
var bigValueSlider = document.getElementById('slider-huge');
var bigValueSpan = document.getElementById('huge-value');
noUiSlider.create(bigValueSlider, {
start: 0,
step: 1,
format: wNumb({
decimals: 0
}),
range: {
min: 0,
max: 13
}
});
// Note how these are 'string' values, not numbers.
var range = [
'0', '2097152', '4194304',
'8388608', '16777216', '33554432',
'67108864', '134217728', '268435456',
'536870912', '1073741824',
'2147483648', '4294967296',
'8589934592'
];
bigValueSlider.noUiSlider.on('update', function (values, handle) {
bigValueSpan.innerHTML = range[values[handle]];
});
//Using the slider with huge numbers ^
//creating a toggle
var toggleSlider = document.getElementById('slider-toggle');
noUiSlider.create(toggleSlider, {
orientation: "vertical",
start: 0,
range: {
'min': [0, 1],
'max': 1
},
format: wNumb({
decimals: 0
})
});
toggleSlider.noUiSlider.on('update', function (values, handle) {
if (values[handle] === '1') {
toggleSlider.classList.add('off');
} else {
toggleSlider.classList.remove('off');
}
});
//creating a toggle ^
//soft limits
var softSlider = document.getElementById('soft');
noUiSlider.create(softSlider, {
start: 50,
range: {
min: 0,
max: 100
},
pips: {
mode: 'values',
values: [20, 80],
density: 4
}
});
softSlider.noUiSlider.on('change', function (values, handle) {
if (values[handle] < 20) {
softSlider.noUiSlider.set(20);
} else if (values[handle] > 80) {
softSlider.noUiSlider.set(80);
}
});
//soft limits ^
//color picker
var resultElement = document.getElementById('result');
var sliders = document.getElementsByClassName('sliders');
var colors = [0, 0, 0];
[].slice.call(sliders).forEach(function (slider, index) {
noUiSlider.create(slider, {
start: 127,
connect: [true, false],
orientation: "vertical",
range: {
'min': 0,
'max': 255
},
format: wNumb({
decimals: 0
})
});
// Bind the color changing function to the update event.
slider.noUiSlider.on('update', function () {
colors[index] = slider.noUiSlider.get();
var color = 'rgb(' + colors.join(',') + ')';
resultElement.style.background = color;
resultElement.style.color = color;
});
});
//color picker ^
//stepping and snapping the values
var stepSlider = document.getElementById('slider-step');
noUiSlider.create(stepSlider, {
start: [4000],
step: 1000,
range: {
'min': [2000],
'max': [10000]
}
});
var stepSliderValueElement = document.getElementById('slider-step-value');
stepSlider.noUiSlider.on('update', function (values, handle) {
stepSliderValueElement.innerHTML = values[handle];
});
//stepping and snapping the values ^
//Stepping in non-linear sliders
var nonLinearStepSlider = document.getElementById('slider-non-linear-step');
noUiSlider.create(nonLinearStepSlider, {
start: [500, 4000],
range: {
'min': [0],
'10%': [500, 500],
'50%': [4000, 1000],
'max': [10000]
}
});
var nonLinearStepSliderValueElement = document.getElementById('slider-non-linear-step-value');
nonLinearStepSlider.noUiSlider.on('update', function (values, handle) {
nonLinearStepSliderValueElement.innerHTML = values[handle];
});
//Stepping in non-linear sliders ^
//Snapping between steps
var snapSlider = document.getElementById('slider-snap');
noUiSlider.create(snapSlider, {
start: [0, 500],
snap: true,
connect: true,
range: {
'min': 0,
'10%': 50,
'20%': 100,
'30%': 150,
'40%': 500,
'50%': 800,
'max': 1000
}
});
var snapValues = [
document.getElementById('slider-snap-value-lower'),
document.getElementById('slider-snap-value-upper')
];
snapSlider.noUiSlider.on('update', function (values, handle) {
snapValues[handle].innerHTML = values[handle];
});
//Snapping between steps ^
//get and set slider values
var slider = document.getElementById('slider');
noUiSlider.create(slider, {
start: [80],
range: {
'min': [0],
'max': [100]
}
});
// Set the slider value to 20
document.getElementById('write-button').addEventListener('click', function () {
slider.noUiSlider.set(20);
});
// Read the slider value.
document.getElementById('read-button').addEventListener('click', function () {
alert(slider.noUiSlider.get());
});
//get and set slider values ^
//Number formatting
var sliderFormat = document.getElementById('slider-format');
noUiSlider.create(sliderFormat, {
start: [20000],
step: 1000,
range: {
'min': [20000],
'max': [80000]
},
ariaFormat: wNumb({
decimals: 3
}),
format: wNumb({
decimals: 3,
thousand: '.',
suffix: ' (US $)'
})
});
var inputFormat = document.getElementById('input-format');
sliderFormat.noUiSlider.on('update', function (values, handle) {
inputFormat.value = values[handle];
});
inputFormat.addEventListener('change', function () {
sliderFormat.noUiSlider.set(this.value);
});
//Number formatting ^
//slider margin
var marginSlider = document.getElementById('slider-margin');
noUiSlider.create(marginSlider, {
start: [20, 80],
margin: 30,
range: {
'min': 0,
'max': 100
}
});
var marginMin = document.getElementById('slider-margin-value-min'),
marginMax = document.getElementById('slider-margin-value-max');
marginSlider.noUiSlider.on('update', function (values, handle) {
if (handle) {
marginMax.innerHTML = values[handle];
} else {
marginMin.innerHTML = values[handle];
}
});
//slider margin ^
//slider limit
var limitSlider = document.getElementById('slider-limit');
noUiSlider.create(limitSlider, {
start: [10, 120],
limit: 40,
behaviour: 'drag',
connect: true,
range: {
'min': 0,
'max': 100
}
});
var limitFieldMin = document.getElementById('slider-limit-value-min');
var limitFieldMax = document.getElementById('slider-limit-value-max');
limitSlider.noUiSlider.on('update', function (values, handle) {
(handle ? limitFieldMax : limitFieldMin).innerHTML = values[handle];
});
//slider limit ^
//slider padding
var paddingSlider = document.getElementById('slider-padding');
noUiSlider.create(paddingSlider, {
start: [20, 80],
padding: [10, 15], // Or just 10
range: {
'min': 0,
'max': 100
}
});
var paddingMin = document.getElementById('slider-padding-value-min');
var paddingMax = document.getElementById('slider-padding-value-max');
paddingSlider.noUiSlider.on('update', function (values, handle) {
if (handle) {
paddingMax.innerHTML = values[handle];
} else {
paddingMin.innerHTML = values[handle];
}
});
//slider padding ^
//slider orientation
var verticalSlider = document.getElementById('slider-vertical');
noUiSlider.create(verticalSlider, {
start: 40,
orientation: 'vertical',
range: {
'min': 0,
'max': 100
}
});
//slider orientation ^
//slider direction
var directionSlider = document.getElementById('slider-direction');
noUiSlider.create(directionSlider, {
start: 20,
direction: 'rtl',
range: {
'min': 0,
'max': 100
}
});
var directionField = document.getElementById('field');
directionSlider.noUiSlider.on('update', function (values, handle) {
directionField.innerHTML = values[handle];
});
//slider direction ^
//slider tooltips
var tooltipSlider = document.getElementById('slider-tooltips');
noUiSlider.create(tooltipSlider, {
start: [20, 80, 120],
tooltips: [false, wNumb({decimals: 1}), true],
range: {
'min': 0,
'max': 200
}
});
//slider tooltips ^
//slider behaviour drag
var behaviourSlider = document.getElementById('behaviour');
noUiSlider.create(behaviourSlider, {
start: [20, 40],
step: 10,
behaviour: 'drag',
connect: true,
range: {
'min': 20,
'max': 80
}
});
//slider behaviour drag ^
//slider behaviour tap
var tapSlider = document.getElementById('tap');
noUiSlider.create(tapSlider, {
start: 40,
behaviour: 'tap',
connect: [false, true],
range: {
'min': 20,
'max': 80
}
});
//slider behaviour tap ^
//slider behaviour fixed dragging
var dragFixedSlider = document.getElementById('drag-fixed');
noUiSlider.create(dragFixedSlider, {
start: [40, 60],
behaviour: 'drag-fixed',
connect: true,
range: {
'min': 20,
'max': 80
}
});
//slider behaviour fixed dragging ^
//slider behaviour snap
var snapSlider2 = document.getElementById('snap');
noUiSlider.create(snapSlider2, {
start: 40,
behaviour: 'snap',
connect: [true, false],
range: {
'min': 20,
'max': 80
}
});
//slider behaviour snap ^
//slider behaviour hover
var hoverSlider = document.getElementById('hover');
var field = document.getElementById('hover-val');
noUiSlider.create(hoverSlider, {
start: 20,
behaviour: 'hover-snap',
direction: 'rtl',
range: {
'min': 0,
'max': 10
}
});
hoverSlider.noUiSlider.on('hover', function (value) {
field.innerHTML = value;
});
//slider behaviour hover ^
//slider behaviour unconstrained
var unconstrainedSlider = document.getElementById('unconstrained');
var unconstrainedValues = document.getElementById('unconstrained-values');
noUiSlider.create(unconstrainedSlider, {
start: [20, 50, 80],
behaviour: 'unconstrained-tap',
connect: true,
range: {
'min': 0,
'max': 100
}
});
unconstrainedSlider.noUiSlider.on('update', function (values) {
unconstrainedValues.innerHTML = values.join(' :: ');
});
//slider behaviour unconstrained ^
//slider behaviour combined
var dragTapSlider = document.getElementById('combined');
noUiSlider.create(dragTapSlider, {
start: [40, 60],
behaviour: 'drag-tap',
connect: true,
range: {
'min': 20,
'max': 80
}
});
//slider behaviour combined ^
//slider range left to right
var range_all_sliders = {
'min': [ 0 ],
'10%': [ 500, 500 ],
'50%': [ 4000, 1000 ],
'max': [ 10000 ]
};
var pipsRange = document.getElementById('pips-range');
noUiSlider.create(pipsRange, {
range: range_all_sliders,
start: 0,
pips: {
mode: 'range',
density: 3
}
});
//slider range left to right ^
//slider range right to left
var pipsRangeRtl = document.getElementById('pips-range-rtl');
noUiSlider.create(pipsRangeRtl, {
range: range_all_sliders,
start: 0,
direction: 'rtl',
pips: {
mode: 'range',
density: 3
}
});
//slider range right to left ^
//slider range vertical top to bottom
var pipsRangeVertical = document.getElementById('pips-range-vertical');
noUiSlider.create(pipsRangeVertical, {
range: range_all_sliders,
start: 0,
orientation: 'vertical',
pips: {
mode: 'range',
density: 3
}
});
//slider range vertical top to bottom ^
//slider range vertical bottom to top
var pipsRangeVerticalRtl = document.getElementById('pips-range-vertical-rtl');
noUiSlider.create(pipsRangeVerticalRtl, {
range: range_all_sliders,
start: 0,
orientation: 'vertical',
direction: 'rtl',
pips: {
mode: 'range',
density: 3
}
});
//slider range vertical bottom to top ^
//slider step
function filterPips(value, type) {
if (type === 0) {
return value < 2000 ? -1 : 0;
}
return value % 1000 ? 2 : 1;
}
//slider step ^
//pip position
var pipsPositions = document.getElementById('pips-positions');
noUiSlider.create(pipsPositions, {
range: range_all_sliders,
start: 0,
pips: {
mode: 'positions',
values: [0, 25, 50, 75, 100],
density: 4
}
});
//pip position ^
//pip position stepped
var positionsStepped = document.getElementById('pips-positions-stepped');
noUiSlider.create(positionsStepped, {
range: range_all_sliders,
start: 0,
pips: {
mode: 'positions',
values: [0, 25, 50, 75, 100],
density: 4,
stepped: true
}
});
//pip position stepped ^
//pips count
var pipsCount = document.getElementById('pips-count');
noUiSlider.create(pipsCount, {
range: range_all_sliders,
start: 0,
pips: {
mode: 'count',
values: 6,
density: 4
}
});
//pips count ^
//pips count stepped
var pipsCountStepped = document.getElementById('pips-count-stepped');
noUiSlider.create(pipsCountStepped, {
range: range_all_sliders,
start: 0,
pips: {
mode: 'count',
values: 6,
density: 4,
stepped: true
}
});
//pips count stepped ^
//pips values
var pipsValues = document.getElementById('pips-values');
noUiSlider.create(pipsValues, {
range: range_all_sliders,
start: 0,
pips: {
mode: 'values',
values: [50, 552, 2251, 3200, 5000, 7080, 9000],
density: 4
}
});
//pips values ^
//pips values stepped
var pipsValuesStepped = document.getElementById('pips-values-stepped');
noUiSlider.create(pipsValuesStepped, {
range: range_all_sliders,
start: 0,
pips: {
mode: 'values',
values: [50, 552, 4651, 4952, 5000, 7080, 9000],
density: 4,
stepped: true
}
});
//pips values stepped ^
//disable slider
var disSlider1 = document.getElementById('disable1');
var checkbox1 = document.getElementById('checkbox1');
function toggle(element) {
// If the checkbox is checked, disabled the slider.
// Otherwise, re-enable it.
if (this.checked) {
element.setAttribute('disabled', true);
} else {
element.removeAttribute('disabled');
}
}
noUiSlider.create(disSlider1, {
start: 80,
connect: [true, false],
range: {
min: 0,
max: 100
}
});
checkbox1.addEventListener('click', function () {
toggle.call(this, disSlider1);
});
//disable slider ^
//disable slider 2
var disSlider2 = document.getElementById('disable2');
var origins = disSlider2.getElementsByClassName('noUi-origin');
var checkbox2 = document.getElementById('checkbox2');
var checkbox3 = document.getElementById('checkbox3');
noUiSlider.create(disSlider2, {
start: [20, 80],
range: {
min: 0,
max: 100
}
});
checkbox2.addEventListener('click', function () {
toggle.call(this, origins[0]);
});
checkbox3.addEventListener('click', function () {
toggle.call(this, origins[1]);
});
//disable slider 2 ^
//updating a slider
var updateSlider = document.getElementById('slider-update');
var updateSliderValue = document.getElementById('slider-update-value');
noUiSlider.create(updateSlider, {
range: {
'min': 0,
'max': 40
},
start: 20,
margin: 2,
step: 2
});
updateSlider.noUiSlider.on('update', function (values, handle) {
updateSliderValue.innerHTML = values[handle];
});
var button1 = document.getElementById('update-1');
var button2 = document.getElementById('update-2');
function updateSliderRange(min, max) {
updateSlider.noUiSlider.updateOptions({
range: {
'min': min,
'max': max
}
});
}
button1.addEventListener('click', function () {
updateSliderRange(20, 50);
});
button2.addEventListener('click', function () {
updateSliderRange(10, 40);
});
//updating a slider ^
})(jQuery);

View File

@ -0,0 +1,7 @@
(function($) {
"use strict"
//date picker classic default
$('.datepicker-default').pickadate();
})(jQuery);

View File

@ -0,0 +1,241 @@
(function($) {
"use strict"
/****************
Piety chart
*****************/
var dzPiety = 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: ['#0B2A97', 'rgba(11, 42, 151, .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(11, 42, 151, .5)"],
stroke: '#0B2A97',
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: ["#0B2A97", "#209f84", "#2781d5"],
width: "100%",
height: "100",
});
}
}
var handlePietyBar1 = function(){
if(jQuery('.bar1').length > 0 ){
$(".bar1").peity("bar", {
fill: ["#0B2A97", "#209f84", "#2781d5"],
//width: "100%",
width: getGraphBlockSize('.bar1'),
height: "140"
});
}
}
var handlePietyBarColours1 = function(){
if(jQuery('.bar-colours-1').length > 0 ){
$(".bar-colours-1").peity("bar", {
fill: ["#0B2A97", "#209f84", "#2781d5"],
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: ["#0B2A97", "#209f84", "#2781d5", "#FF9B52", "#f72b50"],
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(11, 42, 151, .5)'],
stroke: 'rgb(11, 42, 151)',
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(){
}
}
}();
jQuery(document).ready(function(){
});
jQuery(window).on('load',function(){
setTimeout(function(){
dzPiety.load();
}, 1000);
});
jQuery(window).on('resize',function(){
setTimeout(function(){
dzPiety.resize();
}, 1000);
});
})(jQuery);

View File

@ -0,0 +1,385 @@
(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(){
$(".destroy-selector").select2("destroy");
});
// opening options
$(".opening-dropdown").select2();
$("#dropdown-trigger-open").on("click", function(){
$(".opening-dropdown").select2('open');
});
// open or close dropdown
$(".open-close-dropdown").select2();
$("#opening-dropdown-trigger").on("click", function(){
$(".open-close-dropdown").select2('open');
});
$("#closing-dropdown-trigger").on("click", function(){
$(".open-close-dropdown").select2('close');
});
// select2 methods
var $singleUnbind = $(".single-event-unbind").select2();
$(".js-programmatic-set-val").on("click", function () {
$singleUnbind.val("CA").trigger("change");
});
$(".js-programmatic-open").on("click", function () {
$singleUnbind.select2("open");
});
$(".js-programmatic-close").on("click", function () {
$singleUnbind.select2("close");
});
$(".js-programmatic-init").on("click", function () {
$singleUnbind.select2({
width: "400px"
});
});
$(".js-programmatic-destroy").on("click", function () {
$singleUnbind.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);

View File

@ -0,0 +1,273 @@
(function($) {
/* "use strict" */
var dzSparkLine = function(){
var screenWidth = $(window).width();
function getSparkLineGraphBlockSize(selector)
{
var screenWidth = $(window).width();
var graphBlockSize = '100%';
if(screenWidth <= 768)
{
screenWidth = (screenWidth < 300 )?screenWidth:200;
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: "#0B2A97"
});
}
}
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: "#0B2A97",
fillColor: "rgba(11, 42, 151, .5)",
minSpotColor: "#0B2A97",
maxSpotColor: "#0B2A97",
highlightLineColor: "#0B2A97",
highlightSpotColor: "#0B2A97",
});
}
}
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'),
//width: '200',
height: "50",
lineColor: "#8bc740",
fillColor: "rgba(139, 199, 64, .5)",
minSpotColor: "#8bc740",
maxSpotColor: "#8bc740",
highlightLineColor: "rgb(255, 159, 0)",
highlightSpotColor: "#8bc740"
});
}
}
var sparkBar = function(){
// Bar Chart
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: "#1bd084"
});
}
}
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: ['#0B2A97', '#1bd084', '#ff6746']
});
}
}
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: ['#0B2A97', '#1bd084', '#ff6746'],
negBarColor: '#ff6746'
});
}
}
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: "#0B2A97",
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: '#1bd084',
colorMap: ['#1bd084', '#ff6746']
});
}
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(11, 42, 151, .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(){
dzSparkLine.load();
});
jQuery(window).on('resize',function(){
dzSparkLine.resize();
});
})(jQuery);

View File

@ -0,0 +1,14 @@
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")
};

View 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);

View File

@ -0,0 +1 @@
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) }) };

View 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);

View File

@ -0,0 +1,1330 @@
(function($) {
/* "use strict" */
var dzChartlist = function(){
var screenWidth = $(window).width();
var activityChart = function(){
/*======== 16. ANALYTICS - ACTIVITY CHART ========*/
var activity = document.getElementById("activity");
if (activity !== null) {
var activityData = [{
first: [35, 18, 15, 35, 40, 20, 30, 25, 22, 20, 45, 35]
},
{
first: [50, 35, 10, 45, 40, 50, 60, 80, 10, 50, 34, 35]
},
{
first: [20, 35, 60, 45, 40, 70, 30, 80, 65, 70, 60, 20]
},
{
first: [25, 88, 25, 50, 70, 70, 60, 70, 50, 60, 50, 70]
}
];
activity.height = 300;
var config = {
type: "bar",
data: {
labels: [
"01",
"02",
"03",
"04",
"05",
"06",
"07",
"08",
"09",
"10",
"11",
"12"
],
datasets: [
{
label: "My First dataset",
data: [35, 18, 15, 35, 40, 20, 30, 25, 22, 20, 45, 35],
borderColor: 'rgba(26, 51, 213, 1)',
borderWidth: "0",
backgroundColor: 'rgba(72, 169, 248, 1)'
}
]
},
options: {
responsive: true,
maintainAspectRatio: false,
legend: {
display: false
},
scales: {
yAxes: [{
gridLines: {
color: "rgba(89, 59, 219,0.1)",
drawBorder: true
},
ticks: {
fontColor: "#999",
},
}],
xAxes: [{
gridLines: {
display: false,
zeroLineColor: "transparent"
},
ticks: {
stepSize: 5,
fontColor: "#999",
fontFamily: "Nunito, sans-serif"
}
}]
},
tooltips: {
mode: "index",
intersect: false,
titleFontColor: "#888",
bodyFontColor: "#555",
titleFontSize: 12,
bodyFontSize: 15,
backgroundColor: "rgba(256,256,256,0.95)",
displayColors: true,
xPadding: 10,
yPadding: 7,
borderColor: "rgba(220, 220, 220, 0.9)",
borderWidth: 2,
caretSize: 6,
caretPadding: 10
}
}
};
var ctx = document.getElementById("activity").getContext("2d");
var myLine = new Chart(ctx, config);
var items = document.querySelectorAll("#user-activity .nav-tabs .nav-item");
items.forEach(function(item, index) {
item.addEventListener("click", function() {
config.data.datasets[0].data = activityData[index].first;
myLine.update();
});
});
}
}
var activeUser = function(){
if(jQuery('#activeUser').length > 0 ){
var data = {
labels: ["0", "1", "2", "3", "4", "5", "6", "0", "1", "2", "3", "4", "5", "6"],
datasets: [{
label: "My First dataset",
backgroundColor: "rgba(105,255,147,1)",
strokeColor: "rgba(105,255,147,1)",
pointColor: "rgba(0,0,0,0)",
pointStrokeColor: "rgba(105,255,147,1)",
pointHighlightFill: "rgba(105,255,147,1)",
pointHighlightStroke: "rgba(105,255,147,1)",
data: [65, 59, 80, 81, 56, 55, 40, 65, 59, 80, 81, 56, 55, 40]
}]
};
var ctx = document.getElementById("activeUser").getContext("2d");
var chart = new Chart(ctx, {
type: "bar",
data: data,
options: {
responsive: !0,
maintainAspectRatio: false,
legend: {
display: !1
},
tooltips: {
enabled: false
},
scales: {
xAxes: [{
display: !1,
gridLines: {
display: !1
},
barPercentage: 1,
categoryPercentage: 0.5
}],
yAxes: [{
display: !1,
ticks: {
padding: 10,
stepSize: 20,
max: 100,
min: 0
},
gridLines: {
display: !0,
drawBorder: !1,
lineWidth: 1,
zeroLineColor: "#48f3c0"
}
}]
}
}
});
setInterval(function() {
chart.config.data.datasets[0].data.push(
Math.floor(10 + Math.random() * 80)
);
chart.config.data.datasets[0].data.shift();
chart.update();
}, 2000);
}
}
var chartWidget1 = function(){
if(jQuery('#chart_widget_1').length > 0 ){
const chart_widget_1 = document.getElementById("chart_widget_1").getContext('2d');
//generate gradient
// const gradientStroke = chart_widget_1.createLinearGradient(0, 0, 0, 250);
// gradientStroke.addColorStop(0, "#00abc5");
// gradientStroke.addColorStop(1, "#000080");
// chart_widget_1.attr('height', '100');
new Chart(chart_widget_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(255, 255, 255, .8)',
borderWidth: "0",
backgroundColor: 'rgba(255, 255, 255, .8)',
hoverBackgroundColor: 'rgba(255, 255, 255, .8)'
}
]
},
options: {
legend: false,
responsive: true,
maintainAspectRatio: false,
scales: {
yAxes: [{
display: false,
ticks: {
beginAtZero: true,
display: false,
max: 100,
min: 0,
stepSize: 10
},
gridLines: {
display: false,
drawBorder: false
}
}],
xAxes: [{
display: false,
barPercentage: 0.5,
gridLines: {
display: false,
drawBorder: false
},
ticks: {
display: false
}
}]
}
}
});
}
}
var chartWidget2 = function(){
//#chart_widget_2
if(jQuery('#chart_widget_2').length > 0 ){
const chart_widget_2 = document.getElementById("chart_widget_2").getContext('2d');
//generate gradient
const chart_widget_2gradientStroke = chart_widget_2.createLinearGradient(0, 0, 0, 250);
chart_widget_2gradientStroke.addColorStop(0, "#2f4cdd");
chart_widget_2gradientStroke.addColorStop(1, "#7c8fee");
// chart_widget_2.attr('height', '100');
new Chart(chart_widget_2, {
type: 'bar',
data: {
defaultFontFamily: 'Poppins',
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
datasets: [
{
label: "My First dataset",
data: [65, 59, 80, 81, 56, 55, 40, 88, 45, 95, 54, 76],
borderColor: chart_widget_2gradientStroke,
borderWidth: "0",
backgroundColor: chart_widget_2gradientStroke,
hoverBackgroundColor: chart_widget_2gradientStroke
}
]
},
options: {
legend: false,
responsive: true,
maintainAspectRatio: false,
scales: {
yAxes: [{
display: false,
ticks: {
beginAtZero: true,
display: false,
max: 100,
min: 0,
stepSize: 10
},
gridLines: {
display: false,
drawBorder: false
}
}],
xAxes: [{
display: false,
barPercentage: 0.1,
gridLines: {
display: false,
drawBorder: false
},
ticks: {
display: false
}
}]
}
}
});
}
}
var chartWidget3 = function(){
//#chart_widget_3
if(jQuery('#chart_widget_3').length > 0 ){
const chart_widget_3 = document.getElementById("chart_widget_3").getContext('2d');
// chart_widget_3.height = 100;
let barChartData = {
defaultFontFamily: 'Poppins',
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
datasets: [{
label: 'Expense',
backgroundColor: '#5514a4',
hoverBackgroundColor: '#ff5777',
data: [
'20',
'14',
'18',
'25',
'27',
'22',
'12',
'24',
'20',
'14',
'18',
'16'
]
}, {
label: 'Earning',
backgroundColor: '#F1F3F7',
hoverBackgroundColor: '#F1F3F7',
data: [
'12',
'18',
'14',
'7',
'5',
'10',
'20',
'8',
'12',
'18',
'14',
'16'
]
}]
};
new Chart(chart_widget_3, {
type: 'bar',
data: barChartData,
options: {
legend: {
display: false
},
title: {
display: false
},
tooltips: {
mode: 'index',
intersect: false
},
responsive: true,
maintainAspectRatio: false,
scales: {
xAxes: [{
display: false,
stacked: true,
barPercentage: .2,
ticks: {
display: false
},
gridLines: {
display: false,
drawBorder: false
}
}],
yAxes: [{
display: false,
stacked: true,
gridLines: {
display: false,
drawBorder: false
},
ticks: {
display: false
}
}]
}
}
});
}
}
var chartWidget4 = function(){
//#chart_widget_4
if(jQuery('#chart_widget_4').length > 0 ){
const chart_widget_4 = document.getElementById("chart_widget_4").getContext('2d');
// chart_widget_4.height = 100;
let barChartData2 = {
defaultFontFamily: 'Poppins',
labels: ['one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten', 'eleven', 'twelve', 'thirteen', 'forteen', 'fifteen', 'sixteen', 'seventeen', 'eighteen', 'nineteen', 'twenty'],
datasets: [{
label: 'Expense',
backgroundColor: '#2f4cdd',
hoverBackgroundColor: '#6c2586',
data: [
'20',
'14',
'18',
'25',
'27',
'22',
'12',
'24',
'20',
'14',
'18',
'16',
'34',
'32',
'43',
'36',
'56',
'12',
'23',
'34'
]
}, {
label: 'Earning',
backgroundColor: '#F1F3F7',
hoverBackgroundColor: '#F1F3F7',
data: [
'32',
'58',
'34',
'37',
'15',
'41',
'24',
'38',
'52',
'38',
'24',
'19',
'54',
'34',
'23',
'34',
'35',
'22',
'43',
'33'
]
}]
};
new Chart(chart_widget_4, {
type: 'bar',
data: barChartData2,
options: {
legend: {
display: false
},
title: {
display: false
},
tooltips: {
mode: 'index',
intersect: false
},
responsive: true,
maintainAspectRatio: false,
scales: {
xAxes: [{
display: false,
stacked: true,
barPercentage: 1,
barThickness: 5,
ticks: {
display: false
},
gridLines: {
display: false,
drawBorder: false
}
}],
yAxes: [{
display: false,
stacked: true,
gridLines: {
display: false,
drawBorder: false
},
ticks: {
display: false,
max: 100,
min: 0
}
}]
}
}
});
}
}
var chartWidget5 = function(){
//#chart_widget_5
if(jQuery('#chart_widget_5').length > 0 ){
new Chartist.Line("#chart_widget_5", {
labels: ["1", "2", "3", "4", "5", "6", "7", "8"],
series: [
[4, 5, 1.5, 6, 7, 5.5, 5.8, 4.6]
]
}, {
low: 0,
showArea: 1,
showPoint: !0,
showLine: !0,
fullWidth: !0,
lineSmooth: !1,
chartPadding: {
top: 4,
right: 0,
bottom: 0,
left: 0
},
axisX: {
showLabel: !1,
showGrid: !1,
offset: 0
},
axisY: {
showLabel: !1,
showGrid: !1,
offset: 0
}
});
}
}
var chartWidget6 = function(){
//#chart_widget_6
if(jQuery('#chart_widget_6').length > 0 ){
new Chartist.Line("#chart_widget_6", {
labels: ["1", "2", "3", "4", "5", "6", "7", "8"],
series: [
[4, 5, 3.5, 5, 4, 5.5, 3.8, 4.6]
]
}, {
low: 0,
showArea: 1,
showPoint: !0,
showLine: !0,
fullWidth: !0,
lineSmooth: !1,
chartPadding: {
top: 4,
right: 0,
bottom: 0,
left: 0
},
axisX: {
showLabel: !1,
showGrid: !1,
offset: 0
},
axisY: {
showLabel: !1,
showGrid: !1,
offset: 0
}
});
}
}
var chartWidget7 = function(){
//#chart_widget_7
if(jQuery('#chart_widget_7').length > 0 ){
const chart_widget_7 = document.getElementById("chart_widget_7").getContext('2d');
//generate gradient
const chart_widget_7gradientStroke = chart_widget_7.createLinearGradient(0, 0, 0, 250);
chart_widget_7gradientStroke.addColorStop(0, "#5514a4");
chart_widget_7gradientStroke.addColorStop(1, "#5514a4");
// chart_widget_7.attr('height', '100');
new Chart(chart_widget_7, {
type: 'bar',
data: {
defaultFontFamily: 'Poppins',
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
datasets: [
{
label: "My First dataset",
data: [65, 59, 80, 81, 56, 55, 40, 88, 45, 95, 54, 76],
borderColor: chart_widget_7gradientStroke,
borderWidth: "0",
backgroundColor: chart_widget_7gradientStroke,
hoverBackgroundColor: chart_widget_7gradientStroke
}
]
},
options: {
legend: false,
responsive: true,
maintainAspectRatio: false,
scales: {
yAxes: [{
display: false,
ticks: {
beginAtZero: true,
display: false,
max: 100,
min: 0,
stepSize: 10
},
gridLines: {
display: false,
drawBorder: false
}
}],
xAxes: [{
display: false,
barPercentage: 0.6,
gridLines: {
display: false,
drawBorder: false
},
ticks: {
display: false
}
}]
}
}
});
}
}
var chartWidget8 = function(){
//#chart_widget_8
if(jQuery('#chart_widget_8').length > 0 ){
new Chartist.Line("#chart_widget_8", {
labels: ["1", "2", "3", "4", "5", "6", "7", "8"],
series: [
[4, 5, 1.5, 6, 7, 5.5, 5.8, 4.6]
]
}, {
low: 0,
showArea: !1,
showPoint: !0,
showLine: !0,
fullWidth: !0,
lineSmooth: !1,
chartPadding: {
top: 4,
right: 0,
bottom: 0,
left: 0
},
axisX: {
showLabel: !1,
showGrid: !1,
offset: 0
},
axisY: {
showLabel: !1,
showGrid: !1,
offset: 0
}
});
}
}
var chartWidget9 = function(){
//#chart_widget_9
if(jQuery('#chart_widget_9').length > 0 ){
const chart_widget_9 = document.getElementById("chart_widget_9").getContext('2d');
new Chart(chart_widget_9, {
type: "line",
data: {
labels: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "January", "February", "March", "April"],
datasets: [{
label: "Sales Stats",
backgroundColor: "#0B2A97",
borderColor: '#0B2A97',
pointBackgroundColor: '#0B2A97',
pointBorderColor: '#0B2A97',
pointHoverBackgroundColor: '#0B2A97',
pointHoverBorderColor: '#0B2A97',
data: [20, 10, 18, 15, 32, 18, 15, 22, 8, 6, 12, 13, 10, 18, 14, 24, 16, 12, 19, 21, 16, 14, 24, 21, 13, 15, 27, 29, 21, 11, 14, 19, 21, 17]
}]
},
options: {
title: {
display: !1
},
tooltips: {
intersect: !1,
mode: "nearest",
xPadding: 10,
yPadding: 10,
caretPadding: 10
},
legend: {
display: !1
},
responsive: !0,
maintainAspectRatio: !1,
hover: {
mode: "index"
},
scales: {
xAxes: [{
display: !1,
gridLines: !1,
scaleLabel: {
display: !0,
labelString: "Month"
}
}],
yAxes: [{
display: !1,
gridLines: !1,
scaleLabel: {
display: !0,
labelString: "Value"
},
ticks: {
beginAtZero: !0
}
}]
},
elements: {
line: {
tension: .15
},
point: {
radius: 2,
borderWidth: 1
}
},
layout: {
padding: {
left: 0,
right: 0,
top: 5,
bottom: 0
}
}
}
});
}
}
var chartWidget10 = function(){
//#chart_widget_10
if(jQuery('#chart_widget_10').length > 0 ){
const chart_widget_10 = document.getElementById("chart_widget_10").getContext('2d');
new Chart(chart_widget_10, {
type: "line",
data: {
labels: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
datasets: [{
label: "Sales Stats",
backgroundColor: "#0B2A97",
borderColor: '#0B2A97',
pointBackgroundColor: '#0B2A97',
pointBorderColor: '#0B2A97',
pointHoverBackgroundColor: '#0B2A97',
pointHoverBorderColor: '#0B2A97',
borderWidth: 0,
data: [20, 10, 18, 10, 32, 15, 15, 22, 18, 6, 12, 13]
}]
},
options: {
title: {
display: !1
},
tooltips: {
intersect: !1,
mode: "nearest",
xPadding: 10,
yPadding: 10,
caretPadding: 10
},
legend: {
display: !1
},
responsive: !0,
maintainAspectRatio: !1,
hover: {
mode: "index"
},
scales: {
xAxes: [{
display: !1,
gridLines: !1,
scaleLabel: {
display: !0,
labelString: "Month"
}
}],
yAxes: [{
display: !1,
gridLines: !1,
scaleLabel: {
display: !0,
labelString: "Value"
},
ticks: {
beginAtZero: !0
}
}]
},
elements: {
line: {
tension: .7
},
point: {
radius: 0,
borderWidth: 0
}
},
layout: {
padding: {
left: 0,
right: 0,
top: 5,
bottom: 0
}
}
}
});
}
}
var chartWidget11 = function(){
//#chart_widget_11
if(jQuery('#chart_widget_11').length > 0 ){
const chart_widget_11 = document.getElementById("chart_widget_11").getContext('2d');
new Chart(chart_widget_11, {
type: "line",
data: {
labels: ["January", "February", "March", "April", "May", "June"],
datasets: [{
label: "Sales Stats",
backgroundColor: "rgba(11, 42, 151, .5)",
borderColor: '#0B2A97',
pointBackgroundColor: '#0B2A97',
pointBorderColor: '#0B2A97',
pointHoverBackgroundColor: '#0B2A97',
pointHoverBorderColor: '#0B2A97',
data: [0, 18, 14, 24, 16, 30]
}]
},
options: {
title: {
display: !1
},
tooltips: {
intersect: !1,
mode: "nearest",
xPadding: 5,
yPadding: 5,
caretPadding: 5
},
legend: {
display: !1
},
responsive: !0,
maintainAspectRatio: !1,
hover: {
mode: "index"
},
scales: {
xAxes: [{
display: !1,
gridLines: !1,
scaleLabel: {
display: !0,
labelString: "Month"
},
ticks: {
max: 30,
min: 0
}
}],
yAxes: [{
display: !1,
gridLines: !1,
scaleLabel: {
display: !0,
labelString: "Value"
},
ticks: {
beginAtZero: !0
}
}]
},
elements: {
line: {
tension: .15
},
point: {
radius: 2,
borderWidth: 1
}
},
layout: {
padding: {
left: 0,
right: 0,
top: 0,
bottom: 0
}
}
}
});
}
}
var chartWidget14 = function(){
//#chart_widget_14
if(jQuery('#chart_widget_14').length > 0 ){
const chart_widget_14 = document.getElementById("chart_widget_14");
chart_widget_14.height = 200;
new Chart(chart_widget_14, {
type: 'line',
data: {
defaultFontFamily: 'Poppins',
labels: ["Jan", "Febr", "Mar", "Apr", "May", "Jun", "Jul"],
datasets: [
{
label: "My First dataset",
data: [55, 30, 90, 41, 86, 45, 80],
borderColor: '#8bc740',
borderWidth: "2",
backgroundColor: 'transparent',
pointBackgroundColor: '#8bc740',
pointRadius: 0
}
]
},
options: {
legend: false,
responsive: true,
maintainAspectRatio: false,
scales: {
yAxes: [{
display: false,
ticks: {
beginAtZero: true,
max: 100,
min: 0,
stepSize: 20,
padding: 0,
display: false,
},
gridLines: {
drawBorder: false,
display: false
}
}],
xAxes: [{
display: false,
ticks: {
padding: 0,
display: false
},
gridLines: {
display: false,
drawBorder: false
}
}]
}
}
});
}
}
var chartWidget15 = function(){
//#chart_widget_15
if(jQuery('#chart_widget_15').length > 0 ){
const chart_widget_15 = document.getElementById("chart_widget_15");
chart_widget_15.height = 200;
new Chart(chart_widget_15, {
type: 'line',
data: {
defaultFontFamily: 'Poppins',
labels: ["Jan", "Febr", "Mar", "Apr", "May", "Jun", "Jul"],
datasets: [
{
label: "My First dataset",
data: [25, 60, 30, 71, 26, 85, 50],
borderColor: '#0B2A97',
borderWidth: "2",
backgroundColor: 'transparent',
pointBackgroundColor: '#0B2A97',
pointRadius: 0
}
]
},
options: {
legend: false,
responsive: true,
maintainAspectRatio: false,
scales: {
yAxes: [{
display: false,
ticks: {
beginAtZero: true,
max: 100,
min: 0,
stepSize: 20,
padding: 0,
display: false,
},
gridLines: {
drawBorder: false,
display: false
}
}],
xAxes: [{
display: false,
ticks: {
padding: 0,
display: false
},
gridLines: {
display: false,
drawBorder: false
}
}]
}
}
});
}
}
var chartWidget16 = function(){
//#chart_widget_16
if(jQuery('#chart_widget_16').length > 0 ){
const chart_widget_16 = document.getElementById("chart_widget_16");
chart_widget_16.height = 345;
new Chart(chart_widget_16, {
type: 'line',
data: {
defaultFontFamily: 'Poppins',
labels: ["Jan", "Febr", "Mar", "Apr", "May", "Jun", "Jul"],
datasets: [
{
label: "My First dataset",
data: [25, 60, 30, 71, 26, 85, 50],
borderColor: 'rgba(72, 169, 248, 1)',
borderWidth: "2",
backgroundColor: 'rgba(72, 169, 248, 1)',
pointBackgroundColor: 'rgba(72, 169, 248, 1)',
pointRadius: 0
}
]
},
options: {
legend: false,
responsive: true,
maintainAspectRatio: false,
tooltips: {
intersect: !1,
mode: "nearest",
xPadding: 10,
yPadding: 10,
caretPadding: 10
},
scales: {
yAxes: [{
display: false,
ticks: {
beginAtZero: true,
max: 100,
min: 0,
stepSize: 20,
padding: 0,
display: false,
},
gridLines: {
drawBorder: false,
display: false
}
}],
xAxes: [{
display: false,
ticks: {
padding: 0,
display: false,
beginAtZero: true
},
gridLines: {
display: false,
drawBorder: false
}
}]
}
}
});
}
}
var chartWidget17 = function(){
//#chart_widget_17
if(jQuery('#chart_widget_17').length > 0 ){
let data = [];
const 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);
}
const res = [];
for (let i = 0; i < data.length; ++i) {
res.push([i, data[i]])
}
return res;
}
// Set up the control widget
const updateInterval = 1000;
if(jQuery('#chart_widget_17').length > 0 ){
const chart = $.plot('#chart_widget_17', [getRandomData()], {
colors: ['#2f4cdd'],
series: {
lines: {
show: true,
lineWidth: 0,
fill: 0.9
},
shadowSize: 0 // Drawing is faster without shadows
},
grid: {
borderColor: 'transparent',
borderWidth: 0,
labelMargin: 0
},
xaxis: {
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
},
yaxis: {
min: 0,
max: 100,
color: 'transparent',
font: {
size: 10,
color: '#fff'
}
}
});
function update_chart() {
chart.setData([getRandomData()]);
chart.draw();
setTimeout(update_chart, updateInterval);
}
update_chart();
}
}
}
var widgetSparkLinedash = function(){
/* Widget */
if(jQuery('#widget_sparklinedash').length > 0 ){
$("#widget_sparklinedash").sparkline([10, 15, 26, 27, 28, 31, 34, 40, 41, 44, 49, 64, 68, 69, 72], {
type: "bar",
height: "40",
width: "40",
barWidth: "3",
resize: !0,
barSpacing: "3",
barColor: "rgb(0, 171, 197)"
});
}
}
var widgetSparkBar = function(){
if(jQuery('#widget_spark-bar').length > 0 ){
$("#widget_spark-bar").sparkline([33, 22, 68, 54, 8, 30, 74, 7, 36, 5, 41, 19, 43, 29, 38], {
type: "bar",
height: "40",
barWidth: 3,
barSpacing: 3,
barColor: "rgb(7, 135, 234)"
});
}
}
var widgetStackedBarChart = function(){
if(jQuery('#widget_StackedBarChart').length > 0 ){
$('#widget_StackedBarChart').sparkline([
[1, 4, 2],
[2, 3, 2],
[3, 2, 2],
[4, 1, 2]
], {
type: "bar",
height: "40",
barWidth: 3,
barSpacing: 3,
stackedBarColor: ['#36b9d8', '#4bffa2', 'rgba(68, 0, 235, .8)']
});
}
}
var widgetTristate = function(){
if(jQuery('#widget_tristate').length > 0 ){
$("#widget_tristate").sparkline([1, 1, 0, 1, -1, -1, 1, -1, 0, 0, 1, 1], {
type: 'tristate',
height: "40",
barWidth: 3,
barSpacing: 3,
colorMap: ['#36b9d8', '#4bffa2', 'rgba(68, 0, 235, .8)'],
negBarColor: 'rgba(245, 60, 121, .8)'
});
}
}
var widgetCompositeBar = function(){
// Composite
if(jQuery('#widget_composite-bar').length > 0 ){
$("#widget_composite-bar").sparkline([73, 53, 50, 67, 3, 56, 19, 59, 37, 32, 40, 26, 71, 19, 4, 53, 55, 31, 37, 67, 10, 21], {
type: "bar",
height: "40",
barWidth: "3",
resize: !0,
// barSpacing: "7",
barColor: "rgb(68, 11, 89)",
width: '100%'
});
}
}
/* Function ============ */
return {
init:function(){
},
load:function(){
activityChart();
activeUser();
chartWidget1();
chartWidget2();
chartWidget3();
chartWidget4();
chartWidget5();
chartWidget6();
chartWidget7();
chartWidget8();
chartWidget9();
chartWidget10();
chartWidget11();
chartWidget14();
chartWidget15();
chartWidget16();
chartWidget17();
widgetSparkLinedash();
widgetSparkBar();
widgetStackedBarChart();
widgetTristate();
widgetCompositeBar();
},
resize:function(){
chartWidget7();
}
}
}();
jQuery(document).ready(function(){
});
jQuery(window).on('load',function(){
dzChartlist.load();
});
jQuery(window).on('resize',function(){
dzChartlist.resize();
});
})(jQuery);