first commit - report data
This commit is contained in:
@@ -0,0 +1,8 @@
|
||||
/**
|
||||
*
|
||||
* You can write your JS code here, DO NOT touch the default style file
|
||||
* because it will make it harder for you to update.
|
||||
*
|
||||
*/
|
||||
|
||||
"use strict";
|
||||
@@ -0,0 +1,3 @@
|
||||
"use strict";
|
||||
|
||||
$(".pwstrength").pwstrength();
|
||||
@@ -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>'
|
||||
});
|
||||
@@ -0,0 +1,616 @@
|
||||
"use strict";
|
||||
|
||||
// ChartJS
|
||||
if(window.Chart) {
|
||||
Chart.defaults.global.defaultFontFamily = "'Nunito', 'Segoe UI', 'Arial'";
|
||||
Chart.defaults.global.defaultFontSize = 12;
|
||||
Chart.defaults.global.defaultFontStyle = 500;
|
||||
Chart.defaults.global.defaultFontColor = "#999";
|
||||
Chart.defaults.global.tooltips.backgroundColor = "#000";
|
||||
Chart.defaults.global.tooltips.bodyFontColor = "rgba(255,255,255,.7)";
|
||||
Chart.defaults.global.tooltips.titleMarginBottom = 10;
|
||||
Chart.defaults.global.tooltips.titleFontSize = 14;
|
||||
Chart.defaults.global.tooltips.titleFontFamily = "'Nunito', 'Segoe UI', 'Arial'";
|
||||
Chart.defaults.global.tooltips.titleFontColor = '#fff';
|
||||
Chart.defaults.global.tooltips.xPadding = 15;
|
||||
Chart.defaults.global.tooltips.yPadding = 15;
|
||||
Chart.defaults.global.tooltips.displayColors = false;
|
||||
Chart.defaults.global.tooltips.intersect = false;
|
||||
Chart.defaults.global.tooltips.mode = 'nearest';
|
||||
}
|
||||
|
||||
// DropzoneJS
|
||||
if(window.Dropzone) {
|
||||
Dropzone.autoDiscover = false;
|
||||
}
|
||||
|
||||
// Basic confirm box
|
||||
$('[data-confirm]').each(function() {
|
||||
var me = $(this),
|
||||
me_data = me.data('confirm');
|
||||
|
||||
me_data = me_data.split("|");
|
||||
me.fireModal({
|
||||
title: me_data[0],
|
||||
body: me_data[1],
|
||||
buttons: [
|
||||
{
|
||||
text: me.data('confirm-text-yes') || 'Yes',
|
||||
class: 'btn btn-danger btn-shadow',
|
||||
handler: function() {
|
||||
eval(me.data('confirm-yes'));
|
||||
}
|
||||
},
|
||||
{
|
||||
text: me.data('confirm-text-cancel') || 'Cancel',
|
||||
class: 'btn btn-secondary',
|
||||
handler: function(modal) {
|
||||
$.destroyModal(modal);
|
||||
eval(me.data('confirm-no'));
|
||||
}
|
||||
}
|
||||
]
|
||||
})
|
||||
});
|
||||
|
||||
// Global
|
||||
$(function() {
|
||||
let sidebar_nicescroll_opts = {
|
||||
cursoropacitymin: 0,
|
||||
cursoropacitymax: .8,
|
||||
zindex: 892
|
||||
}, now_layout_class = null;
|
||||
|
||||
var sidebar_sticky = function() {
|
||||
if($("body").hasClass('layout-2')) {
|
||||
$("body.layout-2 #sidebar-wrapper").stick_in_parent({
|
||||
parent: $('body')
|
||||
});
|
||||
$("body.layout-2 #sidebar-wrapper").stick_in_parent({recalc_every: 1});
|
||||
}
|
||||
}
|
||||
sidebar_sticky();
|
||||
|
||||
var sidebar_nicescroll;
|
||||
var update_sidebar_nicescroll = function() {
|
||||
let a = setInterval(function() {
|
||||
if(sidebar_nicescroll != null)
|
||||
sidebar_nicescroll.resize();
|
||||
}, 10);
|
||||
|
||||
setTimeout(function() {
|
||||
clearInterval(a);
|
||||
}, 600);
|
||||
}
|
||||
|
||||
var sidebar_dropdown = function() {
|
||||
if($(".main-sidebar").length) {
|
||||
$(".main-sidebar").niceScroll(sidebar_nicescroll_opts);
|
||||
sidebar_nicescroll = $(".main-sidebar").getNiceScroll();
|
||||
|
||||
$(".main-sidebar .sidebar-menu li a.has-dropdown").off('click').on('click', function() {
|
||||
var me = $(this);
|
||||
var active = false;
|
||||
if(me.parent().hasClass("active")){
|
||||
active = true;
|
||||
}
|
||||
|
||||
$('.main-sidebar .sidebar-menu li.active > .dropdown-menu').slideUp(500, function() {
|
||||
update_sidebar_nicescroll();
|
||||
return false;
|
||||
});
|
||||
|
||||
$('.main-sidebar .sidebar-menu li.active').removeClass('active');
|
||||
|
||||
if(active==true) {
|
||||
me.parent().removeClass('active');
|
||||
me.parent().find('> .dropdown-menu').slideUp(500, function() {
|
||||
update_sidebar_nicescroll();
|
||||
return false;
|
||||
});
|
||||
}else{
|
||||
me.parent().addClass('active');
|
||||
me.parent().find('> .dropdown-menu').slideDown(500, function() {
|
||||
update_sidebar_nicescroll();
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
$('.main-sidebar .sidebar-menu li.active > .dropdown-menu').slideDown(500, function() {
|
||||
update_sidebar_nicescroll();
|
||||
return false;
|
||||
});
|
||||
}
|
||||
}
|
||||
sidebar_dropdown();
|
||||
|
||||
if($("#top-5-scroll").length) {
|
||||
$("#top-5-scroll").css({
|
||||
height: 315
|
||||
}).niceScroll();
|
||||
}
|
||||
|
||||
$(".main-content").css({
|
||||
minHeight: $(window).outerHeight() - 108
|
||||
})
|
||||
|
||||
$(".nav-collapse-toggle").click(function() {
|
||||
$(this).parent().find('.navbar-nav').toggleClass('show');
|
||||
return false;
|
||||
});
|
||||
|
||||
$(document).on('click', function(e) {
|
||||
$(".nav-collapse .navbar-nav").removeClass('show');
|
||||
});
|
||||
|
||||
var toggle_sidebar_mini = function(mini) {
|
||||
let body = $('body');
|
||||
|
||||
if(!mini) {
|
||||
body.removeClass('sidebar-mini');
|
||||
$(".main-sidebar").css({
|
||||
overflow: 'hidden'
|
||||
});
|
||||
setTimeout(function() {
|
||||
$(".main-sidebar").niceScroll(sidebar_nicescroll_opts);
|
||||
sidebar_nicescroll = $(".main-sidebar").getNiceScroll();
|
||||
}, 500);
|
||||
$(".main-sidebar .sidebar-menu > li > ul .dropdown-title").remove();
|
||||
$(".main-sidebar .sidebar-menu > li > a").removeAttr('data-toggle');
|
||||
$(".main-sidebar .sidebar-menu > li > a").removeAttr('data-original-title');
|
||||
$(".main-sidebar .sidebar-menu > li > a").removeAttr('title');
|
||||
}else{
|
||||
body.addClass('sidebar-mini');
|
||||
body.removeClass('sidebar-show');
|
||||
sidebar_nicescroll.remove();
|
||||
sidebar_nicescroll = null;
|
||||
$(".main-sidebar .sidebar-menu > li").each(function() {
|
||||
let me = $(this);
|
||||
|
||||
if(me.find('> .dropdown-menu').length) {
|
||||
me.find('> .dropdown-menu').hide();
|
||||
me.find('> .dropdown-menu').prepend('<li class="dropdown-title pt-3">'+ me.find('> a').text() +'</li>');
|
||||
}else{
|
||||
me.find('> a').attr('data-toggle', 'tooltip');
|
||||
me.find('> a').attr('data-original-title', me.find('> a').text());
|
||||
$("[data-toggle='tooltip']").tooltip({
|
||||
placement: 'right'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
$("[data-toggle='sidebar']").click(function() {
|
||||
var body = $("body"),
|
||||
w = $(window);
|
||||
|
||||
if(w.outerWidth() <= 1024) {
|
||||
body.removeClass('search-show search-gone');
|
||||
if(body.hasClass('sidebar-gone')) {
|
||||
body.removeClass('sidebar-gone');
|
||||
body.addClass('sidebar-show');
|
||||
}else{
|
||||
body.addClass('sidebar-gone');
|
||||
body.removeClass('sidebar-show');
|
||||
}
|
||||
|
||||
update_sidebar_nicescroll();
|
||||
}else{
|
||||
body.removeClass('search-show search-gone');
|
||||
if(body.hasClass('sidebar-mini')) {
|
||||
toggle_sidebar_mini(false);
|
||||
}else{
|
||||
toggle_sidebar_mini(true);
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
var toggleLayout = function() {
|
||||
var w = $(window),
|
||||
layout_class = $('body').attr('class') || '',
|
||||
layout_classes = (layout_class.trim().length > 0 ? layout_class.split(' ') : '');
|
||||
|
||||
if(layout_classes.length > 0) {
|
||||
layout_classes.forEach(function(item) {
|
||||
if(item.indexOf('layout-') != -1) {
|
||||
now_layout_class = item;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if(w.outerWidth() <= 1024) {
|
||||
if($('body').hasClass('sidebar-mini')) {
|
||||
toggle_sidebar_mini(false);
|
||||
$('.main-sidebar').niceScroll(sidebar_nicescroll_opts);
|
||||
sidebar_nicescroll = $(".main-sidebar").getNiceScroll();
|
||||
}
|
||||
|
||||
$("body").addClass("sidebar-gone");
|
||||
$("body").removeClass("layout-2 layout-3 sidebar-mini sidebar-show");
|
||||
$("body").off('click touchend').on('click touchend', function(e) {
|
||||
if($(e.target).hasClass('sidebar-show') || $(e.target).hasClass('search-show')) {
|
||||
$("body").removeClass("sidebar-show");
|
||||
$("body").addClass("sidebar-gone");
|
||||
$("body").removeClass("search-show");
|
||||
|
||||
update_sidebar_nicescroll();
|
||||
}
|
||||
});
|
||||
|
||||
update_sidebar_nicescroll();
|
||||
|
||||
if(now_layout_class == 'layout-3') {
|
||||
let nav_second_classes = $(".navbar-secondary").attr('class'),
|
||||
nav_second = $(".navbar-secondary");
|
||||
|
||||
nav_second.attr('data-nav-classes', nav_second_classes);
|
||||
nav_second.removeAttr('class');
|
||||
nav_second.addClass('main-sidebar');
|
||||
|
||||
let main_sidebar = $(".main-sidebar");
|
||||
main_sidebar.find('.container').addClass('sidebar-wrapper').removeClass('container');
|
||||
main_sidebar.find('.navbar-nav').addClass('sidebar-menu').removeClass('navbar-nav');
|
||||
main_sidebar.find('.sidebar-menu .nav-item.dropdown.show a').click();
|
||||
main_sidebar.find('.sidebar-brand').remove();
|
||||
main_sidebar.find('.sidebar-menu').before($('<div>', {
|
||||
class: 'sidebar-brand'
|
||||
}).append(
|
||||
$('<a>', {
|
||||
href: $('.navbar-brand').attr('href'),
|
||||
}).html($('.navbar-brand').html())
|
||||
));
|
||||
setTimeout(function() {
|
||||
sidebar_nicescroll = main_sidebar.niceScroll(sidebar_nicescroll_opts);
|
||||
sidebar_nicescroll = main_sidebar.getNiceScroll();
|
||||
}, 700);
|
||||
|
||||
sidebar_dropdown();
|
||||
$(".main-wrapper").removeClass("container");
|
||||
}
|
||||
}else{
|
||||
$("body").removeClass("sidebar-gone sidebar-show");
|
||||
if(now_layout_class)
|
||||
$("body").addClass(now_layout_class);
|
||||
|
||||
let nav_second_classes = $(".main-sidebar").attr('data-nav-classes'),
|
||||
nav_second = $(".main-sidebar");
|
||||
|
||||
if(now_layout_class == 'layout-3' && nav_second.hasClass('main-sidebar')) {
|
||||
nav_second.find(".sidebar-menu li a.has-dropdown").off('click');
|
||||
nav_second.find('.sidebar-brand').remove();
|
||||
nav_second.removeAttr('class');
|
||||
nav_second.addClass(nav_second_classes);
|
||||
|
||||
let main_sidebar = $(".navbar-secondary");
|
||||
main_sidebar.find('.sidebar-wrapper').addClass('container').removeClass('sidebar-wrapper');
|
||||
main_sidebar.find('.sidebar-menu').addClass('navbar-nav').removeClass('sidebar-menu');
|
||||
main_sidebar.find('.dropdown-menu').hide();
|
||||
main_sidebar.removeAttr('style');
|
||||
main_sidebar.removeAttr('tabindex');
|
||||
main_sidebar.removeAttr('data-nav-classes');
|
||||
$(".main-wrapper").addClass("container");
|
||||
// if(sidebar_nicescroll != null)
|
||||
// sidebar_nicescroll.remove();
|
||||
}else if(now_layout_class == 'layout-2') {
|
||||
$("body").addClass("layout-2");
|
||||
}else{
|
||||
update_sidebar_nicescroll();
|
||||
}
|
||||
}
|
||||
}
|
||||
toggleLayout();
|
||||
$(window).resize(toggleLayout);
|
||||
|
||||
$("[data-toggle='search']").click(function() {
|
||||
var body = $("body");
|
||||
|
||||
if(body.hasClass('search-gone')) {
|
||||
body.addClass('search-gone');
|
||||
body.removeClass('search-show');
|
||||
}else{
|
||||
body.removeClass('search-gone');
|
||||
body.addClass('search-show');
|
||||
}
|
||||
});
|
||||
|
||||
// tooltip
|
||||
$("[data-toggle='tooltip']").tooltip();
|
||||
|
||||
// popover
|
||||
$('[data-toggle="popover"]').popover({
|
||||
container: 'body'
|
||||
});
|
||||
|
||||
// Select2
|
||||
if(jQuery().select2) {
|
||||
$(".select2").select2();
|
||||
}
|
||||
|
||||
// Selectric
|
||||
if(jQuery().selectric) {
|
||||
$(".selectric").selectric({
|
||||
disableOnMobile: false,
|
||||
nativeOnMobile: false
|
||||
});
|
||||
}
|
||||
|
||||
$(".notification-toggle").dropdown();
|
||||
$(".notification-toggle").parent().on('shown.bs.dropdown', function() {
|
||||
$(".dropdown-list-icons").niceScroll({
|
||||
cursoropacitymin: .3,
|
||||
cursoropacitymax: .8,
|
||||
cursorwidth: 7
|
||||
});
|
||||
});
|
||||
|
||||
$(".message-toggle").dropdown();
|
||||
$(".message-toggle").parent().on('shown.bs.dropdown', function() {
|
||||
$(".dropdown-list-message").niceScroll({
|
||||
cursoropacitymin: .3,
|
||||
cursoropacitymax: .8,
|
||||
cursorwidth: 7
|
||||
});
|
||||
});
|
||||
|
||||
if($(".chat-content").length) {
|
||||
$(".chat-content").niceScroll({
|
||||
cursoropacitymin: .3,
|
||||
cursoropacitymax: .8,
|
||||
});
|
||||
$('.chat-content').getNiceScroll(0).doScrollTop($('.chat-content').height());
|
||||
}
|
||||
|
||||
if(jQuery().summernote) {
|
||||
$(".summernote").summernote({
|
||||
dialogsInBody: true,
|
||||
minHeight: 250,
|
||||
});
|
||||
$(".summernote-simple").summernote({
|
||||
dialogsInBody: true,
|
||||
minHeight: 150,
|
||||
toolbar: [
|
||||
['style', ['bold', 'italic', 'underline', 'clear']],
|
||||
['font', ['strikethrough']],
|
||||
['para', ['paragraph']]
|
||||
]
|
||||
});
|
||||
}
|
||||
|
||||
if(window.CodeMirror) {
|
||||
$(".codeeditor").each(function() {
|
||||
let editor = CodeMirror.fromTextArea(this, {
|
||||
lineNumbers: true,
|
||||
theme: "duotone-dark",
|
||||
mode: 'javascript',
|
||||
height: 200
|
||||
});
|
||||
editor.setSize("100%", 200);
|
||||
});
|
||||
}
|
||||
|
||||
// Follow function
|
||||
$('.follow-btn, .following-btn').each(function() {
|
||||
var me = $(this),
|
||||
follow_text = 'Follow',
|
||||
unfollow_text = 'Following';
|
||||
|
||||
me.click(function() {
|
||||
if(me.hasClass('following-btn')) {
|
||||
me.removeClass('btn-danger');
|
||||
me.removeClass('following-btn');
|
||||
me.addClass('btn-primary');
|
||||
me.html(follow_text);
|
||||
|
||||
eval(me.data('unfollow-action'));
|
||||
}else{
|
||||
me.removeClass('btn-primary');
|
||||
me.addClass('btn-danger');
|
||||
me.addClass('following-btn');
|
||||
me.html(unfollow_text);
|
||||
|
||||
eval(me.data('follow-action'));
|
||||
}
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
// Dismiss function
|
||||
$("[data-dismiss]").each(function() {
|
||||
var me = $(this),
|
||||
target = me.data('dismiss');
|
||||
|
||||
me.click(function() {
|
||||
$(target).fadeOut(function() {
|
||||
$(target).remove();
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
// Collapsable
|
||||
$("[data-collapse]").each(function() {
|
||||
var me = $(this),
|
||||
target = me.data('collapse');
|
||||
|
||||
me.click(function() {
|
||||
$(target).collapse('toggle');
|
||||
$(target).on('shown.bs.collapse', function(e) {
|
||||
e.stopPropagation();
|
||||
me.html('<i class="fas fa-minus"></i>');
|
||||
});
|
||||
$(target).on('hidden.bs.collapse', function(e) {
|
||||
e.stopPropagation();
|
||||
me.html('<i class="fas fa-plus"></i>');
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
// Gallery
|
||||
$(".gallery .gallery-item").each(function() {
|
||||
var me = $(this);
|
||||
|
||||
me.attr('href', me.data('image'));
|
||||
me.attr('title', me.data('title'));
|
||||
if(me.parent().hasClass('gallery-fw')) {
|
||||
me.css({
|
||||
height: me.parent().data('item-height'),
|
||||
});
|
||||
me.find('div').css({
|
||||
lineHeight: me.parent().data('item-height') + 'px'
|
||||
});
|
||||
}
|
||||
me.css({
|
||||
backgroundImage: 'url("'+ me.data('image') +'")'
|
||||
});
|
||||
});
|
||||
if(jQuery().Chocolat) {
|
||||
$(".gallery").Chocolat({
|
||||
className: 'gallery',
|
||||
imageSelector: '.gallery-item',
|
||||
});
|
||||
}
|
||||
|
||||
// Background
|
||||
$("[data-background]").each(function() {
|
||||
var me = $(this);
|
||||
me.css({
|
||||
backgroundImage: 'url(' + me.data('background') + ')'
|
||||
});
|
||||
});
|
||||
|
||||
// Custom Tab
|
||||
$("[data-tab]").each(function() {
|
||||
var me = $(this);
|
||||
|
||||
me.click(function() {
|
||||
if(!me.hasClass('active')) {
|
||||
var tab_group = $('[data-tab-group="' + me.data('tab') + '"]'),
|
||||
tab_group_active = $('[data-tab-group="' + me.data('tab') + '"].active'),
|
||||
target = $(me.attr('href')),
|
||||
links = $('[data-tab="'+me.data('tab') +'"]');
|
||||
|
||||
links.removeClass('active');
|
||||
me.addClass('active');
|
||||
target.addClass('active');
|
||||
tab_group_active.removeClass('active');
|
||||
}
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
// Bootstrap 4 Validation
|
||||
$(".needs-validation").submit(function() {
|
||||
var form = $(this);
|
||||
if (form[0].checkValidity() === false) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
form.addClass('was-validated');
|
||||
});
|
||||
|
||||
// alert dismissible
|
||||
$(".alert-dismissible").each(function() {
|
||||
var me = $(this);
|
||||
|
||||
me.find('.close').click(function() {
|
||||
me.alert('close');
|
||||
});
|
||||
});
|
||||
|
||||
if($('.main-navbar').length) {
|
||||
}
|
||||
|
||||
// Image cropper
|
||||
$('[data-crop-image]').each(function(e) {
|
||||
$(this).css({
|
||||
overflow: 'hidden',
|
||||
position: 'relative',
|
||||
height: $(this).data('crop-image')
|
||||
});
|
||||
});
|
||||
|
||||
// Slide Toggle
|
||||
$('[data-toggle-slide]').click(function() {
|
||||
let target = $(this).data('toggle-slide');
|
||||
|
||||
$(target).slideToggle();
|
||||
return false;
|
||||
});
|
||||
|
||||
// Dismiss modal
|
||||
$("[data-dismiss=modal]").click(function() {
|
||||
$(this).closest('.modal').modal('hide');
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
// Width attribute
|
||||
$('[data-width]').each(function() {
|
||||
$(this).css({
|
||||
width: $(this).data('width')
|
||||
});
|
||||
});
|
||||
|
||||
// Height attribute
|
||||
$('[data-height]').each(function() {
|
||||
$(this).css({
|
||||
height: $(this).data('height')
|
||||
});
|
||||
});
|
||||
|
||||
// Chocolat
|
||||
if($('.chocolat-parent').length && jQuery().Chocolat) {
|
||||
$('.chocolat-parent').Chocolat();
|
||||
}
|
||||
|
||||
// Sortable card
|
||||
if($('.sortable-card').length && jQuery().sortable) {
|
||||
$('.sortable-card').sortable({
|
||||
handle: '.card-header',
|
||||
opacity: .8,
|
||||
tolerance: 'pointer'
|
||||
});
|
||||
}
|
||||
|
||||
// Daterangepicker
|
||||
if(jQuery().daterangepicker) {
|
||||
if($(".datepicker").length) {
|
||||
$('.datepicker').daterangepicker({
|
||||
locale: {format: 'YYYY-MM-DD'},
|
||||
singleDatePicker: true,
|
||||
});
|
||||
}
|
||||
if($(".datetimepicker").length) {
|
||||
$('.datetimepicker').daterangepicker({
|
||||
locale: {format: 'YYYY-MM-DD HH:mm'},
|
||||
singleDatePicker: true,
|
||||
timePicker: true,
|
||||
timePicker24Hour: true,
|
||||
});
|
||||
}
|
||||
if($(".daterange").length) {
|
||||
$('.daterange').daterangepicker({
|
||||
locale: {format: 'YYYY-MM-DD'},
|
||||
drops: 'down',
|
||||
opens: 'right'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Timepicker
|
||||
if(jQuery().timepicker && $(".timepicker").length) {
|
||||
$(".timepicker").timepicker({
|
||||
icons: {
|
||||
up: 'fas fa-chevron-up',
|
||||
down: 'fas fa-chevron-down'
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,267 @@
|
||||
"use strict";
|
||||
|
||||
(function($, window, i) {
|
||||
// Bootstrap 4 Modal
|
||||
$.fn.fireModal = function(options) {
|
||||
var options = $.extend({
|
||||
size: 'modal-md',
|
||||
center: false,
|
||||
animation: true,
|
||||
title: 'Modal Title',
|
||||
closeButton: true,
|
||||
header: true,
|
||||
bodyClass: '',
|
||||
footerClass: '',
|
||||
body: '',
|
||||
buttons: [],
|
||||
autoFocus: true,
|
||||
removeOnDismiss: false,
|
||||
created: function() {},
|
||||
appended: function() {},
|
||||
onFormSubmit: function() {},
|
||||
modal: {}
|
||||
}, options);
|
||||
|
||||
this.each(function() {
|
||||
i++;
|
||||
var id = 'fire-modal-' + i,
|
||||
trigger_class = 'trigger--' + id,
|
||||
trigger_button = $('.' + trigger_class);
|
||||
|
||||
$(this).addClass(trigger_class);
|
||||
|
||||
// Get modal body
|
||||
let body = options.body;
|
||||
|
||||
if(typeof body == 'object') {
|
||||
if(body.length) {
|
||||
let part = body;
|
||||
body = body.removeAttr('id').clone().removeClass('modal-part');
|
||||
part.remove();
|
||||
}else{
|
||||
body = '<div class="text-danger">Modal part element not found!</div>';
|
||||
}
|
||||
}
|
||||
|
||||
// Modal base template
|
||||
var modal_template = ' <div class="modal'+ (options.animation == true ? ' fade' : '') +'" tabindex="-1" role="dialog" id="'+ id +'"> ' +
|
||||
' <div class="modal-dialog '+options.size+(options.center ? ' modal-dialog-centered' : '')+'" role="document"> ' +
|
||||
' <div class="modal-content"> ' +
|
||||
((options.header == true) ?
|
||||
' <div class="modal-header"> ' +
|
||||
' <h5 class="modal-title">'+ options.title +'</h5> ' +
|
||||
((options.closeButton == true) ?
|
||||
' <button type="button" class="close" data-dismiss="modal" aria-label="Close"> ' +
|
||||
' <span aria-hidden="true">×</span> ' +
|
||||
' </button> '
|
||||
: '') +
|
||||
' </div> '
|
||||
: '') +
|
||||
' <div class="modal-body"> ' +
|
||||
' </div> ' +
|
||||
(options.buttons.length > 0 ?
|
||||
' <div class="modal-footer"> ' +
|
||||
' </div> '
|
||||
: '')+
|
||||
' </div> ' +
|
||||
' </div> ' +
|
||||
' </div> ' ;
|
||||
|
||||
// Convert modal to object
|
||||
var modal_template = $(modal_template);
|
||||
|
||||
// Start creating buttons from 'buttons' option
|
||||
var this_button;
|
||||
options.buttons.forEach(function(item) {
|
||||
// get option 'id'
|
||||
let id = "id" in item ? item.id : '';
|
||||
|
||||
// Button template
|
||||
this_button = '<button type="'+ ("submit" in item && item.submit == true ? 'submit' : 'button') +'" class="'+ item.class +'" id="'+ id +'">'+ item.text +'</button>';
|
||||
|
||||
// add click event to the button
|
||||
this_button = $(this_button).off('click').on("click", function() {
|
||||
// execute function from 'handler' option
|
||||
item.handler.call(this, modal_template);
|
||||
});
|
||||
// append generated buttons to the modal footer
|
||||
$(modal_template).find('.modal-footer').append(this_button);
|
||||
});
|
||||
|
||||
// append a given body to the modal
|
||||
$(modal_template).find('.modal-body').append(body);
|
||||
|
||||
// add additional body class
|
||||
if(options.bodyClass) $(modal_template).find('.modal-body').addClass(options.bodyClass);
|
||||
|
||||
// add footer body class
|
||||
if(options.footerClass) $(modal_template).find('.modal-footer').addClass(options.footerClass);
|
||||
|
||||
// execute 'created' callback
|
||||
options.created.call(this, modal_template, options);
|
||||
|
||||
// modal form and submit form button
|
||||
let modal_form = $(modal_template).find('.modal-body form'),
|
||||
form_submit_btn = modal_template.find('button[type=submit]');
|
||||
|
||||
// append generated modal to the body
|
||||
$("body").append(modal_template);
|
||||
|
||||
// execute 'appended' callback
|
||||
options.appended.call(this, $('#' + id), modal_form, options);
|
||||
|
||||
// if modal contains form elements
|
||||
if(modal_form.length) {
|
||||
// if `autoFocus` option is true
|
||||
if(options.autoFocus) {
|
||||
// when modal is shown
|
||||
$(modal_template).on('shown.bs.modal', function() {
|
||||
// if type of `autoFocus` option is `boolean`
|
||||
if(typeof options.autoFocus == 'boolean')
|
||||
modal_form.find('input:eq(0)').focus(); // the first input element will be focused
|
||||
// if type of `autoFocus` option is `string` and `autoFocus` option is an HTML element
|
||||
else if(typeof options.autoFocus == 'string' && modal_form.find(options.autoFocus).length)
|
||||
modal_form.find(options.autoFocus).focus(); // find elements and focus on that
|
||||
});
|
||||
}
|
||||
|
||||
// form object
|
||||
let form_object = {
|
||||
startProgress: function() {
|
||||
modal_template.addClass('modal-progress');
|
||||
},
|
||||
stopProgress: function() {
|
||||
modal_template.removeClass('modal-progress');
|
||||
}
|
||||
};
|
||||
|
||||
// if form is not contains button element
|
||||
if(!modal_form.find('button').length) $(modal_form).append('<button class="d-none" id="'+ id +'-submit"></button>');
|
||||
|
||||
// add click event
|
||||
form_submit_btn.click(function() {
|
||||
modal_form.submit();
|
||||
});
|
||||
|
||||
// add submit event
|
||||
modal_form.submit(function(e) {
|
||||
// start form progress
|
||||
form_object.startProgress();
|
||||
|
||||
// execute `onFormSubmit` callback
|
||||
options.onFormSubmit.call(this, modal_template, e, form_object);
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on("click", '.' + trigger_class, function() {
|
||||
let modal = $('#' + id).modal(options.modal);
|
||||
|
||||
if(options.removeOnDismiss) {
|
||||
modal.on('hidden.bs.modal', function() {
|
||||
modal.remove();
|
||||
});
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Bootstrap Modal Destroyer
|
||||
$.destroyModal = function(modal) {
|
||||
modal.modal('hide');
|
||||
modal.on('hidden.bs.modal', function() {
|
||||
});
|
||||
}
|
||||
|
||||
// Card Progress Controller
|
||||
$.cardProgress = function(card, options) {
|
||||
var options = $.extend({
|
||||
dismiss: false,
|
||||
dismissText: 'Cancel',
|
||||
spinner: true,
|
||||
onDismiss: function() {}
|
||||
}, options);
|
||||
|
||||
var me = $(card);
|
||||
|
||||
me.addClass('card-progress');
|
||||
if(options.spinner == false) {
|
||||
me.addClass('remove-spinner');
|
||||
}
|
||||
|
||||
if(options.dismiss == true) {
|
||||
var btn_dismiss = '<a class="btn btn-danger card-progress-dismiss">'+options.dismissText+'</a>';
|
||||
btn_dismiss = $(btn_dismiss).off('click').on('click', function() {
|
||||
me.removeClass('card-progress');
|
||||
me.find('.card-progress-dismiss').remove();
|
||||
options.onDismiss.call(this, me);
|
||||
});
|
||||
me.append(btn_dismiss);
|
||||
}
|
||||
|
||||
return {
|
||||
dismiss: function(dismissed) {
|
||||
$.cardProgressDismiss(me, dismissed);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
$.cardProgressDismiss = function(card, dismissed) {
|
||||
var me = $(card);
|
||||
me.removeClass('card-progress');
|
||||
me.find('.card-progress-dismiss').remove();
|
||||
if(dismissed)
|
||||
dismissed.call(this, me);
|
||||
}
|
||||
|
||||
$.chatCtrl = function(element, chat) {
|
||||
var chat = $.extend({
|
||||
position: 'chat-right',
|
||||
text: '',
|
||||
time: moment(new Date().toISOString()).format('hh:mm'),
|
||||
picture: '',
|
||||
type: 'text', // or typing
|
||||
timeout: 0,
|
||||
onShow: function() {}
|
||||
}, chat);
|
||||
|
||||
var target = $(element),
|
||||
element = '<div class="chat-item '+chat.position+'" style="display:none">' +
|
||||
'<img src="'+chat.picture+'">' +
|
||||
'<div class="chat-details">' +
|
||||
'<div class="chat-text">'+chat.text+'</div>' +
|
||||
'<div class="chat-time">'+chat.time+'</div>' +
|
||||
'</div>' +
|
||||
'</div>',
|
||||
typing_element = '<div class="chat-item chat-left chat-typing" style="display:none">' +
|
||||
'<img src="'+chat.picture+'">' +
|
||||
'<div class="chat-details">' +
|
||||
'<div class="chat-text"></div>' +
|
||||
'</div>' +
|
||||
'</div>';
|
||||
|
||||
var append_element = element;
|
||||
if(chat.type == 'typing') {
|
||||
append_element = typing_element;
|
||||
}
|
||||
|
||||
if(chat.timeout > 0) {
|
||||
setTimeout(function() {
|
||||
target.find('.chat-content').append($(append_element).fadeIn());
|
||||
}, chat.timeout);
|
||||
}else{
|
||||
target.find('.chat-content').append($(append_element).fadeIn());
|
||||
}
|
||||
|
||||
var target_height = 0;
|
||||
target.find('.chat-content .chat-item').each(function() {
|
||||
target_height += $(this).outerHeight();
|
||||
});
|
||||
setTimeout(function() {
|
||||
target.find('.chat-content').scrollTop(target_height, -1);
|
||||
}, 100);
|
||||
chat.onShow.call(this, append_element);
|
||||
}
|
||||
})(jQuery, this, 0);
|
||||
|
||||
Reference in New Issue
Block a user