373 lines
10 KiB
JavaScript
373 lines
10 KiB
JavaScript
const header = document.querySelector('.header');
|
|
const sidebar = document.querySelector('.header .inn_nav');
|
|
const overlay = document.querySelector('.header .overlay');
|
|
const hamburgerIcon = document.querySelector('.header .ham_burger');
|
|
const closeBtn = document.querySelector('.header .nav_cross_btn');
|
|
|
|
function openSidebar() {
|
|
header.classList.add('active');
|
|
|
|
}
|
|
function closeSidebar() {
|
|
header.classList.remove('active');
|
|
}
|
|
|
|
hamburgerIcon.addEventListener('click', () => {
|
|
openSidebar();
|
|
});
|
|
|
|
overlay.addEventListener('click', () => {
|
|
closeSidebar();
|
|
});
|
|
|
|
closeBtn.addEventListener('click', () => {
|
|
closeSidebar();
|
|
});
|
|
|
|
// otp start
|
|
|
|
let digitValidate = function (ele) {
|
|
ele.value = ele.value.replace(/[^0-9]/g, "");
|
|
};
|
|
|
|
let tabChange = function (val) {
|
|
let ele = document.querySelectorAll("#otp_main input");
|
|
if (ele[val - 1].value != "") {
|
|
ele[val].focus();
|
|
} else if (ele[val - 1].value == "") {
|
|
ele[val - 2].focus();
|
|
}
|
|
};
|
|
|
|
// otp end
|
|
|
|
|
|
|
|
// checkbox for 'all' start
|
|
|
|
function checkAll(source) {
|
|
const checkboxes = document.querySelectorAll('.status-checkbox');
|
|
checkboxes.forEach(checkbox => {
|
|
checkbox.checked = source.checked;
|
|
});
|
|
}
|
|
|
|
// checkbox for 'all' end
|
|
|
|
|
|
|
|
// calendar
|
|
|
|
$(function () {
|
|
function c() {
|
|
p();
|
|
var e = h();
|
|
var r = 0;
|
|
var u = false;
|
|
l.empty();
|
|
while (!u) {
|
|
if (s[r] == e[0].weekday) {
|
|
u = true;
|
|
} else {
|
|
l.append('<div class="blank"></div>');
|
|
r++;
|
|
}
|
|
}
|
|
for (var c = 0; c < 35 - r; c++) {
|
|
if (c >= e.length) {
|
|
l.append('<div class="blank"></div>');
|
|
} else {
|
|
var v = e[c].day;
|
|
var m = g(new Date(t, n - 1, v)) ? '<div class="today">' : "<div>";
|
|
l.append(m + "" + v + "</div>");
|
|
}
|
|
}
|
|
var y = o[n - 1];
|
|
a.css("background-color", y)
|
|
.find("h1")
|
|
.text(i[n - 1] + " " + t);
|
|
f.find("div").css("color", y);
|
|
l.find(".today").css("background-color", y);
|
|
d();
|
|
}
|
|
function h() {
|
|
var e = [];
|
|
for (var r = 1; r < v(t, n) + 1; r++) {
|
|
e.push({day: r, weekday: s[m(t, n, r)]});
|
|
}
|
|
return e;
|
|
}
|
|
function p() {
|
|
f.empty();
|
|
for (var e = 0; e < 7; e++) {
|
|
f.append("<div>" + s[e].substring(0, 3) + "</div>");
|
|
}
|
|
}
|
|
function d() {
|
|
var t;
|
|
var n = $("#calendar").css("width", e + "px");
|
|
n.find((t = "#calendar_weekdays, #calendar_content"))
|
|
.css("width", e + "px")
|
|
.find("div")
|
|
.css({
|
|
width: e / 7 + "px",
|
|
height: e / 7 + "px",
|
|
"line-height": e / 7 + "px"
|
|
});
|
|
n.find("#calendar_header")
|
|
.css({height: e * (1 / 7) + "px"})
|
|
.find('i[class^="icon-chevron"]')
|
|
.css("line-height", e * (0.5 / 7) + "px");
|
|
}
|
|
function v(e, t) {
|
|
return new Date(e, t, 0).getDate();
|
|
}
|
|
function m(e, t, n) {
|
|
return new Date(e, t - 1, n).getDay();
|
|
}
|
|
function g(e) {
|
|
return y(new Date()) == y(e);
|
|
}
|
|
function y(e) {
|
|
return e.getFullYear() + "/" + (e.getMonth() + 1) + "/" + e.getDate();
|
|
}
|
|
function b() {
|
|
var e = new Date();
|
|
t = e.getFullYear();
|
|
n = e.getMonth() + 1;
|
|
}
|
|
var e = 350;
|
|
var t = 2013;
|
|
var n = 12;
|
|
var r = [];
|
|
var i = [
|
|
"JANUARY",
|
|
"FEBRUARY",
|
|
"MARCH",
|
|
"APRIL",
|
|
"MAY",
|
|
"JUNE",
|
|
"JULY",
|
|
"AUGUST",
|
|
"SEPTEMBER",
|
|
"OCTOBER",
|
|
"NOVEMBER",
|
|
"DECEMBER"
|
|
];
|
|
var s = [
|
|
"Sunday",
|
|
"Monday",
|
|
"Tuesday",
|
|
"Wednesday",
|
|
"Thursday",
|
|
"Friday",
|
|
"Saturday"
|
|
];
|
|
var o = [
|
|
// "#16a085",
|
|
// "#1abc9c",
|
|
// "#c0392b",
|
|
// "#27ae60",
|
|
// "#FF6860",
|
|
// "#f39c12",
|
|
// "#f1c40f",
|
|
// "#e67e22",
|
|
// "#2ecc71",
|
|
// "#e74c3c",
|
|
// "#d35400",
|
|
// "#2c3e50"
|
|
];
|
|
var u = $("#calendar");
|
|
var a = u.find("#calendar_header");
|
|
var f = u.find("#calendar_weekdays");
|
|
var l = u.find("#calendar_content");
|
|
b();
|
|
c();
|
|
a.find('i[class^="icon-chevron"]').on("click", function () {
|
|
var e = $(this);
|
|
var r = function (e) {
|
|
n = e == "next" ? n + 1 : n - 1;
|
|
if (n < 1) {
|
|
n = 12;
|
|
t--;
|
|
} else if (n > 12) {
|
|
n = 1;
|
|
t++;
|
|
}
|
|
c();
|
|
};
|
|
if (e.attr("class").indexOf("left") != -1) {
|
|
r("previous");
|
|
} else {
|
|
r("next");
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
// ====counter===
|
|
|
|
// Get the elements
|
|
const counterElement = document.getElementById('counter');
|
|
const incrementBtn = document.getElementById('incrementBtn');
|
|
const decrementBtn = document.getElementById('decrementBtn');
|
|
|
|
// Initialize the counter
|
|
let counter = 0;
|
|
|
|
// Update the counter display
|
|
function updateCounter() {
|
|
counterElement.textContent = counter;
|
|
}
|
|
|
|
// Increment button event listener
|
|
incrementBtn.addEventListener('click', () => {
|
|
counter++;
|
|
updateCounter();
|
|
});
|
|
|
|
// Decrement button event listener
|
|
decrementBtn.addEventListener('click', () => {
|
|
counter--;
|
|
updateCounter();
|
|
});
|
|
|
|
|
|
|
|
// drag&drop upload start
|
|
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const uploadContainer = document.getElementById('upload-container');
|
|
const fileInput = document.getElementById('file-input');
|
|
const preview = document.getElementById('preview');
|
|
|
|
// Prevent default drag behaviors
|
|
['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
|
|
uploadContainer.addEventListener(eventName, preventDefaults, false);
|
|
});
|
|
|
|
function preventDefaults(e) {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
}
|
|
|
|
// Highlight drag area
|
|
['dragenter', 'dragover'].forEach(eventName => {
|
|
uploadContainer.addEventListener(eventName, () => uploadContainer.classList.add('highlight'), false);
|
|
});
|
|
|
|
['dragleave', 'drop'].forEach(eventName => {
|
|
uploadContainer.addEventListener(eventName, () => uploadContainer.classList.remove('highlight'), false);
|
|
});
|
|
|
|
// Handle dropped files
|
|
uploadContainer.addEventListener('drop', handleDrop, false);
|
|
|
|
function handleDrop(e) {
|
|
let dt = e.dataTransfer;
|
|
let files = dt.files;
|
|
|
|
handleFiles(files);
|
|
}
|
|
|
|
function handleFiles(files) {
|
|
([...files]).forEach(previewFile);
|
|
}
|
|
|
|
function previewFile(file) {
|
|
let reader = new FileReader();
|
|
reader.readAsDataURL(file);
|
|
reader.onloadend = function () {
|
|
let img = document.createElement('img');
|
|
img.src = reader.result;
|
|
let removeButton = document.createElement('button');
|
|
removeButton.textContent = '✖';
|
|
removeButton.addEventListener('click', () => {
|
|
img.parentNode.remove();
|
|
});
|
|
let imageContainer = document.createElement('div');
|
|
imageContainer.classList.add('up_imgs')
|
|
imageContainer.appendChild(img);
|
|
imageContainer.appendChild(removeButton);
|
|
preview.appendChild(imageContainer);
|
|
}
|
|
}
|
|
|
|
// Handle file selection via file input
|
|
uploadContainer.addEventListener('click', () => fileInput.click());
|
|
fileInput.addEventListener('change', (e) => {
|
|
let files = e.target.files;
|
|
handleFiles(files);
|
|
});
|
|
});
|
|
|
|
|
|
|
|
// drag&drop video start
|
|
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const uploadContainer = document.getElementById('upload-container2');
|
|
const fileInput = document.getElementById('file-input2');
|
|
const preview = document.getElementById('preview2');
|
|
|
|
// Prevent default drag behaviors
|
|
['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
|
|
uploadContainer.addEventListener(eventName, preventDefaults, false);
|
|
});
|
|
|
|
function preventDefaults(e) {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
}
|
|
|
|
// Highlight drag area
|
|
['dragenter', 'dragover'].forEach(eventName => {
|
|
uploadContainer.addEventListener(eventName, () => uploadContainer.classList.add('highlight'), false);
|
|
});
|
|
|
|
['dragleave', 'drop'].forEach(eventName => {
|
|
uploadContainer.addEventListener(eventName, () => uploadContainer.classList.remove('highlight'), false);
|
|
});
|
|
|
|
// Handle dropped files
|
|
uploadContainer.addEventListener('drop', handleDrop, false);
|
|
|
|
function handleDrop(e) {
|
|
let dt = e.dataTransfer;
|
|
let files = dt.files;
|
|
|
|
handleFiles(files);
|
|
}
|
|
|
|
function handleFiles(files) {
|
|
([...files]).forEach(previewFile);
|
|
}
|
|
|
|
function previewFile(file) {
|
|
let reader = new FileReader();
|
|
reader.readAsDataURL(file);
|
|
reader.onloadend = function () {
|
|
let video = document.createElement('video');
|
|
video.src = reader.result;
|
|
video.controls = true;
|
|
let removeButton = document.createElement('button');
|
|
removeButton.textContent = '✖';
|
|
removeButton.addEventListener('click', () => {
|
|
video.parentNode.remove();
|
|
});
|
|
let videoContainer = document.createElement('div');
|
|
videoContainer.classList.add('up_imgs');
|
|
videoContainer.appendChild(video);
|
|
videoContainer.appendChild(removeButton);
|
|
preview.appendChild(videoContainer);
|
|
}
|
|
}
|
|
|
|
// Handle file selection via file input
|
|
uploadContainer.addEventListener('click', () => fileInput.click());
|
|
fileInput.addEventListener('change', (e) => {
|
|
let files = e.target.files;
|
|
handleFiles(files);
|
|
});
|
|
});
|