pianello/pianello-api
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Committing laravel (part 3)

Browse source 
committing js templating files and components
This commit is contained in:
Ale Gallo 2023-11-10 16:00:59 +01:00
parent 74c4b1d3f4
commit 82f958e5da
87 changed files with 3138 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
resources/js/app.js Normal file
View file

@ -0,0 +1,7 @@
import "./bootstrap";
import "./vendor/dom";
import "./vendor/tailwind-merge";
import "./vendor/svg-loader";
// Load static files
import.meta.glob(["../images/**"]);

41
resources/js/bootstrap.js vendored Normal file
View file

@ -0,0 +1,41 @@
import _ from "lodash";
import helper from "./helper";
import { getColor } from "./colors";
import dayjs from "dayjs";
window._ = _;
window.helper = helper;
window.getColor = getColor;
window.dayjs = dayjs;
/**
* We'll load the axios HTTP library which allows us to easily issue requests
* to our Laravel back-end. This library automatically handles sending the
* CSRF token as a header based on the value of the "XSRF" token cookie.
*/
import axios from "axios";
window.axios = axios;
window.axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";
/**
* Echo exposes an expressive API for subscribing to channels and listening
* for events that are broadcast by Laravel. Echo and event broadcasting
* allows your team to easily build robust real-time web applications.
*/
// import Echo from 'laravel-echo';
// import Pusher from 'pusher-js';
// window.Pusher = Pusher;
// window.Echo = new Echo({
// broadcaster: 'pusher',
// key: import.meta.env.VITE_PUSHER_APP_KEY,
// cluster: import.meta.env.VITE_PUSHER_APP_CLUSTER ?? 'mt1',
// wsHost: import.meta.env.VITE_PUSHER_HOST ? import.meta.env.VITE_PUSHER_HOST : `ws-${import.meta.env.VITE_PUSHER_APP_CLUSTER}.pusher.com`,
// wsPort: import.meta.env.VITE_PUSHER_PORT ?? 80,
// wssPort: import.meta.env.VITE_PUSHER_PORT ?? 443,
// forceTLS: (import.meta.env.VITE_PUSHER_SCHEME ?? 'https') === 'https',
// enabledTransports: ['ws', 'wss'],
// });

24
resources/js/colors.js Normal file
View file

@ -0,0 +1,24 @@
import helper from "./helper";
import resolveConfig from "tailwindcss/resolveConfig";
import tailwindConfig from "tailwind-config";
import flatten from "flat";
const twConfig = resolveConfig(tailwindConfig);
const colors = twConfig.theme?.colors;
function getColor(colorKey, opacity = 1) {
const flattenColors = flatten(colors);
if (flattenColors[colorKey].search("var") === -1) {
return `rgb(${helper.toRGB(flattenColors[colorKey])} / ${opacity})`;
} else {
const cssVariableName = `--color-${
flattenColors[colorKey].split("--color-")[1].split(")")[0]
}`;
return `rgb(${getComputedStyle(document.body).getPropertyValue(
cssVariableName
)} / ${opacity})`;
}
}
export { getColor };

10
resources/js/components/balloon-block-editor/index.js Normal file
View file

@ -0,0 +1,10 @@
(function () {
"use strict";
$(".editor").each(function () {
const el = this;
BalloonBlockEditor.create(el).catch((error) => {
console.error(error);
});
});
})();

10
resources/js/components/balloon-editor/index.js Normal file
View file

@ -0,0 +1,10 @@
(function () {
"use strict";
$(".editor").each(function () {
const el = this;
BalloonEditor.create(el).catch((error) => {
console.error(error);
});
});
})();

17
resources/js/components/calendar/draggable/index.js Normal file
View file

@ -0,0 +1,17 @@
(function () {
"use strict";
$(".full-calendar-draggable").each(function () {
new Draggable(this, {
itemSelector: ".event",
eventData: function (eventEl) {
return {
title: $(eventEl).find(".event__title").html(),
duration: {
days: parseInt($(eventEl).find(".event__days").text()),
},
};
},
});
});
})();

65
resources/js/components/calendar/index.js Normal file
View file

@ -0,0 +1,65 @@
(function () {
"use strict";
$(".full-calendar").each(function () {
let calendar = new Calendar(this, {
plugins: [
interactionPlugin,
dayGridPlugin,
timeGridPlugin,
listPlugin,
],
droppable: true,
headerToolbar: {
left: "prev,next today",
center: "title",
right: "dayGridMonth,timeGridWeek,timeGridDay,listWeek",
},
initialDate: "2021-01-12",
navLinks: true,
editable: true,
dayMaxEvents: true,
events: [
{
title: "Vue Vixens Day",
start: "2021-01-05",
end: "2021-01-08",
},
{
title: "VueConfUS",
start: "2021-01-11",
end: "2021-01-15",
},
{
title: "VueJS Amsterdam",
start: "2021-01-17",
end: "2021-01-21",
},
{
title: "Vue Fes Japan 2019",
start: "2021-01-21",
end: "2021-01-24",
},
{
title: "Laracon 2021",
start: "2021-01-24",
end: "2021-01-27",
},
],
drop: function (info) {
if (
$("#checkbox-events").length &&
$("#checkbox-events")[0].checked
) {
$(info.draggedEl).parent().remove();
if ($("#calendar-events").children().length == 1) {
$("#calendar-no-events").removeClass("hidden");
}
}
},
});
calendar.render();
});
})();

10
resources/js/components/classic-editor/index.js Normal file
View file

@ -0,0 +1,10 @@
(function () {
"use strict";
$(".editor").each(function () {
const el = this;
ClassicEditor.create(el).catch((error) => {
console.error(error);
});
});
})();

17
resources/js/components/dark-mode-switcher/index.js Normal file
View file

@ -0,0 +1,17 @@
(function () {
"use strict";
// Dark mode switcher
$(".dark-mode-switcher").on("click", function () {
if ($(this).hasClass("dark-mode-switcher--active")) {
$(this).removeClass("dark-mode-switcher--active");
} else {
$(this).addClass("dark-mode-switcher--active");
}
setTimeout(() => {
const link = $(".dark-mode-switcher").data("url");
window.location.href = link;
}, 500);
});
})();

17
resources/js/components/document-editor/index.js Normal file
View file

@ -0,0 +1,17 @@
(function () {
"use strict";
$(".editor").each(function () {
const el = this;
DocumentEditor.create($(el).find(".document-editor__editable")[0])
.then((editor) => {
$(el)
.closest(".editor")
.find(".document-editor__toolbar")
.append(editor.ui.view.toolbar.element);
})
.catch((error) => {
console.error(error);
});
});
})();

44
resources/js/components/donut-chart/index.js Normal file
View file

@ -0,0 +1,44 @@
(function () {
"use strict";
// Chart
if ($(".donut-chart").length) {
let ctx = $(".donut-chart")[0].getContext("2d");
let myDoughnutChart = new Chart(ctx, {
type: "doughnut",
data: {
labels: ["Html", "Vuejs", "Laravel"],
datasets: [
{
data: [15, 10, 65],
backgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
hoverBackgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
borderWidth: 5,
borderColor: $("html").hasClass("dark")
? getColor("darkmode.700")
: getColor("white"),
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
labels: {
color: getColor("slate.500", 0.8),
},
},
},
cutout: "80%",
},
});
}
})();

39
resources/js/components/dropzone/index.js Normal file
View file

@ -0,0 +1,39 @@
(function () {
"use strict";
// Dropzone
Dropzone.autoDiscover = false;
$(".dropzone").each(function () {
let options = {
accept: (file, done) => {
console.log("Uploaded");
done();
},
};
if ($(this).data("single")) {
options.maxFiles = 1;
}
if ($(this).data("file-types")) {
options.accept = (file, done) => {
if (
$(this).data("file-types").split("|").indexOf(file.type) ===
-1
) {
alert("Error! Files of this type are not accepted");
done("Error! Files of this type are not accepted");
} else {
console.log("Uploaded");
done();
}
};
}
let dz = new Dropzone(this, options);
dz.on("maxfilesexceeded", (file) => {
alert("No more files please!");
});
});
})();

32
resources/js/components/highlight/index.js Normal file
View file

@ -0,0 +1,32 @@
(function () {
"use strict";
// Highlight code
$(".highlight").each(function () {
let source = $(this).find("code").html();
// First replace
let replace = helper.replaceAll(source, "HTMLOpenTag", "<");
replace = helper.replaceAll(replace, "HTMLCloseTag", ">");
// Save for copy code function
let originalSource = $(
'<textarea class="absolute w-0 h-0 p-0 -mt-1 -ml-1"></textarea>'
).val(replace);
$(this).append(originalSource);
// Beautify code
if ($(this).find("code").hasClass("javascript")) {
replace = jsBeautify(replace);
} else {
replace = jsBeautify.html(replace);
}
// Format for highlight.js
replace = helper.replaceAll(replace, "<", "&lt;");
replace = helper.replaceAll(replace, ">", "&gt;");
$(this).find("code").html(replace);
});
hljs.highlightAll();
})();

