https://dataslicesagency.ai/wp-content/themes/aimo/assets/js/libs/cursor.js?ver=1782192529

1;(function ($) {
2  "use strict";
3
4    window.App = {};
5    App.config = {
6      headroom: {
7        enabled: true,
8        options: {
9          classes : {
10            initial : "headroom",
11            pinned : "is-pinned",
12            unpinned : "is-unpinned",
13            top : "is-top",
14            notTop : "is-not-top",
15            bottom : "is-bottom",
16            notBottom : "is-not-bottom",
17            frozen: "is-frozen",
18          },
19        }
20      },
21      ajax: {
22        enabled: true,
23      },
24      cursorFollower: {
25        enabled: true,
26        disableBreakpoint: '992',
27      },
28    }
29
30    App.html = document.querySelector('html');
31    App.body = document.querySelector('body');
32
33    window.onload = function () {
34
35      if (App.config.cursorFollower.enabled) {
36        Cursor.init();
37      }
38      
39
40    }
41
42    const Cursor = (function() {
43
44    const cursor = document.querySelector(".pxl-js-cursor");
45    let follower;
46    let label;
47    let drap;
48    let icon;
49
50    let clientX;
51    let clientY;
52    let cursorWidth;
53    let cursorHeight;
54    let cursorTriggers;
55    let cursorTriggersSection;
56    let state;
57
58    function variables() {
59
60      follower = cursor.querySelector(".pxl-js-follower");

61      label = cursor.querySelector(".pxl-js-label");
62      drap = cursor.querySelector(".pxl-js-drap");
63      icon = cursor.querySelector(".pxl-js-icon");
64
65      clientX = -100;
66      clientY = -100;
67      cursorWidth = cursor.offsetWidth / 2;
68      cursorHeight = cursor.offsetHeight / 2;
69      cursorTriggers;
70      cursorTriggersSection;
71      state = false;
72
73    }
74
75    function init() {
76
77      if (!cursor) return;
78
79      variables();
80      state = true;
81      cursor.classList.add('is-enabled');
82
83      document.addEventListener("mousedown", e => {
84        cursor.classList.add('is-mouse-down');
85      });
86
87      document.addEventListener("mouseup", e => {
88        cursor.classList.remove('is-mouse-down');
89      });
90
91      document.addEventListener("mousemove", (event) => {
92        clientX = event.clientX;
93        clientY = event.clientY;
94      });
95
96      const render = () => {
97        cursor.style.transform = `translate(${clientX - cursorWidth}px, ${clientY - cursorHeight}px)`;
98        requestAnimationFrame(render);
99      };
100
101      requestAnimationFrame(render);
102
103      update();
104      breakpoint();
105
106    }
107
108    function enterHandler({ target }) {
109
110      cursor.classList.add('is-active');
111
112      if (target.getAttribute('data-cursor-label')) {
113        App.body.classList.add('is-cursor-active');
114        cursor.classList.add('has-label');
115        label.innerHTML = target.getAttribute('data-cursor-label');
116      }
117
118      if (target.getAttribute('data-cursor-drap')) {
119        App.body.classList.add('is-cursor-active');
120        cursor.classList.add('has-drap');
121        drap.innerHTML = target.getAttribute('data-cursor-drap');
122      }
123
124      if (target.getAttribute('data-drap-style')) {
125         var $d_style = target.getAttribute('data-drap-style');
126        cursor.classList.add($d_style);
127        drap.innerHTML = target.getAttribute('data-drap-style');
128      }
129
130      if (target.getAttribute('data-cursor-icon')) {
131        App.body.classList.add('is-cursor-active');
132        cursor.classList.add('has-icon');
133        const iconAttr = target.getAttribute('data-cursor-icon');
134      }
135
136      if (target.getAttribute('data-cursor-icon-left')) {
137        App.body.classList.add('is-cursor-active');
138        cursor.classList.add('has-icon-left');
139        const iconAttr_left = target.getAttribute('data-cursor-icon-left');
140      }
141
142      if (target.getAttribute('data-cursor-icon-right')) {
143        App.body.classList.add('is-cursor-active');
144        cursor.classList.add('has-icon-right');
145        const iconAttr_right = target.getAttribute('data-cursor-icon-right');
146      }
147
148      if (target.getAttribute('data-has-remove')) {
149        cursor.classList.add('has-remove');
150      }
151
152    }
153    
154    function leaveHandler({ target }) {
155
156      App.body.classList.remove('is-cursor-active');
157      cursor.classList.remove('is-active');
158      cursor.classList.remove('has-label');
159      cursor.classList.remove('has-drap');
160      cursor.classList.remove('has-icon');
161      cursor.classList.remove('has-icon-left');
162      cursor.classList.remove('has-icon-right');
163      cursor.classList.remove('has-remove');
164      label.innerHTML = '';
165      drap.innerHTML = '';
166      icon.innerHTML = '';
167
168    }
169
170    function update() {
171
172      if (!cursor) return;
173
174      cursorTriggers = document.querySelectorAll([
175        ".pxl-cursor--cta",
176        ".pxl-cursor-remove",
177        ".pxl-close",
178        "button",
179        "a",
180        "input",
181        "[data-cursor]",
182        "[data-cursor-label]",
183        "[data-cursor-drap]",
184        "[data-drap-style]",
185        "[data-cursor-icon]",
186        "[data-cursor-icon-left]",
187        "[data-cursor-icon-right]",
188        "textarea"
189      ]);
190
191      cursorTriggersSection = document.querySelectorAll([
192        ".pxl-mouse-animation-yes"
193      ]);
194      
195      cursorTriggers.forEach(el => {
196        el.addEventListener("mouseenter", enterHandler);
197        el.addEventListener("mouseleave", leaveHandler);
198      });
199
200    }
201
202    function clear() {
203
204      if (!cursor) return;
205      
206      cursorTriggers.forEach(el => {
207        el.removeEventListener("mouseenter", enterHandler);
208        el.removeEventListener("mouseleave", leaveHandler);
209      });
210
211    }
212
213    function hide() {
214
215      if (!cursor) return;
216      cursor.classList.add('is-hidden');
217
218    }
219
220    function show() {
221
222      if (!cursor) return;
223      cursor.classList.remove('is-hidden');
224
225    }
226
227    function breakpoint() {
228
229      if (!state) return;
230      if (!App.config.cursorFollower.disableBreakpoint) return;
231
232      let width = (window.innerWidth > 0) ? window.innerWidth : screen.width;
233
234      if (width < App.config.cursorFollower.disableBreakpoint) {
235        state = false;

236        cursor.classList.remove('is-enabled');
237        clear();
238      } else {
239        state = true;
240        cursor.classList.add('is-enabled');
241        update();
242      }
243
244      window.addEventListener('resize', () => {
245        let width = (window.innerWidth > 0) ? window.innerWidth : screen.width;
246
247        if (width < App.config.cursorFollower.disableBreakpoint) {
248          state = false;
249          cursor.classList.remove('is-enabled');
250          clear();
251        } else {
252          state = true;
253          cursor.classList.add('is-enabled');
254          update();
255        }
256      })
257
258    }
259
260    return {
261      init: init,
262      update: update,
263      clear: clear,
264      hide: hide,
265      show: show,
266    };
267
268  })();
269})(jQuery);