initial commit

resources/themestyle/js/dropdown-hover.js

@@ -0,0 +1,44 @@
+/*
+ * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
+ * This devtool is neither made for production nor for readable output files.
+ * It uses "eval()" calls to create a separate source file in the browser devtools.
+ * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
+ * or disable the default devtool with "devtool: false".
+ * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
+ */
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else {
+		var a = factory();
+		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
+	}
+})(self, function() {
+return /******/ (function() { // webpackBootstrap
+/******/ 	var __webpack_modules__ = ({
+
+/***/ "./js/dropdown-hover.js":
+/*!******************************!*\
+  !*** ./js/dropdown-hover.js ***!
+  \******************************/
+/***/ (function() {
+
+eval("// Add onHover event for dropdowns\n\n;\n(function ($) {\n  if (!$ || !$.fn) return;\n  var SELECTOR = '[data-bs-toggle=dropdown][data-trigger=hover]';\n  var TIMEOUT = 150;\n  function openDropdown($i) {\n    var t = $i.data('dd-timeout');\n    if (t) {\n      clearTimeout(t);\n      t = null;\n      $i.data('dd-timeout', t);\n    }\n    if ($i.attr('aria-expanded') !== 'true') $i.dropdown('toggle');\n  }\n  function closeDropdown($i) {\n    var t = $i.data('dd-timeout');\n    if (t) clearTimeout(t);\n    t = setTimeout(function () {\n      var t2 = $i.data('dd-timeout');\n      if (t2) {\n        clearTimeout(t2);\n        t2 = null;\n        $i.data('dd-timeout', t2);\n      }\n      if ($i.attr('aria-expanded') === 'true') $i.dropdown('toggle');\n    }, TIMEOUT);\n    $i.data('dd-timeout', t);\n  }\n  $(function () {\n    $('body').on('mouseenter', \"\".concat(SELECTOR, \", \").concat(SELECTOR, \" ~ .dropdown-menu\"), function () {\n      var $toggle = $(this).hasClass('dropdown-toggle') ? $(this) : $(this).prev('.dropdown-toggle');\n      var $dropdown = $(this).hasClass('dropdown-menu') ? $(this) : $(this).next('.dropdown-menu');\n      if (window.getComputedStyle($dropdown[0], null).getPropertyValue('position') === 'static') return;\n\n      // Set hovered flag\n      if ($(this).is(SELECTOR)) {\n        $(this).data('hovered', true);\n      }\n      openDropdown($(this).hasClass('dropdown-toggle') ? $(this) : $(this).prev('.dropdown-toggle'));\n    }).on('mouseleave', \"\".concat(SELECTOR, \", \").concat(SELECTOR, \" ~ .dropdown-menu\"), function () {\n      var $toggle = $(this).hasClass('dropdown-toggle') ? $(this) : $(this).prev('.dropdown-toggle');\n      var $dropdown = $(this).hasClass('dropdown-menu') ? $(this) : $(this).next('.dropdown-menu');\n      if (window.getComputedStyle($dropdown[0], null).getPropertyValue('position') === 'static') return;\n\n      // Remove hovered flag\n      if ($(this).is(SELECTOR)) {\n        $(this).data('hovered', false);\n      }\n      closeDropdown($(this).hasClass('dropdown-toggle') ? $(this) : $(this).prev('.dropdown-toggle'));\n    }).on('hide.bs.dropdown', function (e) {\n      if ($(this).find(SELECTOR).data('hovered')) e.preventDefault();\n    });\n  });\n})(window.jQuery);\n\n//# sourceURL=webpack://Vuexy/./js/dropdown-hover.js?");
+
+/***/ })
+
+/******/ 	});
+/************************************************************************/
+/******/ 	
+/******/ 	// startup
+/******/ 	// Load entry module and return exports
+/******/ 	// This entry module can't be inlined because the eval devtool is used.
+/******/ 	var __webpack_exports__ = {};
+/******/ 	__webpack_modules__["./js/dropdown-hover.js"]();
+/******/ 	
+/******/ 	return __webpack_exports__;
+/******/ })()
+;
+});

resources/themestyle/js/front-config.js

