https://kreyon.md/wp-content/plugins/dethemekit-for-elementor/incl…/de_curtain_animation.preview.js?ver=7.1.3

1class DeCurtainAnimationHandlerClass extends elementorModules.frontend.handlers.Base {
2    getDefaultSettings() {
3        return {
4            selectors: {
5                wrapper: '.de_curtain_animation_yes',
6                revealer__content: '.block-revealer__content',
7                revealer__element: '.block-revealer__element',
8                widget_container: '.elementor-widget-container',
9            },
10        };
11    }
12
13    getDefaultElements() {
14        const selectors = this.getSettings( 'selectors' );
15        return {
16            $wrapper: this.$element.find( selectors.wrapper ),
17            $revealer__content: this.$element.find( selectors.revealer__content ),
18            $revealer__element: this.$element.find( selectors.revealer__element ),
19            $widget_container: this.$element.find( selectors.widget_container ),
20        };
21    }
22
23    do_animation(elem) {
24        var attributeValue = elem.context.attributes['class'].nodeValue;
25                    
26        var $arr_classes = attributeValue.split(' ')
27
28        var do_animation = false, editMode = false, $id, $duration = '900', $color = '#000000', $direction = 'lr', $easing = 'linear'
29    
30        jQuery.each($arr_classes, (index, value) => {
31            if ( value.search('de_curtain_animation_yes') === 0 ) {
32                do_animation = true;
33            }
34
35            if ( value.search('elementor-element-edit-mode') === 0 ) {
36                editMode = true;
37            }
38
39            if ( value.length === 25 && value.search('elementor-element-') === 0 ) {
40                $id = value.replace('elementor-element-','')
41                }
42                
43            if ( value.search('de_curtain_duration_') === 0 ) {
44            $duration = value.replace('de_curtain_duration_','')
45            }
46    
47            if ( value.search('de_curtain_color_') === 0 ) {
48            $color = value.replace('de_curtain_color_','')
49            }
50    
51            if ( value.search('de_curtain_direction_') === 0 ) {
52            $direction = value.replace('de_curtain_direction_','')
53            }
54    
55            if ( value.search('de_curtain_easing_') === 0 ) {
56            $easing = value.replace('de_curtain_easing_','')
57            }
58        })
59
60        if (do_animation) {
61            // console.log('do animation');
62            var elementSelector = document.querySelector(".elementor-element-" + $id + " .elementor-widget-container");       
63
64            if (!editMode) {
65                var watcher = scrollMonitor.create(elementSelector, 0)
66                var revealer = new RevealFx(elementSelector);
67
68                watcher.enterViewport(function() {
69                    revealer.reveal({
70                        bgcolor: $color,
71                        duration: $duration,
72                        direction: $direction,
73                        easing: $easing,
74                        onStart: function(contentEl, revealerEl) { contentEl.style.opacity = 0; },
75                        onCover: function(contentEl, revealerEl) { contentEl.style.opacity = 1; },
76                        onComplete: function(contentEl, revealerEl) { contentEl.style.opacity = 1; },
77                    });              
78                    watcher.destroy();
79                });
80
81            } else {
82                var revealer = new RevealFx(elementSelector);
83
84                revealer.reveal({
85                    bgcolor: $color,
86                    duration: $duration,
87                    direction: $direction,
88                    easing: $easing,
89                    onStart: function(contentEl, revealerEl) { contentEl.style.opacity = 0; },
90                    onCover: function(contentEl, revealerEl) { contentEl.style.opacity = 1; },
91                    onComplete: function(contentEl, revealerEl) { contentEl.style.opacity = 1; },
92                });
93            }              
94        }
95    }
96
97    onInit() {
98        var observer = new MutationObserver(function(mutations) {
99            mutations.forEach(function(mutation) {
100                if (mutation.attributeName === "class") {
101                    var attributeValue = $(mutation.target).prop(mutation.attributeName);
102                    
103                    var $arr_classes = attributeValue.split(' ')
104
105                    var do_animation = false, $id, $duration = '900', $color = '#000000', $direction = 'lr', $easing = 'linear'
106              
107                    jQuery.each($arr_classes, (index, value) => {
108                        if ( value.search('de_curtain_animation_yes') === 0 ) {
109                            do_animation = true;
110                        }
111
112                        if ( value.length === 25 && value.search('elementor-element-') === 0 ) {
113                            $id = value.replace('elementor-element-','')
114                          }
115                            
116                      if ( value.search('de_curtain_duration_') === 0 ) {
117                        $duration = value.replace('de_curtain_duration_','')
118                      }
119              
120                      if ( value.search('de_curtain_color_') === 0 ) {
121                        $color = value.replace('de_curtain_color_','')
122                      }
123              
124                      if ( value.search('de_curtain_direction_') === 0 ) {
125                        $direction = value.replace('de_curtain_direction_','')
126                      }
127              
128                      if ( value.search('de_curtain_easing_') === 0 ) {
129                        $easing = value.replace('de_curtain_easing_','')
130                      }
131                    })
132
133                    if (do_animation) {
134                        // console.log('do animation');
135                        var elementSelector = document.querySelector(".elementor-element-" + $id + " .elementor-widget-container"); 
136                        
137                        var revealer = new RevealFx(elementSelector);
138
139                        revealer.reveal({
140                            bgcolor: $color,
141                            duration: $duration,
142                            direction: $direction,
143                            easing: $easing,
144                            onStart: function(contentEl, revealerEl) { contentEl.style.opacity = 0; },
145                            onCover: function(contentEl, revealerEl) { contentEl.style.opacity = 1; },
146                            onComplete: function(contentEl, revealerEl) { contentEl.style.opacity = 1; },
147                        });              
148                    }
149                }
150            });
151        });
152
153        if (this.$element) {
154            var elementId = this.$element.context.attributes['data-id'].nodeValue;
155            var elementSelector = document.querySelector("[data-id='" + elementId + "']");
156            if (elementSelector) {
157                observer.observe(elementSelector, {
158                    attributes: true
159                });
160
161                this.do_animation(this.$element);
162            }
163        }
164    }
165
166    bindEvents() {
167    }
168}
169
170jQuery( window ).on( 'elementor/frontend/init', () => {
171  const addHandler = ( $element ) => {
172    elementorFrontend.elementsHandler.addHandler( DeCurtainAnimationHandlerClass, {
173      $element,
174    } );
175  };
176
177  elementorFrontend.hooks.addAction( 'frontend/element_ready/global', addHandler );
178} );