88
resources/js/components/horizontal-bar-chart/index.js Normal file
View file

@ -0,0 +1,88 @@
(function () {
"use strict";
// Chart
if ($(".horizontal-bar-chart").length) {
let ctx = $(".horizontal-bar-chart")[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "bar",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
],
datasets: [
{
label: "Html Template",
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 2,
data: [0, 200, 250, 200, 500, 450, 850, 1050],
backgroundColor: getColor("primary"),
},
{
label: "VueJs Template",
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 2,
data: [0, 300, 400, 560, 320, 600, 720, 850],
backgroundColor: $("html").hasClass("dark")
? getColor("darkmode.200")
: getColor("slate.300"),
},
],
},
options: {
indexAxis: "y",
maintainAspectRatio: false,
plugins: {
legend: {
labels: {
color: getColor("slate.500", 0.8),
},
},
},
scales: {
x: {
ticks: {
font: {
size: "12",
},
color: getColor("slate.500", 0.8),
callback: function (value, index, values) {
return "$" + value;
},
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
ticks: {
font: {
size: "12",
},
color: getColor("slate.500", 0.8),
},
grid: {
color: $("html").hasClass("dark")
? getColor("slate.500", 0.3)
: getColor("slate.300"),
borderDash: [2, 2],
drawBorder: false,
},
},
},
},
});
}
})();

10
resources/js/components/inline-editor/index.js Normal file
View file

@ -0,0 +1,10 @@
(function () {
"use strict";
$(".editor").each(function () {
const el = this;
InlineEditor.create(el).catch((error) => {
console.error(error);
});
});
})();

98
resources/js/components/leaflet-map-loader/index.js Normal file
View file

@ -0,0 +1,98 @@
import locations from "../../../json/location.json"
(function () {
"use strict";
$(".leaflet").each(async function () {
const map = L.map(this, {
center: [$(this).data("lat"), $(this).data("long")],
zoom: 9,
});
if (map) {
const apiKey = $(this).data("api-key");
L.tileLayer(
`https://tile.thunderforest.com/atlas/{z}/{x}/{y}@2x.png?apikey=${apiKey}`,
{
attribution:
"Map data &copy; OpenStreetMap contributors, Tiles &copy; Thunderforest",
}
).addTo(map);
const markers = L.markerClusterGroup({
maxClusterRadius: 30,
iconCreateFunction: function (cluster) {
const color = $("html").hasClass("dark")
? getColor("darkmode.100", 0.6)
: getColor("primary", 0.8);
const mapMarkerRegionSvg =
window.btoa(`<svg xmlns="http://www.w3.org/2000/svg" width="55.066" height="47.691" viewBox="0 0 55.066 47.691">
<g id="Group_15" data-name="Group 15" transform="translate(-319.467 -83.991)">
<g id="Group_14" data-name="Group 14">
<path id="Intersection_4" data-name="Intersection 4" d="M12.789,17.143a15,15,0,0,1,20.7,0l-1.6,2.141-.018-.018a12.352,12.352,0,0,0-17.469,0l-.018.018Z" transform="translate(323.861 78.999)" fill="${color}" opacity="0.845"/>
<path id="Intersection_5" data-name="Intersection 5" d="M10.384,13.919a19,19,0,0,1,25.511,0l-2.016,2.7a15.647,15.647,0,0,0-21.479,0Z" transform="translate(323.861 78.999)" fill="${color}" opacity="0.652"/>
<path id="Intersection_6" data-name="Intersection 6" d="M7.982,10.7a22.978,22.978,0,0,1,30.313,0l-2,2.679a19.652,19.652,0,0,0-26.316,0Z" transform="translate(323.861 78.999)" fill="${color}" opacity="0.453"/>
</g>
<g id="Group_13" data-name="Group 13" transform="translate(427.806 461.061) rotate(-120)">
<path id="Intersection_4-2" data-name="Intersection 4" d="M12.789,17.143a15,15,0,0,1,20.7,0l-1.6,2.141-.018-.018a12.352,12.352,0,0,0-17.469,0l-.018.018Z" transform="translate(323.861 78.999)" fill="${color}" opacity="0.845"/>
<path id="Intersection_5-2" data-name="Intersection 5" d="M10.384,13.919a19,19,0,0,1,25.511,0l-2.016,2.7a15.647,15.647,0,0,0-21.479,0Z" transform="translate(323.861 78.999)" fill="${color}" opacity="0.652"/>
<path id="Intersection_6-2" data-name="Intersection 6" d="M7.982,10.7a22.978,22.978,0,0,1,30.313,0l-2,2.679a19.652,19.652,0,0,0-26.316,0Z" transform="translate(323.861 78.999)" fill="${color}" opacity="0.453"/>
</g>
<circle id="Ellipse_9" data-name="Ellipse 9" cx="11" cy="11" r="11" transform="translate(336 96)" fill="${color}"/>
<g id="Group_12" data-name="Group 12" transform="translate(613.194 -139.96) rotate(120)">
<path id="Intersection_4-3" data-name="Intersection 4" d="M12.789,17.143a15,15,0,0,1,20.7,0l-1.6,2.141-.018-.018a12.352,12.352,0,0,0-17.469,0l-.018.018Z" transform="translate(323.861 78.999)" fill="${color}" opacity="0.845"/>
<path id="Intersection_5-3" data-name="Intersection 5" d="M10.384,13.919a19,19,0,0,1,25.511,0l-2.016,2.7a15.647,15.647,0,0,0-21.479,0Z" transform="translate(323.861 78.999)" fill="${color}" opacity="0.652"/>
<path id="Intersection_6-3" data-name="Intersection 6" d="M7.982,10.7a22.978,22.978,0,0,1,30.313,0l-2,2.679a19.652,19.652,0,0,0-26.316,0Z" transform="translate(323.861 78.999)" fill="${color}" opacity="0.453"/>
</g>
</g>
</svg>
`);
return L.divIcon({
html: `<div class="relative w-full h-full">
<div class="absolute inset-0 flex items-center justify-center ml-1.5 mb-0.5 font-medium text-white">${cluster.getChildCount()}</div>
<img class="w-full h-full" src="data:image/svg+xml;base64,${mapMarkerRegionSvg}">
</div>`,
className: "",
iconSize: L.point(42, 42),
iconAnchor: L.point(20, 45),
});
},
spiderfyOnMaxZoom: false,
showCoverageOnHover: false,
});
map.addLayer(markers);
const color = $("html").hasClass("dark")
? getColor("darkmode.100")
: getColor("primary");
const mapMarkerSvg =
window.btoa(`<svg xmlns="http://www.w3.org/2000/svg" width="20" height="31.063" viewBox="0 0 20 31.063">
<g id="Group_16" data-name="Group 16" transform="translate(-408 -150.001)">
<path id="Subtraction_21" data-name="Subtraction 21" d="M10,31.064h0L1.462,15.208A10,10,0,1,1,20,10a9.9,9.9,0,0,1-1.078,4.522l-.056.108c-.037.071-.077.146-.121.223L10,31.062ZM10,2a8,8,0,1,0,8,8,8,8,0,0,0-8-8Z" transform="translate(408 150)" fill="${color}"/>
<circle id="Ellipse_26" data-name="Ellipse 26" cx="6" cy="6" r="6" transform="translate(412 154)" fill="${color}"/>
</g>
</svg>
`);
locations.map(function (markerElem) {
const marker = L.marker(
{
lat: parseFloat(markerElem.latitude),
lng: parseFloat(markerElem.longitude),
},
{
title: markerElem.name,
icon: L.icon({
iconUrl: `data:image/svg+xml;base64,${mapMarkerSvg}`,
iconAnchor: L.point(10, 35),
}),
}
);
markers.addLayer(marker);
});
}
});
})();

98
resources/js/components/line-chart/index.js Normal file
View file

@ -0,0 +1,98 @@
(function () {
"use strict";
// Chart
if ($(".line-chart").length) {
let ctx = $(".line-chart")[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "line",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
datasets: [
{
label: "Html Template",
data: [
0, 200, 250, 200, 500, 450, 850, 1050, 950, 1100,
900, 1200,
],
borderWidth: 2,
borderColor: getColor("primary"),
backgroundColor: "transparent",
pointBorderColor: "transparent",
tension: 0.4,
},
{
label: "VueJs Template",
data: [
0, 300, 400, 560, 320, 600, 720, 850, 690, 805,
1200, 1010,
],
borderWidth: 2,
borderDash: [2, 2],
borderColor: $("html").hasClass("dark")
? getColor("slate.400", 0.6)
: getColor("slate.400"),
backgroundColor: "transparent",
pointBorderColor: "transparent",
tension: 0.4,
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
labels: {
color: getColor("slate.500", 0.8),
},
},
},
scales: {
x: {
ticks: {
font: {
size: "12",
},
font: getColor("slate.500", 0.8),
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
ticks: {
font: {
size: "12",
},
color: getColor("slate.500", 0.8),
callback: function (value, index, values) {
return "$" + value;
},
},
grid: {
color: $("html").hasClass("dark")
? getColor("slate.500", 0.3)
: getColor("slate.300"),
borderDash: [2, 2],
drawBorder: false,
},
},
},
},
});
}
})();