@@ -0,0 +1,35 @@
+/**
+ * Config
+ * -------------------------------------------------------------------------------------
+ * ! IMPORTANT: Make sure you clear the browser local storage In order to see the config changes in the template.
+ * ! To clear local storage: (https://www.leadshook.com/help/how-to-clear-local-storage-in-google-chrome-browser/).
+ */
+
+'use strict';
+
+let assetsPath = document.documentElement.getAttribute('data-assets-path'),
+  templateName = document.documentElement.getAttribute('data-template'),
+  rtlSupport = true; // set true for rtl support (rtl + ltr), false for ltr only.
+
+/**
+ * TemplateCustomizer settings
+ * -------------------------------------------------------------------------------------
+ * cssPath: Core CSS file path
+ * themesPath: Theme CSS file path
+ * displayCustomizer: true(Show customizer), false(Hide customizer)
+ * lang: To set default language, Add more langues and set default. Fallback language is 'en'
+ * controls: [ 'rtl', 'style', 'headerType', 'contentLayout', 'layoutCollapsed', 'layoutNavbarOptions', 'themes' ] | Show/Hide customizer controls
+ * defaultStyle: 'light', 'dark', 'system' (Mode)
+ * defaultTextDir: 'ltr', 'rtl' (rtlSupport must be true for rtl mode)
+ */
+
+if (typeof TemplateCustomizer !== 'undefined') {
+  window.templateCustomizer = new TemplateCustomizer({
+    cssPath: assetsPath + 'vendor/css' + (rtlSupport ? '/rtl' : '') + '/',
+    themesPath: assetsPath + 'vendor/css' + (rtlSupport ? '/rtl' : '') + '/',
+    displayCustomizer: true,
+    // defaultTextDir: 'rtl'
+    // defaultStyle: 'dark',
+    controls: ['rtl', 'style']
+  });
+}

resources/themestyle/js/front-main.js

