@google-psat/cli 0.14.1 → 1.2.1

package/dist/assets/amp/custom-scripts/amp-player-main.js

@@ -1 +1 @@
-let stateObject={cards:null,cardMargin:null,cardWidth:null,player:null,lightboxEl:null,maxScroll:null,scaleVal:1,scalingDown:!1,deltaY:0,doesHaveMorePages:!1,previousStories:[],loadStoriesOnScroll:!0};function setPlayer(e){stateObject.player=e}function setLightbox(e){stateObject.lightboxEl=e}function setCards(e){stateObject.cards=e}function setCardWidth(e){stateObject.cardWidth=e}function setCardMargin(e){stateObject.cardMargin=e}function initializeArrows(){try{const e=document.querySelector(".carousel-cards-container"),t=parseFloat(getComputedStyle(e.firstElementChild).paddingLeft)+parseFloat(getComputedStyle(e.firstElementChild).paddingRight);stateObject.maxScroll=e.offsetWidth-t+stateObject.cardMargin-stateObject.cards.length*stateObject.cardWidth,stateObject.maxScroll<0&&document.querySelector(".carousel-container").classList.add("overflow-right")}catch(e){}}function closePlayer(){const e=new CustomEvent("webStoriesLightBoxEvent",{detail:{storyOpened:!1}});window.parent.document.dispatchEvent(e),stateObject.player.pause(),stateObject.player.rewind(),document.body.classList.remove("lightbox-open"),stateObject.lightboxEl.classList.add("closed"),stateObject.cards.forEach((e=>e.classList.remove("hidden")))}function animateScale(e){e<1&&scalingDown&&(stateObject.scaleVal=lerp(easeOutQuad(e),1,.95),stateObject.lightboxEl.style.transform=`translate3d(0px, ${Math.pow(-deltaY,.6)}px, 0) scale3d(${scaleVal}, ${scaleVal}, 1)`,requestAnimationFrame((()=>animateScale(e+.05))))}function resetStyles(){stateObject.scalingDown=!1,stateObject.scaleVal=1,stateObject.lightboxEl.style.transform="translate3d(0, 0, 0) scale3d(1, 1, 1)"}function initializeCards(){try{setCards(document.querySelectorAll(".entry-point-card-container")),setCardMargin(parseFloat(getComputedStyle(stateObject.cards[0]).marginRight)),setCardWidth(stateObject.cardMargin+stateObject.cards[0].offsetWidth),stateObject.cards.forEach((e=>{e.addEventListener("click",(()=>{const t=new CustomEvent("webStoriesLightBoxEvent",{detail:{storyOpened:!0}});window.parent.document.dispatchEvent(t),stateObject.player.show(e.dataset.storyUrl,null,{animate:!1}),document.body.classList.add("lightbox-open"),stateObject.lightboxEl.classList.remove("closed"),e.classList.add("hidden"),resetStyles(),stateObject.player.play()}))}))}catch(e){}}function initializeCarousel(){setLightbox(document.body.querySelector(".lightbox")),initializeCards(),initializeArrows();const e=new CustomEvent("iframeLoaded");window.parent.document.dispatchEvent(e),stateObject.player.addEventListener("amp-story-player-close",closePlayer)}function init(){setPlayer(document.body.querySelector("amp-story-player")),stateObject.previousStories=[],stateObject.player.isReady?initializeCarousel():stateObject.player.addEventListener("ready",initializeCarousel)}function lerp(e,t,n){return t*(1-e)+n*e}function easeOutQuad(e){return--e*e*e+1}const sendEventToParent=()=>{const e=new CustomEvent("loadMoreData");window.parent.document.dispatchEvent(e)};function scrollListener(){Math.ceil(window.scrollY+window.innerHeight)>document.documentElement.scrollHeight&&!document.body.classList.contains("lightbox-open")&&stateObject.loadStoriesOnScroll&&sendEventToParent(),window.scrollY>0&&!stateObject.doesHaveMorePages&&(document.getElementById("show-more-indicator").style.display="block",document.getElementById("show-more-indicator").style.rotate="180deg",document.getElementById("show-more-indicator").onclick=()=>{document.body.scrollIntoView({behavior:"smooth"})}),0!==window.scrollY||stateObject.doesHaveMorePages||(document.getElementById("show-more-indicator").style.display="none")}const getCardHTML=({heroImage:e,publisherLogo:t,storyTitle:n,storyUrl:a,shouldPublisherLogo:o})=>`\n    <div class="entry-point-card-container" data-story-url="${a}">\n      <div class="background-cards">\n        <div class="background-card-1"></div>\n        <div class="background-card-2"></div>\n      </div>\n      <img src="${e}" class="entry-point-card-img" alt="A cat">\n     ${o?` <div class="author-container">\n        <div class="logo-container">\n            <div class="logo-ring"></div>\n            <img class="entry-point-card-logo" src="${t}" alt="Publisher logo">\n        </div>\n      </div>`:""}\n      <div class="card-headline-container">\n          <span class="entry-point-card-headline"> ${n} </span>\n      </div>\n    </div>\n    `,messageListener=({data:{story:e,doesHaveMorePages:t}})=>{try{if(!e)return;const n=e?.map((e=>getCardHTML({...e,shouldPublisherLogo:!1}))).join(""),a=e?.map((({storyUrl:e})=>({href:e})));if(JSON.stringify(e)===JSON.stringify(stateObject.previousStories))return;document.getElementById("entry-points").innerHTML=n;const o=stateObject.previousStories.length;stateObject.previousStories=e,stateObject.player.add(a),initializeCards(),initializeArrows(),stateObject.doesHaveMorePages=t;const s=calculateDistanceBetweenLastItemAndBox();document.getElementById("show-more-indicator").style.left=`calc(100% - ${s/2}px)`,stateObject.doesHaveMorePages?(window.scrollTo({top:0,left:0}),document.getElementById("show-more-indicator").classList.add("bounce"),document.getElementById("show-more-indicator").onclick=()=>{stateObject.loadStoriesOnScroll=!1,sendEventToParent()},setTimeout((()=>{document.getElementById("show-more-indicator").classList.remove("bounce")}),2e3)):window.scrollY>0?document.getElementById("show-more-indicator").style.rotate="180deg":document.getElementById("show-more-indicator").style.display="none";const r=()=>{stateObject.loadStoriesOnScroll=!0,stateObject.cards[o].removeEventListener("scrollend",r)};stateObject.cards[o].addEventListener("scrollend",r),stateObject.cards[o].scrollIntoView({behavior:"smooth"})}catch(e){}},calculateDistanceBetweenLastItemAndBox=()=>{const e=document.querySelector(".entry-points"),t=Array.from(e.children);let n=null,a=0;for(let e=0;e<t.length;e++){const o=t[e].getBoundingClientRect();if(0===e&&(a=o.bottom),!(o.bottom<=a))break;n=t[e]}const o=e.getBoundingClientRect();if(n){const e=n.getBoundingClientRect();return o.right-e.right+36}return null};window.addEventListener("load",init),window.addEventListener("scroll",scrollListener),window.addEventListener("message",messageListener);
+let stateObject={cards:null,cardMargin:null,cardWidth:null,player:null,lightboxEl:null,maxScroll:null,scaleVal:1,scalingDown:!1,deltaY:0,doesHaveMorePages:!1,previousStories:[],loadStoriesOnScroll:!0};function setPlayer(e){stateObject.player=e}function setLightbox(e){stateObject.lightboxEl=e}function setCards(e){stateObject.cards=e}function setCardWidth(e){stateObject.cardWidth=e}function setCardMargin(e){stateObject.cardMargin=e}function initializeArrows(){try{const e=document.querySelector(".carousel-cards-container"),t=parseFloat(getComputedStyle(e.firstElementChild).paddingLeft)+parseFloat(getComputedStyle(e.firstElementChild).paddingRight);stateObject.maxScroll=e.offsetWidth-t+stateObject.cardMargin-stateObject.cards.length*stateObject.cardWidth,stateObject.maxScroll<0&&document.querySelector(".carousel-container").classList.add("overflow-right")}catch(e){}}function closePlayer(){const e=new CustomEvent("webStoriesLightBoxEvent",{detail:{storyOpened:!1}});window.parent.document.dispatchEvent(e),stateObject.player.pause(),stateObject.player.rewind(),document.body.classList.remove("lightbox-open"),stateObject.lightboxEl.classList.add("closed"),stateObject.cards.forEach(e=>e.classList.remove("hidden"))}function animateScale(e){e<1&&scalingDown&&(stateObject.scaleVal=lerp(easeOutQuad(e),1,.95),stateObject.lightboxEl.style.transform=`translate3d(0px, ${Math.pow(-deltaY,.6)}px, 0) scale3d(${scaleVal}, ${scaleVal}, 1)`,requestAnimationFrame(()=>animateScale(e+.05)))}function resetStyles(){stateObject.scalingDown=!1,stateObject.scaleVal=1,stateObject.lightboxEl.style.transform="translate3d(0, 0, 0) scale3d(1, 1, 1)"}function initializeCards(){try{setCards(document.querySelectorAll(".entry-point-card-container")),setCardMargin(parseFloat(getComputedStyle(stateObject.cards[0]).marginRight)),setCardWidth(stateObject.cardMargin+stateObject.cards[0].offsetWidth),stateObject.cards.forEach(e=>{e.addEventListener("click",()=>{const t=new CustomEvent("webStoriesLightBoxEvent",{detail:{storyOpened:!0}});window.parent.document.dispatchEvent(t),stateObject.player.show(e.dataset.storyUrl,null,{animate:!1}),document.body.classList.add("lightbox-open"),stateObject.lightboxEl.classList.remove("closed"),e.classList.add("hidden"),resetStyles(),stateObject.player.play()})})}catch(e){}}function initializeCarousel(){setLightbox(document.body.querySelector(".lightbox")),initializeCards(),initializeArrows();const e=new CustomEvent("iframeLoaded");window.parent.document.dispatchEvent(e),stateObject.player.addEventListener("amp-story-player-close",closePlayer)}function init(){setPlayer(document.body.querySelector("amp-story-player")),stateObject.previousStories=[],stateObject.player.isReady?initializeCarousel():stateObject.player.addEventListener("ready",initializeCarousel)}function lerp(e,t,n){return t*(1-e)+n*e}function easeOutQuad(e){return--e*e*e+1}const sendEventToParent=()=>{const e=new CustomEvent("loadMoreData");window.parent.document.dispatchEvent(e)};function scrollListener(){Math.ceil(window.scrollY+window.innerHeight)>document.documentElement.scrollHeight&&!document.body.classList.contains("lightbox-open")&&stateObject.loadStoriesOnScroll&&sendEventToParent(),window.scrollY>0&&!stateObject.doesHaveMorePages&&(document.getElementById("show-more-indicator").style.display="block",document.getElementById("show-more-indicator").style.rotate="180deg",document.getElementById("show-more-indicator").onclick=()=>{document.body.scrollIntoView({behavior:"smooth"})}),0!==window.scrollY||stateObject.doesHaveMorePages||(document.getElementById("show-more-indicator").style.display="none")}const getCardHTML=({heroImage:e,publisherLogo:t,storyTitle:n,storyUrl:a,shouldPublisherLogo:o})=>`\n    <div class="entry-point-card-container" data-story-url="${a}">\n      <div class="background-cards">\n        <div class="background-card-1"></div>\n        <div class="background-card-2"></div>\n      </div>\n      <img src="${e}" class="entry-point-card-img" alt="A cat">\n     ${o?` <div class="author-container">\n        <div class="logo-container">\n            <div class="logo-ring"></div>\n            <img class="entry-point-card-logo" src="${t}" alt="Publisher logo">\n        </div>\n      </div>`:""}\n      <div class="card-headline-container">\n          <span class="entry-point-card-headline"> ${n} </span>\n      </div>\n    </div>\n    `,messageListener=({data:{story:e,doesHaveMorePages:t}})=>{try{if(!e)return;const n=e?.map(e=>getCardHTML({...e,shouldPublisherLogo:!1})).join(""),a=e?.map(({storyUrl:e})=>({href:e}));if(JSON.stringify(e)===JSON.stringify(stateObject.previousStories))return;document.getElementById("entry-points").innerHTML=n;const o=stateObject.previousStories.length;stateObject.previousStories=e,stateObject.player.add(a),initializeCards(),initializeArrows(),stateObject.doesHaveMorePages=t;const s=calculateDistanceBetweenLastItemAndBox();document.getElementById("show-more-indicator").style.left=`calc(100% - ${s/2}px)`,stateObject.doesHaveMorePages?(window.scrollTo({top:0,left:0}),document.getElementById("show-more-indicator").classList.add("bounce"),document.getElementById("show-more-indicator").onclick=()=>{stateObject.loadStoriesOnScroll=!1,sendEventToParent()},setTimeout(()=>{document.getElementById("show-more-indicator").classList.remove("bounce")},2e3)):window.scrollY>0?document.getElementById("show-more-indicator").style.rotate="180deg":document.getElementById("show-more-indicator").style.display="none";const r=()=>{stateObject.loadStoriesOnScroll=!0,stateObject.cards[o].removeEventListener("scrollend",r)};stateObject.cards[o].addEventListener("scrollend",r),stateObject.cards[o].scrollIntoView({behavior:"smooth"})}catch(e){}},calculateDistanceBetweenLastItemAndBox=()=>{const e=document.querySelector(".entry-points"),t=Array.from(e.children);let n=null,a=0;for(let e=0;e<t.length;e++){const o=t[e].getBoundingClientRect();if(0===e&&(a=o.bottom),!(o.bottom<=a))break;n=t[e]}const o=e.getBoundingClientRect();if(n){const e=n.getBoundingClientRect();return o.right-e.right+36}return null};window.addEventListener("load",init),window.addEventListener("scroll",scrollListener),window.addEventListener("message",messageListener);