44
resources/js/components/litepicker/index.js Normal file
View file

@ -0,0 +1,44 @@
(function () {
"use strict";
// Litepicker
$(".datepicker").each(function () {
let options = {
autoApply: false,
singleMode: false,
numberOfColumns: 2,
numberOfMonths: 2,
showWeekNumbers: true,
format: "D MMM, YYYY",
dropdowns: {
minYear: 1990,
maxYear: null,
months: true,
years: true,
},
};
if ($(this).data("single-mode")) {
options.singleMode = true;
options.numberOfColumns = 1;
options.numberOfMonths = 1;
}
if ($(this).data("format")) {
options.format = $(this).data("format");
}
if (!$(this).val()) {
let date = dayjs().format(options.format);
date += !options.singleMode
? " - " + dayjs().add(1, "month").format(options.format)
: "";
$(this).val(date);
}
new Litepicker({
element: this,
...options,
});
});
})();

10
resources/js/components/lucide/index.js Normal file
View file

@ -0,0 +1,10 @@
(function () {
"use strict";
// Lucide Icons
createIcons({
icons,
"stroke-width": 1.5,
nameAttr: "data-lucide",
});
})();

49
resources/js/components/mobile-menu/index.js Normal file
View file

@ -0,0 +1,49 @@
(function () {
"use strict";
// Scrollbar
if ($(".mobile-menu .scrollable").length) {
new SimpleBar($(".mobile-menu .scrollable")[0]);
}
// Mobile Menu
$(".mobile-menu-toggler").on("click", function () {
if ($(".mobile-menu").hasClass("mobile-menu--active")) {
$(".mobile-menu").removeClass("mobile-menu--active");
} else {
$(".mobile-menu").addClass("mobile-menu--active");
}
});
$(".mobile-menu")
.find(".menu")
.on("click", function () {
if ($(this).parent().find("ul").length) {
if (
$(this).parent().find("ul").first()[0].offsetParent !== null
) {
$(this)
.find(".menu__sub-icon")
.removeClass("transform rotate-180");
$(this)
.parent()
.find("ul")
.first()
.slideUp(300, function () {
$(this).removeClass("menu__sub-open");
});
} else {
$(this)
.find(".menu__sub-icon")
.addClass("transform rotate-180");
$(this)
.parent()
.find("ul")
.first()
.slideDown(300, function () {
$(this).addClass("menu__sub-open");
});
}
}
});
})();

43
resources/js/components/pie-chart/index.js Normal file
View file

@ -0,0 +1,43 @@
(function () {
"use strict";
// Chart
if ($(".pie-chart").length) {
let ctx = $(".pie-chart")[0].getContext("2d");
let myPieChart = new Chart(ctx, {
type: "pie",
data: {
labels: ["Html", "Vuejs", "Laravel"],
datasets: [
{
data: [15, 10, 65],
backgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
hoverBackgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
borderWidth: 5,
borderColor: $("html").hasClass("dark")
? getColor("darkmode.700")
: getColor("white"),
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
labels: {
color: getColor("slate.500", 0.8),
},
},
},
},
});
}
})();

20
resources/js/components/preview-component/index.js Normal file
View file

@ -0,0 +1,20 @@
(function () {
"use strict";
// Show code or preview
$(".preview-component").each(function () {
const previewComponent = this;
$(this)
.find('input[type="checkbox"]')
.first()
.on("click", function () {
if ($(this).is(":checked")) {
$(previewComponent).find(".preview").hide();
$(previewComponent).find(".source").fadeIn(200);
} else {
$(previewComponent).find(".preview").fadeIn(200);
$(previewComponent).find(".source").hide();
}
});
});
})();

85
resources/js/components/report-bar-chart-1/index.js Normal file
View file

@ -0,0 +1,85 @@
(function () {
"use strict";
// Chart
if ($(".report-bar-chart-1").length) {
let ctx = $(".report-bar-chart-1")[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "bar",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
datasets: [
{
label: "Html Template",
barThickness: 8,
maxBarThickness: 6,
data: [
60, 150, 30, 200, 180, 50, 180, 120, 230, 180, 250,
270,
],
backgroundColor: getColor("primary", 0.9),
},
{
label: "VueJs Template",
barThickness: 8,
maxBarThickness: 6,
data: [
50, 135, 40, 180, 190, 60, 150, 90, 250, 170, 240,
250,
],
backgroundColor: $("html").hasClass("dark")
? getColor("darkmode.400")
: getColor("slate.300"),
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
ticks: {
font: {
size: 11,
},
color: getColor("slate.500", 0.8),
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
ticks: {
display: false,
},
grid: {
color: $("html").hasClass("dark")
? getColor("darkmode.300", 0.8)
: getColor("slate.300"),
borderDash: [2, 2],
drawBorder: false,
},
},
},
},
});
}
})();

89
resources/js/components/report-bar-chart/index.js Normal file
View file

@ -0,0 +1,89 @@
(function () {
"use strict";
// Chart
if ($(".report-bar-chart").length) {
// Fake visitor data
let reportBarChartData = new Array(40).fill(0).map((data, key) => {
if (key % 3 == 0 || key % 5 == 0) {
return Math.ceil(Math.random() * (0 - 20) + 20);
} else {
return Math.ceil(Math.random() * (0 - 7) + 7);
}
});
// Fake visitor bar color
let reportBarChartColor = reportBarChartData.map((data) => {
if (data >= 8 && data <= 14) {
return $("html").hasClass("dark")
? "#2E51BBA6"
: getColor("primary", 0.65);
} else if (data >= 15) {
return $("html").hasClass("dark")
? "#2E51BB"
: getColor("primary");
}
return $("html").hasClass("dark")
? "#2E51BB59"
: getColor("primary", 0.35);
});
let ctx = $(".report-bar-chart")[0].getContext("2d");
let myBarChart = new Chart(ctx, {
type: "bar",
data: {
labels: reportBarChartData,
datasets: [
{
label: "Html Template",
barThickness: 6,
data: reportBarChartData,
backgroundColor: reportBarChartColor,
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
ticks: {
display: false,
},
grid: {
display: false,
},
},
y: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
},
},
});
setInterval(() => {
// Swap visitor data
let newData = reportBarChartData[0];
reportBarChartData.shift();
reportBarChartData.push(newData);
// Swap visitor bar color
let newColor = reportBarChartColor[0];
reportBarChartColor.shift();
reportBarChartColor.push(newColor);
myBarChart.update();
}, 1000);
}
})();

44
resources/js/components/report-donut-chart-1/index.js Normal file
View file