@@ -0,0 +1,154 @@
+/**
+ * Main - Front Pages
+ */
+'use strict';
+
+let isRtl = window.Helpers.isRtl(),
+  isDarkStyle = window.Helpers.isDarkStyle();
+
+(function () {
+  const menu = document.getElementById('navbarSupportedContent'),
+    nav = document.querySelector('.layout-navbar'),
+    navItemLink = document.querySelectorAll('.navbar-nav .nav-link');
+
+  // Initialised custom options if checked
+  setTimeout(function () {
+    window.Helpers.initCustomOptionCheck();
+  }, 1000);
+
+  if (typeof Waves !== 'undefined') {
+    Waves.init();
+    Waves.attach(".btn[class*='btn-']:not([class*='btn-outline-']):not([class*='btn-label-'])", ['waves-light']);
+    Waves.attach("[class*='btn-outline-']");
+    Waves.attach("[class*='btn-label-']");
+    Waves.attach('.pagination .page-item .page-link');
+  }
+
+  // Init BS Tooltip
+  const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
+  tooltipTriggerList.map(function (tooltipTriggerEl) {
+    return new bootstrap.Tooltip(tooltipTriggerEl);
+  });
+
+  // If layout is RTL add .dropdown-menu-end class to .dropdown-menu
+  if (isRtl) {
+    Helpers._addClass('dropdown-menu-end', document.querySelectorAll('#layout-navbar .dropdown-menu'));
+  }
+
+  // Navbar
+  window.addEventListener('scroll', e => {
+    if (window.scrollY > 10) {
+      nav.classList.add('navbar-active');
+    } else {
+      nav.classList.remove('navbar-active');
+    }
+  });
+  window.addEventListener('load', e => {
+    if (window.scrollY > 10) {
+      nav.classList.add('navbar-active');
+    } else {
+      nav.classList.remove('navbar-active');
+    }
+  });
+
+  // Function to close the mobile menu
+  function closeMenu() {
+    menu.classList.remove('show');
+  }
+
+  document.addEventListener('click', function (event) {
+    // Check if the clicked element is inside mobile menu
+    if (!menu.contains(event.target)) {
+      closeMenu();
+    }
+  });
+  navItemLink.forEach(link => {
+    link.addEventListener('click', event => {
+      if (!link.classList.contains('dropdown-toggle')) {
+        closeMenu();
+      } else {
+        event.preventDefault();
+      }
+    });
+  });
+
+  // If layout is RTL add .dropdown-menu-end class to .dropdown-menu
+  if (isRtl) {
+    Helpers._addClass('dropdown-menu-end', document.querySelectorAll('.dropdown-menu'));
+  }
+
+  // Mega dropdown
+  const megaDropdown = document.querySelectorAll('.nav-link.mega-dropdown');
+  if (megaDropdown) {
+    megaDropdown.forEach(e => {
+      new MegaDropdown(e);
+    });
+  }
+
+  //Style Switcher (Light/Dark/System Mode)
+  let styleSwitcher = document.querySelector('.dropdown-style-switcher');
+
+  // Set style on click of style switcher item if template customizer is enabled
+  if (window.templateCustomizer && styleSwitcher) {
+    // Get style from local storage or use 'system' as default
+    let storedStyle =
+      localStorage.getItem('templateCustomizer-' + templateName + '--Style') ||
+      window.templateCustomizer.settings.defaultStyle;
+
+    let styleSwitcherItems = [].slice.call(styleSwitcher.children[1].querySelectorAll('.dropdown-item'));
+    styleSwitcherItems.forEach(function (item) {
+      item.addEventListener('click', function () {
+        let currentStyle = this.getAttribute('data-theme');
+        if (currentStyle === 'light') {
+          window.templateCustomizer.setStyle('light');
+        } else if (currentStyle === 'dark') {
+          window.templateCustomizer.setStyle('dark');
+        } else {
+          window.templateCustomizer.setStyle('system');
+        }
+      });
+    });
+
+    // Update style switcher icon based on the stored style
+
+    const styleSwitcherIcon = styleSwitcher.querySelector('i');
+
+    if (storedStyle === 'light') {
+      styleSwitcherIcon.classList.add('ti-sun');
+      new bootstrap.Tooltip(styleSwitcherIcon, {
+        title: 'Light Mode',
+        fallbackPlacements: ['bottom']
+      });
+    } else if (storedStyle === 'dark') {
+      styleSwitcherIcon.classList.add('ti-moon');
+      new bootstrap.Tooltip(styleSwitcherIcon, {
+        title: 'Dark Mode',
+        fallbackPlacements: ['bottom']
+      });
+    } else {
+      styleSwitcherIcon.classList.add('ti-device-desktop');
+      new bootstrap.Tooltip(styleSwitcherIcon, {
+        title: 'System Mode',
+        fallbackPlacements: ['bottom']
+      });
+    }
+    // Run switchImage function based on the stored style
+    switchImage(storedStyle);
+  }
+
+  // Update light/dark image based on current style
+  function switchImage(style) {
+    if (style === 'system') {
+      if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+        style = 'dark';
+      } else {
+        style = 'light';
+      }
+    }
+    const switchImagesList = [].slice.call(document.querySelectorAll('[data-app-' + style + '-img]'));
+    switchImagesList.map(function (imageEl) {
+      const setImage = imageEl.getAttribute('data-app-' + style + '-img');
+      imageEl.src = assetsPath + 'img/' + setImage; // Using window.assetsPath to get the exact relative path
+    });
+  }
+})();

resources/themestyle/js/front-page-landing.js

