Viewing File: /home/maglabs/etascom/wp-content/themes/agenzio/elements/widgets/js/elementor.js
( function( $ ) {
"use strict";
function agenzio_section_start_render(){
var _elementor = typeof elementor != 'undefined' ? elementor : elementorFrontend;
_elementor.hooks.addFilter( 'pxl_section_start_render', function( html, settings, el ) {
if(typeof settings.pxl_parallax_bg_img != 'undefined' && settings.pxl_parallax_bg_img.url != ''){
html += '<div class="pxl-section-bg-parallax"></div>';
}
if(typeof settings.pxl_color_offset != 'undefined' && settings.pxl_color_offset != 'none'){
html += '<div class="pxl-section-overlay-color"></div>';
}
if(typeof settings.pxl_overlay_img != 'undefined' && settings.pxl_overlay_img.url != ''){
html += '<div class="pxl-overlay--image pxl-overlay--imageLeft"><div class="bg-image"></div></div>';
}
if(typeof settings.pxl_overlay_img2 != 'undefined' && settings.pxl_overlay_img2.url != ''){
html += '<div class="pxl-overlay--image pxl-overlay--imageRight"><div class="bg-image"></div></div>';
}
return html;
} );
$('.pxl-section-bg-parallax').parent('.elementor-element').addClass('pxl-section-parallax-overflow');
}
function agenzio_column_before_render(){
var _elementor = typeof elementor != 'undefined' ? elementor : elementorFrontend;
_elementor.hooks.addFilter( 'pxl-custom-column/before-render', function( html, settings, el ) {
if(typeof settings.pxl_column_parallax_bg_img != 'undefined' && settings.pxl_column_parallax_bg_img.url != ''){
html += '<div class="pxl-column-bg-parallax"></div>';
}
return html;
} );
}
function agenzio_css_inline_js(){
var _inline_css = "<style>";
$(document).find('.pxl-inline-css').each(function () {
var _this = $(this);
_inline_css += _this.attr("data-css") + " ";
_this.remove();
});
_inline_css += "</style>";
$('head').append(_inline_css);
}
function agenzio_section_before_render(){
var _elementor = typeof elementor != 'undefined' ? elementor : elementorFrontend;
_elementor.hooks.addFilter( 'pxl-custom-section/before-render', function( html, settings, el ) {
if (typeof settings['row_divider'] !== 'undefined') {
if(settings['row_divider'] == 'angle-top' || settings['row_divider'] == 'angle-bottom' || settings['row_divider'] == 'angle-top-right' || settings['row_divider'] == 'angle-bottom-left') {
html = '<svg class="pxl-row-angle" style="fill:#ffffff" xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 100 100" version="1.1" preserveAspectRatio="none" height="130px"><path stroke="" stroke-width="0" d="M0 100 L100 0 L200 100"></path></svg>';
return html;
}
if(settings['row_divider'] == 'angle-top-bottom' || settings['row_divider'] == 'angle-top-bottom-left') {
html = '<svg class="pxl-row-angle pxl-row-angle-top" style="fill:#ffffff" xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 100 100" version="1.1" preserveAspectRatio="none" height="130px"><path stroke="" stroke-width="0" d="M0 100 L100 0 L200 100"></path></svg><svg class="pxl-row-angle pxl-row-angle-bottom" style="fill:#ffffff" xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 100 100" version="1.1" preserveAspectRatio="none" height="130px"><path stroke="" stroke-width="0" d="M0 100 L100 0 L200 100"></path></svg>';
return html;
}
if(settings['row_divider'] == 'wave-animation-top' || settings['row_divider'] == 'wave-animation-bottom') {
html = '<svg class="pxl-row-angle" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 1440 150" fill="#fff"><path d="M 0 26.1978 C 275.76 83.8152 430.707 65.0509 716.279 25.6386 C 930.422 -3.86123 1210.32 -3.98357 1439 9.18045 C 2072.34 45.9691 2201.93 62.4429 2560 26.198 V 172.199 L 0 172.199 V 26.1978 Z"><animate repeatCount="indefinite" fill="freeze" attributeName="d" dur="10s" values="M0 25.9086C277 84.5821 433 65.736 720 25.9086C934.818 -3.9019 1214.06 -5.23669 1442 8.06597C2079 45.2421 2208 63.5007 2560 25.9088V171.91L0 171.91V25.9086Z; M0 86.3149C316 86.315 444 159.155 884 51.1554C1324 -56.8446 1320.29 34.1214 1538 70.4063C1814 116.407 2156 188.408 2560 86.315V232.317L0 232.316V86.3149Z; M0 53.6584C158 11.0001 213 0 363 0C513 0 855.555 115.001 1154 115.001C1440 115.001 1626 -38.0004 2560 53.6585V199.66L0 199.66V53.6584Z; M0 25.9086C277 84.5821 433 65.736 720 25.9086C934.818 -3.9019 1214.06 -5.23669 1442 8.06597C2079 45.2421 2208 63.5007 2560 25.9088V171.91L0 171.91V25.9086Z"></animate></path></svg>';
return html;
}
if(settings['row_divider'] == 'curved-top' || settings['row_divider'] == 'curved-bottom') {
html = '<svg class="pxl-row-angle" xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 1920 128" version="1.1" preserveAspectRatio="none" style="fill:#ffffff"><path stroke-width="0" d="M-1,126a3693.886,3693.886,0,0,1,1921,2.125V-192H-7Z"></path></svg>';
return html;
}
}
} );
}
var PXL_Icon_Contact_Form = function( $scope, $ ) {
setTimeout(function () {
$('.pxl--item').each(function () {
var icon_input = $(this).find(".pxl--form-icon"),
control_wrap = $(this).find('.wpcf7-form-control');
control_wrap.before(icon_input.clone());
icon_input.remove();
});
}, 10);
};
function agenzioWidgetTextImage($scope) {
if($scope.find('.pxl-text-img-wrap').length <= 0) return;
var mouseX = 0,
mouseY = 0;
$scope.find('.pxl-text-img-wrap .pxl-item--inner').mousemove(function(e){
var offset = $(this).offset();
mouseX = (e.pageX - offset.left);
mouseY = (e.pageY - offset.top);
});
$scope.find('.pxl-text-img-wrap ul>li').on("mouseenter", function() {
$(this).removeClass('deactive').addClass('active');
var target = $(this).attr('data-target');
$(this).closest('.pxl-item--inner').find(target).removeClass('deactive').addClass('active');
});
$scope.find('.pxl-text-img-wrap ul>li').on("mouseleave", function() {
$(this).addClass('deactive').removeClass('active');
var target = $(this).attr('data-target');
$(this).closest('.pxl-item--inner').find(target).addClass('deactive').removeClass('active');
});
const s = {
x: window.innerWidth / 2,
y: window.innerHeight / 2
},
t = gsap.quickSetter($scope.find('.pxl-text-img-wrap .pxl-item--inner'), "css"),
e = gsap.quickSetter($scope.find('.pxl-text-img-wrap .pxl-item--inner'), "css");
gsap.ticker.add((() => {
const o = .15,
i = 1 - Math.pow(.85, gsap.ticker.deltaRatio());
s.x += (mouseX - s.x) * i,
s.y += (mouseY - s.y) * i,
t({
"--pxl-mouse-x": `${s.x}px`
}), e({
"--pxl-mouse-y": `${s.y}px`
})
}))
}
function agenzio_split_text($scope){
setTimeout(function () {
var st = $scope.find(".pxl-split-text");
if(st.length == 0) return;
gsap.registerPlugin(SplitText);
st.each(function(index, el) {
el.split = new SplitText(el, {
type: "lines,words,chars",
linesClass: "split-line"
});
gsap.set(el, { perspective: 400 });
if( $(el).hasClass('split-in-fade') ){
gsap.set(el.split.chars, {
opacity: 0,
ease: "Back.easeOut",
});
}
if( $(el).hasClass('split-in-right') ){
gsap.set(el.split.chars, {
opacity: 0,
x: "50",
ease: "Back.easeOut",
});
}
if( $(el).hasClass('split-in-left') ){
gsap.set(el.split.chars, {
opacity: 0,
x: "-50",
ease: "circ.out",
});
}
if( $(el).hasClass('split-in-up') ){
gsap.set(el.split.chars, {
opacity: 0,
y: "80",
ease: "circ.out",
});
}
if( $(el).hasClass('split-in-down') ){
gsap.set(el.split.chars, {
opacity: 0,
y: "-80",
ease: "circ.out",
});
}
if( $(el).hasClass('split-in-rotate') ){
gsap.set(el.split.chars, {
opacity: 0,
rotateX: "50deg",
ease: "circ.out",
});
}
if( $(el).hasClass('split-in-scale') ){
gsap.set(el.split.chars, {
opacity: 0,
scale: "0.5",
ease: "circ.out",
});
}
el.anim = gsap.to(el.split.chars, {
scrollTrigger: {
trigger: el,
toggleActions: "restart pause resume reverse",
start: "top 90%",
},
x: "0",
y: "0",
rotateX: "0",
scale: 1,
opacity: 1,
duration: 0.8,
stagger: 0.02,
});
});
}, 200);
}
function agenzio_clip_left($scope) {
let revealContainers = document.querySelectorAll(".pxl-clip-left");
revealContainers.forEach((container) => {
let image = container.querySelector("img");
let tb = gsap.timeline({
scrollTrigger: {
trigger: container,
toggleActions: "play none none reverse",
start: "top 150%",
end: "bottom 150%",
scrub: 0.5,
}
});
gsap.set(container, { x: "30px", clipPath: "inset(0 100% 0 0)" });
gsap.set(image, { x: "30px", clipPath: "inset(0 100% 0 0)" });
tb.to(container, {
x: "0px",
clipPath: "inset(0 0 0 0)",
ease: "power4.out",
duration: 1.5
});
tb.to(image, {
x: "0px",
clipPath: "inset(0 0 0 0)",
ease: "power4.out",
duration: 1.5
}, "-=1");
});
}
function agenzio_transform_left($scope) {
setTimeout(function () {
let revealContainers = document.querySelectorAll(".pxl-transform-left");
revealContainers.forEach((container) => {
let image = container.querySelector("img");
let tb = gsap.timeline({
scrollTrigger: {
trigger: container,
toggleActions: "restart none none reset",
start: "top 130%",
end: "bottom 70%",
scrub: 1,
}
});
gsap.set(container, { x: "-100px", rotationY: "25deg" });
gsap.set(image, { x: "-100px", rotationY: "25deg" });
tb.to(container, {
x: "0px",
rotationY: "0deg",
ease: Power4.out,
duration: 1.5
});
tb.to(image, {
x: "0px",
rotationY: "0deg",
ease: Power4.out,
duration: 1.5
}, "-=1"); //
});
}, 100);
}
function agenzio_transform_right($scope) {
setTimeout(function () {
let revealContainers = document.querySelectorAll(".pxl-transform-right");
revealContainers.forEach((container) => {
let image = container.querySelector("img");
let tb = gsap.timeline({
scrollTrigger: {
trigger: container,
toggleActions: "restart none none reset",
start: "top 95%",
end: "bottom 70%",
scrub: true,
}
});
gsap.set(container, { x: "130px", rotationY: "-25deg" });
gsap.set(image, { x: "130px", rotationY: "-25deg" });
tb.to(container, {
x: "0px",
rotationY: "0deg",
ease: Power4.out,
duration: 1.5
});
tb.to(image, {
x: "0px",
rotationY: "0deg",
ease: Power4.out,
duration: 1.5
}, "-=1"); //
});
}, 100);
}
function agenzio_parallax_scale($scope) {
setTimeout(function () {
let revealContainers = document.querySelectorAll(".parallax-scale");
revealContainers.forEach((container) => {
let image = container.querySelector("img");
let tb = gsap.timeline({
scrollTrigger: {
trigger: container,
toggleActions: "restart none none reset",
start: "top 95%",
end: "bottom 70%",
scrub: true,
}
});
gsap.set(container, { x: "0px", rotationY: "0" });
gsap.set(image, { x: "0px", rotationY: "0" });
tb.to(container, {
x: "-21px",
rotationY: "-27deg",
ease: Power4.out,
duration: 1.5
});
tb.to(image, {
x: "-21px",
rotationY: "-27deg",
ease: Power4.out,
duration: 1.5
}, "-=1"); //
});
}, 100);
}
function agenzio_zoom_point(){
elementorFrontend.waypoint($(document).find('.pxl-zoom-point'), function () {
var offset = $(this).offset();
var offset_top = offset.top;
var scroll_top = $(window).scrollTop();
}, {
offset: -100,
triggerOnce: true
});
}
function agenzio_scroll_fixed_section(){
if($('.pxl-section-fix-top').length > 0) {
ScrollTrigger.matchMedia({
"(min-width: 991px)": function() {
const pinnedSections = ['.pxl-section-fix-top'];
pinnedSections.forEach(className => {
gsap.to(".pxl-section-fix-bottom", {
scrollTrigger: {
trigger: ".pxl-section-fix-bottom",
scrub: true,
pin: className,
pinSpacing: false,
start: 'top bottom',
end: "bottom top",
},
});
});
}
});
}
}
function agenzio_item_marquee($scope){
const logos = $scope.find('.pxl-item--marquee');
gsap.set(logos, { autoAlpha: 1 })
logos.each(function(index, el) {
gsap.set(el, { xPercent: 100 * index });
});
if (logos.length > 2) {
const logosWrap = gsap.utils.wrap(-100, ((logos.length - 1) * 100));
const durationNumber = logos.data('duration');
const slipType = logos.data('slip-type');
var slipResult = `-=${logos.length * 100}`;
if(slipType == 'right') {
slipResult = `+=${logos.length * 100}`;
}
gsap.to(logos, {
xPercent: slipResult,
duration: durationNumber,
repeat: -1,
ease: 'none',
modifiers: {
xPercent: xPercent => logosWrap(parseFloat(xPercent))
}
});
}
}
function agenzio_text_marquee($scope){
const text_marquee = $scope.find('.pxl-text--marquee');
const boxes = gsap.utils.toArray(text_marquee);
const loop = text_horizontalLoop(boxes, {paused: false,repeat: -1,});
function text_horizontalLoop(items, config) {
items = gsap.utils.toArray(items);
config = config || {};
let tl = gsap.timeline({repeat: config.repeat, paused: config.paused, defaults: {ease: "none"}, onReverseComplete: () => tl.totalTime(tl.rawTime() + tl.duration() * 100)}),
length = items.length,
startX = items[0].offsetLeft,
times = [],
widths = [],
xPercents = [],
curIndex = 0,
pixelsPerSecond = (config.speed || 1) * 100,
snap = config.snap === false ? v => v : gsap.utils.snap(config.snap || 1),
totalWidth, curX, distanceToStart, distanceToLoop, item, i;
gsap.set(items, {
xPercent: (i, el) => {
let w = widths[i] = parseFloat(gsap.getProperty(el, "width", "px"));
xPercents[i] = snap(parseFloat(gsap.getProperty(el, "x", "px")) / w * 100 + gsap.getProperty(el, "xPercent"));
return xPercents[i];
}
});
gsap.set(items, {x: 0});
totalWidth = items[length-1].offsetLeft + xPercents[length-1] / 100 * widths[length-1] - startX + items[length-1].offsetWidth * gsap.getProperty(items[length-1], "scaleX") + (parseFloat(config.paddingRight) || 0);
for (i = 0; i < length; i++) {
item = items[i];
curX = xPercents[i] / 100 * widths[i];
distanceToStart = item.offsetLeft + curX - startX;
distanceToLoop = distanceToStart + widths[i] * gsap.getProperty(item, "scaleX");
tl.to(item, {xPercent: snap((curX - distanceToLoop) / widths[i] * 100), duration: distanceToLoop / pixelsPerSecond}, 0)
.fromTo(item, {xPercent: snap((curX - distanceToLoop + totalWidth) / widths[i] * 100)}, {xPercent: xPercents[i], duration: (curX - distanceToLoop + totalWidth - curX) / pixelsPerSecond, immediateRender: false}, distanceToLoop / pixelsPerSecond)
.add("label" + i, distanceToStart / pixelsPerSecond);
times[i] = distanceToStart / pixelsPerSecond;
}
function toIndex(index, vars) {
vars = vars || {};
(Math.abs(index - curIndex) > length / 2) && (index += index > curIndex ? -length : length);
let newIndex = gsap.utils.wrap(0, length, index),
time = times[newIndex];
if (time > tl.time() !== index > curIndex) {
vars.modifiers = {time: gsap.utils.wrap(0, tl.duration())};
time += tl.duration() * (index > curIndex ? 1 : -1);
}
curIndex = newIndex;
vars.overwrite = true;
return tl.tweenTo(time, vars);
}
tl.next = vars => toIndex(curIndex+1, vars);
tl.previous = vars => toIndex(curIndex-1, vars);
tl.current = () => curIndex;
tl.toIndex = (index, vars) => toIndex(index, vars);
tl.times = times;
tl.progress(1, true).progress(0, true);
if (config.reversed) {
tl.vars.onReverseComplete();
tl.reverse();
}
return tl;
}
}
function agenzio_split_scroll_color($scope) {
var revealContainers = document.querySelectorAll(".pxl-slip-text-color");
if (revealContainers.length === 0) return;
gsap.registerPlugin(ScrollTrigger, SplitText);
revealContainers.forEach((container) => {
var text = new SplitText(container, { type: 'words, chars' });
gsap.fromTo(text.chars,
{
position: 'relative',
display: 'inline-block',
opacity: 0.2,
x: -5,
},
{
opacity: 1,
x: 0,
stagger: 0.1,
scrollTrigger: {
trigger: container,
toggleActions: "play pause reverse pause",
start: "top 100%",
end: "top 40%",
scrub: 0.2,
}
}
);
});
}
$( window ).on( 'elementor/frontend/init', function() {
agenzio_section_start_render();
agenzio_column_before_render();
agenzio_css_inline_js();
agenzio_section_before_render();
agenzio_zoom_point();
agenzio_scroll_fixed_section();
agenzio_transform_left();
agenzio_transform_right();
agenzio_clip_left();
agenzio_parallax_scale();
agenzio_split_scroll_color();
elementorFrontend.hooks.addAction( 'frontend/element_ready/pxl_contact_form.default', PXL_Icon_Contact_Form );
elementorFrontend.hooks.addAction( 'frontend/element_ready/pxl_heading.default', function( $scope ) {
agenzio_split_text($scope);
} );
elementorFrontend.hooks.addAction( 'frontend/element_ready/pxl_logo_marquee.default', function( $scope ) {
agenzio_item_marquee($scope);
} );
elementorFrontend.hooks.addAction( 'frontend/element_ready/pxl_text_marquee.default', function( $scope ) {
agenzio_text_marquee($scope);
} );
elementorFrontend.hooks.addAction( 'frontend/element_ready/pxl_post_slip.default', function( $scope ) {
agenzio_text_marquee($scope);
} );
elementorFrontend.hooks.addAction( 'frontend/element_ready/pxl_text_carousel.default', function( $scope ) {
agenzio_item_marquee($scope);
} );
elementorFrontend.hooks.addAction( 'frontend/element_ready/pxl_post_slip.default', function( $scope ) {
agenzio_split_text($scope);
} );
elementorFrontend.hooks.addAction( 'frontend/element_ready/pxl_image_marquee.default', function( $scope ) {
agenzio_split_text($scope);
} );
elementorFrontend.hooks.addAction( 'frontend/element_ready/pxl_testimonial_marquee.default', function( $scope ) {
agenzio_split_text($scope);
} );
elementorFrontend.hooks.addAction( 'frontend/element_ready/pxl_list_box.default', function( $scope ) {
agenzioWidgetTextImage($scope);
} );
} );
} )( jQuery );
Back to Directory
File Manager