1/******/ (() => { // webpackBootstrap 2/******/ "use strict"; 3/******/ var __webpack_modules__ = ({ 4 5/***/ "./src/css/periods-bar.css" 6/*!*********************************!*\ 7 !*** ./src/css/periods-bar.css ***! 8 \*********************************/ 9(__unused_webpack_module, __webpack_exports__, __webpack_require__) { 10 11__webpack_require__.r(__webpack_exports__); 12// extracted by mini-css-extract-plugin 13 14 15/***/ }, 16 17/***/ "./src/css/pricing-column.css" 18/*!************************************!*\ 19 !*** ./src/css/pricing-column.css ***! 20 \************************************/ 21(__unused_webpack_module, __webpack_exports__, __webpack_require__) { 22 23__webpack_require__.r(__webpack_exports__); 24// extracted by mini-css-extract-plugin 25 26 27/***/ }, 28 29/***/ "./src/css/pricing-table.css" 30/*!***********************************!*\ 31 !*** ./src/css/pricing-table.css ***! 32 \***********************************/ 33(__unused_webpack_module, __webpack_exports__, __webpack_require__) { 34 35__webpack_require__.r(__webpack_exports__); 36// extracted by mini-css-extract-plugin 37 38 39/***/ }, 40 41/***/ "./src/js/PeriodsBar.js" 42/*!******************************!*\ 43 !*** ./src/js/PeriodsBar.js ***! 44 \******************************/ 45(__unused_webpack_module, __webpack_exports__, __webpack_require__) { 46 47__webpack_require__.r(__webpack_exports__); 48/* harmony export */ __webpack_require__.d(__webpack_exports__, { 49/* harmony export */ "default": () => (/* binding */ PeriodsBar) 50/* harmony export */ }); 51class PeriodsBar { 52 constructor(element) { 53 this.element = element; 54 this.indicator = this.element.querySelector('.periods-bar__indicator'); 55 this.tabs = this.element.querySelectorAll('.periods-bar__tab'); 56 this.activeTab = this.element.querySelector('.periods-bar__tab--active'); 57 this.onTabChange = null; 58 59 this.init(); 60 } 61 62 init() { 63 this.bindEvents(); 64 this.updateIndicator(); 65 } 66 67 bindEvents() {
68 this.tabs.forEach(tab => { 69 tab.addEventListener('click', (e) => this.handleTabClick(e)); 70 }); 71 } 72 73 handleTabClick(e) { 74 const tab = e.currentTarget; 75 const periodKey = tab.dataset.periodKey; 76 77 this.tabs.forEach(t => t.classList.remove('periods-bar__tab--active')); 78 tab.classList.add('periods-bar__tab--active'); 79 this.activeTab = tab; 80 81 this.updateIndicator(tab); 82 83 if (this.onTabChange) { 84 this.onTabChange(periodKey); 85 } 86 } 87 88 updateIndicator(activeTab = null) { 89 if (!this.indicator) return; 90 91 const tab = activeTab || this.activeTab; 92 if (!tab) return; 93 94 const item = tab.parentElement; 95 const list = item.parentElement; 96 97 this.indicator.style.width = `${tab.offsetWidth}px`; 98 this.indicator.style.height = `${tab.offsetHeight}px`; 99 this.indicator.style.left = `${list.offsetLeft + item.offsetLeft}px`; 100 this.indicator.style.top = `${list.offsetTop + item.offsetTop}px`; 101 } 102} 103 104 105/***/ }, 106 107/***/ "./src/js/PricingColumn.js" 108/*!*********************************!*\ 109 !*** ./src/js/PricingColumn.js ***! 110 \*********************************/ 111(__unused_webpack_module, __webpack_exports__, __webpack_require__) { 112 113__webpack_require__.r(__webpack_exports__); 114/* harmony export */ __webpack_require__.d(__webpack_exports__, { 115/* harmony export */ "default": () => (/* binding */ PricingColumn) 116/* harmony export */ }); 117class PricingColumn { 118 constructor(element) { 119 this.element = element; 120 this.priceElement = this.element.querySelector('.pricing-column__amount'); 121 this.button = this.element.querySelector('.pricing-column__button'); 122 this.features = this.element.querySelectorAll('.pricing-column__feature'); 123 124 this.init(); 125 } 126 127 init() { 128 this.bindEvents(); 129 } 130 131 bindEvents() { 132 if (this.button) { 133 this.button.addEventListener('click', (e) => this.handleButtonClick(e)); 134 } 135 } 136 137 handleButtonClick(e) { 138 const button = e.currentTarget; 139 140 button.classList.add('pricing-column__button--clicked'); 141 setTimeout(() => { 142 button.classList.remove('pricing-column__button--clicked'); 143 }, 300); 144 145 console.log('Pricing column button clicked'); 146 } 147 148 updatePrice(periodKey) { 149 if (!this.priceElement) return; 150 151 const priceMap = JSON.parse(this.priceElement.dataset.priceMap || '{}'); 152 153 if (priceMap && priceMap[periodKey] !== undefined) { 154 this.priceElement.style.opacity = '0'; 155 this.priceElement.style.transform = 'translateY(-10px)'; 156 157 setTimeout(() => { 158 this.priceElement.textContent = priceMap[periodKey]; 159 this.priceElement.style.opacity = '1'; 160 this.priceElement.style.transform = 'translateY(0)'; 161 }, 150); 162 } 163 } 164 165 animateFeatures(startDelay = 0) { 166 this.features.forEach((feature, index) => { 167 setTimeout(() => { 168 feature.style.opacity = '0'; 169 feature.style.transform = 'translateX(-20px)'; 170 feature.style.transition = 'opacity 0.4s ease, transform 0.4s ease'; 171 172 requestAnimationFrame(() => { 173 feature.style.opacity = '1'; 174 feature.style.transform = 'translateX(0)'; 175 }); 176 }, startDelay + (index * 100)); 177 }); 178 } 179} 180 181 182/***/ }, 183 184/***/ "./src/js/PricingTable.js" 185/*!********************************!*\ 186 !*** ./src/js/PricingTable.js ***! 187 \********************************/ 188(__unused_webpack_module, __webpack_exports__, __webpack_require__) { 189 190__webpack_require__.r(__webpack_exports__); 191/* harmony export */ __webpack_require__.d(__webpack_exports__, { 192/* harmony export */ "default": () => (/* binding */ PricingTable) 193/* harmony export */ });
194/* harmony import */ var _PeriodsBar_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./PeriodsBar.js */ "./src/js/PeriodsBar.js"); 195/* harmony import */ var _PricingColumn_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./PricingColumn.js */ "./src/js/PricingColumn.js"); 196 197 198 199 200class PricingTable { 201 constructor(element) { 202 this.element = element; 203 this.periodsBar = null; 204 this.columns = []; 205 206 this.init(); 207 } 208 209 init() { 210 this.initPeriodsBar(); 211 this.initColumns(); 212 this.addAnimations(); 213 } 214 215 initPeriodsBar() { 216 const barElement = this.element.querySelector('.periods-bar'); 217 if (!barElement) return; 218 219 this.periodsBar = new _PeriodsBar_js__WEBPACK_IMPORTED_MODULE_0__["default"](barElement); 220 this.periodsBar.onTabChange = (periodKey) => { 221 this.updateAllPrices(periodKey); 222 }; 223 } 224 225 initColumns() { 226 const columnElements = this.element.querySelectorAll('.pricing-column'); 227 columnElements.forEach(columnElement => { 228 const column = new _PricingColumn_js__WEBPACK_IMPORTED_MODULE_1__["default"](columnElement); 229 this.columns.push(column); 230 }); 231 } 232 233 updateAllPrices(periodKey) { 234 this.columns.forEach(column => { 235 column.updatePrice(periodKey); 236 }); 237 } 238 239 addAnimations() { 240 if ('IntersectionObserver' in window) { 241 const observer = new IntersectionObserver((entries) => { 242 entries.forEach(entry => { 243 if (entry.isIntersecting) { 244 this.animateColumns(); 245 observer.unobserve(entry.target); 246 } 247 }); 248 }, { 249 threshold: 0.2 250 }); 251 252 observer.observe(this.element); 253 } else { 254 this.animateColumns(); 255 } 256 } 257 258 animateColumns() { 259 this.columns.forEach((column, index) => { 260 column.animateFeatures(index * 200); 261 }); 262 } 263} 264 265 266 267/***/ } 268 269/******/ }); 270/************************************************************************/ 271/******/ // The module cache 272/******/ var __webpack_module_cache__ = {}; 273/******/ 274/******/ // The require function 275/******/ function __webpack_require__(moduleId) { 276/******/ // Check if module is in cache 277/******/ var cachedModule = __webpack_module_cache__[moduleId]; 278/******/ if (cachedModule !== undefined) { 279/******/ return cachedModule.exports; 280/******/ } 281/******/ // Check if module exists (development only) 282/******/ if (__webpack_modules__[moduleId] === undefined) { 283/******/ var e = new Error("Cannot find module '" + moduleId + "'"); 284/******/ e.code = 'MODULE_NOT_FOUND'; 285/******/ throw e; 286/******/ } 287/******/ // Create a new module (and put it into the cache) 288/******/ var module = __webpack_module_cache__[moduleId] = { 289/******/ // no module.id needed 290/******/ // no module.loaded needed 291/******/ exports: {} 292/******/ }; 293/******/ 294/******/ // Execute the module function 295/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__); 296/******/ 297/******/ // Return the exports of the module 298/******/ return module.exports; 299/******/ } 300/******/ 301/************************************************************************/ 302/******/ /* webpack/runtime/define property getters */ 303/******/ (() => { 304/******/ // define getter functions for harmony exports 305/******/ __webpack_require__.d = (exports, definition) => { 306/******/ for(var key in definition) { 307/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) { 308/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] }); 309/******/ } 310/******/ } 311/******/ }; 312/******/ })(); 313/******/ 314/******/ /* webpack/runtime/hasOwnProperty shorthand */ 315/******/ (() => { 316/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop)) 317/******/ })(); 318/******/ 319/******/ /* webpack/runtime/make namespace object */ 320/******/ (() => { 321/******/ // define __esModule on exports 322/******/ __webpack_require__.r = (exports) => { 323/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { 324/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); 325/******/ } 326/******/ Object.defineProperty(exports, '__esModule', { value: true }); 327/******/ }; 328/******/ })(); 329/******/ 330/************************************************************************/ 331var __webpack_exports__ = {}; 332// This entry needs to be wrapped in an IIFE because it needs to be isolated against other modules in the chunk. 333(() => { 334/*!*************************!*\ 335 !*** ./src/js/index.js ***! 336 \*************************/ 337__webpack_require__.r(__webpack_exports__); 338/* harmony import */ var _css_periods_bar_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../css/periods-bar.css */ "./src/css/periods-bar.css"); 339/* harmony import */ var _css_pricing_column_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css/pricing-column.css */ "./src/css/pricing-column.css"); 340/* harmony import */ var _css_pricing_table_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../css/pricing-table.css */ "./src/css/pricing-table.css"); 341/* harmony import */ var _PricingTable_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./PricingTable.js */ "./src/js/PricingTable.js"); 342 343 344 345 346 347 348// Initialize on Elementor frontend 349window.addEventListener('elementor/frontend/init', function() { 350 elementorFrontend.hooks.addAction('frontend/element_ready/zysk_pricing_table.default', function($scope) { 351 // Handle both jQuery and raw DOM element 352 const container = $scope instanceof jQuery ? $scope[0] : $scope; 353 const element = container.querySelector('.pricing-table'); 354 355 if (element) { 356 new _PricingTable_js__WEBPACK_IMPORTED_MODULE_3__["default"](element); 357 } 358 }); 359}); 360 361})(); 362 363/******/ })() 364; 365//# sourceMappingURL=pricing-table.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.