@@ -0,0 +1,146 @@
+/**
+ * Main - Front Pages
+ */
+'use strict';
+
+(function () {
+  const nav = document.querySelector('.layout-navbar'),
+    heroAnimation = document.getElementById('hero-animation'),
+    animationImg = document.querySelectorAll('.hero-dashboard-img'),
+    animationElements = document.querySelectorAll('.hero-elements-img'),
+    swiperLogos = document.getElementById('swiper-clients-logos'),
+    swiperReviews = document.getElementById('swiper-reviews'),
+    ReviewsPreviousBtn = document.getElementById('reviews-previous-btn'),
+    ReviewsNextBtn = document.getElementById('reviews-next-btn'),
+    ReviewsSliderPrev = document.querySelector('.swiper-button-prev'),
+    ReviewsSliderNext = document.querySelector('.swiper-button-next'),
+    priceDurationToggler = document.querySelector('.price-duration-toggler'),
+    priceMonthlyList = [].slice.call(document.querySelectorAll('.price-monthly')),
+    priceYearlyList = [].slice.call(document.querySelectorAll('.price-yearly'));
+
+  // Hero
+  const mediaQueryXL = '1200';
+  const width = screen.width;
+  if (width >= mediaQueryXL && heroAnimation) {
+    heroAnimation.addEventListener('mousemove', function parallax(e) {
+      animationElements.forEach(layer => {
+        layer.style.transform = 'translateZ(1rem)';
+      });
+      animationImg.forEach(layer => {
+        let x = (window.innerWidth - e.pageX * 2) / 100;
+        let y = (window.innerHeight - e.pageY * 2) / 100;
+        layer.style.transform = `perspective(1200px) rotateX(${y}deg) rotateY(${x}deg) scale3d(1, 1, 1)`;
+      });
+    });
+    nav.addEventListener('mousemove', function parallax(e) {
+      animationElements.forEach(layer => {
+        layer.style.transform = 'translateZ(1rem)';
+      });
+      animationImg.forEach(layer => {
+        let x = (window.innerWidth - e.pageX * 2) / 100;
+        let y = (window.innerHeight - e.pageY * 2) / 100;
+        layer.style.transform = `perspective(1200px) rotateX(${y}deg) rotateY(${x}deg) scale3d(1, 1, 1)`;
+      });
+    });
+
+    heroAnimation.addEventListener('mouseout', function () {
+      animationElements.forEach(layer => {
+        layer.style.transform = 'translateZ(0)';
+      });
+      animationImg.forEach(layer => {
+        layer.style.transform = 'perspective(1200px) scale(1) rotateX(0) rotateY(0)';
+      });
+    });
+  }
+
+  // swiper carousel
+  // Customers reviews
+  // -----------------------------------
+  if (swiperReviews) {
+    new Swiper(swiperReviews, {
+      slidesPerView: 1,
+      spaceBetween: 5,
+      grabCursor: true,
+      autoplay: {
+        delay: 3000,
+        disableOnInteraction: false
+      },
+      loop: true,
+      loopAdditionalSlides: 1,
+      navigation: {
+        nextEl: '.swiper-button-next',
+        prevEl: '.swiper-button-prev'
+      },
+      breakpoints: {
+        1200: {
+          slidesPerView: 3,
+          spaceBetween: 26
+        },
+        992: {
+          slidesPerView: 2,
+          spaceBetween: 20
+        }
+      }
+    });
+  }
+
+  // Reviews slider next and previous
+  // -----------------------------------
+  // Add click event listener to next button
+  ReviewsNextBtn.addEventListener('click', function () {
+    ReviewsSliderNext.click();
+  });
+  ReviewsPreviousBtn.addEventListener('click', function () {
+    ReviewsSliderPrev.click();
+  });
+
+  // Review client logo
+  // -----------------------------------
+  if (swiperLogos) {
+    new Swiper(swiperLogos, {
+      slidesPerView: 2,
+      autoplay: {
+        delay: 3000,
+        disableOnInteraction: false
+      },
+      breakpoints: {
+        992: {
+          slidesPerView: 5
+        },
+        768: {
+          slidesPerView: 3
+        }
+      }
+    });
+  }
+
+  // Pricing Plans
+  // -----------------------------------
+  document.addEventListener('DOMContentLoaded', function (event) {
+    function togglePrice() {
+      if (priceDurationToggler.checked) {
+        // If checked
+        priceYearlyList.map(function (yearEl) {
+          yearEl.classList.remove('d-none');
+        });
+        priceMonthlyList.map(function (monthEl) {
+          monthEl.classList.add('d-none');
+        });
+      } else {
+        // If not checked
+        priceYearlyList.map(function (yearEl) {
+          yearEl.classList.add('d-none');
+        });
+        priceMonthlyList.map(function (monthEl) {
+          monthEl.classList.remove('d-none');
+        });
+      }
+    }
+    // togglePrice Event Listener
+    togglePrice();
+
+    priceDurationToggler.onchange = function () {
+      togglePrice();
+    };
+  });
+})();