@ -0,0 +1,44 @@
(function () {
"use strict";
// Chart
if ($(".report-donut-chart-1").length) {
$(".report-donut-chart-1").each(function () {
let ctx = $(this)[0].getContext("2d");
let myDoughnutChart = new Chart(ctx, {
type: "doughnut",
data: {
labels: ["Yellow", "Dark"],
datasets: [
{
data: [15, 10, 65],
backgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
hoverBackgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
borderWidth: 2,
borderColor: $("html").hasClass("dark")
? getColor("darkmode.700")
: getColor("white"),
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
cutout: "83%",
},
});
});
}
})();

42
resources/js/components/report-donut-chart-2/index.js Normal file
View file

@ -0,0 +1,42 @@
(function () {
"use strict";
// Chart
if ($(".report-donut-chart-2").length) {
let ctx = $(".report-donut-chart-2")[0].getContext("2d");
let myDoughnutChart = new Chart(ctx, {
type: "doughnut",
data: {
labels: ["Yellow", "Dark"],
datasets: [
{
data: [15, 10, 65],
backgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
hoverBackgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
borderWidth: 2,
borderColor: $("html").hasClass("dark")
? getColor("darkmode.700")
: getColor("white"),
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
cutout: "83%",
},
});
}
})();

46
resources/js/components/report-donut-chart/index.js Normal file
View file

@ -0,0 +1,46 @@
(function () {
"use stirct";
// Chart
if ($("#report-donut-chart").length) {
let ctx = $("#report-donut-chart")[0].getContext("2d");
let myDoughnutChart = new Chart(ctx, {
type: "doughnut",
data: {
labels: [
"31 - 50 Years old",
">= 50 Years old",
"17 - 30 Years old",
],
datasets: [
{
data: [15, 10, 65],
backgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
hoverBackgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
borderWidth: 5,
borderColor: $("html").hasClass("dark")
? getColor("darkmode.700")
: getColor("white"),
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
cutout: "80%",
},
});
}
})();

96
resources/js/components/report-line-chart/index.js Normal file
View file

@ -0,0 +1,96 @@
(function () {
"use strict";
// Chart
if ($("#report-line-chart").length) {
let ctx = $("#report-line-chart")[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "line",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
datasets: [
{
label: "# of Votes",
data: [
0, 200, 250, 200, 700, 550, 650, 1050, 950, 1100,
900, 1200,
],
borderWidth: 2,
borderColor: getColor("primary", 0.8),
backgroundColor: "transparent",
pointBorderColor: "transparent",
tension: 0.4,
},
{
label: "# of Votes",
data: [
0, 300, 400, 560, 320, 600, 720, 850, 690, 805,
1200, 1010,
],
borderWidth: 2,
borderDash: [2, 2],
borderColor: $("html").hasClass("dark")
? getColor("slate.400", 0.6)
: getColor("slate.400"),
backgroundColor: "transparent",
pointBorderColor: "transparent",
tension: 0.4,
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
ticks: {
font: {
size: 12,
},
color: getColor("slate.500", 0.8),
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
ticks: {
font: {
size: 12,
},
color: getColor("slate.500", 0.8),
callback: function (value, index, values) {
return "$" + value;
},
},
grid: {
color: $("html").hasClass("dark")
? getColor("slate.500", 0.3)
: getColor("slate.300"),
borderDash: [2, 2],
drawBorder: false,
},
},
},
},
});
}
})();

45
resources/js/components/report-pie-chart/index.js Normal file
View file

@ -0,0 +1,45 @@
(function () {
"use strict";
// Chart
if ($("#report-pie-chart").length) {
let ctx = $("#report-pie-chart")[0].getContext("2d");
let myPieChart = new Chart(ctx, {
type: "pie",
data: {
labels: [
"31 - 50 Years old",
">= 50 Years old",
"17 - 30 Years old",
],
datasets: [
{
data: [15, 10, 65],
backgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
hoverBackgroundColor: [
getColor("pending", 0.9),
getColor("warning", 0.9),
getColor("primary", 0.9),
],
borderWidth: 5,
borderColor: $("html").hasClass("dark")
? getColor("darkmode.700")
: getColor("white"),
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
},
});
}
})();

77
resources/js/components/simple-line-chart-1/index.js Normal file
View file

@ -0,0 +1,77 @@
(function () {
"use strict";
// Chart
if ($(".simple-line-chart-1").length) {
$(".simple-line-chart-1").each(function () {
let ctx = $(this)[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "line",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
datasets: [
{
label: "# of Votes",
data:
$(this).data("random") !== undefined
? helper.randomNumbers(0, 5, 12)
: [
0, 200, 250, 200, 500, 450, 850, 1050,
950, 1100, 900, 1200,
],
borderWidth: 2,
borderColor:
$(this).data("line-color") !== undefined
? $(this).data("line-color")
: getColor("primary", 0.8),
backgroundColor: "transparent",
pointBorderColor: "transparent",
tension: 0.4,
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
},
},
});
});
}
})();

77
resources/js/components/simple-line-chart-2/index.js Normal file
View file

@ -0,0 +1,77 @@
(function () {
"use strict";
// Chart
if ($(".simple-line-chart-2").length) {
$(".simple-line-chart-2").each(function () {
let ctx = $(this)[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "line",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
datasets: [
{
label: "# of Votes",
data:
$(this).data("random") !== undefined
? helper.randomNumbers(0, 5, 12)
: [
0, 300, 400, 560, 320, 600, 720, 850,
690, 805, 1200, 1010,
],
borderWidth: 2,
borderDash: [2, 2],
borderColor:
$(this).data("line-color") !== undefined
? $(this).data("line-color")
: getColor("slate.300"),
backgroundColor: "transparent",
pointBorderColor: "transparent",
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
},
},
});
});
}
})();

84
resources/js/components/simple-line-chart-3/index.js Normal file
View file

@ -0,0 +1,84 @@
(function () {
"use strict";
// Chart
if ($(".simple-line-chart-3").length) {
let ctx = $(".simple-line-chart-3")[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "line",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
datasets: [
{
label: "# of Votes",
data: [
0, 200, 250, 200, 700, 550, 650, 1050, 950, 1100,
900, 1200,
],
borderWidth: 2,
borderColor: getColor("primary", 0.8),
backgroundColor: "transparent",
pointBorderColor: "transparent",
tension: 0.4,
},
{
label: "# of Votes",
data: [
0, 300, 400, 560, 320, 600, 720, 850, 690, 805,
1200, 1010,
],
borderWidth: 2,
borderDash: [2, 2],
borderColor: $("html").hasClass("dark")
? getColor("darkmode.100")
: getColor("slate.400"),
backgroundColor: "transparent",
pointBorderColor: "transparent",
tension: 0.4,
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
},
},
});
}
})();

84
resources/js/components/simple-line-chart-4/index.js Normal file
View file

@ -0,0 +1,84 @@
(function () {
"use strict";
// Chart
if ($(".simple-line-chart-4").length) {
let ctx = $(".simple-line-chart-4")[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "line",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
datasets: [
{
label: "# of Votes",
data: [
0, 200, 250, 200, 700, 550, 650, 1050, 950, 1100,
900, 1200,
],
borderWidth: 2,
borderColor: getColor("primary", 0.8),
backgroundColor: "transparent",
pointBorderColor: "transparent",
tension: 0.4,
},
{
label: "# of Votes",
data: [
0, 300, 400, 560, 320, 600, 720, 850, 690, 805,
1200, 1010,
],
borderWidth: 2,
borderDash: [2, 2],
borderColor: $("html").hasClass("dark")
? getColor("darkmode.100")
: getColor("slate.400"),
backgroundColor: "transparent",
pointBorderColor: "transparent",
tension: 0.4,
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
},
},
});
}
})();

71
resources/js/components/simple-line-chart/index.js Normal file
View file

@ -0,0 +1,71 @@
(function () {
"use strict";
// Chart
if ($(".simple-line-chart").length) {
$(".simple-line-chart").each(function () {
let ctx = $(this)[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "line",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
datasets: [
{
label: "# of Votes",
data: helper.randomNumbers(0, 5, 12),
borderWidth: 2,
borderColor:
$(this).data("line-color") !== undefined
? $(this).data("line-color")
: getColor("primary", 0.8),
backgroundColor: "transparent",
pointBorderColor: "transparent",
tension: 0.4,
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
ticks: {
display: false,
},
grid: {
display: false,
drawBorder: false,
},
},
},
},
});
});
}
})();

18
resources/js/components/source/index.js Normal file
View file

@ -0,0 +1,18 @@
(function () {
"use strict";
// Copy original code
$("body").on("click", ".copy-code", function () {
const content = $(this).html();
const self = this;
$(self).html(content.replace("Copy example code", "Copied!"));
setTimeout(() => {
$(self).html(content);
}, 1500);
const highlight = $(this).closest(".highlight");
$(highlight).find("textarea")[0].select();
$(highlight).find("textarea")[0].setSelectionRange(0, 99999);
document.execCommand("copy");
});
})();

78
resources/js/components/stacked-bar-chart-1/index.js Normal file
View file

@ -0,0 +1,78 @@
(function () {
"use strict";
// Chart
if ($(".stacked-bar-chart-1").length) {
let ctx = $(".stacked-bar-chart-1")[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "bar",
data: {
labels: [...Array(16).keys()],
datasets: [
{
label: "Html Template",
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 2,
backgroundColor: getColor("primary", 0.8),
data: helper.randomNumbers(-100, 100, 16),
},
{
label: "VueJs Template",
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 2,
backgroundColor: $("html").hasClass("dark")
? getColor("darkmode.200")
: getColor("slate.300"),
data: helper.randomNumbers(-100, 100, 16),
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
stacked: true,
ticks: {
font: {
size: "12",
},
color: getColor("slate.500", 0.8),
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
stacked: true,
ticks: {
font: {
size: "12",
},
color: getColor("slate.500", 0.8),
callback: function (value, index, values) {
return "$" + value;
},
},
grid: {
color: $("html").hasClass("dark")
? getColor("slate.500", 0.3)
: getColor("slate.300"),
borderDash: [2, 2],
drawBorder: false,
},
},
},
},
});
}
})();

93
resources/js/components/stacked-bar-chart/index.js Normal file
View file

@ -0,0 +1,93 @@
(function () {
"use strict";
// Chart
if ($(".stacked-bar-chart").length) {
let ctx = $(".stacked-bar-chart")[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "bar",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
],
datasets: [
{
label: "Html Template",
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 2,
backgroundColor: getColor("primary"),
data: helper.randomNumbers(-100, 100, 12),
},
{
label: "VueJs Template",
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 2,
backgroundColor: $("html").hasClass("dark")
? getColor("darkmode.200")
: getColor("slate.300"),
data: helper.randomNumbers(-100, 100, 12),
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
labels: {
color: getColor("slate.500", 0.8),
},
},
},
scales: {
x: {
stacked: true,
ticks: {
font: {
size: "12",
},
color: getColor("slate.500", 0.8),
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
stacked: true,
ticks: {
font: {
size: "12",
},
color: getColor("slate.500", 0.8),
callback: function (value, index, values) {
return "$" + value;
},
},
grid: {
color: $("html").hasClass("dark")
? getColor("slate.500", 0.3)
: getColor("slate.300"),
borderDash: [2, 2],
drawBorder: false,
},
},
},
},
});
}
})();

