← All changes | includes/features/Floating_Animation/preview-handler.js +46 -0 51.1.2 → 51.1.83 View file →

		@@ -1,0 +1,46 @@
	1	+"use strict";
	2	+(function ($) {
	3	+ $(window).on('elementor/frontend/init', function () {
	4	+ let KngFloatingAnimationHandler = elementorModules.frontend.handlers.Base.extend({
	5	+ onInit: function onInit() {
	6	+ if (this.$element.hasClass('kng-floating-animation-yes')) {
	7	+ this.applyKngFloatingAnimation();
	8	+ }
	9	+ },
	10	+ getReadySettings: function getReadySettings() {
	11	+ let settings = {
	12	+ animation_value_X: this.getElementSettings('kng_floating_animation_value_X'),
	13	+ animation_value: this.getElementSettings('kng_floating_animation_value'),
	14	+ animation_duration: this.getElementSettings('kng_floating_animation_duration'),
	15	+ animation_delay: this.getElementSettings('kng_floating_animation_delay')
	16	+ };
	17	+ return $.extend({}, settings);
	18	+ },
	19	+ onElementChange: function onElementChange() {
	20	+ if (this.$element.hasClass('kng-floating-animation-yes')) {
	21	+ if (!this.$element.hasClass('kng-style-floating-animation-applied')) {
	22	+ this.applyKngFloatingAnimation();
	23	+ }
	24	+ }
	25	+ },
	26	+ applyKngFloatingAnimation: function applyKngFloatingAnimation() {
	27	+ let options = this.getReadySettings();
	28	+ let element_ID = this.$element.data('id');
	29	+ $('.kng-style-floating-animation-' + element_ID).remove();
	30	+ this.$element.addClass('kng-style-floating-animation-applied');
	31	+ this.$element.before('<style class="kng-style-floating-animation-' + element_ID + '">' +
	32	+ '@keyframes floating-animation-' + element_ID + ' {0% {transform: translate(0, 0);} 50% {transform: translate(' + options.animation_value_X + 'px, ' + options.animation_value + 'px);} 100% {transform: translate(0, 0);}} ' +
	33	+ '.elementor-element-' + element_ID + '.kng-floating-animation-yes {animation: floating-animation-' + element_ID + ' ' + options.animation_duration + 'ms ease-in-out infinite;' +
	34	+ 'animation-delay:' + options.animation_delay + 'ms;}' +
	35	+ '</style>');
	36	+ }
	37	+ });
	38	+
	39	+ elementorFrontend.hooks.addAction('frontend/element_ready/global', function ($scope) {
	40	+ elementorFrontend.elementsHandler.addHandler(KngFloatingAnimationHandler, {
	41	+ $element: $scope
	42	+ });
	43	+ });
	44	+
	45	+ });
	46	+})(jQuery);