package/dist/assets/amp/custom-scripts/single-player-main.js

@@ -1 +1 @@
-let stateObject={player:null,lightboxEl:null,maxScroll:null,scaleVal:1,scalingDown:!1,deltaY:0};function setPlayer(e){stateObject.player=e}function setLightbox(e){stateObject.lightboxEl=e}function closePlayer(){const e=new CustomEvent("webStoriesLightBoxEvent",{detail:{storyOpened:!1}});window.parent.document.dispatchEvent(e),stateObject.player.pause(),stateObject.player.rewind(),document.body.classList.remove("lightbox-open"),stateObject.lightboxEl.classList.add("closed")}function animateScale(e){e<1&&scalingDown&&(stateObject.scaleVal=lerp(easeOutQuad(e),1,.95),stateObject.lightboxEl.style.transform=`translate3d(0px, ${Math.pow(-deltaY,.6)}px, 0) scale3d(${scaleVal}, ${scaleVal}, 1)`,requestAnimationFrame((()=>animateScale(e+.05))))}function resetStyles(){stateObject.scalingDown=!1,stateObject.scaleVal=1,stateObject.lightboxEl.style.transform="translate3d(0, 0, 0) scale3d(1, 1, 1)"}function initializeCarousel(){setLightbox(document.body.querySelector(".lightbox")),stateObject.player.addEventListener("amp-story-player-close",closePlayer)}function init(){setPlayer(document.body.querySelector("amp-story-player")),stateObject.player.isReady?initializeCarousel():stateObject.player.addEventListener("ready",initializeCarousel)}function lerp(e,t,a){return t*(1-e)+a*e}function easeOutQuad(e){return--e*e*e+1}const messageListener=({data:{storyUrl:e}})=>{try{if(!e)return;stateObject.player.add([{href:e+"#embedmode=2"}]);const t=new CustomEvent("webStoriesLightBoxEvent",{detail:{storyOpened:!0}});window.parent.document.dispatchEvent(t),stateObject.player.show(e+"#embedmode=2",null,{animate:!1}),document.body.classList.add("lightbox-open"),stateObject.lightboxEl.classList.remove("closed"),resetStyles(),stateObject.player.play()}catch(e){console.log(e)}};window.addEventListener("load",init),window.addEventListener("message",messageListener);
+let stateObject={player:null,lightboxEl:null,maxScroll:null,scaleVal:1,scalingDown:!1,deltaY:0};function setPlayer(e){stateObject.player=e}function setLightbox(e){stateObject.lightboxEl=e}function closePlayer(){const e=new CustomEvent("webStoriesLightBoxEvent",{detail:{storyOpened:!1}});window.parent.document.dispatchEvent(e),stateObject.player.pause(),stateObject.player.rewind(),document.body.classList.remove("lightbox-open"),stateObject.lightboxEl.classList.add("closed")}function animateScale(e){e<1&&scalingDown&&(stateObject.scaleVal=lerp(easeOutQuad(e),1,.95),stateObject.lightboxEl.style.transform=`translate3d(0px, ${Math.pow(-deltaY,.6)}px, 0) scale3d(${scaleVal}, ${scaleVal}, 1)`,requestAnimationFrame(()=>animateScale(e+.05)))}function resetStyles(){stateObject.scalingDown=!1,stateObject.scaleVal=1,stateObject.lightboxEl.style.transform="translate3d(0, 0, 0) scale3d(1, 1, 1)"}function initializeCarousel(){setLightbox(document.body.querySelector(".lightbox")),stateObject.player.addEventListener("amp-story-player-close",closePlayer)}function init(){setPlayer(document.body.querySelector("amp-story-player")),stateObject.player.isReady?initializeCarousel():stateObject.player.addEventListener("ready",initializeCarousel)}function lerp(e,t,a){return t*(1-e)+a*e}function easeOutQuad(e){return--e*e*e+1}const messageListener=({data:{storyUrl:e}})=>{try{if(!e)return;stateObject.player.add([{href:e+"#embedmode=2"}]);const t=new CustomEvent("webStoriesLightBoxEvent",{detail:{storyOpened:!0}});window.parent.document.dispatchEvent(t),stateObject.player.show(e+"#embedmode=2",null,{animate:!1}),document.body.classList.add("lightbox-open"),stateObject.lightboxEl.classList.remove("closed"),resetStyles(),stateObject.player.play()}catch(e){console.log(e)}};window.addEventListener("load",init),window.addEventListener("message",messageListener);