110
resources/js/components/tiny-slider/index.js Normal file
View file

@ -0,0 +1,110 @@
(function () {
"use strict";
const defaultConfig = {
slideBy: "page",
mouseDrag: true,
autoplay: true,
controls: false,
nav: false,
speed: 500,
};
const singleItemConfig = {
slideBy: "page",
mouseDrag: true,
autoplay: false,
controls: true,
nav: false,
speed: 500,
};
const multipleItemsConfig = {
slideBy: "page",
mouseDrag: true,
autoplay: false,
controls: true,
items: 1,
nav: false,
speed: 500,
responsive: {
600: {
items: 3,
},
480: {
items: 2,
},
},
};
const responsiveConfig = {
slideBy: "page",
mouseDrag: true,
autoplay: false,
controls: true,
items: 1,
nav: true,
speed: 500,
responsive: {
600: {
items: 3,
},
480: {
items: 2,
},
},
};
const centerModeConfig = {
mouseDrag: true,
autoplay: false,
controls: true,
center: true,
items: 1,
nav: false,
speed: 500,
responsive: {
600: {
items: 2,
},
},
};
const fadeConfig = {
mode: "gallery",
slideBy: "page",
mouseDrag: true,
autoplay: true,
controls: true,
nav: true,
speed: 500,
};
// Tiny Slider
if ($(".tiny-slider").length) {
$(".tiny-slider").each(function () {
const config = $(this).data("config");
this.tns = tns({
container: this,
...(config === undefined || config === "" ? defaultConfig : {}),
...(config === "single-item" ? singleItemConfig : {}),
...(config === "multiple-items" ? multipleItemsConfig : {}),
...(config === "responsive" ? responsiveConfig : {}),
...(config === "center-mode" ? centerModeConfig : {}),
...(config === "fade" ? fadeConfig : {}),
});
});
}
if ($(".tiny-slider-navigator").length) {
$(".tiny-slider-navigator").each(function () {
$(this).on("click", function () {
if ($(this).data("target") == "prev") {
$("#" + $(this).data("carousel"))[0].tns.goTo("prev");
} else {
$("#" + $(this).data("carousel"))[0].tns.goTo("next");
}
});
});
}
})();

56
resources/js/components/tippy-content/index.js Normal file
View file

@ -0,0 +1,56 @@
(function () {
"use strict";
// Tooltips
$(".tippy-content").each(function () {
let options = {};
if ($(this).data("trigger") !== undefined) {
options.trigger = $(this).data("trigger");
}
if ($(this).data("placement") !== undefined) {
options.placement = $(this).data("placement");
}
if ($(this).data("theme") !== undefined) {
options.theme = $(this).data("theme");
}
const initTippyContent = () => {
if (
!$(this).find("canvas").hasClass("chart") ||
($(this).find("canvas").hasClass("chart") &&
$(this).find("canvas").attr("style") !== undefined)
) {
tippy(`[data-tooltip="${$(this).attr("id")}"]`, {
plugins: [animateFillPlugin],
content: $(this)[0],
allowHTML: true,
arrow: roundArrow,
popperOptions: {
modifiers: [
{
name: "preventOverflow",
options: {
rootBoundary: "viewport",
},
},
],
},
animateFill: false,
animation: "shift-away",
theme: "light",
trigger: "click",
...options,
});
} else {
setTimeout(() => {
initTippyContent();
}, 500);
}
};
initTippyContent();
});
})();

34
resources/js/components/tippy/index.js Normal file
View file

@ -0,0 +1,34 @@
(function () {
"use strict";
// Tooltips
$(".tooltip").each(function () {
let options = {
content: $(this).attr("title"),
};
if ($(this).data("trigger") !== undefined) {
options.trigger = $(this).data("trigger");
}
if ($(this).data("placement") !== undefined) {
options.placement = $(this).data("placement");
}
if ($(this).data("theme") !== undefined) {
options.theme = $(this).data("theme");
}
if ($(this).data("tooltip-content") !== undefined) {
options.content = $($(this).data("tooltip-content"))[0];
}
$(this).removeAttr("title");
tippy(this, {
arrow: roundArrow,
animation: "shift-away",
...options,
});
});
})();

55
resources/js/components/tom-select/index.js Normal file
View file

@ -0,0 +1,55 @@
(function () {
"use strict";
// Tom Select
$(".tom-select").each(function () {
let options = {
plugins: {
dropdown_input: {},
},
};
if ($(this).data("placeholder")) {
options.placeholder = $(this).data("placeholder");
}
if ($(this).attr("multiple") !== undefined) {
options = {
...options,
plugins: {
...options.plugins,
remove_button: {
title: "Remove this item",
},
},
persist: false,
create: true,
onDelete: function (values) {
return confirm(
values.length > 1
? "Are you sure you want to remove these " +
values.length +
" items?"
: 'Are you sure you want to remove "' +
values[0] +
'"?'
);
},
};
}
if ($(this).data("header")) {
options = {
...options,
plugins: {
...options.plugins,
dropdown_header: {
title: $(this).data("header"),
},
},
};
}
new TomSelect(this, options);
});
})();

15
resources/js/components/top-bar/index.js Normal file
View file

@ -0,0 +1,15 @@
(function () {
"use strict";
$(".search")
.find("input")
.each(function () {
$(this).on("focus", function () {
$(".search-result").addClass("show");
});
$(this).on("focusout", function () {
$(".search-result").removeClass("show");
});
});
})();

87
resources/js/components/vertical-bar-chart/index.js Normal file
View file

@ -0,0 +1,87 @@
(function () {
"use strict";
// Chart
if ($(".vertical-bar-chart").length) {
let ctx = $(".vertical-bar-chart")[0].getContext("2d");
let myChart = new Chart(ctx, {
type: "bar",
data: {
labels: [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
],
datasets: [
{
label: "Html Template",
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 2,
data: [0, 200, 250, 200, 500, 450, 850, 1050],
backgroundColor: getColor("primary"),
},
{
label: "VueJs Template",
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 2,
data: [0, 300, 400, 560, 320, 600, 720, 850],
backgroundColor: $("html").hasClass("dark")
? getColor("darkmode.200")
: getColor("slate.300"),
},
],
},
options: {
maintainAspectRatio: false,
plugins: {
legend: {
labels: {
color: getColor("slate.500", 0.8),
},
},
},
scales: {
x: {
ticks: {
font: {
size: 12,
},
color: getColor("slate.500", 0.8),
},
grid: {
display: false,
drawBorder: false,
},
},
y: {
ticks: {
font: {
size: "12",
},
color: getColor("slate.500", 0.8),
callback: function (value, index, values) {
return "$" + value;
},
},
grid: {
color: $("html").hasClass("dark")
? getColor("slate.500", 0.3)
: getColor("slate.300"),
borderDash: [2, 2],
drawBorder: false,
},
},
},
},
});
}
})();

127
resources/js/helper.js Normal file
View file

