https://will-media.de/wp-content/plugins/uicore-animate/assets/js/animated-border.js?ver=2.2.4

1window.addEventListener('DOMContentLoaded', () => {
2  class animatedBorder extends elementorModules.frontend.handlers.Base {
3    bindEvents() {
4      this.setVariables();
5    }
6    // getWidgetType() {
7    //     return 'global';
8    // }
9    debounce(func, wait = 1, immediate = true) {
10      let timeout;
11      return function () {
12        const context = this,
13          args = arguments;
14        const later = function () {
15          timeout = null;
16          if (!immediate) func.apply(context, args);
17        };
18        const callNow = immediate && !timeout;
19        clearTimeout(timeout);
20        timeout = setTimeout(later, wait);
21        if (callNow) func.apply(context, args);
22      };
23    }
24    onElementChange(prop) {
25      //check if prop was uicon_animated_border or  the changed prop string contains border word in it
26      if ((prop === 'uicore_animated_border' || prop.includes('border') || prop === 'uicore_animated_border_item') && !prop.includes('animated_border_color')) {
27        this.debounce(this.setVariables(), 50);
28      }
29      return;
30    }
31    getChild() {
32      var $el = this.$element;
33      if (!this.$element.hasClass('e-con') && !this.$element.hasClass('ui-borderanim-rotate_item') && !this.$element.hasClass('ui-borderanim-hover_item')) {
34        $el = elementorFrontend.config.experimentalFeatures.e_optimized_markup ? this.$element : this.$element.find('> .elementor-widget-container');
35      }
36      if (this.$element.hasClass('ui-borderanim-rotate_item') || this.$element.hasClass('ui-borderanim-hover_item')) {
37        const type = this.getWidgetType();
38        switch (type) {
39          case 'uicore-icon-list':
40            $el = this.$element.find('.ui-e-wrap');
41            break;
42          case 'uicore-advanced-post-carousel':
43          case 'uicore-advanced-post-grid':
44            $el = this.$element.find('.ui-e-item > article');
45            break;
46          default:
47            $el = this.$element.find('.ui-e-wrap');
48        }
49      }
50      return $el;
51    }
52    setVariables() {
53      //check if element has the class that defines the animation or the item aniamtion
54      if (!this.$element.hasClass('ui-borderanim-rotate') && !this.$element.hasClass('ui-borderanim-hover') && !this.$element.hasClass('ui-borderanim-rotate_item') && !this.$element.hasClass('ui-borderanim-hover_item')) {
55        return;
56      }
57      var $el = this.getChild();
58      $el.css('border-style', '');
59      $el.css('border-color', '');
60      $el.css('border-width', '');
61      let _this = this;
62      var delay = 0;
63      if (elementorFrontend.isEditMode()) {
64        delay = 5;
65      }
66      setTimeout(() => {
67        var $el = this.getChild();
68
69        // There's no child when animating widgets directly
70        if (!$el.length) {
71          $el = this.$element;
72        }
73        var borderWidthTop = Math.ceil(parseFloat($el.css('border-top-width').replace('px', ''))) + "px";
74        var borderWidthRight = Math.ceil(parseFloat($el.css('border-right-width').replace('px', ''))) + "px";
75        var borderWidthBottom = Math.ceil(parseFloat($el.css('border-bottom-width').replace('px', ''))) + "px";
76        var borderWidthLeft = Math.ceil(parseFloat($el.css('border-left-width').replace('px', ''))) + "px";
77        var borderRadius = $el.css('border-radius');
78        var bordercolor = $el.css('border-color');
79        if (_this.$element.hasClass('ui-borderanim-hover') || _this.$element.hasClass('ui-borderanim-hover_item')) {
80          if (!_this.$element.hasClass('e-con')) {
81            $el.css('border-color', 'transparent');
82          }
83          $el.css('z-index', 2);
84          $el.css('position', 'relative');
85          $el.css('margin', `${-borderWidthTop} ${-borderWidthRight} ${-borderWidthBottom} ${-borderWidthLeft}`);
86          //set position relative on parent (for before and after element to work properly)
87          $el.parent().css('position', 'relative');
88          if (_this.$element.hasClass('ui-borderanim-hover_item')) {
89            $el.css('border-width', 0); //remove border from item because the background is set on a child and this will make the border duble
90          }
91          _this.initHoverAnimation();
92        }
93        if (_this.$element.hasClass('ui-borderanim-rotate_item')) {
94          $el.css('border-style', 'none');
95        }
96
97        //set them to after element
98        _this.$element.css('--ui-borderanim-width-top', borderWidthTop);
99        _this.$element.css('--ui-borderanim-width-right', borderWidthRight);
100        _this.$element.css('--ui-borderanim-width-bottom', borderWidthBottom);
101        _this.$element.css('--ui-borderanim-width-left', borderWidthLeft);
102        _this.$element.css('--ui-borderanim-radius', borderRadius);
103        _this.$element.css('--ui-borderanim-basecolor', bordercolor);
104      }, delay);
105    }
106    initHoverAnimation() {
107      //add handler but make sure is only added once
108      if (window.innerWidth < 768 || window.uicore_hover_animation) {
109        return;
110      }
111      document.addEventListener("mousemove", $event => {
112        window.uicore_hover_animation = true;
113        const proximity = 200;
114        const hoverElements = [...jQuery(".ui-borderanim-hover"), ...this.getChild().parent()];

115        hoverElements.forEach(element => {
116          const rect = element.getBoundingClientRect();
117          const x = $event.clientX - rect.left;
118          const y = $event.clientY - rect.top;
119          const distanceX = Math.max(0, Math.abs(x) - rect.width);
120          const distanceY = Math.max(0, Math.abs(y) - rect.height);
121          const distance = Math.sqrt(distanceX ** 2 + distanceY ** 2);
122          if (distance < proximity) {
123            element.style.setProperty("--xPos", `${x}px`);
124            element.style.setProperty("--yPos", `${y}px`);
125            element.style.setProperty("--proximity", `${1 - distance / proximity}`);
126          } else {
127            element.style.setProperty("--proximity", `0`);
128          }
129        });
130      });
131    }
132  }
133  jQuery(window).on('elementor/frontend/init', () => {
134    const addHandler = $element => {
135      elementorFrontend.elementsHandler.addHandler(animatedBorder, {
136        $element
137      });
138    };
139    elementorFrontend.hooks.addAction('frontend/element_ready/global', addHandler);
140    elementorFrontend.hooks.addAction('frontend/element_ready/section', addHandler);
141    elementorFrontend.hooks.addAction('frontend/element_ready/container', addHandler);
142  });
143}, false);