From 8b3d7f5b65fba53e3408aa9eb82e0bd343a822f6 Mon Sep 17 00:00:00 2001 From: Tejas Chari Date: Mon, 6 Nov 2023 20:51:33 +0530 Subject: [PATCH] chore: added node package for jquery-offcanvas and completed the dev build --- _dev/custom.css | 1 + _dev/js/facets.js | 1 + _dev/js/theme.js | 71 ++++++++++++++++++++++++++---------------- _dev/package.json | 6 ++-- _dev/postcss.config.js | 6 ++++ _dev/vite.config.js | 32 ++++++++++--------- _dev/yarn.lock | 13 +++++--- 7 files changed, 82 insertions(+), 48 deletions(-) create mode 100644 _dev/custom.css create mode 100644 _dev/js/facets.js create mode 100644 _dev/postcss.config.js diff --git a/_dev/custom.css b/_dev/custom.css new file mode 100644 index 0000000..48cfc9d --- /dev/null +++ b/_dev/custom.css @@ -0,0 +1 @@ +@import "./node_modules/jquery-offcanvas/dist/jquery-offcanvas.min.css" diff --git a/_dev/js/facets.js b/_dev/js/facets.js new file mode 100644 index 0000000..4913f92 --- /dev/null +++ b/_dev/js/facets.js @@ -0,0 +1 @@ +import $ from "jquery"; diff --git a/_dev/js/theme.js b/_dev/js/theme.js index 633249f..50d0461 100644 --- a/_dev/js/theme.js +++ b/_dev/js/theme.js @@ -23,28 +23,33 @@ * @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0) */ /* eslint-disable */ -import 'bootstrap-touchspin'; -import 'jquery-touchswipe'; -import './selectors'; +import "jquery-offcanvas/dist/jquery.offcanvas.min.css"; +import touchspin from "bootstrap-touchspin"; +import "jquery-touchswipe"; +import "./selectors"; -import './responsive'; -import './checkout'; -import './customer'; -import './listing'; -import './product'; -import './cart'; +import "./responsive"; +import "./checkout"; +import "./customer"; +import "./listing"; +import "./product"; +import "./cart"; +import "./facets"; -import prestashop from 'prestashop'; -import EventEmitter from 'events'; -import DropDown from './components/drop-down'; -import Form from './components/form'; -import usePasswordPolicy from './components/usePasswordPolicy'; -import ProductMinitature from './components/product-miniature'; -import ProductSelect from './components/product-select'; -import TopMenu from './components/top-menu'; +import prestashop from "prestashop"; +import EventEmitter from "events"; +import DropDown from "./components/drop-down"; +import Form from "./components/form"; +import usePasswordPolicy from "./components/usePasswordPolicy"; +import ProductMinitature from "./components/product-miniature"; +import ProductSelect from "./components/product-select"; +import TopMenu from "./components/top-menu"; -import './components/block-cart'; -import $ from 'jquery'; +import "./components/block-cart"; +import $ from "jquery"; +import jo from "jquery-offcanvas"; +jo(window, $); +touchspin(window, $); /* eslint-enable */ // "inherit" EventEmitter @@ -53,8 +58,8 @@ for (const i in EventEmitter.prototype) { prestashop[i] = EventEmitter.prototype[i]; } -$(document).ready(() => { - const dropDownEl = $('.js-dropdown'); +$(function () { + const dropDownEl = $(".js-dropdown"); const form = new Form(); const topMenuEl = $('.js-top-menu ul[data-depth="0"]'); const dropDown = new DropDown(dropDownEl); @@ -66,17 +71,29 @@ $(document).ready(() => { topMenu.init(); productMinitature.init(); productSelect.init(); - usePasswordPolicy('.field-password-policy'); + usePasswordPolicy(".field-password-policy"); $('.carousel[data-touch="true"]').swipe({ swipe(event, direction) { - if (direction === 'left') { - $(this).carousel('next'); + if (direction === "left") { + $(this).carousel("next"); } - if (direction === 'right') { - $(this).carousel('prev'); + if (direction === "right") { + $(this).carousel("prev"); } }, - allowPageScroll: 'vertical', + allowPageScroll: "vertical", }); + + $("#products_top_sidebar").offcanvas({ + effect: "slide-in-over", + overlay: true, + classes: { + element: "absolute top-0 z-50", + }, + }); + $("#show_filters").on("click", function () { + $("#products_top_sidebar").offcanvas("toggle"); + }); + console.log($); }); diff --git a/_dev/package.json b/_dev/package.json index 75d4631..90ebc7d 100644 --- a/_dev/package.json +++ b/_dev/package.json @@ -11,14 +11,16 @@ "scripts": { "dev:tailwind": "tailwindcss -i ./elegance.css -o ../assets/css/theme.css --watch", "dev:livereload": "livereload \"../templates/, ../modules/, ../assets/\"", - "dev:js": "vite dev", + "dev:js": "vite build --watch", "dev": "yarn run dev:livereload & yarn run dev:tailwind & yarn run dev:js" }, "dependencies": { "bootstrap-touchspin": "^4.7.3", "events": "^3.3.0", - "jquery": "^3.7.1", + "jquery": "3.5.1", + "jquery-offcanvas": "^3.4.7", "jquery-touchswipe": "^1.6.19", + "postcss-import": "^15.1.0", "sprintf-js": "^1.1.3", "velocity-animate": "^1.5.2" } diff --git a/_dev/postcss.config.js b/_dev/postcss.config.js new file mode 100644 index 0000000..8f7c3f5 --- /dev/null +++ b/_dev/postcss.config.js @@ -0,0 +1,6 @@ +module.exports = { + plugins: { + "postcss-import": {}, + tailwindcss: {}, + }, +}; diff --git a/_dev/vite.config.js b/_dev/vite.config.js index 75ab635..a7ae609 100644 --- a/_dev/vite.config.js +++ b/_dev/vite.config.js @@ -1,26 +1,28 @@ -import { defineConfig } from 'vite' +import { defineConfig } from "vite"; export default defineConfig({ build: { + sourcemap: "inline", + minify: false, lib: { entry: "./js/theme.js", - name: 'theme', - formats: ['iife'], - fileName: function() { - return 'theme.js' - } + name: "theme", + formats: ["iife"], + fileName: function () { + return "theme.js"; + }, }, - outDir: '../assets/js/', + outDir: "../assets/js/", rollupOptions: { - external: ['$', 'jquery', 'prestashop'], + external: ["$", "jquery", "prestashop"], output: { globals: { - $: '$', - jquery: 'jQuery', - prestashop: 'prestashop' - } - } + $: "$", + jquery: "jQuery", + prestashop: "prestashop", + }, + }, }, - write: true + write: true, }, -}) +}); diff --git a/_dev/yarn.lock b/_dev/yarn.lock index dbdb93f..5f3cae1 100644 --- a/_dev/yarn.lock +++ b/_dev/yarn.lock @@ -418,15 +418,20 @@ jiti@^1.19.1: resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.0.tgz#7c97f8fe045724e136a397f7340475244156105d" integrity sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q== +jquery-offcanvas@^3.4.7: + version "3.4.7" + resolved "https://registry.yarnpkg.com/jquery-offcanvas/-/jquery-offcanvas-3.4.7.tgz#dde1f492f5904ff76bdd98ba42f1e514fa52ed70" + integrity sha512-5E3ITQNKgyzJfXqa80Nm9QBCVng4IpbrlGqAuCMSll7yPjoqJgTBl4akZE5rZXJrIpPrp1wPIjPF8tAyuhTD6g== + jquery-touchswipe@^1.6.19: version "1.6.19" resolved "https://registry.yarnpkg.com/jquery-touchswipe/-/jquery-touchswipe-1.6.19.tgz#dfd5ddaec0b78212dd500d29707129b9c7fd6cd4" integrity sha512-b0BGje9reNRU3u6ksAK9QqnX7yBRgLNe/wYG7DOfyDlhBlYjayIT8bSOHmcuvptIDW/ubM9CTW/mnZf9Rohuow== -jquery@^3.7.1: - version "3.7.1" - resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.7.1.tgz#083ef98927c9a6a74d05a6af02806566d16274de" - integrity sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg== +jquery@3.5.1: + version "3.5.1" + resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.5.1.tgz#d7b4d08e1bfdb86ad2f1a3d039ea17304717abb5" + integrity sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg== lilconfig@^2.0.5, lilconfig@^2.1.0: version "2.1.0"