@ -0,0 +1,127 @@
import dayjs from "dayjs";
import { parseColor } from "tailwindcss/lib/util/color";
const helpers = {
cutText(text, length) {
if (text.split(" ").length > 1) {
let string = text.substring(0, length);
let splitText = string.split(" ");
splitText.pop();
return splitText.join(" ") + "...";
} else {
return text;
}
},
formatDate(date, format) {
return dayjs(date).format(format);
},
capitalizeFirstLetter(string) {
if (string) {
return string.charAt(0).toUpperCase() + string.slice(1);
}
},
onlyNumber(number) {
if (number) {
return number.replace(/\D/g, "");
} else {
return "";
}
},
formatCurrency(number) {
if (number) {
let formattedNumber = number.toString().replace(/\D/g, "");
let rest = formattedNumber.length % 3;
let currency = formattedNumber.substr(0, rest);
let thousand = formattedNumber.substr(rest).match(/\d{3}/g);
let separator;
if (thousand) {
separator = rest ? "." : "";
currency += separator + thousand.join(".");
}
return currency;
} else {
return "";
}
},
timeAgo(time) {
let date = new Date(
(time || "").replace(/-/g, "/").replace(/[TZ]/g, " ")
),
diff = (new Date().getTime() - date.getTime()) / 1000,
dayDiff = Math.floor(diff / 86400);
if (isNaN(dayDiff) || dayDiff < 0 || dayDiff >= 31)
return dayjs(time).format("MMMM DD, YYYY");
return (
(dayDiff == 0 &&
((diff < 60 && "just now") ||
(diff < 120 && "1 minute ago") ||
(diff < 3600 && Math.floor(diff / 60) + " minutes ago") ||
(diff < 7200 && "1 hour ago") ||
(diff < 86400 &&
Math.floor(diff / 3600) + " hours ago"))) ||
(dayDiff == 1 && "Yesterday") ||
(dayDiff < 7 && dayDiff + " days ago") ||
(dayDiff < 31 && Math.ceil(dayDiff / 7) + " weeks ago")
);
},
diffTimeByNow(time) {
let startDate = dayjs(dayjs().format("YYYY-MM-DD HH:mm:ss").toString());
let endDate = dayjs(
dayjs(time).format("YYYY-MM-DD HH:mm:ss").toString()
);
let duration = dayjs.duration(endDate.diff(startDate));
let milliseconds = Math.floor(duration.asMilliseconds());
let days = Math.round(milliseconds / 86400000);
let hours = Math.round((milliseconds % 86400000) / 3600000);
let minutes = Math.round(((milliseconds % 86400000) % 3600000) / 60000);
let seconds = Math.round(
(((milliseconds % 86400000) % 3600000) % 60000) / 1000
);
if (seconds < 30 && seconds >= 0) {
minutes += 1;
}
return {
days: days.toString().length < 2 ? "0" + days : days,
hours: hours.toString().length < 2 ? "0" + hours : hours,
minutes: minutes.toString().length < 2 ? "0" + minutes : minutes,
seconds: seconds.toString().length < 2 ? "0" + seconds : seconds,
};
},
isset(obj) {
return Object.keys(obj).length;
},
assign(obj) {
return JSON.parse(JSON.stringify(obj));
},
delay(time) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve();
}, time);
});
},
randomNumbers(from, to, length) {
let numbers = [0];
for (let i = 1; i < length; i++) {
numbers.push(Math.ceil(Math.random() * (from - to) + to));
}
return numbers;
},
replaceAll(str, find, replace) {
return str.replace(new RegExp(find, "g"), replace);
},
toRGB(value) {
return parseColor(value).color.join(" ");
},
};
export default helpers;

68
resources/js/layouts/side-menu/index.js Normal file
View file

@ -0,0 +1,68 @@
(function () {
"use strict";
// Side Menu Dropdown
$(".side-menu").on("click", function () {
if ($(this).parent().find("ul").length) {
if ($(this).parent().find("ul").first()[0].offsetParent !== null) {
$(this)
.find(".side-menu__sub-icon")
.removeClass("transform rotate-180");
$(this).removeClass("side-menu--open");
$(this)
.parent()
.find("ul")
.first()
.slideUp(300, function () {
$(this).removeClass("side-menu__sub-open");
});
} else {
$(this)
.find(".side-menu__sub-icon")
.addClass("transform rotate-180");
$(this).addClass("side-menu--open");
$(this)
.parent()
.find("ul")
.first()
.slideDown(300, function () {
$(this).addClass("side-menu__sub-open");
});
}
}
});
// Side Menu Tooltips
const initTooltips = (function tooltips() {
$(".side-menu").each(function () {
if (this._tippy == undefined) {
const content = $(this)
.find(".side-menu__title")
.html()
.replace(/<[^>]*>?/gm, "")
.trim();
tippy(this, {
content: content,
arrow: roundArrow,
animation: "shift-away",
placement: "right",
});
}
if (
$(window).width() <= 1260 ||
$(this).closest(".side-nav").hasClass("side-nav--simple")
) {
this._tippy.enable();
} else {
this._tippy.disable();
}
});
return tooltips;
})();
window.addEventListener("resize", () => {
initTooltips();
});
})();

81
resources/js/pages/calendar/index.js Normal file
View file

@ -0,0 +1,81 @@
// (function () {
// "use strict";
// if ($("#calendar").length) {
// if ($("#calendar-events").length) {
// new Draggable($("#calendar-events")[0], {
// itemSelector: ".event",
// eventData: function (eventEl) {
// return {
// title: $(eventEl).find(".event__title").html(),
// duration: {
// days: parseInt(
// $(eventEl).find(".event__days").text()
// ),
// },
// };
// },
// });
// }
// let calendar = new Calendar($("#calendar")[0], {
// plugins: [
// interactionPlugin,
// dayGridPlugin,
// timeGridPlugin,
// listPlugin,
// ],
// droppable: true,
// headerToolbar: {
// left: "prev,next today",
// center: "title",
// right: "dayGridMonth,timeGridWeek,timeGridDay,listWeek",
// },
// initialDate: "2021-01-12",
// navLinks: true,
// editable: true,
// dayMaxEvents: true,
// events: [
// {
// title: "Vue Vixens Day",
// start: "2021-01-05",
// end: "2021-01-08",
// },
// {
// title: "VueConfUS",
// start: "2021-01-11",
// end: "2021-01-15",
// },
// {
// title: "VueJS Amsterdam",
// start: "2021-01-17",
// end: "2021-01-21",
// },
// {
// title: "Vue Fes Japan 2019",
// start: "2021-01-21",
// end: "2021-01-24",
// },
// {
// title: "Laracon 2021",
// start: "2021-01-24",
// end: "2021-01-27",
// },
// ],
// drop: function (info) {
// if (
// $("#checkbox-events").length &&
// $("#checkbox-events")[0].checked
// ) {
// $(info.draggedEl).parent().remove();
// if ($("#calendar-events").children().length == 1) {
// $("#calendar-no-events").removeClass("hidden");
// }
// }
// },
// });
// calendar.render();
// }
// })();

19
resources/js/pages/chat/index.js Normal file
View file

@ -0,0 +1,19 @@
(function () {
"use strict";
$(".chat-list")
.children()
.each(function () {
$(this).on("click", function () {
$(".chat-box")
.children("div:nth-child(2)")
.fadeOut(300, function () {
$(".chat-box")
.children("div:nth-child(1)")
.fadeIn(300, function (el) {
$(el).removeClass("hidden").removeAttr("style");
});
});
});
});
})();

53
resources/js/pages/login/index.js Normal file
View file

@ -0,0 +1,53 @@
(function () {
"use strict";
async function login() {
// Reset state
$("#login-form").find(".login__input").removeClass("border-danger");
$("#login-form").find(".login__input-error").html("");
// Post form
let email = $("#email").val();
let password = $("#password").val();
// Loading state
$("#btn-login").html(
'<i data-loading-icon="oval" data-color="white" class="w-5 h-5 mx-auto"></i>'
);
tailwind.svgLoader();
await helper.delay(1500);
axios
.post(`login`, {
email: email,
password: password,
})
.then((res) => {
location.href = "/";
})
.catch((err) => {
$("#btn-login").html("Login");
if (err.response.data.message != "Wrong email or password.") {
for (const [key, val] of Object.entries(
err.response.data.errors
)) {
$(`#${key}`).addClass("border-danger");
$(`#error-${key}`).html(val);
}
} else {
$(`#password`).addClass("border-danger");
$(`#error-password`).html(err.response.data.message);
}
});
}
$("#login-form").on("keyup", function (e) {
if (e.keyCode === 13) {
login();
}
});
$("#btn-login").on("click", function () {
login();
});
})();

24
resources/js/pages/modal/index.js Normal file
View file

@ -0,0 +1,24 @@
(function () {
"use strict";
// Show modal
$("#programmatically-show-modal").on("click", function () {
const el = document.querySelector("#programmatically-modal");
const modal = tailwind.Modal.getOrCreateInstance(el);
modal.show();
});
// Hide modal
$("#programmatically-hide-modal").on("click", function () {
const el = document.querySelector("#programmatically-modal");
const modal = tailwind.Modal.getOrCreateInstance(el);
modal.hide();
});
// Toggle modal
$("#programmatically-toggle-modal").on("click", function () {
const el = document.querySelector("#programmatically-modal");
const modal = tailwind.Modal.getOrCreateInstance(el);
modal.toggle();
});
})();

125
resources/js/pages/notification/index.js Normal file
View file

