first commit - report data
This commit is contained in:
@@ -0,0 +1,3 @@
|
||||
"use strict";
|
||||
|
||||
$(".pwstrength").pwstrength();
|
||||
Vendored
+98
@@ -0,0 +1,98 @@
|
||||
"use strict";
|
||||
|
||||
$("#modal-1").fireModal({body: 'Modal body text goes here.'});
|
||||
$("#modal-2").fireModal({body: 'Modal body text goes here.', center: true});
|
||||
|
||||
let modal_3_body = '<p>Object to create a button on the modal.</p><pre class="language-javascript"><code>';
|
||||
modal_3_body += '[\n';
|
||||
modal_3_body += ' {\n';
|
||||
modal_3_body += " text: 'Login',\n";
|
||||
modal_3_body += " submit: true,\n";
|
||||
modal_3_body += " class: 'btn btn-primary btn-shadow',\n";
|
||||
modal_3_body += " handler: function(modal) {\n";
|
||||
modal_3_body += " alert('Hello, you clicked me!');\n"
|
||||
modal_3_body += " }\n"
|
||||
modal_3_body += ' }\n';
|
||||
modal_3_body += ']';
|
||||
modal_3_body += '</code></pre>';
|
||||
$("#modal-3").fireModal({
|
||||
title: 'Modal with Buttons',
|
||||
body: modal_3_body,
|
||||
buttons: [
|
||||
{
|
||||
text: 'Click, me!',
|
||||
class: 'btn btn-primary btn-shadow',
|
||||
handler: function(modal) {
|
||||
alert('Hello, you clicked me!');
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
$("#modal-4").fireModal({
|
||||
footerClass: 'bg-whitesmoke',
|
||||
body: 'Add the <code>bg-whitesmoke</code> class to the <code>footerClass</code> option.',
|
||||
buttons: [
|
||||
{
|
||||
text: 'No Action!',
|
||||
class: 'btn btn-primary btn-shadow',
|
||||
handler: function(modal) {
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
$("#modal-5").fireModal({
|
||||
title: 'Login',
|
||||
body: $("#modal-login-part"),
|
||||
footerClass: 'bg-whitesmoke',
|
||||
autoFocus: false,
|
||||
onFormSubmit: function(modal, e, form) {
|
||||
// Form Data
|
||||
let form_data = $(e.target).serialize();
|
||||
console.log(form_data)
|
||||
|
||||
// DO AJAX HERE
|
||||
let fake_ajax = setTimeout(function() {
|
||||
form.stopProgress();
|
||||
modal.find('.modal-body').prepend('<div class="alert alert-info">Please check your browser console</div>')
|
||||
|
||||
clearInterval(fake_ajax);
|
||||
}, 1500);
|
||||
|
||||
e.preventDefault();
|
||||
},
|
||||
shown: function(modal, form) {
|
||||
console.log(form)
|
||||
},
|
||||
buttons: [
|
||||
{
|
||||
text: 'Login',
|
||||
submit: true,
|
||||
class: 'btn btn-primary btn-shadow',
|
||||
handler: function(modal) {
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
$("#modal-6").fireModal({
|
||||
body: '<p>Now you can see something on the left side of the footer.</p>',
|
||||
created: function(modal) {
|
||||
modal.find('.modal-footer').prepend('<div class="mr-auto"><a href="#">I\'m a hyperlink!</a></div>');
|
||||
},
|
||||
buttons: [
|
||||
{
|
||||
text: 'No Action',
|
||||
submit: true,
|
||||
class: 'btn btn-primary btn-shadow',
|
||||
handler: function(modal) {
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
$('.oh-my-modal').fireModal({
|
||||
title: 'My Modal',
|
||||
body: 'This is cool plugin!'
|
||||
});
|
||||
@@ -0,0 +1,120 @@
|
||||
"use strict";
|
||||
|
||||
var chats = [
|
||||
{
|
||||
text: 'Hi, dude!',
|
||||
position: 'left'
|
||||
},
|
||||
{
|
||||
text: 'Wat?',
|
||||
position: 'right'
|
||||
},
|
||||
{
|
||||
text: 'You wanna know?',
|
||||
position: 'left'
|
||||
},
|
||||
{
|
||||
text: 'Wat?!',
|
||||
position: 'right'
|
||||
},
|
||||
{
|
||||
typing: true,
|
||||
position: 'left'
|
||||
}
|
||||
];
|
||||
for(var i = 0; i < chats.length; i++) {
|
||||
var type = 'text';
|
||||
if(chats[i].typing != undefined) type = 'typing';
|
||||
$.chatCtrl('#mychatbox', {
|
||||
text: (chats[i].text != undefined ? chats[i].text : ''),
|
||||
picture: (chats[i].position == 'left' ? '../assets/img/avatar/avatar-1.png' : '../assets/img/avatar/avatar-2.png'),
|
||||
position: 'chat-'+chats[i].position,
|
||||
type: type
|
||||
});
|
||||
}
|
||||
|
||||
$("#chat-form").submit(function() {
|
||||
var me = $(this);
|
||||
|
||||
if(me.find('input').val().trim().length > 0) {
|
||||
$.chatCtrl('#mychatbox', {
|
||||
text: me.find('input').val(),
|
||||
picture: '../assets/img/avatar/avatar-2.png',
|
||||
});
|
||||
me.find('input').val('');
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
var chats = [
|
||||
{
|
||||
text: 'Wake up!',
|
||||
position: 'left'
|
||||
},
|
||||
{
|
||||
text: 'Yes, already',
|
||||
position: 'right'
|
||||
},
|
||||
{
|
||||
text: 'Grab a brush and put a little make-up',
|
||||
position: 'left'
|
||||
},
|
||||
{
|
||||
text: 'What do you mean?',
|
||||
position: 'right'
|
||||
},
|
||||
{
|
||||
text: 'Hide the scars to fade away the shake-up',
|
||||
position: 'left'
|
||||
},
|
||||
{
|
||||
text: 'WTF?!',
|
||||
position: 'right'
|
||||
},
|
||||
{
|
||||
text: 'Why\'d you leave the keys upon the table?',
|
||||
position: 'left'
|
||||
},
|
||||
{
|
||||
text: '-__________________-',
|
||||
position: 'right'
|
||||
},
|
||||
{
|
||||
text: 'Here you go create another fable',
|
||||
position: 'left'
|
||||
},
|
||||
{
|
||||
text: 'You wanted do!',
|
||||
position: 'right'
|
||||
},
|
||||
{
|
||||
text: 'FXCK!',
|
||||
position: 'right'
|
||||
},
|
||||
{
|
||||
text: '<i>You have blocked Ryan</i>',
|
||||
position: 'right'
|
||||
},
|
||||
];
|
||||
for(var i = 0; i < chats.length; i++) {
|
||||
var type = 'text';
|
||||
if(chats[i].typing != undefined) type = 'typing';
|
||||
$.chatCtrl('#mychatbox2', {
|
||||
text: (chats[i].text != undefined ? chats[i].text : ''),
|
||||
picture: (chats[i].position == 'left' ? '../assets/img/avatar/avatar-5.png' : '../assets/img/avatar/avatar-2.png'),
|
||||
position: 'chat-'+chats[i].position,
|
||||
type: type
|
||||
});
|
||||
}
|
||||
$("#chat-form2").submit(function() {
|
||||
var me = $(this);
|
||||
|
||||
if(me.find('input').val().trim().length > 0) {
|
||||
$.chatCtrl('#mychatbox2', {
|
||||
text: me.find('input').val(),
|
||||
picture: '../assets/img/avatar/avatar-2.png',
|
||||
});
|
||||
me.find('input').val('');
|
||||
}
|
||||
return false;
|
||||
});
|
||||
@@ -0,0 +1,41 @@
|
||||
"use strict";
|
||||
|
||||
var dropzone = new Dropzone("#mydropzone", {
|
||||
url: "#"
|
||||
});
|
||||
|
||||
var minSteps = 6,
|
||||
maxSteps = 60,
|
||||
timeBetweenSteps = 100,
|
||||
bytesPerStep = 100000;
|
||||
|
||||
dropzone.uploadFiles = function(files) {
|
||||
var self = this;
|
||||
|
||||
for (var i = 0; i < files.length; i++) {
|
||||
|
||||
var file = files[i];
|
||||
totalSteps = Math.round(Math.min(maxSteps, Math.max(minSteps, file.size / bytesPerStep)));
|
||||
|
||||
for (var step = 0; step < totalSteps; step++) {
|
||||
var duration = timeBetweenSteps * (step + 1);
|
||||
setTimeout(function(file, totalSteps, step) {
|
||||
return function() {
|
||||
file.upload = {
|
||||
progress: 100 * (step + 1) / totalSteps,
|
||||
total: file.size,
|
||||
bytesSent: (step + 1) * file.size / totalSteps
|
||||
};
|
||||
|
||||
self.emit('uploadprogress', file, file.upload.progress, file.upload.bytesSent);
|
||||
if (file.upload.progress == 100) {
|
||||
file.status = Dropzone.SUCCESS;
|
||||
self.emit("success", file, 'success', null);
|
||||
self.emit("complete", file);
|
||||
self.processQueue();
|
||||
}
|
||||
};
|
||||
}(file, totalSteps, step), duration);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,239 @@
|
||||
"use strict";
|
||||
|
||||
var sparkline_values = [10, 7, 4, 8, 5, 8, 6, 5, 2, 4, 7, 4, 9, 6, 5, 9];
|
||||
var sparkline_values_chart = [2, 6, 4, 8, 3, 5, 2, 7];
|
||||
var sparkline_values_bar = [10, 7, 4, 8, 5, 8, 6, 5, 2, 4, 7, 4, 9, 10, 7, 4, 8, 5, 8, 6, 5, 2, 4, 7, 4, 9, 8, 6, 5, 2, 4, 7, 4, 9, 10, 2, 4, 7, 4, 9, 7, 4, 8, 5, 8, 6, 5];
|
||||
|
||||
$('.sparkline-inline').sparkline(sparkline_values, {
|
||||
type: 'line',
|
||||
width: '100%',
|
||||
height: '32',
|
||||
lineWidth: 3,
|
||||
lineColor: 'rgba(87,75,144,.1)',
|
||||
fillColor: 'rgba(87,75,144,.25)',
|
||||
highlightSpotColor: 'rgba(87,75,144,.1)',
|
||||
highlightLineColor: 'rgba(87,75,144,.1)',
|
||||
spotRadius: 3,
|
||||
});
|
||||
|
||||
$('.sparkline-line').sparkline(sparkline_values, {
|
||||
type: 'line',
|
||||
width: '100%',
|
||||
height: '32',
|
||||
lineWidth: 3,
|
||||
lineColor: 'rgba(63, 82, 227, .5)',
|
||||
fillColor: 'transparent',
|
||||
highlightSpotColor: 'rgba(63, 82, 227, .5)',
|
||||
highlightLineColor: 'rgba(63, 82, 227, .5)',
|
||||
spotRadius: 3,
|
||||
});
|
||||
|
||||
$('.sparkline-line-chart').sparkline(sparkline_values_chart, {
|
||||
type: 'line',
|
||||
width: '100%',
|
||||
height: '32',
|
||||
lineWidth: 2,
|
||||
lineColor: 'rgba(63, 82, 227, .5)',
|
||||
fillColor: 'transparent',
|
||||
highlightSpotColor: 'rgba(63, 82, 227, .5)',
|
||||
highlightLineColor: 'rgba(63, 82, 227, .5)',
|
||||
spotRadius: 2,
|
||||
});
|
||||
|
||||
$(".sparkline-bar").sparkline(sparkline_values_bar, {
|
||||
type: 'bar',
|
||||
height: '32',
|
||||
disableTooltips: true,
|
||||
barColor: 'rgb(87,75,144)'
|
||||
});
|
||||
|
||||
|
||||
var ctx = document.getElementById("myChart").getContext('2d');
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
|
||||
datasets: [{
|
||||
label: 'Statistics',
|
||||
data: [460, 458, 330, 502, 430, 610, 488],
|
||||
borderWidth: 2,
|
||||
backgroundColor: 'rgba(63,82,227,.8)',
|
||||
borderWidth: 0,
|
||||
borderColor: 'transparent',
|
||||
pointBorderWidth: 0,
|
||||
pointRadius: 3.5,
|
||||
pointBackgroundColor: 'transparent',
|
||||
pointHoverBackgroundColor: 'rgba(63,82,227,.8)',
|
||||
},{
|
||||
label: 'Statistics',
|
||||
data: [390, 600, 390, 280, 600, 430, 638],
|
||||
borderWidth: 2,
|
||||
backgroundColor: 'rgba(254,86,83,.7)',
|
||||
borderWidth: 0,
|
||||
borderColor: 'transparent',
|
||||
pointBorderWidth: 0 ,
|
||||
pointRadius: 3.5,
|
||||
pointBackgroundColor: 'transparent',
|
||||
pointHoverBackgroundColor: 'rgba(254,86,83,.8)',
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
drawBorder: false,
|
||||
color: '#f2f2f2',
|
||||
},
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
stepSize: 200,
|
||||
callback: function(value, index, values) {
|
||||
return '$' + value;
|
||||
}
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
gridLines: {
|
||||
display: false,
|
||||
tickMarkLength: 15,
|
||||
}
|
||||
}]
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
var ctx = document.getElementById("myChart2").getContext('2d');
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
|
||||
datasets: [{
|
||||
label: 'Statistics',
|
||||
data: [460, 458, 330, 502, 430, 610, 488],
|
||||
borderWidth: 2,
|
||||
backgroundColor: 'rgba(254,86,83,.7)',
|
||||
borderColor: 'rgba(254,86,83,.7)',
|
||||
borderWidth: 2.5,
|
||||
pointBackgroundColor: '#ffffff',
|
||||
pointRadius: 4
|
||||
},{
|
||||
label: 'Statistics',
|
||||
data: [550, 558, 390, 562, 490, 670, 538],
|
||||
borderWidth: 2,
|
||||
backgroundColor: 'rgba(63,82,227,.8)',
|
||||
borderColor: 'transparent',
|
||||
borderWidth: 0,
|
||||
pointBackgroundColor: '#999',
|
||||
pointRadius: 4
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
drawBorder: false,
|
||||
color: '#f2f2f2',
|
||||
},
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
stepSize: 150
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
gridLines: {
|
||||
display: false
|
||||
}
|
||||
}]
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
var ctx = document.getElementById("myChart3").getContext('2d');
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
|
||||
datasets: [{
|
||||
label: 'Google',
|
||||
data: [290, 358, 220, 402, 690, 510, 688],
|
||||
borderWidth: 2,
|
||||
backgroundColor: 'transparent',
|
||||
borderColor: 'rgba(254,86,83,.7)',
|
||||
borderWidth: 2.5,
|
||||
pointBackgroundColor: 'transparent',
|
||||
pointBorderColor: 'transparent',
|
||||
pointRadius: 4
|
||||
},
|
||||
{
|
||||
label: 'Facebook',
|
||||
data: [450, 258, 390, 162, 440, 570, 438],
|
||||
borderWidth: 2,
|
||||
backgroundColor: 'transparent',
|
||||
borderColor: 'rgba(63,82,227,.8)',
|
||||
borderWidth: 0,
|
||||
pointBackgroundColor: 'transparent',
|
||||
pointBorderColor: 'transparent',
|
||||
pointRadius: 4
|
||||
},
|
||||
]
|
||||
},
|
||||
options: {
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
drawBorder: false,
|
||||
color: '#f2f2f2',
|
||||
},
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
stepSize: 200
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
gridLines: {
|
||||
display: false
|
||||
}
|
||||
}]
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
$('#visitorMap').vectorMap(
|
||||
{
|
||||
map: 'world_en',
|
||||
backgroundColor: '#ffffff',
|
||||
borderColor: '#f2f2f2',
|
||||
borderOpacity: .8,
|
||||
borderWidth: 1,
|
||||
hoverColor: '#000',
|
||||
hoverOpacity: .8,
|
||||
color: '#ddd',
|
||||
normalizeFunction: 'linear',
|
||||
selectedRegions: false,
|
||||
showTooltip: true,
|
||||
pins: {
|
||||
id: '<div class="jqvmap-circle"></div>',
|
||||
my: '<div class="jqvmap-circle"></div>',
|
||||
th: '<div class="jqvmap-circle"></div>',
|
||||
sy: '<div class="jqvmap-circle"></div>',
|
||||
eg: '<div class="jqvmap-circle"></div>',
|
||||
ae: '<div class="jqvmap-circle"></div>',
|
||||
nz: '<div class="jqvmap-circle"></div>',
|
||||
tl: '<div class="jqvmap-circle"></div>',
|
||||
ng: '<div class="jqvmap-circle"></div>',
|
||||
si: '<div class="jqvmap-circle"></div>',
|
||||
pa: '<div class="jqvmap-circle"></div>',
|
||||
au: '<div class="jqvmap-circle"></div>',
|
||||
ca: '<div class="jqvmap-circle"></div>',
|
||||
tr: '<div class="jqvmap-circle"></div>',
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,33 @@
|
||||
"use strict";
|
||||
|
||||
$("[data-checkboxes]").each(function() {
|
||||
var me = $(this),
|
||||
group = me.data('checkboxes'),
|
||||
role = me.data('checkbox-role');
|
||||
|
||||
me.change(function() {
|
||||
var all = $('[data-checkboxes="' + group + '"]:not([data-checkbox-role="dad"])'),
|
||||
checked = $('[data-checkboxes="' + group + '"]:not([data-checkbox-role="dad"]):checked'),
|
||||
dad = $('[data-checkboxes="' + group + '"][data-checkbox-role="dad"]'),
|
||||
total = all.length,
|
||||
checked_length = checked.length;
|
||||
|
||||
if(role == 'dad') {
|
||||
if(me.is(':checked')) {
|
||||
all.prop('checked', true);
|
||||
}else{
|
||||
all.prop('checked', false);
|
||||
}
|
||||
}else{
|
||||
if(checked_length >= total) {
|
||||
dad.prop('checked', true);
|
||||
}else{
|
||||
dad.prop('checked', false);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$("#sortable-table tbody").sortable({
|
||||
handle: '.sort-handler'
|
||||
});
|
||||
@@ -0,0 +1,20 @@
|
||||
"use strict";
|
||||
|
||||
$("#users-carousel").owlCarousel({
|
||||
items: 4,
|
||||
margin: 20,
|
||||
autoplay: true,
|
||||
autoplayTimeout: 5000,
|
||||
loop: true,
|
||||
responsive: {
|
||||
0: {
|
||||
items: 2
|
||||
},
|
||||
578: {
|
||||
items: 4
|
||||
},
|
||||
768: {
|
||||
items: 4
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,13 @@
|
||||
"use strict";
|
||||
|
||||
$("select").selectric();
|
||||
$.uploadPreview({
|
||||
input_field: "#image-upload", // Default: .image-upload
|
||||
preview_box: "#image-preview", // Default: .image-preview
|
||||
label_field: "#image-label", // Default: .image-label
|
||||
label_default: "Choose File", // Default: Choose File
|
||||
label_selected: "Change File", // Default: Change File
|
||||
no_label: false, // Default: false
|
||||
success_callback: null // Default: null
|
||||
});
|
||||
$(".inputtags").tagsinput('items');
|
||||
@@ -0,0 +1,29 @@
|
||||
"use strict";
|
||||
|
||||
$("[data-checkboxes]").each(function() {
|
||||
var me = $(this),
|
||||
group = me.data('checkboxes'),
|
||||
role = me.data('checkbox-role');
|
||||
|
||||
me.change(function() {
|
||||
var all = $('[data-checkboxes="' + group + '"]:not([data-checkbox-role="dad"])'),
|
||||
checked = $('[data-checkboxes="' + group + '"]:not([data-checkbox-role="dad"]):checked'),
|
||||
dad = $('[data-checkboxes="' + group + '"][data-checkbox-role="dad"]'),
|
||||
total = all.length,
|
||||
checked_length = checked.length;
|
||||
|
||||
if(role == 'dad') {
|
||||
if(me.is(':checked')) {
|
||||
all.prop('checked', true);
|
||||
}else{
|
||||
all.prop('checked', false);
|
||||
}
|
||||
}else{
|
||||
if(checked_length >= total) {
|
||||
dad.prop('checked', true);
|
||||
}else{
|
||||
dad.prop('checked', false);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,27 @@
|
||||
"use strict";
|
||||
|
||||
$("#setting-form").submit(function() {
|
||||
let save_button = $(this).find('#save-btn'),
|
||||
output_status = $("#output-status"),
|
||||
card = $('#settings-card');
|
||||
|
||||
let card_progress = $.cardProgress(card, {
|
||||
spinner: false
|
||||
});
|
||||
save_button.addClass('btn-progress');
|
||||
output_status.html('');
|
||||
|
||||
// Do AJAX here
|
||||
// Here's fake AJAX
|
||||
setTimeout(function() {
|
||||
card_progress.dismiss(function() {
|
||||
$('html, body').animate({
|
||||
scrollTop: 0
|
||||
});
|
||||
|
||||
output_status.prepend('<div class="alert alert-success">Setting saved Successfully.</div>')
|
||||
save_button.removeClass('btn-progress');
|
||||
});
|
||||
}, 3000);
|
||||
return false;
|
||||
});
|
||||
@@ -0,0 +1,77 @@
|
||||
"use strict";
|
||||
|
||||
var cleavePN = new Cleave('.phone-number', {
|
||||
phone: true,
|
||||
phoneRegionCode: 'us'
|
||||
});
|
||||
var cleaveC = new Cleave('.currency', {
|
||||
numeral: true,
|
||||
numeralThousandsGroupStyle: 'thousand'
|
||||
});
|
||||
var cleavePC = new Cleave('.purchase-code', {
|
||||
delimiter: '-',
|
||||
blocks: [4, 4, 4, 4],
|
||||
uppercase: true
|
||||
});
|
||||
var cleaveI = new Cleave('.invoice-input', {
|
||||
prefix: 'INV',
|
||||
delimiter: '-',
|
||||
blocks: [10],
|
||||
uppercase: true
|
||||
});
|
||||
var cleaveD = new Cleave('.datemask', {
|
||||
date: true,
|
||||
datePattern: ['Y', 'm', 'd']
|
||||
});
|
||||
var cc_last_type;
|
||||
var cleaveCC = new Cleave('.creditcard', {
|
||||
creditCard: true,
|
||||
onCreditCardTypeChanged: function(type) {
|
||||
if(type !== 'unknown') {
|
||||
if(type == 'amex') {
|
||||
type = 'americanexpress';
|
||||
}else if(type == 'mastercard') {
|
||||
type = 'mastercard';
|
||||
}else if(type == 'visa') {
|
||||
type = 'visa';
|
||||
}else if(type == 'diners') {
|
||||
type = 'dinersclub';
|
||||
}else if(type == 'discover') {
|
||||
type = 'discover';
|
||||
}else if(type == 'jcb') {
|
||||
type = 'jcb';
|
||||
}
|
||||
$(".creditcard").removeClass(cc_last_type);
|
||||
$(".creditcard").addClass(type);
|
||||
cc_last_type = type;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$(".pwstrength").pwstrength();
|
||||
|
||||
$('.daterange-cus').daterangepicker({
|
||||
locale: {format: 'YYYY-MM-DD'},
|
||||
drops: 'down',
|
||||
opens: 'right'
|
||||
});
|
||||
$('.daterange-btn').daterangepicker({
|
||||
ranges: {
|
||||
'Today' : [moment(), moment()],
|
||||
'Yesterday' : [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
|
||||
'Last 7 Days' : [moment().subtract(6, 'days'), moment()],
|
||||
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
|
||||
'This Month' : [moment().startOf('month'), moment().endOf('month')],
|
||||
'Last Month' : [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
|
||||
},
|
||||
startDate: moment().subtract(29, 'days'),
|
||||
endDate : moment()
|
||||
}, function (start, end) {
|
||||
$('.daterange-btn span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'))
|
||||
});
|
||||
|
||||
$(".colorpickerinput").colorpicker({
|
||||
format: 'hex',
|
||||
component: '.input-group-append',
|
||||
});
|
||||
$(".inputtags").tagsinput('items');
|
||||
@@ -0,0 +1,31 @@
|
||||
"use strict";
|
||||
|
||||
// initialize map
|
||||
var map = new GMaps({
|
||||
div: '#map',
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061
|
||||
});
|
||||
|
||||
// when the 'start travel' button is clicked
|
||||
$("#start-travel").click(function() {
|
||||
$(this).fadeOut();
|
||||
$("#instructions").before("<div class='section-title'>Instructions</div>");
|
||||
map.travelRoute({
|
||||
origin: [-6.5637928, 106.7535061],
|
||||
destination: [-6.5956157, 106.788236],
|
||||
travelMode: 'driving',
|
||||
step: function(e) {
|
||||
$('#instructions').append('<li class="media"><div class="media-icon"><i class="far fa-circle"></i></div><div class="media-body">'+e.instructions+'</div></li>');
|
||||
$('#instructions li:eq(' + e.step_number + ')').delay(450 * e.step_number).fadeIn(200, function() {
|
||||
map.setCenter(e.end_location.lat(), e.end_location.lng());
|
||||
map.drawPolyline({
|
||||
path: e.path,
|
||||
strokeColor: '#131540',
|
||||
strokeOpacity: 0.6,
|
||||
strokeWeight: 6
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,57 @@
|
||||
"use strict";
|
||||
|
||||
var input_lat = $("#input-lat"), // latitude input text
|
||||
input_lng = $("#input-lng"), // longitude input text
|
||||
map = new GMaps({ // init map
|
||||
div: '#map',
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061
|
||||
});
|
||||
|
||||
// add marker
|
||||
var marker = map.addMarker({
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061,
|
||||
draggable: true,
|
||||
});
|
||||
|
||||
// when the map is clicked
|
||||
map.addListener("click", function(e) {
|
||||
var lat = e.latLng.lat(),
|
||||
lng = e.latLng.lng();
|
||||
|
||||
// move the marker position
|
||||
marker.setPosition({
|
||||
lat: lat,
|
||||
lng: lng
|
||||
});
|
||||
update_position();
|
||||
});
|
||||
|
||||
// when the marker is dragged
|
||||
marker.addListener('drag', function(e) {
|
||||
update_position();
|
||||
});
|
||||
|
||||
// set the value to latitude and longitude input
|
||||
update_position();
|
||||
function update_position() {
|
||||
var lat = marker.getPosition().lat(), lng = marker.getPosition().lng();
|
||||
input_lat.val(lat);
|
||||
input_lng.val(lng);
|
||||
}
|
||||
|
||||
// move the marker when the latitude and longitude inputs change in value
|
||||
$("#input-lat,#input-lng").blur(function() {
|
||||
var lat = parseInt(input_lat.val()),
|
||||
lng = parseInt(input_lng.val());
|
||||
|
||||
marker.setPosition({
|
||||
lat: lat,
|
||||
lng: lng
|
||||
});
|
||||
map.setCenter({
|
||||
lat: lat,
|
||||
lng: lng
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,28 @@
|
||||
"use strict";
|
||||
|
||||
// initialize map
|
||||
var map = new GMaps({
|
||||
div: '#map',
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061
|
||||
});
|
||||
|
||||
// when the form is submitted
|
||||
$("#search-form").submit(function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
// initialize map geocode
|
||||
GMaps.geocode({
|
||||
address: $('#address').val(),
|
||||
callback: function(results, status) {
|
||||
if (status == 'OK') {
|
||||
var latlng = results[0].geometry.location;
|
||||
map.setCenter(latlng.lat(), latlng.lng());
|
||||
map.addMarker({
|
||||
lat: latlng.lat(),
|
||||
lng: latlng.lng()
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
@@ -0,0 +1,30 @@
|
||||
"use strict";
|
||||
|
||||
// initialize map
|
||||
var map = new GMaps({
|
||||
div: '#map',
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061
|
||||
});
|
||||
// initialize map geolocation
|
||||
GMaps.geolocate({
|
||||
// when geolocation is allowed by user
|
||||
success: function(position) {
|
||||
// set center map according to user position
|
||||
map.setCenter(position.coords.latitude, position.coords.longitude);
|
||||
// add a marker to the map
|
||||
map.addMarker({
|
||||
lat: position.coords.latitude,
|
||||
lng: position.coords.longitude,
|
||||
title: 'You'
|
||||
});
|
||||
},
|
||||
// when geolocation is blocked by the user
|
||||
error: function(error) {
|
||||
toastr.error('Geolocation failed: '+error.message);
|
||||
},
|
||||
// when the user's browser does not support
|
||||
not_supported: function() {
|
||||
toastr.error("Your browser does not support geolocation");
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,17 @@
|
||||
"use strict";
|
||||
|
||||
// initialize map
|
||||
var map = new GMaps({
|
||||
div: '#map',
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061
|
||||
});
|
||||
// Added a marker to the map
|
||||
map.addMarker({
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061,
|
||||
title: 'Multinity',
|
||||
infoWindow: {
|
||||
content: '<h6>Multinity</h6><p>Jl. HM. Syarifudin, Bubulak, Bogor Bar., <br>Kota Bogor, Jawa Barat 16115</p><p><a target="_blank" href="http://multinity.com">Website</a></p>'
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,34 @@
|
||||
"use strict";
|
||||
|
||||
// initialize map
|
||||
var map = new GMaps({
|
||||
div: '#map',
|
||||
lat: -6.8665409,
|
||||
lng: 106.4836553,
|
||||
zoom: 8
|
||||
});
|
||||
// Added markers to the map
|
||||
map.addMarker({
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061,
|
||||
title: 'Multinity',
|
||||
infoWindow: {
|
||||
content: '<h6>Multinity</h6><p>Jl. HM. Syarifudin, Bubulak, Bogor Bar., <br>Kota Bogor, Jawa Barat 16115</p><p><a target="_blank" href="https://multinity.com">Website</a></p>'
|
||||
}
|
||||
});
|
||||
map.addMarker({
|
||||
lat: -6.1325841,
|
||||
lng: 106.8116507,
|
||||
title: 'Procyon Logikreasi Indonesia',
|
||||
infoWindow: {
|
||||
content: '<h6>Procyon Logikreasi Indonesia</h6><p>Jl. Kali Besar Tim. No.29C, RT.7/RW.7, Pinangsia, Tamansari, Kota Jakarta Barat, Daerah Khusus Ibukota Jakarta 11110</p><p><a target="_blank" href="https://procyon.co.id/">Website</a></p>'
|
||||
}
|
||||
});
|
||||
map.addMarker({
|
||||
lat: -6.4462693,
|
||||
lng: 106.7654318,
|
||||
title: 'Sigma ID',
|
||||
infoWindow: {
|
||||
content: '<h6>Sigma ID</h6><p>Jl.Setapak No.5, Citayam, Tajur Halang, Bogor, Jawa Barat 16320</p><p><a target="_blank" href="http://sigmaid.net/">Website</a></p>'
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,19 @@
|
||||
"use strict";
|
||||
|
||||
// initialize map
|
||||
var map = new GMaps({
|
||||
div: '#map',
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061,
|
||||
zoom: 13
|
||||
});
|
||||
|
||||
// draw route between 'origin' to 'destination'
|
||||
map.drawRoute({
|
||||
origin: [-6.5637928, 106.7535061],
|
||||
destination: [-6.5956157, 106.788236],
|
||||
travelMode: 'driving',
|
||||
strokeColor: '#131540',
|
||||
strokeOpacity: 0.6,
|
||||
strokeWeight: 6
|
||||
});
|
||||
@@ -0,0 +1,7 @@
|
||||
"use strict";
|
||||
|
||||
var simple_map = new GMaps({
|
||||
div: '#simple-map',
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061
|
||||
})
|
||||
@@ -0,0 +1,101 @@
|
||||
"use strict";
|
||||
|
||||
var statistics_chart = document.getElementById("myChart").getContext('2d');
|
||||
|
||||
var myChart = new Chart(statistics_chart, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
|
||||
datasets: [{
|
||||
label: 'Statistics',
|
||||
data: [640, 387, 530, 302, 430, 270, 488],
|
||||
borderWidth: 5,
|
||||
borderColor: '#6777ef',
|
||||
backgroundColor: 'transparent',
|
||||
pointBackgroundColor: '#fff',
|
||||
pointBorderColor: '#6777ef',
|
||||
pointRadius: 4
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
display: false,
|
||||
drawBorder: false,
|
||||
},
|
||||
ticks: {
|
||||
stepSize: 150
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
gridLines: {
|
||||
color: '#fbfbfb',
|
||||
lineWidth: 2
|
||||
}
|
||||
}]
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
$('#visitorMap').vectorMap(
|
||||
{
|
||||
map: 'world_en',
|
||||
backgroundColor: '#ffffff',
|
||||
borderColor: '#f2f2f2',
|
||||
borderOpacity: .8,
|
||||
borderWidth: 1,
|
||||
hoverColor: '#000',
|
||||
hoverOpacity: .8,
|
||||
color: '#ddd',
|
||||
normalizeFunction: 'linear',
|
||||
selectedRegions: false,
|
||||
showTooltip: true,
|
||||
pins: {
|
||||
id: '<div class="jqvmap-circle"></div>',
|
||||
my: '<div class="jqvmap-circle"></div>',
|
||||
th: '<div class="jqvmap-circle"></div>',
|
||||
sy: '<div class="jqvmap-circle"></div>',
|
||||
eg: '<div class="jqvmap-circle"></div>',
|
||||
ae: '<div class="jqvmap-circle"></div>',
|
||||
nz: '<div class="jqvmap-circle"></div>',
|
||||
tl: '<div class="jqvmap-circle"></div>',
|
||||
ng: '<div class="jqvmap-circle"></div>',
|
||||
si: '<div class="jqvmap-circle"></div>',
|
||||
pa: '<div class="jqvmap-circle"></div>',
|
||||
au: '<div class="jqvmap-circle"></div>',
|
||||
ca: '<div class="jqvmap-circle"></div>',
|
||||
tr: '<div class="jqvmap-circle"></div>',
|
||||
},
|
||||
});
|
||||
|
||||
// weather
|
||||
getWeather();
|
||||
setInterval(getWeather, 600000);
|
||||
|
||||
function getWeather() {
|
||||
$.simpleWeather({
|
||||
location: 'Bogor, Indonesia',
|
||||
unit: 'c',
|
||||
success: function(weather) {
|
||||
var html = '';
|
||||
html += '<div class="weather">';
|
||||
html += '<div class="weather-icon text-primary"><span class="wi wi-yahoo-' + weather.code + '"></span></div>';
|
||||
html += '<div class="weather-desc">';
|
||||
html += '<h4>' + weather.temp + '°' + weather.units.temp + '</h4>';
|
||||
html += '<div class="weather-text">' + weather.currently + '</div>';
|
||||
html += '<ul><li>' + weather.city + ', ' + weather.region + '</li>';
|
||||
html += '<li> <i class="wi wi-strong-wind"></i> ' + weather.wind.speed+' '+weather.units.speed + '</li></ul>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
|
||||
$("#myWeather").html(html);
|
||||
},
|
||||
error: function(error) {
|
||||
$("#myWeather").html('<div class="alert alert-danger">'+error+'</div>');
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -0,0 +1,194 @@
|
||||
"use strict";
|
||||
|
||||
var ctx = document.getElementById("myChart").getContext('2d');
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: ["January", "February", "March", "April", "May", "June", "July", "August"],
|
||||
datasets: [{
|
||||
label: 'Sales',
|
||||
data: [3200, 1800, 4305, 3022, 6310, 5120, 5880, 6154],
|
||||
borderWidth: 2,
|
||||
backgroundColor: 'rgba(63,82,227,.8)',
|
||||
borderWidth: 0,
|
||||
borderColor: 'transparent',
|
||||
pointBorderWidth: 0,
|
||||
pointRadius: 3.5,
|
||||
pointBackgroundColor: 'transparent',
|
||||
pointHoverBackgroundColor: 'rgba(63,82,227,.8)',
|
||||
},
|
||||
{
|
||||
label: 'Budget',
|
||||
data: [2207, 3403, 2200, 5025, 2302, 4208, 3880, 4880],
|
||||
borderWidth: 2,
|
||||
backgroundColor: 'rgba(254,86,83,.7)',
|
||||
borderWidth: 0,
|
||||
borderColor: 'transparent',
|
||||
pointBorderWidth: 0 ,
|
||||
pointRadius: 3.5,
|
||||
pointBackgroundColor: 'transparent',
|
||||
pointHoverBackgroundColor: 'rgba(254,86,83,.8)',
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
// display: false,
|
||||
drawBorder: false,
|
||||
color: '#f2f2f2',
|
||||
},
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
stepSize: 1500,
|
||||
callback: function(value, index, values) {
|
||||
return '$' + value;
|
||||
}
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
gridLines: {
|
||||
display: false,
|
||||
tickMarkLength: 15,
|
||||
}
|
||||
}]
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
var balance_chart = document.getElementById("balance-chart").getContext('2d');
|
||||
|
||||
var balance_chart_bg_color = balance_chart.createLinearGradient(0, 0, 0, 70);
|
||||
balance_chart_bg_color.addColorStop(0, 'rgba(63,82,227,.2)');
|
||||
balance_chart_bg_color.addColorStop(1, 'rgba(63,82,227,0)');
|
||||
|
||||
var myChart = new Chart(balance_chart, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: ['16-07-2018', '17-07-2018', '18-07-2018', '19-07-2018', '20-07-2018', '21-07-2018', '22-07-2018', '23-07-2018', '24-07-2018', '25-07-2018', '26-07-2018', '27-07-2018', '28-07-2018', '29-07-2018', '30-07-2018', '31-07-2018'],
|
||||
datasets: [{
|
||||
label: 'Balance',
|
||||
data: [50, 61, 80, 50, 72, 52, 60, 41, 30, 45, 70, 40, 93, 63, 50, 62],
|
||||
backgroundColor: balance_chart_bg_color,
|
||||
borderWidth: 3,
|
||||
borderColor: 'rgba(63,82,227,1)',
|
||||
pointBorderWidth: 0,
|
||||
pointBorderColor: 'transparent',
|
||||
pointRadius: 3,
|
||||
pointBackgroundColor: 'transparent',
|
||||
pointHoverBackgroundColor: 'rgba(63,82,227,1)',
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
layout: {
|
||||
padding: {
|
||||
bottom: -1,
|
||||
left: -1
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
display: false,
|
||||
drawBorder: false,
|
||||
},
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
display: false
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
gridLines: {
|
||||
drawBorder: false,
|
||||
display: false,
|
||||
},
|
||||
ticks: {
|
||||
display: false
|
||||
}
|
||||
}]
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
var sales_chart = document.getElementById("sales-chart").getContext('2d');
|
||||
|
||||
var sales_chart_bg_color = sales_chart.createLinearGradient(0, 0, 0, 80);
|
||||
balance_chart_bg_color.addColorStop(0, 'rgba(63,82,227,.2)');
|
||||
balance_chart_bg_color.addColorStop(1, 'rgba(63,82,227,0)');
|
||||
|
||||
var myChart = new Chart(sales_chart, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: ['16-07-2018', '17-07-2018', '18-07-2018', '19-07-2018', '20-07-2018', '21-07-2018', '22-07-2018', '23-07-2018', '24-07-2018', '25-07-2018', '26-07-2018', '27-07-2018', '28-07-2018', '29-07-2018', '30-07-2018', '31-07-2018'],
|
||||
datasets: [{
|
||||
label: 'Sales',
|
||||
data: [70, 62, 44, 40, 21, 63, 82, 52, 50, 31, 70, 50, 91, 63, 51, 60],
|
||||
borderWidth: 2,
|
||||
backgroundColor: balance_chart_bg_color,
|
||||
borderWidth: 3,
|
||||
borderColor: 'rgba(63,82,227,1)',
|
||||
pointBorderWidth: 0,
|
||||
pointBorderColor: 'transparent',
|
||||
pointRadius: 3,
|
||||
pointBackgroundColor: 'transparent',
|
||||
pointHoverBackgroundColor: 'rgba(63,82,227,1)',
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
layout: {
|
||||
padding: {
|
||||
bottom: -1,
|
||||
left: -1
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
display: false,
|
||||
drawBorder: false,
|
||||
},
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
display: false
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
gridLines: {
|
||||
drawBorder: false,
|
||||
display: false,
|
||||
},
|
||||
ticks: {
|
||||
display: false
|
||||
}
|
||||
}]
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
$("#products-carousel").owlCarousel({
|
||||
items: 3,
|
||||
margin: 10,
|
||||
autoplay: true,
|
||||
autoplayTimeout: 5000,
|
||||
loop: true,
|
||||
responsive: {
|
||||
0: {
|
||||
items: 2
|
||||
},
|
||||
768: {
|
||||
items: 2
|
||||
},
|
||||
1200: {
|
||||
items: 3
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,66 @@
|
||||
"use strict";
|
||||
|
||||
$("#myEvent").fullCalendar({
|
||||
height: 'auto',
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,agendaWeek,agendaDay,listWeek'
|
||||
},
|
||||
editable: true,
|
||||
events: [
|
||||
{
|
||||
title: 'Conference',
|
||||
start: '2018-01-9',
|
||||
end: '2018-01-11',
|
||||
backgroundColor: "#fff",
|
||||
borderColor: "#fff",
|
||||
textColor: '#000'
|
||||
},
|
||||
{
|
||||
title: "John's Birthday",
|
||||
start: '2018-01-14',
|
||||
backgroundColor: "#007bff",
|
||||
borderColor: "#007bff",
|
||||
textColor: '#fff'
|
||||
},
|
||||
{
|
||||
title: 'Reporting',
|
||||
start: '2018-01-10T11:30:00',
|
||||
backgroundColor: "#f56954",
|
||||
borderColor: "#f56954",
|
||||
textColor: '#fff'
|
||||
},
|
||||
{
|
||||
title: 'Starting New Project',
|
||||
start: '2018-01-11',
|
||||
backgroundColor: "#ffc107",
|
||||
borderColor: "#ffc107",
|
||||
textColor: '#fff'
|
||||
},
|
||||
{
|
||||
title: 'Social Distortion Concert',
|
||||
start: '2018-01-24',
|
||||
end: '2018-01-27',
|
||||
backgroundColor: "#000",
|
||||
borderColor: "#000",
|
||||
textColor: '#fff'
|
||||
},
|
||||
{
|
||||
title: 'Lunch',
|
||||
start: '2018-01-24T13:15:00',
|
||||
backgroundColor: "#fff",
|
||||
borderColor: "#fff",
|
||||
textColor: '#000',
|
||||
},
|
||||
{
|
||||
title: 'Company Trip',
|
||||
start: '2018-01-28',
|
||||
end: '2018-01-31',
|
||||
backgroundColor: "#fff",
|
||||
borderColor: "#fff",
|
||||
textColor: '#000',
|
||||
},
|
||||
]
|
||||
|
||||
});
|
||||
@@ -0,0 +1,161 @@
|
||||
"use strict";
|
||||
|
||||
var ctx = document.getElementById("myChart").getContext('2d');
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
|
||||
datasets: [{
|
||||
label: 'Statistics',
|
||||
data: [460, 458, 330, 502, 430, 610, 488],
|
||||
borderWidth: 2,
|
||||
backgroundColor: '#6777ef',
|
||||
borderColor: '#6777ef',
|
||||
borderWidth: 2.5,
|
||||
pointBackgroundColor: '#ffffff',
|
||||
pointRadius: 4
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
drawBorder: false,
|
||||
color: '#f2f2f2',
|
||||
},
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
stepSize: 150
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
ticks: {
|
||||
display: false
|
||||
},
|
||||
gridLines: {
|
||||
display: false
|
||||
}
|
||||
}]
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
var ctx = document.getElementById("myChart2").getContext('2d');
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
|
||||
datasets: [{
|
||||
label: 'Statistics',
|
||||
data: [460, 458, 330, 502, 430, 610, 488],
|
||||
borderWidth: 2,
|
||||
backgroundColor: '#6777ef',
|
||||
borderColor: '#6777ef',
|
||||
borderWidth: 2.5,
|
||||
pointBackgroundColor: '#ffffff',
|
||||
pointRadius: 4
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
drawBorder: false,
|
||||
color: '#f2f2f2',
|
||||
},
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
stepSize: 150
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
ticks: {
|
||||
display: false
|
||||
},
|
||||
gridLines: {
|
||||
display: false
|
||||
}
|
||||
}]
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
var ctx = document.getElementById("myChart3").getContext('2d');
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: [
|
||||
80,
|
||||
50,
|
||||
40,
|
||||
30,
|
||||
20,
|
||||
],
|
||||
backgroundColor: [
|
||||
'#191d21',
|
||||
'#63ed7a',
|
||||
'#ffa426',
|
||||
'#fc544b',
|
||||
'#6777ef',
|
||||
],
|
||||
label: 'Dataset 1'
|
||||
}],
|
||||
labels: [
|
||||
'Black',
|
||||
'Green',
|
||||
'Yellow',
|
||||
'Red',
|
||||
'Blue'
|
||||
],
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
legend: {
|
||||
position: 'bottom',
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
var ctx = document.getElementById("myChart4").getContext('2d');
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'pie',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: [
|
||||
80,
|
||||
50,
|
||||
40,
|
||||
30,
|
||||
100,
|
||||
],
|
||||
backgroundColor: [
|
||||
'#191d21',
|
||||
'#63ed7a',
|
||||
'#ffa426',
|
||||
'#fc544b',
|
||||
'#6777ef',
|
||||
],
|
||||
label: 'Dataset 1'
|
||||
}],
|
||||
labels: [
|
||||
'Black',
|
||||
'Green',
|
||||
'Yellow',
|
||||
'Red',
|
||||
'Blue'
|
||||
],
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
legend: {
|
||||
position: 'bottom',
|
||||
},
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,40 @@
|
||||
"use strict";
|
||||
|
||||
$("[data-checkboxes]").each(function() {
|
||||
var me = $(this),
|
||||
group = me.data('checkboxes'),
|
||||
role = me.data('checkbox-role');
|
||||
|
||||
me.change(function() {
|
||||
var all = $('[data-checkboxes="' + group + '"]:not([data-checkbox-role="dad"])'),
|
||||
checked = $('[data-checkboxes="' + group + '"]:not([data-checkbox-role="dad"]):checked'),
|
||||
dad = $('[data-checkboxes="' + group + '"][data-checkbox-role="dad"]'),
|
||||
total = all.length,
|
||||
checked_length = checked.length;
|
||||
|
||||
if(role == 'dad') {
|
||||
if(me.is(':checked')) {
|
||||
all.prop('checked', true);
|
||||
}else{
|
||||
all.prop('checked', false);
|
||||
}
|
||||
}else{
|
||||
if(checked_length >= total) {
|
||||
dad.prop('checked', true);
|
||||
}else{
|
||||
dad.prop('checked', false);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$("#table-1").dataTable({
|
||||
"columnDefs": [
|
||||
{ "sortable": false, "targets": [2,3] }
|
||||
]
|
||||
});
|
||||
$("#table-2").dataTable({
|
||||
"columnDefs": [
|
||||
{ "sortable": false, "targets": [0,2,3] }
|
||||
]
|
||||
});
|
||||
@@ -0,0 +1,9 @@
|
||||
"use strict";
|
||||
|
||||
$("#icons li").each(function() {
|
||||
$(this).append('<div class="icon-name">'+ $(this).attr('class') +'</div>');
|
||||
});
|
||||
$("#icons li").click(function() {
|
||||
$(".icon-name").fadeOut();
|
||||
$(this).find('.icon-name').fadeIn();
|
||||
});
|
||||
@@ -0,0 +1,7 @@
|
||||
"use strict";
|
||||
|
||||
$("#slider1,#slider2").owlCarousel({
|
||||
items: 1,
|
||||
nav: true,
|
||||
navText: ['<i class="fas fa-chevron-left"></i>','<i class="fas fa-chevron-right"></i>']
|
||||
});
|
||||
@@ -0,0 +1,44 @@
|
||||
"use strict";
|
||||
|
||||
var sparkline_values = [110, 147, 324, 108, 235, 498, 346, 525, 382, 214, 427, 424, 239, 236, 475, 569],
|
||||
sparkline_values_bar = [10, 7, 4, 8, 5, 8, 6, 5, 2, 4, 7, 4, 9, 10, 7, 4, 8, 5, 8, 6, 5, 4],
|
||||
sparkline_pie = [30, 20, 10];
|
||||
|
||||
$('.sparkline-inline').sparkline(sparkline_values, {
|
||||
type: 'line',
|
||||
width: '100%',
|
||||
height: '200',
|
||||
lineWidth: 3,
|
||||
lineColor: 'rgba(63,82,227,.1)',
|
||||
fillColor: 'rgba(63,82,227,.4)',
|
||||
highlightSpotColor: 'rgba(63,82,227,.1)',
|
||||
highlightLineColor: 'rgba(63,82,227,.1)',
|
||||
spotRadius: 3,
|
||||
});
|
||||
|
||||
$('.sparkline-line').sparkline(sparkline_values, {
|
||||
type: 'line',
|
||||
width: '100%',
|
||||
height: '200',
|
||||
lineWidth: 3,
|
||||
lineColor: 'rgba(63,82,227,.6)',
|
||||
fillColor: 'transparent',
|
||||
highlightSpotColor: 'rgba(63,82,227,.1)',
|
||||
highlightLineColor: 'rgba(63,82,227,.1)',
|
||||
spotRadius: 3,
|
||||
});
|
||||
|
||||
$(".sparkline-bar").sparkline(sparkline_values_bar, {
|
||||
type: 'bar',
|
||||
width: '100%',
|
||||
height: '200',
|
||||
barColor: 'rgb(63,82,227)',
|
||||
barWidth: 20
|
||||
});
|
||||
|
||||
$(".sparkline-pie").sparkline(sparkline_pie, {
|
||||
type: 'pie',
|
||||
width: 'auto',
|
||||
height: '200',
|
||||
barWidth: 20
|
||||
});
|
||||
@@ -0,0 +1,62 @@
|
||||
"use strict";
|
||||
|
||||
$("#swal-1").click(function() {
|
||||
swal('Hello');
|
||||
});
|
||||
|
||||
$("#swal-2").click(function() {
|
||||
swal('Good Job', 'You clicked the button!', 'success');
|
||||
});
|
||||
|
||||
$("#swal-3").click(function() {
|
||||
swal('Good Job', 'You clicked the button!', 'warning');
|
||||
});
|
||||
|
||||
$("#swal-4").click(function() {
|
||||
swal('Good Job', 'You clicked the button!', 'info');
|
||||
});
|
||||
|
||||
$("#swal-5").click(function() {
|
||||
swal('Good Job', 'You clicked the button!', 'error');
|
||||
});
|
||||
|
||||
$("#swal-6").click(function() {
|
||||
swal({
|
||||
title: 'Are you sure?',
|
||||
text: 'Once deleted, you will not be able to recover this imaginary file!',
|
||||
icon: 'warning',
|
||||
buttons: true,
|
||||
dangerMode: true,
|
||||
})
|
||||
.then((willDelete) => {
|
||||
if (willDelete) {
|
||||
swal('Poof! Your imaginary file has been deleted!', {
|
||||
icon: 'success',
|
||||
});
|
||||
} else {
|
||||
swal('Your imaginary file is safe!');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$("#swal-7").click(function() {
|
||||
swal({
|
||||
title: 'What is your name?',
|
||||
content: {
|
||||
element: 'input',
|
||||
attributes: {
|
||||
placeholder: 'Type your name',
|
||||
type: 'text',
|
||||
},
|
||||
},
|
||||
}).then((data) => {
|
||||
swal('Hello, ' + data + '!');
|
||||
});
|
||||
});
|
||||
|
||||
$("#swal-8").click(function() {
|
||||
swal('This modal will disappear soon!', {
|
||||
buttons: false,
|
||||
timer: 3000,
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,65 @@
|
||||
"use strict";
|
||||
|
||||
$("#toastr-1").click(function() {
|
||||
iziToast.info({
|
||||
title: 'Hello, world!',
|
||||
message: 'This awesome plugin is made iziToast toastr',
|
||||
position: 'topRight'
|
||||
});
|
||||
});
|
||||
|
||||
$("#toastr-2").click(function() {
|
||||
iziToast.success({
|
||||
title: 'Hello, world!',
|
||||
message: 'This awesome plugin is made by iziToast',
|
||||
position: 'topRight'
|
||||
});
|
||||
});
|
||||
|
||||
$("#toastr-3").click(function() {
|
||||
iziToast.warning({
|
||||
title: 'Hello, world!',
|
||||
message: 'This awesome plugin is made by iziToast',
|
||||
position: 'topRight'
|
||||
});
|
||||
});
|
||||
|
||||
$("#toastr-4").click(function() {
|
||||
iziToast.error({
|
||||
title: 'Hello, world!',
|
||||
message: 'This awesome plugin is made by iziToast',
|
||||
position: 'topRight'
|
||||
});
|
||||
});
|
||||
|
||||
$("#toastr-5").click(function() {
|
||||
iziToast.show({
|
||||
title: 'Hello, world!',
|
||||
message: 'This awesome plugin is made by iziToast',
|
||||
position: 'bottomRight'
|
||||
});
|
||||
});
|
||||
|
||||
$("#toastr-6").click(function() {
|
||||
iziToast.show({
|
||||
title: 'Hello, world!',
|
||||
message: 'This awesome plugin is made by iziToast',
|
||||
position: 'bottomCenter'
|
||||
});
|
||||
});
|
||||
|
||||
$("#toastr-7").click(function() {
|
||||
iziToast.show({
|
||||
title: 'Hello, world!',
|
||||
message: 'This awesome plugin is made by iziToast',
|
||||
position: 'bottomLeft'
|
||||
});
|
||||
});
|
||||
|
||||
$("#toastr-8").click(function() {
|
||||
iziToast.show({
|
||||
title: 'Hello, world!',
|
||||
message: 'This awesome plugin is made by iziToast',
|
||||
position: 'topCenter'
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,79 @@
|
||||
"use strict";
|
||||
|
||||
$('#visitorMap').vectorMap({
|
||||
map: 'world_en',
|
||||
backgroundColor: '#ffffff',
|
||||
borderColor: '#f2f2f2',
|
||||
borderOpacity: .8,
|
||||
borderWidth: 1,
|
||||
hoverColor: '#000',
|
||||
hoverOpacity: .8,
|
||||
color: '#ddd',
|
||||
normalizeFunction: 'linear',
|
||||
selectedRegions: false,
|
||||
showTooltip: true,
|
||||
pins: {
|
||||
id: '<div class="jqvmap-circle"></div>',
|
||||
my: '<div class="jqvmap-circle"></div>',
|
||||
th: '<div class="jqvmap-circle"></div>',
|
||||
sy: '<div class="jqvmap-circle"></div>',
|
||||
eg: '<div class="jqvmap-circle"></div>',
|
||||
ae: '<div class="jqvmap-circle"></div>',
|
||||
nz: '<div class="jqvmap-circle"></div>',
|
||||
tl: '<div class="jqvmap-circle"></div>',
|
||||
ng: '<div class="jqvmap-circle"></div>',
|
||||
si: '<div class="jqvmap-circle"></div>',
|
||||
pa: '<div class="jqvmap-circle"></div>',
|
||||
au: '<div class="jqvmap-circle"></div>',
|
||||
ca: '<div class="jqvmap-circle"></div>',
|
||||
tr: '<div class="jqvmap-circle"></div>',
|
||||
},
|
||||
onRegionClick: function(element, code, region) {
|
||||
var opts = {
|
||||
title: 'Choosed',
|
||||
message: 'You clicked "'
|
||||
+ region
|
||||
+ '" which has the code: '
|
||||
+ code.toUpperCase()
|
||||
};
|
||||
|
||||
iziToast.info(opts);
|
||||
}
|
||||
});
|
||||
$('#visitorMap2').vectorMap({
|
||||
map: 'world_en',
|
||||
backgroundColor: '#ffffff',
|
||||
borderColor: '#f2f2f2',
|
||||
borderOpacity: .8,
|
||||
borderWidth: 1,
|
||||
hoverColor: '#000',
|
||||
hoverOpacity: .8,
|
||||
color: '#ddd',
|
||||
normalizeFunction: 'linear',
|
||||
selectedRegions: false,
|
||||
showTooltip: true,
|
||||
onRegionClick: function(element, code, region) {
|
||||
var message = 'You clicked "'
|
||||
+ region
|
||||
+ '" which has the code: '
|
||||
+ code.toUpperCase();
|
||||
|
||||
$("#flag-icon").removeClass (function (index, className) {
|
||||
return (className.match (/(^|\s)flag-icon-\S+/g) || []).join(' ');
|
||||
});
|
||||
$("#flag-icon").addClass('flag-icon-' + code);
|
||||
}
|
||||
});
|
||||
$('#visitorMap3').vectorMap({
|
||||
map: 'indonesia_id',
|
||||
backgroundColor: '#ffffff',
|
||||
borderColor: '#f2f2f2',
|
||||
borderOpacity: .8,
|
||||
borderWidth: 1,
|
||||
hoverColor: '#000',
|
||||
hoverOpacity: .8,
|
||||
color: '#ddd',
|
||||
normalizeFunction: 'linear',
|
||||
selectedRegions: false,
|
||||
showTooltip: true,
|
||||
});
|
||||
@@ -0,0 +1,20 @@
|
||||
"use strict";
|
||||
|
||||
// initialize map
|
||||
var map = new GMaps({
|
||||
div: '#map',
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061,
|
||||
zoomControl: false,
|
||||
fullscreenControl: false,
|
||||
mapTypeControl: true,
|
||||
mapTypeControlOptions: {
|
||||
mapTypeIds: []
|
||||
}
|
||||
});
|
||||
// Added a overlay to the map
|
||||
map.drawOverlay({
|
||||
lat: -6.5637928,
|
||||
lng: 106.7535061,
|
||||
content: '<div class="popover" style="width:250px;"><div class="manual-arrow"><i class="fas fa-caret-down"></i></div><div class="popover-body"><b>Multinity</b><p><small>Jl. HM. Syarifudin, Bubulak, Bogor Bar., <br>Kota Bogor, Jawa Barat 16115</p><p><a target="_blank" href="http://multinity.com">Website</a></small></p></div></div>'
|
||||
});
|
||||
Reference in New Issue
Block a user