@ -0,0 +1,125 @@
(function () {
"use strict";
// Basic non sticky notification
$("#basic-non-sticky-notification-toggle").on("click", function () {
Toastify({
node: $("#basic-non-sticky-notification-content")
.clone()
.removeClass("hidden")[0],
duration: 3000,
newWindow: true,
close: true,
gravity: "top",
position: "right",
stopOnFocus: true,
}).showToast();
});
// Basic sticky notification
$("#basic-sticky-notification-toggle").on("click", function () {
Toastify({
node: $("#basic-non-sticky-notification-content")
.clone()
.removeClass("hidden")[0],
duration: -1,
newWindow: true,
close: true,
gravity: "top",
position: "right",
stopOnFocus: true,
}).showToast();
});
// Success notification
$("#success-notification-toggle").on("click", function () {
Toastify({
node: $("#success-notification-content")
.clone()
.removeClass("hidden")[0],
duration: -1,
newWindow: true,
close: true,
gravity: "top",
position: "right",
stopOnFocus: true,
}).showToast();
});
// Notification with actions
$("#notification-with-actions-toggle").on("click", function () {
Toastify({
node: $("#notification-with-actions-content")
.clone()
.removeClass("hidden")[0],
duration: -1,
newWindow: true,
close: true,
gravity: "top",
position: "right",
stopOnFocus: true,
}).showToast();
});
// Notification with avatar
$("#notification-with-avatar-toggle").on("click", function () {
// Init toastify
let avatarNotification = Toastify({
node: $("#notification-with-avatar-content")
.clone()
.removeClass("hidden")[0],
duration: -1,
newWindow: true,
close: false,
gravity: "top",
position: "right",
stopOnFocus: true,
}).showToast();
// Close notification event
$(avatarNotification.toastElement)
.find('[data-dismiss="notification"]')
.on("click", function () {
avatarNotification.hideToast();
});
});
// Notification with split buttons
$("#notification-with-split-buttons-toggle").on("click", function () {
// Init toastify
let splitButtonsNotification = Toastify({
node: $("#notification-with-split-buttons-content")
.clone()
.removeClass("hidden")[0],
duration: -1,
newWindow: true,
close: false,
gravity: "top",
position: "right",
stopOnFocus: true,
}).showToast();
// Close notification event
$(splitButtonsNotification.toastElement)
.find('[data-dismiss="notification"]')
.on("click", function () {
splitButtonsNotification.hideToast();
});
});
// Notification with buttons below
$("#notification-with-buttons-below-toggle").on("click", function () {
// Init toastify
Toastify({
node: $("#notification-with-buttons-below-content")
.clone()
.removeClass("hidden")[0],
duration: -1,
newWindow: true,
close: true,
gravity: "top",
position: "right",
stopOnFocus: true,
}).showToast();
});
})();

24
resources/js/pages/slideover/index.js Normal file
View file

@ -0,0 +1,24 @@
(function () {
"use strict";
// Show slide over
$("#programmatically-show-slideover").on("click", function () {
const el = document.querySelector("#programmatically-slideover");
const slideOver = tailwind.Modal.getOrCreateInstance(el);
slideOver.show();
});
// Hide slide over
$("#programmatically-hide-slideover").on("click", function () {
const el = document.querySelector("#programmatically-slideover");
const slideOver = tailwind.Modal.getOrCreateInstance(el);
slideOver.hide();
});
// Toggle slide over
$("#programmatically-toggle-slideover").on("click", function () {
const el = document.querySelector("#programmatically-slideover");
const slideOver = tailwind.Modal.getOrCreateInstance(el);
slideOver.toggle();
});
})();

300
resources/js/pages/tabulator/index.js Normal file
View file

@ -0,0 +1,300 @@
(function () {
"use strict";
const imageAssets = import.meta.glob(
"/resources/images/fakers/*.{jpg,jpeg,png,svg}",
{ eager: true }
);
// Tabulator
if ($("#tabulator").length) {
// Setup Tabulator
const tabulator = new Tabulator("#tabulator", {
ajaxURL: "https://dummy-data.left4code.com",
paginationMode: "remote",
filterMode: "remote",
sortMode: "remote",
printAsHtml: true,
printStyled: true,
pagination: true,
paginationSize: 10,
paginationSizeSelector: [10, 20, 30, 40],
layout: "fitColumns",
responsiveLayout: "collapse",
placeholder: "No matching records found",
columns: [
{
title: "",
formatter: "responsiveCollapse",
width: 40,
minWidth: 30,
hozAlign: "center",
resizable: false,
headerSort: false,
},
// For HTML table
{
title: "PRODUCT NAME",
minWidth: 200,
responsive: 0,
field: "name",
vertAlign: "middle",
print: false,
download: false,
formatter(cell) {
const response = cell.getData();
return `<div>
<div class="font-medium whitespace-nowrap">${response.name}</div>
<div class="text-xs text-slate-500 whitespace-nowrap">${response.category}</div>
</div>`;
},
},
{
title: "IMAGES",
minWidth: 200,
field: "images",
hozAlign: "center",
headerHozAlign: "center",
vertAlign: "middle",
print: false,
download: false,
formatter(cell) {
return `<div class="flex lg:justify-center">
<div class="w-10 h-10 intro-x image-fit">
<img alt="Midone Tailwind HTML Admin Template" class="rounded-full shadow-[0px_0px_0px_2px_#fff,_1px_1px_5px_rgba(0,0,0,0.32)] dark:shadow-[0px_0px_0px_2px_#3f4865,_1px_1px_5px_rgba(0,0,0,0.32)]" src="${
imageAssets[
"/resources/images/fakers/" +
cell.getData().images[0]
].default
}">
</div>
<div class="w-10 h-10 -ml-5 intro-x image-fit">
<img alt="Midone Tailwind HTML Admin Template" class="rounded-full shadow-[0px_0px_0px_2px_#fff,_1px_1px_5px_rgba(0,0,0,0.32)] dark:shadow-[0px_0px_0px_2px_#3f4865,_1px_1px_5px_rgba(0,0,0,0.32)]" src="${
imageAssets[
"/resources/images/fakers/" +
cell.getData().images[1]
].default
}">
</div>
<div class="w-10 h-10 -ml-5 intro-x image-fit">
<img alt="Midone Tailwind HTML Admin Template" class="rounded-full shadow-[0px_0px_0px_2px_#fff,_1px_1px_5px_rgba(0,0,0,0.32)] dark:shadow-[0px_0px_0px_2px_#3f4865,_1px_1px_5px_rgba(0,0,0,0.32)]" src="${
imageAssets[
"/resources/images/fakers/" +
cell.getData().images[2]
].default
}">
</div>
</div>`;
},
},
{
title: "REMAINING STOCK",
minWidth: 200,
field: "remaining_stock",
hozAlign: "center",
headerHozAlign: "center",
vertAlign: "middle",
print: false,
download: false,
},
{
title: "STATUS",
minWidth: 200,
field: "status",
hozAlign: "center",
headerHozAlign: "center",
vertAlign: "middle",
print: false,
download: false,
formatter(cell) {
const response = cell.getData();
return `<div class="flex items-center lg:justify-center ${
response.status ? "text-success" : "text-danger"
}">
<i data-lucide="check-square" class="w-4 h-4 mr-2"></i> ${
response.status ? "Active" : "Inactive"
}
</div>`;
},
},
{
title: "ACTIONS",
minWidth: 200,
field: "actions",
responsive: 1,
hozAlign: "center",
headerHozAlign: "center",
vertAlign: "middle",
print: false,
download: false,
formatter() {
let a =
$(`<div class="flex items-center lg:justify-center">
<a class="flex items-center mr-3 edit" href="javascript:;">
<i data-lucide="check-square" class="w-4 h-4 mr-1"></i> Edit
</a>
<a class="flex items-center delete text-danger" href="javascript:;">
<i data-lucide="trash-2" class="w-4 h-4 mr-1"></i> Delete
</a>
</div>`);
$(a)
.find(".edit")
.on("click", function () {
alert("EDIT");
});
$(a)
.find(".delete")
.on("click", function () {
alert("DELETE");
});
return a[0];
},
},
// For print format
{
title: "PRODUCT NAME",
field: "name",
visible: false,
print: true,
download: true,
},
{
title: "CATEGORY",
field: "category",
visible: false,
print: true,
download: true,
},
{
title: "REMAINING STOCK",
field: "remaining_stock",
visible: false,
print: true,
download: true,
},
{
title: "STATUS",
field: "status",
visible: false,
print: true,
download: true,
formatterPrint(cell) {
return cell.getValue() ? "Active" : "Inactive";
},
},
{
title: "IMAGE 1",
field: "images",
visible: false,
print: true,
download: true,
formatterPrint(cell) {
return cell.getValue()[0];
},
},
{
title: "IMAGE 2",
field: "images",
visible: false,
print: true,
download: true,
formatterPrint(cell) {
return cell.getValue()[1];
},
},
{
title: "IMAGE 3",
field: "images",
visible: false,
print: true,
download: true,
formatterPrint(cell) {
return cell.getValue()[2];
},
},
],
});
tabulator.on("renderComplete", () => {
createIcons({
icons,
attrs: {
"stroke-width": 1.5,
},
nameAttr: "data-lucide",
});
});
// Redraw table onresize
window.addEventListener("resize", () => {
tabulator.redraw();
createIcons({
icons,
"stroke-width": 1.5,
nameAttr: "data-lucide",
});
});
// Filter function
function filterHTMLForm() {
let field = $("#tabulator-html-filter-field").val();
let type = $("#tabulator-html-filter-type").val();
let value = $("#tabulator-html-filter-value").val();
tabulator.setFilter(field, type, value);
}
// On submit filter form
$("#tabulator-html-filter-form")[0].addEventListener(
"keypress",
function (event) {
let keycode = event.keyCode ? event.keyCode : event.which;
if (keycode == "13") {
event.preventDefault();
filterHTMLForm();
}
}
);
// On click go button
$("#tabulator-html-filter-go").on("click", function (event) {
filterHTMLForm();
});
// On reset filter form
$("#tabulator-html-filter-reset").on("click", function (event) {
$("#tabulator-html-filter-field").val("name");
$("#tabulator-html-filter-type").val("like");
$("#tabulator-html-filter-value").val("");
filterHTMLForm();
});
// Export
$("#tabulator-export-csv").on("click", function (event) {
tabulator.download("csv", "data.csv");
});
$("#tabulator-export-json").on("click", function (event) {
tabulator.download("json", "data.json");
});
$("#tabulator-export-xlsx").on("click", function (event) {
tabulator.download("xlsx", "data.xlsx", {
sheetName: "Products",
});
});
$("#tabulator-export-html").on("click", function (event) {
tabulator.download("html", "data.html", {
style: true,
});
});
// Print
$("#tabulator-print").on("click", function (event) {
tabulator.print();
});
}
})();

63
resources/js/pages/validation/index.js Normal file
View file

@ -0,0 +1,63 @@
(function () {
"use strict";
function onSubmit(pristine) {
let valid = pristine.validate();
if (valid) {
Toastify({
node: $("#success-notification-content")
.clone()
.removeClass("hidden")[0],
duration: 3000,
newWindow: true,
close: true,
gravity: "top",
position: "right",
stopOnFocus: true,
}).showToast();
} else {
Toastify({
node: $("#failed-notification-content")
.clone()
.removeClass("hidden")[0],
duration: 3000,
newWindow: true,
close: true,
gravity: "top",
position: "right",
stopOnFocus: true,
}).showToast();
}
}
$(".validate-form").each(function () {
let pristine = new Pristine(this, {
classTo: "input-form",
errorClass: "has-error",
errorTextParent: "input-form",
errorTextClass: "text-danger mt-2",
});
pristine.addValidator(
$(this).find('input[type="url"]')[0],
function (value) {
let expression =
/[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)?/gi;
let regex = new RegExp(expression);
if (!value.length || (value.length && value.match(regex))) {
return true;
}
return false;
},
"This field is URL format only",
2,
false
);
$(this).on("submit", function (e) {
e.preventDefault();
onSubmit(pristine);
});
});
})();

1
resources/js/vendor/accordion/index.js vendored Normal file
View file

@ -0,0 +1 @@
import "@left4code/tw-starter/dist/js/accordion";

1
resources/js/vendor/alert/index.js vendored Normal file
View file

@ -0,0 +1 @@
import "@left4code/tw-starter/dist/js/alert";

2
resources/js/vendor/calendar/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import { Calendar } from "@fullcalendar/core";
window.Calendar = Calendar;

2
resources/js/vendor/calendar/plugins/day-grid.js vendored Normal file
View file

@ -0,0 +1,2 @@
import dayGridPlugin from "@fullcalendar/daygrid";
window.dayGridPlugin = dayGridPlugin;

3
resources/js/vendor/calendar/plugins/interaction.js vendored Normal file
View file

@ -0,0 +1,3 @@
import interactionPlugin, { Draggable } from "@fullcalendar/interaction";
window.interactionPlugin = interactionPlugin;
window.Draggable = Draggable;

2
resources/js/vendor/calendar/plugins/list.js vendored Normal file
View file

@ -0,0 +1,2 @@
import listPlugin from "@fullcalendar/list";
window.listPlugin = listPlugin;

2
resources/js/vendor/calendar/plugins/time-grid.js vendored Normal file
View file

@ -0,0 +1,2 @@
import timeGridPlugin from "@fullcalendar/timegrid";
window.timeGridPlugin = timeGridPlugin;

2
resources/js/vendor/chartjs/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import Chart from "chart.js/auto";
window.Chart = Chart;

2
resources/js/vendor/ckeditor/balloon-block/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import BalloonBlockEditor from "@ckeditor/ckeditor5-build-balloon-block";
window.BalloonBlockEditor = BalloonBlockEditor;

2
resources/js/vendor/ckeditor/balloon/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import BalloonEditor from "@ckeditor/ckeditor5-build-balloon";
window.BalloonEditor = BalloonEditor;

2
resources/js/vendor/ckeditor/classic/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import ClassicEditor from "@ckeditor/ckeditor5-build-classic";
window.ClassicEditor = ClassicEditor;

2
resources/js/vendor/ckeditor/document/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import DocumentEditor from "@ckeditor/ckeditor5-build-decoupled-document";
window.DocumentEditor = DocumentEditor;

2
resources/js/vendor/ckeditor/inline/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import InlineEditor from "@ckeditor/ckeditor5-build-inline";
window.InlineEditor = InlineEditor;

2
resources/js/vendor/dom/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import dom from "@left4code/tw-starter/dist/js/dom";
window.$ = dom;

1
resources/js/vendor/dropdown/index.js vendored Normal file
View file

@ -0,0 +1 @@
import "@left4code/tw-starter/dist/js/dropdown";

2
resources/js/vendor/dropzone/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import Dropzone from "dropzone";
window.Dropzone = Dropzone;

4
resources/js/vendor/highlight/index.js vendored Normal file
View file

@ -0,0 +1,4 @@
import hljs from "highlight.js";
import jsBeautify from "js-beautify";
window.hljs = hljs;
window.jsBeautify = jsBeautify;

1
resources/js/vendor/image-zoom/index.js vendored Normal file
View file

@ -0,0 +1 @@
import "zoom-vanilla.js/dist/zoom-vanilla.min.js";

3
resources/js/vendor/leaflet-map/index.js vendored Normal file
View file

@ -0,0 +1,3 @@
import L from "leaflet";
import "leaflet.markercluster";
window.L = L;

2
resources/js/vendor/litepicker/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import Litepicker from "litepicker";
window.Litepicker = Litepicker;

3
resources/js/vendor/lucide/index.js vendored Normal file
View file

@ -0,0 +1,3 @@
import { createIcons, icons } from "lucide";
window.createIcons = createIcons;
window.icons = icons;

1
resources/js/vendor/modal/index.js vendored Normal file
View file

@ -0,0 +1 @@
import "@left4code/tw-starter/dist/js/modal";

2
resources/js/vendor/pristine/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import Pristine from "pristinejs";
window.Pristine = Pristine;

2
resources/js/vendor/simplebar/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import SimpleBar from "simplebar";
window.SimpleBar = SimpleBar;

1
resources/js/vendor/svg-loader/index.js vendored Normal file
View file

@ -0,0 +1 @@
import "@left4code/tw-starter/dist/js/svg-loader";

1
resources/js/vendor/tab/index.js vendored Normal file
View file

@ -0,0 +1 @@
import "@left4code/tw-starter/dist/js/tab";

2
resources/js/vendor/tabulator/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import { TabulatorFull as Tabulator } from "tabulator-tables";
window.Tabulator = Tabulator;

10
resources/js/vendor/tailwind-merge/index.js vendored Normal file
View file

@ -0,0 +1,10 @@
import * as tailwindMerge from "tailwind-merge";
const { twMerge } = tailwindMerge;
document.querySelectorAll("[data-tw-merge]").forEach((el) => {
el.setAttribute("class", twMerge(el.getAttribute("class")));
el.removeAttribute("data-tw-merge");
});
window.twMerge = tailwindMerge;

2
resources/js/vendor/tiny-slider/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import { tns } from "tiny-slider/src/tiny-slider";
window.tns = tns;

4
resources/js/vendor/tippy/index.js vendored Normal file
View file

@ -0,0 +1,4 @@
import tippy, { roundArrow, animateFill as animateFillPlugin } from "tippy.js";
window.tippy = tippy;
window.roundArrow = roundArrow;
window.animateFillPlugin = animateFillPlugin;

2
resources/js/vendor/toastify/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import Toastify from "toastify-js";
window.Toastify = Toastify;

2
resources/js/vendor/tom-select/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import TomSelect from "tom-select";
window.TomSelect = TomSelect;

1
resources/js/vendor/transition/index.js vendored Normal file
View file

@ -0,0 +1 @@
import "@left4code/tw-starter/dist/js/transition";

2
resources/js/vendor/xlsx/index.js vendored Normal file
View file

@ -0,0 +1,2 @@
import * as xlsx from "xlsx";
window.xlsx = xlsx;