diff --git a/css/Z_INDEX.md b/css/Z_INDEX.md index 19319ba784ce..9751b1aa798d 100644 --- a/css/Z_INDEX.md +++ b/css/Z_INDEX.md @@ -5,8 +5,6 @@ | context | z-index | file | | ------------------------------------------------------------------------------------------------ | ---------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `amp-img[i-amphtml-ssr]:not(.i-amphtml-element) > [placeholder]` | auto | [css/ampshared.css](/css/ampshared.css) | -| `.i-amphtml-expanded-mode amp-story-grid-layer` | auto | [extensions/amp-story/1.0/amp-story.css](/extensions/amp-story/1.0/amp-story.css) | -| `.i-amphtml-expanded-mode amp-story-grid-layer *` | auto | [extensions/amp-story/1.0/amp-story.css](/extensions/amp-story/1.0/amp-story.css) | | `amp-sidebar::part(c)` | inherit | [extensions/amp-sidebar/1.0/amp-sidebar.css](/extensions/amp-sidebar/1.0/amp-sidebar.css) | | `amp-sidebar::part(sidebar)` | inherit | [extensions/amp-sidebar/1.0/amp-sidebar.css](/extensions/amp-sidebar/1.0/amp-sidebar.css) | | `amp-sidebar::part(wrapper)` | inherit | [extensions/amp-sidebar/1.0/amp-sidebar.css](/extensions/amp-sidebar/1.0/amp-sidebar.css) | @@ -141,7 +139,6 @@ | `.i-amphtml-story-consent-actions` | 1 | [extensions/amp-story/1.0/amp-story-consent.css](/extensions/amp-story/1.0/amp-story-consent.css) | | `.i-amphtml-story-draggable-drawer-header` | 1 | [extensions/amp-story/1.0/amp-story-draggable-drawer-header.css](/extensions/amp-story/1.0/amp-story-draggable-drawer-header.css) | | `.i-amphtml-story-hint-container .i-amphtml-story-hint-tap-button-icon` | 1 | [extensions/amp-story/1.0/amp-story-hint.css](/extensions/amp-story/1.0/amp-story-hint.css) | -| `.i-amphtml-expanded-mode .i-amphtml-embedded-component.i-amphtml-expanded-component` | 1 | [extensions/amp-story/1.0/amp-story.css](/extensions/amp-story/1.0/amp-story.css) | | `amp-story-page[active]` | 1 | [extensions/amp-story/1.0/amp-story.css](/extensions/amp-story/1.0/amp-story.css) | | `.i-amphtml-stream-gallery-next` | 1 | [extensions/amp-stream-gallery/0.1/arrows.css](/extensions/amp-stream-gallery/0.1/arrows.css) | | `.i-amphtml-stream-gallery-prev` | 1 | [extensions/amp-stream-gallery/0.1/arrows.css](/extensions/amp-stream-gallery/0.1/arrows.css) | diff --git a/examples/visual-tests/amp-story/amp-story-tooltip-desktop.js b/examples/visual-tests/amp-story/amp-story-tooltip-desktop.js index 5f13b899021b..26f7c3147a01 100644 --- a/examples/visual-tests/amp-story/amp-story-tooltip-desktop.js +++ b/examples/visual-tests/amp-story/amp-story-tooltip-desktop.js @@ -52,21 +52,6 @@ module.exports = { await page.waitForTimeout(800); // For animations to finish. await verifySelectorsVisible(page, name, ['amp-story-page#page-3[active]']); }, - 'tapping on embed tooltip should expand the component': async ( - page, - name - ) => { - await page.tap('.next-container > button.i-amphtml-story-button-move'); - await page.waitForSelector('amp-story-page#page-2[active]'); - await page.waitForTimeout(300); // For animations to finish. - await page.tap('amp-twitter.interactive-embed'); - await page.waitForTimeout(300); // For animations to finish. - await page.tap('a.i-amphtml-story-tooltip'); - await page.waitForTimeout(800); // For animations to finish. - await verifySelectorsVisible(page, name, [ - 'amp-story-page.i-amphtml-expanded-mode', - ]); - }, 'tapping on non-interactive embed should not show tooltip or block navigation': async (page, name) => { await page.tap('.next-container > button.i-amphtml-story-button-move'); @@ -82,18 +67,4 @@ module.exports = { 'amp-story-page#page-4[active]', ]); }, - 'tapping on closing button should exit expanded view': async (page, name) => { - await page.tap('.next-container > button.i-amphtml-story-button-move'); - await page.waitForSelector('amp-story-page#page-2[active]'); - await page.waitForTimeout(300); // For animations to finish. - await page.tap('amp-twitter.interactive-embed'); - await page.waitForTimeout(300); // For animations to finish. - await page.tap('a.i-amphtml-story-tooltip'); - await page.waitForSelector('amp-story-page.i-amphtml-expanded-mode'); - await page.waitForTimeout(800); // For animations to finish. - await page.tap('span.i-amphtml-expanded-view-close-button'); - await verifySelectorsInvisible(page, name, [ - 'amp-story-page.i-amphtml-expanded-mode', - ]); - }, }; diff --git a/examples/visual-tests/amp-story/amp-story-tooltip.js b/examples/visual-tests/amp-story/amp-story-tooltip.js index e6fa5af30245..d1f4a7afcc96 100644 --- a/examples/visual-tests/amp-story/amp-story-tooltip.js +++ b/examples/visual-tests/amp-story/amp-story-tooltip.js @@ -44,23 +44,6 @@ module.exports = { await page.waitForTimeout(150); // For animations to finish. await verifySelectorsVisible(page, name, ['amp-story-page#cover[active]']); }, - 'tapping on embed tooltip should expand the component': async ( - page, - name - ) => { - const screen = page.touchscreen; - await screen.tap(200, 240); - await page.waitForSelector('amp-story-page#page-2[active]'); - await page.waitForTimeout(800); // For animations to finish. - await page.tap('amp-twitter.interactive-embed'); - await page.waitForSelector('a.i-amphtml-story-tooltip'); - await page.waitForTimeout(500); // For animations to finish. - await page.tap('a.i-amphtml-story-tooltip'); - await page.waitForTimeout(1000); // For animations to finish. - await verifySelectorsVisible(page, name, [ - 'amp-story-page.i-amphtml-expanded-mode', - ]); - }, 'tapping on non-interactive embed should not show tooltip or block navigation': async (page, name) => { const screen = page.touchscreen; @@ -77,21 +60,4 @@ module.exports = { 'amp-story-page#page-2[active]', ]); }, - 'tapping on closing button should exit expanded view': async (page, name) => { - const screen = page.touchscreen; - await screen.tap(200, 240); - await page.waitForSelector('amp-story-page#page-2[active]'); - await page.waitForTimeout(800); // For animations to finish. - await page.tap('amp-twitter.interactive-embed'); - await page.waitForSelector('a.i-amphtml-story-tooltip'); - await page.waitForTimeout(500); // For animations to finish. - await page.tap('a.i-amphtml-story-tooltip'); - await page.waitForSelector('amp-story-page.i-amphtml-expanded-mode'); - await page.waitForTimeout(1000); // For animations to finish. - await page.tap('button.i-amphtml-expanded-view-close-button'); - await page.waitForTimeout(300); // For animations to finish. - await verifySelectorsInvisible(page, name, [ - 'amp-story-page.i-amphtml-expanded-mode', - ]); - }, }; diff --git a/extensions/amp-story/1.0/_locales/af.json b/extensions/amp-story/1.0/_locales/af.json index afa555151c6d..a8d12142ad9c 100644 --- a/extensions/amp-story/1.0/_locales/af.json +++ b/extensions/amp-story/1.0/_locales/af.json @@ -80,9 +80,6 @@ "35": { "string": "Vee opwaarts" }, - "36": { - "string": "Vou twiet uit" - }, "62": { "string": "Deel vanaf hierdie bladsy" }, diff --git a/extensions/amp-story/1.0/_locales/am.json b/extensions/amp-story/1.0/_locales/am.json index fe8beb114730..949c68313f0d 100644 --- a/extensions/amp-story/1.0/_locales/am.json +++ b/extensions/amp-story/1.0/_locales/am.json @@ -80,9 +80,6 @@ "35": { "string": "ወደ ላይ ያንሸራቱ" }, - "36": { - "string": "ትዊትን ዘርጋ" - }, "62": { "string": "ከዚህ ገጽ ጀምሮ ያጋሩ" }, diff --git a/extensions/amp-story/1.0/_locales/ar.json b/extensions/amp-story/1.0/_locales/ar.json index f8016170aeb5..a7da0fbd9b56 100644 --- a/extensions/amp-story/1.0/_locales/ar.json +++ b/extensions/amp-story/1.0/_locales/ar.json @@ -80,9 +80,6 @@ "35": { "string": "السحب لأعلى" }, - "36": { - "string": "توسيع التغريدة" - }, "62": { "string": "المشاركة بدءًا من هذه الصفحة" }, diff --git a/extensions/amp-story/1.0/_locales/bg.json b/extensions/amp-story/1.0/_locales/bg.json index b3b61c36c2a5..bcd1794b063c 100644 --- a/extensions/amp-story/1.0/_locales/bg.json +++ b/extensions/amp-story/1.0/_locales/bg.json @@ -80,9 +80,6 @@ "35": { "string": "Плъзнете нагоре" }, - "36": { - "string": "Разгъване на съобщението в Twitter" - }, "62": { "string": "Споделете, започвайки от тази страница" }, diff --git a/extensions/amp-story/1.0/_locales/bn.json b/extensions/amp-story/1.0/_locales/bn.json index f2cb48be9304..c42248c14dd2 100644 --- a/extensions/amp-story/1.0/_locales/bn.json +++ b/extensions/amp-story/1.0/_locales/bn.json @@ -80,9 +80,6 @@ "35": { "string": "উপরে সোয়াইপ করুন" }, - "36": { - "string": "টুইট সম্প্রসারণ করুন" - }, "62": { "string": "এই পৃষ্ঠা থেকে শুরু শেয়ার করুন" }, diff --git a/extensions/amp-story/1.0/_locales/bs.json b/extensions/amp-story/1.0/_locales/bs.json index c01c1ae21bee..61b7417add3c 100644 --- a/extensions/amp-story/1.0/_locales/bs.json +++ b/extensions/amp-story/1.0/_locales/bs.json @@ -80,9 +80,6 @@ "35": { "string": "Pređite prstom nagore" }, - "36": { - "string": "Proširi tweet" - }, "62": { "string": "Podijeli počevši od ove stranice" }, diff --git a/extensions/amp-story/1.0/_locales/ca.json b/extensions/amp-story/1.0/_locales/ca.json index dd1d7f69aec1..ccf896d351dc 100644 --- a/extensions/amp-story/1.0/_locales/ca.json +++ b/extensions/amp-story/1.0/_locales/ca.json @@ -80,9 +80,6 @@ "35": { "string": "Llisca cap amunt" }, - "36": { - "string": "Amplia el tuit" - }, "62": { "string": "Comparteix a partir d'aquesta pàgina" }, diff --git a/extensions/amp-story/1.0/_locales/cs.json b/extensions/amp-story/1.0/_locales/cs.json index fc28e17ec553..14ee0a1cb934 100644 --- a/extensions/amp-story/1.0/_locales/cs.json +++ b/extensions/amp-story/1.0/_locales/cs.json @@ -80,9 +80,6 @@ "35": { "string": "Potáhněte nahoru" }, - "36": { - "string": "Rozbalit tweet" - }, "62": { "string": "Sdílet od této stránky" }, diff --git a/extensions/amp-story/1.0/_locales/da.json b/extensions/amp-story/1.0/_locales/da.json index da98301d87ab..2ea6b795fc9f 100644 --- a/extensions/amp-story/1.0/_locales/da.json +++ b/extensions/amp-story/1.0/_locales/da.json @@ -80,9 +80,6 @@ "35": { "string": "Stryg op" }, - "36": { - "string": "Udvid tweet" - }, "62": { "string": "Begynd at dele startende fra denne side" }, diff --git a/extensions/amp-story/1.0/_locales/de.json b/extensions/amp-story/1.0/_locales/de.json index 93ca1ab143e7..40c5dda04e7e 100644 --- a/extensions/amp-story/1.0/_locales/de.json +++ b/extensions/amp-story/1.0/_locales/de.json @@ -80,9 +80,6 @@ "35": { "string": "Nach oben wischen" }, - "36": { - "string": "Tweet maximieren" - }, "62": { "string": "Ab dieser Seite teilen" }, diff --git a/extensions/amp-story/1.0/_locales/el.json b/extensions/amp-story/1.0/_locales/el.json index c7c3fdadcb1d..6705a7b0ba9e 100644 --- a/extensions/amp-story/1.0/_locales/el.json +++ b/extensions/amp-story/1.0/_locales/el.json @@ -80,9 +80,6 @@ "35": { "string": "Σύρετε προς τα πάνω" }, - "36": { - "string": "Ανάπτυξη Tweet" - }, "62": { "string": "Κοινοποίηση ξεκινώντας από αυτήν τη σελίδα" }, diff --git a/extensions/amp-story/1.0/_locales/en-GB.json b/extensions/amp-story/1.0/_locales/en-GB.json index b9ce11201624..ef859592dcca 100644 --- a/extensions/amp-story/1.0/_locales/en-GB.json +++ b/extensions/amp-story/1.0/_locales/en-GB.json @@ -80,9 +80,6 @@ "35": { "string": "Swipe up" }, - "36": { - "string": "Expand Tweet" - }, "62": { "string": "Share starting from this page" }, diff --git a/extensions/amp-story/1.0/_locales/en.json b/extensions/amp-story/1.0/_locales/en.json index c1e6580e3e24..5399b66b8136 100644 --- a/extensions/amp-story/1.0/_locales/en.json +++ b/extensions/amp-story/1.0/_locales/en.json @@ -107,10 +107,6 @@ "string": "Swipe up", "description": "Label for a button to open a drawer containing additional content via a \"swipe up\" user gesture." }, - "36": { - "string": "Expand Tweet", - "description": "Label in the tooltip text for when a Twitter embed is expandable." - }, "62": { "string": "Share starting from this page", "description": "Checkbox label when the branching experiment is turned on and the story is in landscape mode; checking the checkbox lets the user share the story from the current page." diff --git a/extensions/amp-story/1.0/_locales/es-419.json b/extensions/amp-story/1.0/_locales/es-419.json index 2fffa90357cb..2f4cb6510bca 100644 --- a/extensions/amp-story/1.0/_locales/es-419.json +++ b/extensions/amp-story/1.0/_locales/es-419.json @@ -80,9 +80,6 @@ "35": { "string": "Deslizar el dedo hacia arriba" }, - "36": { - "string": "Mostrar tuit" - }, "62": { "string": "Compartir a partir de esta página" }, diff --git a/extensions/amp-story/1.0/_locales/es.json b/extensions/amp-story/1.0/_locales/es.json index cf84be09f3c3..15e83d00b905 100644 --- a/extensions/amp-story/1.0/_locales/es.json +++ b/extensions/amp-story/1.0/_locales/es.json @@ -80,9 +80,6 @@ "35": { "string": "Deslizar el dedo hacia arriba" }, - "36": { - "string": "Mostrar tuit" - }, "62": { "string": "Compartir a partir de esta página" }, diff --git a/extensions/amp-story/1.0/_locales/et.json b/extensions/amp-story/1.0/_locales/et.json index c69b2cb54105..5126d27c0fa6 100644 --- a/extensions/amp-story/1.0/_locales/et.json +++ b/extensions/amp-story/1.0/_locales/et.json @@ -80,9 +80,6 @@ "35": { "string": "Pühkige üles" }, - "36": { - "string": "Laiendage säutsu" - }, "62": { "string": "Jaga alates sellest lehest" }, diff --git a/extensions/amp-story/1.0/_locales/eu.json b/extensions/amp-story/1.0/_locales/eu.json index a61111ea744a..6f7836c8c275 100644 --- a/extensions/amp-story/1.0/_locales/eu.json +++ b/extensions/amp-story/1.0/_locales/eu.json @@ -80,9 +80,6 @@ "35": { "string": "Pasatu hatza gora" }, - "36": { - "string": "Zabaldu txioa" - }, "62": { "string": "Partekatu orri honetatik aurrera" }, diff --git a/extensions/amp-story/1.0/_locales/fa.json b/extensions/amp-story/1.0/_locales/fa.json index 9eb1f854142f..7325d68da3b9 100644 --- a/extensions/amp-story/1.0/_locales/fa.json +++ b/extensions/amp-story/1.0/_locales/fa.json @@ -80,9 +80,6 @@ "35": { "string": "کشیدن به بالا" }, - "36": { - "string": "گسترش توییت" - }, "62": { "string": "اشتراک‌گذاری را از این صفحه شروع کنید" }, diff --git a/extensions/amp-story/1.0/_locales/fi.json b/extensions/amp-story/1.0/_locales/fi.json index 371d06f7e34e..7b1f36ebb1ac 100644 --- a/extensions/amp-story/1.0/_locales/fi.json +++ b/extensions/amp-story/1.0/_locales/fi.json @@ -80,9 +80,6 @@ "35": { "string": "Pyyhkäise ylös" }, - "36": { - "string": "Laajenna tviitti" - }, "62": { "string": "Jaa tältä sivulta alkaen" }, diff --git a/extensions/amp-story/1.0/_locales/fil.json b/extensions/amp-story/1.0/_locales/fil.json index 357677cedb9e..bdc2b63f4a93 100644 --- a/extensions/amp-story/1.0/_locales/fil.json +++ b/extensions/amp-story/1.0/_locales/fil.json @@ -80,9 +80,6 @@ "35": { "string": "Mag-swipe pataas" }, - "36": { - "string": "I-expand ang Tweet" - }, "62": { "string": "Ibahagi simula sa page na ito" }, diff --git a/extensions/amp-story/1.0/_locales/fr.json b/extensions/amp-story/1.0/_locales/fr.json index f5ff1d292713..937d61f17179 100644 --- a/extensions/amp-story/1.0/_locales/fr.json +++ b/extensions/amp-story/1.0/_locales/fr.json @@ -80,9 +80,6 @@ "35": { "string": "Balayer l'écran vers le haut" }, - "36": { - "string": "Développer le tweet" - }, "62": { "string": "Partager à partir de cette page" }, diff --git a/extensions/amp-story/1.0/_locales/gl.json b/extensions/amp-story/1.0/_locales/gl.json index 7ac0b5f47122..b1e871ee0f2c 100644 --- a/extensions/amp-story/1.0/_locales/gl.json +++ b/extensions/amp-story/1.0/_locales/gl.json @@ -80,9 +80,6 @@ "35": { "string": "Deslizar cara enriba" }, - "36": { - "string": "Mostrar todo" - }, "62": { "string": "Compartir a partir desta páxina" }, diff --git a/extensions/amp-story/1.0/_locales/gu.json b/extensions/amp-story/1.0/_locales/gu.json index c25985e1d0a4..44cc5fa0143e 100644 --- a/extensions/amp-story/1.0/_locales/gu.json +++ b/extensions/amp-story/1.0/_locales/gu.json @@ -80,9 +80,6 @@ "35": { "string": "ઉપર સ્વાઇપ કરો" }, - "36": { - "string": "ટ્વિટ મોટી કરો" - }, "62": { "string": "શેર કરવાનું આ પેજથી શરૂ થાય છે" }, diff --git a/extensions/amp-story/1.0/_locales/hi.json b/extensions/amp-story/1.0/_locales/hi.json index 73e31f1ef847..866f7f907f0a 100644 --- a/extensions/amp-story/1.0/_locales/hi.json +++ b/extensions/amp-story/1.0/_locales/hi.json @@ -80,9 +80,6 @@ "35": { "string": "ऊपर स्वाइप करें" }, - "36": { - "string": "ट्वीट को विस्तारित करें" - }, "62": { "string": "इस पेज से शुरू करते हुए शेयर करें" }, diff --git a/extensions/amp-story/1.0/_locales/hr.json b/extensions/amp-story/1.0/_locales/hr.json index 29acde6ec25d..b3776eed3a0d 100644 --- a/extensions/amp-story/1.0/_locales/hr.json +++ b/extensions/amp-story/1.0/_locales/hr.json @@ -80,9 +80,6 @@ "35": { "string": "Prijeđite prstom prema gore" }, - "36": { - "string": "Proširi Tweet" - }, "62": { "string": "Podijelite, počevši s ovom stranicom" }, diff --git a/extensions/amp-story/1.0/_locales/hu.json b/extensions/amp-story/1.0/_locales/hu.json index dca3eb836a64..6ed026290e2e 100644 --- a/extensions/amp-story/1.0/_locales/hu.json +++ b/extensions/amp-story/1.0/_locales/hu.json @@ -80,9 +80,6 @@ "35": { "string": "Csúsztatás felfelé" }, - "36": { - "string": "Tweet kibontása" - }, "62": { "string": "Megosztás ettől az oldaltól kezdve" }, diff --git a/extensions/amp-story/1.0/_locales/id.json b/extensions/amp-story/1.0/_locales/id.json index 1ad98d790625..fcc200352962 100644 --- a/extensions/amp-story/1.0/_locales/id.json +++ b/extensions/amp-story/1.0/_locales/id.json @@ -80,9 +80,6 @@ "35": { "string": "Usap ke atas" }, - "36": { - "string": "Perluas Tweet" - }, "62": { "string": "Bagikan mulai dari halaman ini" }, diff --git a/extensions/amp-story/1.0/_locales/is.json b/extensions/amp-story/1.0/_locales/is.json index 6bd18303d952..3157e3dae4b2 100644 --- a/extensions/amp-story/1.0/_locales/is.json +++ b/extensions/amp-story/1.0/_locales/is.json @@ -80,9 +80,6 @@ "35": { "string": "Strjúktu upp" }, - "36": { - "string": "Stækka tíst" - }, "62": { "string": "Deila frá og með þessari síðu" }, diff --git a/extensions/amp-story/1.0/_locales/it.json b/extensions/amp-story/1.0/_locales/it.json index c24d67f23c40..9aa81c92ee59 100644 --- a/extensions/amp-story/1.0/_locales/it.json +++ b/extensions/amp-story/1.0/_locales/it.json @@ -80,9 +80,6 @@ "35": { "string": "Scorri verso l'alto" }, - "36": { - "string": "Espandi Tweet" - }, "62": { "string": "Condividi a partire da questa pagina" }, diff --git a/extensions/amp-story/1.0/_locales/iw.json b/extensions/amp-story/1.0/_locales/iw.json index 8c8d7ea93165..99bec9283a89 100644 --- a/extensions/amp-story/1.0/_locales/iw.json +++ b/extensions/amp-story/1.0/_locales/iw.json @@ -80,9 +80,6 @@ "35": { "string": "החלק למעלה" }, - "36": { - "string": "הרחב ציוץ" - }, "62": { "string": "שתף החל מדף זה" }, diff --git a/extensions/amp-story/1.0/_locales/ja.json b/extensions/amp-story/1.0/_locales/ja.json index d6f4b61a76ac..898c590dc612 100644 --- a/extensions/amp-story/1.0/_locales/ja.json +++ b/extensions/amp-story/1.0/_locales/ja.json @@ -80,9 +80,6 @@ "35": { "string": "上にスワイプ" }, - "36": { - "string": "ツイートを展開" - }, "62": { "string": "このページから共有を開始" }, diff --git a/extensions/amp-story/1.0/_locales/ka.json b/extensions/amp-story/1.0/_locales/ka.json index 0fcdc0beb8d5..75d20ae98a05 100644 --- a/extensions/amp-story/1.0/_locales/ka.json +++ b/extensions/amp-story/1.0/_locales/ka.json @@ -80,9 +80,6 @@ "35": { "string": "აწევა" }, - "36": { - "string": "ტვიტის გაშლა" - }, "62": { "string": "გაზიარების დაწყება ამ გვერდიდან" }, diff --git a/extensions/amp-story/1.0/_locales/km.json b/extensions/amp-story/1.0/_locales/km.json index 6ce9a20d938f..1d51c361c42e 100644 --- a/extensions/amp-story/1.0/_locales/km.json +++ b/extensions/amp-story/1.0/_locales/km.json @@ -80,9 +80,6 @@ "35": { "string": "អូស​ឡើង​លើ" }, - "36": { - "string": "ពង្រីក​ធ្វីត" - }, "62": { "string": "ចែក​រំលែក​ចាប់​ពី​ទំព័រ​នេះ​ទៅ" }, diff --git a/extensions/amp-story/1.0/_locales/kn.json b/extensions/amp-story/1.0/_locales/kn.json index 9d7114bae60b..c5771d19a3d3 100644 --- a/extensions/amp-story/1.0/_locales/kn.json +++ b/extensions/amp-story/1.0/_locales/kn.json @@ -80,9 +80,6 @@ "35": { "string": "ಮೇಲಕ್ಕೆ ಸ್ವೈಪ್ ಮಾಡಿ" }, - "36": { - "string": "ಟ್ವೀಟ್ ಅನ್ನು ವಿಸ್ತರಿಸಿ" - }, "62": { "string": "ಈ ಪುಟದಿಂದ ಪ್ರಾರಂಭಿಸಿ ಹಂಚಿಕೊಳ್ಳಿ" }, diff --git a/extensions/amp-story/1.0/_locales/ko.json b/extensions/amp-story/1.0/_locales/ko.json index 6bef1ce4817d..bf36f7115839 100644 --- a/extensions/amp-story/1.0/_locales/ko.json +++ b/extensions/amp-story/1.0/_locales/ko.json @@ -80,9 +80,6 @@ "35": { "string": "위로 스와이프" }, - "36": { - "string": "트윗 펼치기" - }, "62": { "string": "이 페이지부터 공유 시작" }, diff --git a/extensions/amp-story/1.0/_locales/lo.json b/extensions/amp-story/1.0/_locales/lo.json index eb748078c5b3..a90e1df31c53 100644 --- a/extensions/amp-story/1.0/_locales/lo.json +++ b/extensions/amp-story/1.0/_locales/lo.json @@ -80,9 +80,6 @@ "35": { "string": "ປັດຂຶ້ນ" }, - "36": { - "string": "ຂະຫຍາຍ Tweet" - }, "62": { "string": "ແບ່ງປັນເລີ່ມຈາກໜ້ານີ້" }, diff --git a/extensions/amp-story/1.0/_locales/lt.json b/extensions/amp-story/1.0/_locales/lt.json index d0d10b89bd58..a5c480d2827b 100644 --- a/extensions/amp-story/1.0/_locales/lt.json +++ b/extensions/amp-story/1.0/_locales/lt.json @@ -80,9 +80,6 @@ "35": { "string": "Perbraukti aukštyn" }, - "36": { - "string": "Išskleisti „Twitter“ įrašą" - }, "62": { "string": "Bendrinti pradedant šiuo puslapiu" }, diff --git a/extensions/amp-story/1.0/_locales/lv.json b/extensions/amp-story/1.0/_locales/lv.json index ad30c4158f44..6cabbc16d14b 100644 --- a/extensions/amp-story/1.0/_locales/lv.json +++ b/extensions/amp-story/1.0/_locales/lv.json @@ -80,9 +80,6 @@ "35": { "string": "Pavilkt uz augšu" }, - "36": { - "string": "Izvērst Twitter ierakstu" - }, "62": { "string": "Kopīgot, sākot ar šo lapu" }, diff --git a/extensions/amp-story/1.0/_locales/mk.json b/extensions/amp-story/1.0/_locales/mk.json index fc44e9f620cf..90d4836e0494 100644 --- a/extensions/amp-story/1.0/_locales/mk.json +++ b/extensions/amp-story/1.0/_locales/mk.json @@ -80,9 +80,6 @@ "35": { "string": "Повлечете нагоре" }, - "36": { - "string": "Проширете го твитот" - }, "62": { "string": "Споделувајте од оваа страница" }, diff --git a/extensions/amp-story/1.0/_locales/ml.json b/extensions/amp-story/1.0/_locales/ml.json index 1e954fac6010..ac2d29c6a6bf 100644 --- a/extensions/amp-story/1.0/_locales/ml.json +++ b/extensions/amp-story/1.0/_locales/ml.json @@ -80,9 +80,6 @@ "35": { "string": "മുകളിലേക്ക് സ്വൈപ്പ് ചെയ്യുക" }, - "36": { - "string": "ട്വീറ്റ് വികസിപ്പിക്കുക" - }, "62": { "string": "ഈ പേജ് മുതൽ പങ്കിടുക" }, diff --git a/extensions/amp-story/1.0/_locales/mn.json b/extensions/amp-story/1.0/_locales/mn.json index cfa89ffbb0f6..ce530c9df2e3 100644 --- a/extensions/amp-story/1.0/_locales/mn.json +++ b/extensions/amp-story/1.0/_locales/mn.json @@ -80,9 +80,6 @@ "35": { "string": "Дээш шудрах" }, - "36": { - "string": "Жиргээг дэлгэх" - }, "62": { "string": "Энэ хуудсаас эхлэн хуваалцах" }, diff --git a/extensions/amp-story/1.0/_locales/mr.json b/extensions/amp-story/1.0/_locales/mr.json index 1aeaa8128c91..2d11342e8951 100644 --- a/extensions/amp-story/1.0/_locales/mr.json +++ b/extensions/amp-story/1.0/_locales/mr.json @@ -80,9 +80,6 @@ "35": { "string": "वर स्वाइप करा" }, - "36": { - "string": "ट्वीट विस्तृत करा" - }, "62": { "string": "या पृष्ठापासून सुरुवात करत सामायिक करा" }, diff --git a/extensions/amp-story/1.0/_locales/ms.json b/extensions/amp-story/1.0/_locales/ms.json index aa5457c0912c..d5b5eb4283a3 100644 --- a/extensions/amp-story/1.0/_locales/ms.json +++ b/extensions/amp-story/1.0/_locales/ms.json @@ -80,9 +80,6 @@ "35": { "string": "Leret ke atas" }, - "36": { - "string": "Kembangkan Twit" - }, "62": { "string": "Berkongsi bermula dari halaman ini" }, diff --git a/extensions/amp-story/1.0/_locales/my.json b/extensions/amp-story/1.0/_locales/my.json index b75b312b05ae..5592c9de8822 100644 --- a/extensions/amp-story/1.0/_locales/my.json +++ b/extensions/amp-story/1.0/_locales/my.json @@ -80,9 +80,6 @@ "35": { "string": "အပေါ်သို့ ပွတ်ဆွဲရန်" }, - "36": { - "string": "Tweet ကို ဖြန့်ချဲ့ရန်" - }, "62": { "string": "ဤစာမျက်နှာမှ စတင်၍ ဝေမျှရန်" }, diff --git a/extensions/amp-story/1.0/_locales/ne.json b/extensions/amp-story/1.0/_locales/ne.json index f4564be872e7..bc5631596394 100644 --- a/extensions/amp-story/1.0/_locales/ne.json +++ b/extensions/amp-story/1.0/_locales/ne.json @@ -80,9 +80,6 @@ "35": { "string": "माथि स्वाइप गर्नुहोस्" }, - "36": { - "string": "ट्विट विस्तार गर्नुहोस्" - }, "62": { "string": "यस पृष्ठबाट सुरु गरेर साझा गर्नुहोस्" }, diff --git a/extensions/amp-story/1.0/_locales/nl.json b/extensions/amp-story/1.0/_locales/nl.json index 675ac050c309..8d81582ca3d8 100644 --- a/extensions/amp-story/1.0/_locales/nl.json +++ b/extensions/amp-story/1.0/_locales/nl.json @@ -80,9 +80,6 @@ "35": { "string": "Omhoog vegen" }, - "36": { - "string": "Tweet uitvouwen" - }, "62": { "string": "Delen vanaf deze pagina" }, diff --git a/extensions/amp-story/1.0/_locales/no.json b/extensions/amp-story/1.0/_locales/no.json index 5ed9ca03be1a..64fff0966979 100644 --- a/extensions/amp-story/1.0/_locales/no.json +++ b/extensions/amp-story/1.0/_locales/no.json @@ -80,9 +80,6 @@ "35": { "string": "Sveip opp" }, - "36": { - "string": "Utvid Tweet" - }, "62": { "string": "Del med start fra denne siden" }, diff --git a/extensions/amp-story/1.0/_locales/pa.json b/extensions/amp-story/1.0/_locales/pa.json index 786fb4f60af3..6b8296d8b95d 100644 --- a/extensions/amp-story/1.0/_locales/pa.json +++ b/extensions/amp-story/1.0/_locales/pa.json @@ -80,9 +80,6 @@ "35": { "string": "ਉੱਪਰ ਸਵਾਈਪ ਕਰੋ" }, - "36": { - "string": "ਟਵੀਟ ਦਾ ਵਿਸਤਾਰ ਕਰੋ" - }, "62": { "string": "ਇਸ ਪੰਨੇ ਤੋਂ ਸ਼ੁਰੂ ਕਰਦੇ ਹੋਏ ਸਾਂਝਾ ਕਰੋ" }, diff --git a/extensions/amp-story/1.0/_locales/pl.json b/extensions/amp-story/1.0/_locales/pl.json index 203da6d10237..1a9ad19073b7 100644 --- a/extensions/amp-story/1.0/_locales/pl.json +++ b/extensions/amp-story/1.0/_locales/pl.json @@ -80,9 +80,6 @@ "35": { "string": "Przesuń w górę" }, - "36": { - "string": "Rozwiń tweet" - }, "62": { "string": "Udostępnij, zaczynając od tej strony" }, diff --git a/extensions/amp-story/1.0/_locales/pt-BR.json b/extensions/amp-story/1.0/_locales/pt-BR.json index dd5eb1496125..34a728d8e9dd 100644 --- a/extensions/amp-story/1.0/_locales/pt-BR.json +++ b/extensions/amp-story/1.0/_locales/pt-BR.json @@ -80,9 +80,6 @@ "35": { "string": "Deslizar para cima" }, - "36": { - "string": "Expandir tweet" - }, "62": { "string": "Compartilhar a partir desta página" }, diff --git a/extensions/amp-story/1.0/_locales/pt-PT.json b/extensions/amp-story/1.0/_locales/pt-PT.json index 123fb0d7e4c2..c64c9fd3b6aa 100644 --- a/extensions/amp-story/1.0/_locales/pt-PT.json +++ b/extensions/amp-story/1.0/_locales/pt-PT.json @@ -80,9 +80,6 @@ "35": { "string": "Deslizar para cima" }, - "36": { - "string": "Expandir Tweet" - }, "62": { "string": "Partilhar a partir desta página" }, diff --git a/extensions/amp-story/1.0/_locales/ro.json b/extensions/amp-story/1.0/_locales/ro.json index fbc78cb60641..7cf6e6a1e8dc 100644 --- a/extensions/amp-story/1.0/_locales/ro.json +++ b/extensions/amp-story/1.0/_locales/ro.json @@ -80,9 +80,6 @@ "35": { "string": "Glisați în sus" }, - "36": { - "string": "Extindeți tweetul" - }, "62": { "string": "Distribuiți începând cu această pagină" }, diff --git a/extensions/amp-story/1.0/_locales/ru.json b/extensions/amp-story/1.0/_locales/ru.json index c3f1f2b08639..934ab3a256c3 100644 --- a/extensions/amp-story/1.0/_locales/ru.json +++ b/extensions/amp-story/1.0/_locales/ru.json @@ -80,9 +80,6 @@ "35": { "string": "Проведите вверх" }, - "36": { - "string": "Развернуть твит" - }, "62": { "string": "Поделиться начиная с текущей страницы" }, diff --git a/extensions/amp-story/1.0/_locales/si.json b/extensions/amp-story/1.0/_locales/si.json index e10bc52d567f..3c8620761fb1 100644 --- a/extensions/amp-story/1.0/_locales/si.json +++ b/extensions/amp-story/1.0/_locales/si.json @@ -80,9 +80,6 @@ "35": { "string": "ඉහළට ස්වයිප් කරන්න" }, - "36": { - "string": "ට්වීට් පුළුල් කරන්න" - }, "62": { "string": "මෙම පිටුවෙන් පටන්ගෙන බෙදාගන්න" }, diff --git a/extensions/amp-story/1.0/_locales/sk.json b/extensions/amp-story/1.0/_locales/sk.json index 8c3c846b3a5c..3c0d6bd6ca8c 100644 --- a/extensions/amp-story/1.0/_locales/sk.json +++ b/extensions/amp-story/1.0/_locales/sk.json @@ -80,9 +80,6 @@ "35": { "string": "Potiahnite nahor" }, - "36": { - "string": "Rozbaliť tweet" - }, "62": { "string": "Zdieľanie začína z tejto stránky" }, diff --git a/extensions/amp-story/1.0/_locales/sl.json b/extensions/amp-story/1.0/_locales/sl.json index 3d4c493117c6..f1d37b3f7115 100644 --- a/extensions/amp-story/1.0/_locales/sl.json +++ b/extensions/amp-story/1.0/_locales/sl.json @@ -80,9 +80,6 @@ "35": { "string": "Povleci navzgor" }, - "36": { - "string": "Razširi objavo" - }, "62": { "string": "Začni deliti s to stranjo" }, diff --git a/extensions/amp-story/1.0/_locales/sq.json b/extensions/amp-story/1.0/_locales/sq.json index 4e6a4c525059..6586042cdbbb 100644 --- a/extensions/amp-story/1.0/_locales/sq.json +++ b/extensions/amp-story/1.0/_locales/sq.json @@ -80,9 +80,6 @@ "35": { "string": "Rrëshqit lart" }, - "36": { - "string": "Zgjero tweet-in" - }, "62": { "string": "Ndaj duke filluar nga kjo faqe" }, diff --git a/extensions/amp-story/1.0/_locales/sr.json b/extensions/amp-story/1.0/_locales/sr.json index 797bd6d544d2..5df0c7529b77 100644 --- a/extensions/amp-story/1.0/_locales/sr.json +++ b/extensions/amp-story/1.0/_locales/sr.json @@ -80,9 +80,6 @@ "35": { "string": "Превуци нагоре" }, - "36": { - "string": "Прошири твит" - }, "62": { "string": "Подели почев од ове странице" }, diff --git a/extensions/amp-story/1.0/_locales/sv.json b/extensions/amp-story/1.0/_locales/sv.json index 6a79f9d4c127..eb6c4d2f2a76 100644 --- a/extensions/amp-story/1.0/_locales/sv.json +++ b/extensions/amp-story/1.0/_locales/sv.json @@ -80,9 +80,6 @@ "35": { "string": "Svep upp" }, - "36": { - "string": "Expandera tweet" - }, "62": { "string": "Dela med start från den här sidan" }, diff --git a/extensions/amp-story/1.0/_locales/sw.json b/extensions/amp-story/1.0/_locales/sw.json index 138899b41d73..ee2f29af7a9e 100644 --- a/extensions/amp-story/1.0/_locales/sw.json +++ b/extensions/amp-story/1.0/_locales/sw.json @@ -80,9 +80,6 @@ "35": { "string": "Telezesha juu" }, - "36": { - "string": "Panua Tweet" - }, "62": { "string": "Tuma kuanzia ukurasa huu" }, diff --git a/extensions/amp-story/1.0/_locales/ta.json b/extensions/amp-story/1.0/_locales/ta.json index bfc4c2da2d96..22072c27371f 100644 --- a/extensions/amp-story/1.0/_locales/ta.json +++ b/extensions/amp-story/1.0/_locales/ta.json @@ -80,9 +80,6 @@ "35": { "string": "மேலே ஸ்வைப் செய்" }, - "36": { - "string": "ட்வீட்டை விரிவுபடுத்துக" - }, "62": { "string": "இந்தப் பக்கத்திலிருந்து பகிரத் தொடங்குக" }, diff --git a/extensions/amp-story/1.0/_locales/te.json b/extensions/amp-story/1.0/_locales/te.json index a910ed5871fd..34793ab9f778 100644 --- a/extensions/amp-story/1.0/_locales/te.json +++ b/extensions/amp-story/1.0/_locales/te.json @@ -80,9 +80,6 @@ "35": { "string": "పైకి స్వైప్ చేయండి" }, - "36": { - "string": "ట్వీట్ విస్తరించండి" - }, "62": { "string": "ఈ పేజీ నుంచి పంచుకోవడం ప్రారంభించండి" }, diff --git a/extensions/amp-story/1.0/_locales/th.json b/extensions/amp-story/1.0/_locales/th.json index ee274ae387ff..24cfd5393542 100644 --- a/extensions/amp-story/1.0/_locales/th.json +++ b/extensions/amp-story/1.0/_locales/th.json @@ -80,9 +80,6 @@ "35": { "string": "ปัดขึ้น" }, - "36": { - "string": "ขยายทวีต" - }, "62": { "string": "เริ่มแชร์จากหน้าเพจนี้" }, diff --git a/extensions/amp-story/1.0/_locales/tr.json b/extensions/amp-story/1.0/_locales/tr.json index 2f51720d2f6e..7504a3b22a12 100644 --- a/extensions/amp-story/1.0/_locales/tr.json +++ b/extensions/amp-story/1.0/_locales/tr.json @@ -80,9 +80,6 @@ "35": { "string": "Yukarı kaydır" }, - "36": { - "string": "Tweet'i genişlet" - }, "62": { "string": "Bu sayfadan başlayarak paylaşın" }, diff --git a/extensions/amp-story/1.0/_locales/uk.json b/extensions/amp-story/1.0/_locales/uk.json index ebe2dcc579f1..c9db47038607 100644 --- a/extensions/amp-story/1.0/_locales/uk.json +++ b/extensions/amp-story/1.0/_locales/uk.json @@ -80,9 +80,6 @@ "35": { "string": "Провести вгору" }, - "36": { - "string": "Розгорнути твіт" - }, "62": { "string": "Поділитися з цієї сторінки" }, diff --git a/extensions/amp-story/1.0/_locales/ur.json b/extensions/amp-story/1.0/_locales/ur.json index e7b3fbb90887..25c8920193cf 100644 --- a/extensions/amp-story/1.0/_locales/ur.json +++ b/extensions/amp-story/1.0/_locales/ur.json @@ -80,9 +80,6 @@ "35": { "string": "اوپر سوائپ کریں" }, - "36": { - "string": "ٹوئیٹ پھیلائیں" - }, "62": { "string": "اس صفحے سے شیئر کرنا شروع کریں" }, diff --git a/extensions/amp-story/1.0/_locales/vi.json b/extensions/amp-story/1.0/_locales/vi.json index 9cee340bfe69..e8147dc35c86 100644 --- a/extensions/amp-story/1.0/_locales/vi.json +++ b/extensions/amp-story/1.0/_locales/vi.json @@ -80,9 +80,6 @@ "35": { "string": "Vuốt lên" }, - "36": { - "string": "Mở rộng Tweet" - }, "62": { "string": "Bắt đầu chia sẻ từ trang này" }, diff --git a/extensions/amp-story/1.0/_locales/zh-CN.json b/extensions/amp-story/1.0/_locales/zh-CN.json index f11f8f91705c..621b15dc773a 100644 --- a/extensions/amp-story/1.0/_locales/zh-CN.json +++ b/extensions/amp-story/1.0/_locales/zh-CN.json @@ -80,9 +80,6 @@ "35": { "string": "向上滑动" }, - "36": { - "string": "展开推文" - }, "62": { "string": "从此网页开始分享" }, diff --git a/extensions/amp-story/1.0/_locales/zh-TW.json b/extensions/amp-story/1.0/_locales/zh-TW.json index c027ac2f1a3e..4b7c7b372c09 100644 --- a/extensions/amp-story/1.0/_locales/zh-TW.json +++ b/extensions/amp-story/1.0/_locales/zh-TW.json @@ -80,9 +80,6 @@ "35": { "string": "向上滑動" }, - "36": { - "string": "展開推文" - }, "62": { "string": "從此頁面開始分享" }, diff --git a/extensions/amp-story/1.0/_locales/zu.json b/extensions/amp-story/1.0/_locales/zu.json index 5099053956ac..8bbc6b737d0c 100644 --- a/extensions/amp-story/1.0/_locales/zu.json +++ b/extensions/amp-story/1.0/_locales/zu.json @@ -80,9 +80,6 @@ "35": { "string": "Swayiphela phezulu" }, - "36": { - "string": "Khulisa i-Tweet" - }, "62": { "string": "Ukwabelana kuqala kuleli khasi" }, diff --git a/extensions/amp-story/1.0/amp-story-embedded-component.js b/extensions/amp-story/1.0/amp-story-embedded-component.js index 3833016191c2..b18687244469 100644 --- a/extensions/amp-story/1.0/amp-story-embedded-component.js +++ b/extensions/amp-story/1.0/amp-story-embedded-component.js @@ -14,7 +14,6 @@ import { } from './story-analytics'; import {CSS} from '../../../build/amp-story-tooltip-1.0.css'; import {EventType, dispatch} from './events'; -import {Keys} from '#core/constants/key-codes'; import {LocalizedStringId} from '#service/localization/strings'; import {Services} from '#service'; import {tryFocus} from '#core/dom'; @@ -25,24 +24,16 @@ import { triggerClickFromLightDom, } from './utils'; import {dev, devAssert, user, userAssert} from '#utils/log'; -import {dict} from '#core/types/object'; import {getAmpdoc} from '../../../src/service-helpers'; import {localize} from './amp-story-localization-service'; import {htmlRefs} from '#core/dom/static-template'; import {isProtocolValid, parseUrlDeprecated} from '../../../src/url'; -import {px, resetStyles, setImportantStyles, toggle} from '#core/dom/style'; +import {resetStyles, setImportantStyles} from '#core/dom/style'; import objstr from 'obj-str'; -/** - * Action icons to be placed in tooltip. - * @enum {string} - * @private - */ -const ActionIcon = { - LAUNCH: 'i-amphtml-tooltip-action-icon-launch', - EXPAND: 'i-amphtml-tooltip-action-icon-expand', -}; +/** @private @const {string} */ +const LAUNCH_ICON_CLASS = 'i-amphtml-tooltip-action-icon-launch'; /** @private @const {number} */ const TOOLTIP_CLOSE_ANIMATION_MS = 100; @@ -58,27 +49,13 @@ const TooltipTheme = { DARK: 'dark', }; -/** - * Since we don't know the actual width of the content inside the iframe - * and in responsive environments the iframe takes the whole width, we - * hardcode a limit based on what we know of how the embed behaves (only true - * for Twitter embeds). See #22334. - * @const {number} - * @private - */ -const MAX_TWEET_WIDTH_PX = 500; - -/** - * Components that can be expanded. - * @const {!Object} - * @package - */ -export const EXPANDABLE_COMPONENTS = { +/** @private @const {!Object} list of embedded components that are click shielded */ +const EMBEDDED_COMPONENTS_SELECTORS = { 'amp-twitter': { customIconClassName: 'amp-social-share-twitter-no-background', - actionIcon: ActionIcon.EXPAND, + actionIcon: LAUNCH_ICON_CLASS, localizedStringId: LocalizedStringId.AMP_STORY_TOOLTIP_EXPAND_TWEET, - selector: 'amp-twitter', + selector: 'amp-twitter[interactive]', }, }; @@ -89,325 +66,56 @@ export const EXPANDABLE_COMPONENTS = { */ const LAUNCHABLE_COMPONENTS = { 'a': { - actionIcon: ActionIcon.LAUNCH, + actionIcon: LAUNCH_ICON_CLASS, selector: 'a[href]:not([affiliate-link-icon])', }, -}; - -/** - * Union of expandable and launchable components. - * @private - * @const {!Object} - */ -const INTERACTIVE_COMPONENTS = { - ...EXPANDABLE_COMPONENTS, - ...LAUNCHABLE_COMPONENTS, + ...EMBEDDED_COMPONENTS_SELECTORS, }; /** * Gets the list of components with their respective selectors. * @param {!Object} components - * @param {string=} opt_predicate * @return {!Object} */ -function getComponentSelectors(components, opt_predicate) { +function getComponentSelectors(components) { const componentSelectors = {}; Object.keys(components).forEach((componentName) => { - componentSelectors[componentName] = opt_predicate - ? components[componentName].selector + opt_predicate - : components[componentName].selector; + componentSelectors[componentName] = components[componentName].selector; }); return componentSelectors; } -/** @const {string} */ -const INTERACTIVE_EMBED_SELECTOR = '[interactive]'; - /** - * Selectors of elements that can go into expanded view. + * Selectors of elements that are embedded. * @return {!Object} */ -export function expandableElementsSelectors() { +export function embeddedElementsSelectors() { // Using indirect invocation to prevent no-export-side-effect issue. - return getComponentSelectors( - EXPANDABLE_COMPONENTS, - INTERACTIVE_EMBED_SELECTOR - ); + return Object.keys(EMBEDDED_COMPONENTS_SELECTORS).join(','); } -/** - * Contains all interactive component CSS selectors. - * @type {!Object} - */ -const interactiveSelectors = { - ...getComponentSelectors(LAUNCHABLE_COMPONENTS), - ...getComponentSelectors(EXPANDABLE_COMPONENTS, INTERACTIVE_EMBED_SELECTOR), - EXPANDED_VIEW_OVERLAY: - '.i-amphtml-story-expanded-view-overflow, ' + - '.i-amphtml-expanded-view-close-button', -}; - /** * All selectors that should delegate to the AmpStoryEmbeddedComponent class. * @return {!Object} */ export function interactiveElementsSelectors() { // Using indirect invocation to prevent no-export-side-effect issue. - return interactiveSelectors; + return Object.values(getComponentSelectors(LAUNCHABLE_COMPONENTS)).join(','); } -/** - * Maps each embedded element to its corresponding style. - * @type {!JsonObject} - */ -const embedStyleEls = dict(); - -/** - * Generates ids for embedded component styles. - * @type {number} - */ -let embedIds = 0; - -/** - * Contains metadata about embedded components, found in ; - - element.setAttribute(EMBED_ID_ATTRIBUTE_NAME, elId); - pageEl.insertBefore(embedStyleEl, pageEl.firstChild); - embedStyleEls[elId] = embedStyleEl; - } - - embedStyleEls[elId][AMP_EMBED_DATA] = { - ...updateStyleForEl(element, elId, state), - }; - - const embedStyleEl = dev().assertElement( - embedStyleEls[elId], - `Failed to look up embed style element with ID ${elId}` - ); - updateEmbedStyleEl(element, embedStyleEl, embedStyleEl[AMP_EMBED_DATA]); - } - ); - } - /** * Updates tooltip text content. * @param {!Element} target @@ -1340,12 +712,6 @@ export class AmpStoryEmbeddedComponent { ); customIcon.className = 'i-amphtml-story-tooltip-custom-icon'; resetStyles(customIcon, ['background-image']); - - this.tooltip_.removeEventListener( - 'click', - this.expandComponentHandler_, - true - ); this.tooltip_.classList.remove(DARK_THEME_CLASS); this.tooltip_.removeAttribute('href'); }); diff --git a/extensions/amp-story/1.0/amp-story-page.js b/extensions/amp-story/1.0/amp-story-page.js index 99bcde0e7e09..ba2b1d64ac0c 100644 --- a/extensions/amp-story/1.0/amp-story-page.js +++ b/extensions/amp-story/1.0/amp-story-page.js @@ -21,13 +21,6 @@ import { getStoreService, } from './amp-story-store-service'; import {AdvancementConfig} from './page-advancement'; -import {AmpEvents} from '#core/constants/amp-events'; -import { - AmpStoryEmbeddedComponent, - EMBED_ID_ATTRIBUTE_NAME, - EXPANDABLE_COMPONENTS, - expandableElementsSelectors, -} from './amp-story-embedded-component'; import {AnimationManager, hasAnimations} from './animation'; import {CommonSignals} from '#core/constants/common-signals'; import {Deferred} from '#core/data-structures/promise'; @@ -48,7 +41,6 @@ import {createShadowRootWithStyle, setTextBackgroundColor} from './utils'; import {debounce} from '#core/types/function'; import {dev} from '#utils/log'; import {dict} from '#core/types/object'; -import {getAmpdoc} from '../../../src/service-helpers'; import {getFriendlyIframeEmbedOptional} from '../../../src/iframe-helper'; import {localize} from './amp-story-localization-service'; import {getLogEntries} from './logging'; @@ -66,6 +58,7 @@ import {whenUpgradedToCustomElement} from '#core/dom/amp-element-helpers'; import {toArray} from '#core/types/array'; import {upgradeBackgroundAudio} from './audio'; +import {embeddedElementsSelectors} from './amp-story-embedded-component'; /** * CSS class for an amp-story-page that indicates the entire page is loaded. @@ -100,19 +93,6 @@ export const Selectors = { ALL_TABBABLE: 'a, amp-twitter > iframe', }; -/** @private @const {string} */ -const EMBEDDED_COMPONENTS_SELECTORS = Object.keys(EXPANDABLE_COMPONENTS).join( - ', ' -); - -/** @private @const {string} */ -const INTERACTIVE_EMBEDDED_COMPONENTS_SELECTORS = Object.values( - expandableElementsSelectors() -).join(','); - -/** @private @const {number} */ -const RESIZE_TIMEOUT_MS = 1000; - /** @private @const {string} */ const TAG = 'amp-story-page'; @@ -167,33 +147,6 @@ export const NavigationDirection = { PREVIOUS: 'previous', }; -/** - * Prepares an embed for its expanded mode animation. Since this requires - * calculating the size of the embed, we debounce after each resize event to - * make sure we have the final size before doing the calculation for the - * animation. - * @param {!Window} win - * @param {!Element} page - * @param {!../../../src/service/mutator-interface.MutatorInterface} mutator - * @return {function(!Element, ?UnlistenDef)} - */ -function debounceEmbedResize(win, page, mutator) { - return debounce( - win, - (el, unlisten) => { - AmpStoryEmbeddedComponent.prepareForAnimation( - page, - dev().assertElement(el), - mutator - ); - if (unlisten) { - unlisten(); - } - }, - RESIZE_TIMEOUT_MS - ); -} - /** * The custom element, which represents a single page of * an . @@ -236,9 +189,6 @@ export class AmpStoryPage extends AMP.BaseElement { /** @private {?Element} */ this.openAttachmentEl_ = null; - /** @private @const {!../../../src/service/mutator-interface.MutatorInterface} */ - this.mutator_ = Services.mutatorForDoc(getAmpdoc(this.win.document)); - const deferred = new Deferred(); /** @private @const {!./media-performance-metrics-service.MediaPerformanceMetricsService} */ @@ -578,9 +528,6 @@ export class AmpStoryPage extends AMP.BaseElement { this.backgroundAudioDeferred_.resolve(); this.muteAllMedia(); - this.getViewport().onResize( - debounce(this.win, () => this.onResize_(), RESIZE_TIMEOUT_MS) - ); this.renderOpenAttachmentUI_(); @@ -636,13 +583,6 @@ export class AmpStoryPage extends AMP.BaseElement { ); } - /** - * @private - */ - onResize_() { - this.findAndPrepareEmbeddedComponents_(true /* forceResize */); - } - /** * Reacts to UI state updates. * @param {!UIType} uiState @@ -751,12 +691,10 @@ export class AmpStoryPage extends AMP.BaseElement { /** * Finds embedded components in page and prepares them. - * @param {boolean=} forceResize * @private */ - findAndPrepareEmbeddedComponents_(forceResize = false) { + findAndPrepareEmbeddedComponents_() { this.addClickShieldToEmbeddedComponents_(); - this.resizeInteractiveEmbeddedComponents_(forceResize); this.buildAffiliateLinks_(); } @@ -767,7 +705,7 @@ export class AmpStoryPage extends AMP.BaseElement { */ addClickShieldToEmbeddedComponents_() { const componentEls = toArray( - scopedQuerySelectorAll(this.element, EMBEDDED_COMPONENTS_SELECTORS) + scopedQuerySelectorAll(this.element, embeddedElementsSelectors()) ); if (componentEls.length <= 0) { @@ -781,37 +719,6 @@ export class AmpStoryPage extends AMP.BaseElement { }); } - /** - * Resizes interactive embeds to prepare them for their expanded animation. - * @param {boolean} forceResize - * @private - */ - resizeInteractiveEmbeddedComponents_(forceResize) { - toArray( - scopedQuerySelectorAll( - this.element, - INTERACTIVE_EMBEDDED_COMPONENTS_SELECTORS - ) - ).forEach((el) => { - const debouncePrepareForAnimation = debounceEmbedResize( - this.win, - this.element, - this.mutator_ - ); - - if (forceResize) { - debouncePrepareForAnimation(el, null /* unlisten */); - } else if (!el.hasAttribute(EMBED_ID_ATTRIBUTE_NAME)) { - // Element has not been prepared for its animation yet. - const unlisten = listen(el, AmpEvents.SIZE_CHANGED, () => { - debouncePrepareForAnimation(el, unlisten); - }); - // Run in case target never changes size. - debouncePrepareForAnimation(el, null /* unlisten */); - } - }); - } - /** * Initializes affiliate links. */ diff --git a/extensions/amp-story/1.0/amp-story-store-service.js b/extensions/amp-story/1.0/amp-story-store-service.js index 21012e29882e..f7690220f4d2 100644 --- a/extensions/amp-story/1.0/amp-story-store-service.js +++ b/extensions/amp-story/1.0/amp-story-store-service.js @@ -47,7 +47,6 @@ export const UIType = { export const EmbeddedComponentState = { HIDDEN: 0, // Component is present in page, but hasn't been interacted with. FOCUSED: 1, // Component has been clicked, a tooltip should be shown. - EXPANDED: 2, // Component is in expanded mode. }; /** @@ -314,10 +313,8 @@ const actions = (state, action, data) => { return /** @type {!State} */ ({ ...state, [StateProperty.PAUSED_STATE]: - data.state === EmbeddedComponentState.EXPANDED || data.state === EmbeddedComponentState.FOCUSED, - [StateProperty.SYSTEM_UI_IS_VISIBLE_STATE]: - data.state !== EmbeddedComponentState.EXPANDED, + [StateProperty.SYSTEM_UI_IS_VISIBLE_STATE]: true, [StateProperty.INTERACTIVE_COMPONENT_STATE]: data, }); // Shows or hides the info dialog. diff --git a/extensions/amp-story/1.0/amp-story-tooltip.css b/extensions/amp-story/1.0/amp-story-tooltip.css index 2d22aadc3cc4..b36205b646a6 100644 --- a/extensions/amp-story/1.0/amp-story-tooltip.css +++ b/extensions/amp-story/1.0/amp-story-tooltip.css @@ -149,18 +149,10 @@ background-image: url('data:image/svg+xml;charset=utf-8,') !important; } -.i-amphtml-tooltip-action-icon-expand { - background-image: url('data:image/svg+xml;charset=utf-8,') !important; -} - .i-amphtml-story-tooltip-theme-dark .i-amphtml-tooltip-action-icon-launch { background-image: url('data:image/svg+xml;charset=utf-8,') !important; } -.i-amphtml-story-tooltip-theme-dark .i-amphtml-tooltip-action-icon-expand { - background-image: url('data:image/svg+xml;charset=utf-8,') !important; -} - .i-amphtml-story-tooltip-arrow { border-right: 8px solid transparent !important; border-left: 8px solid transparent !important; diff --git a/extensions/amp-story/1.0/amp-story.css b/extensions/amp-story/1.0/amp-story.css index cdd92e9f5396..a60975a769d5 100644 --- a/extensions/amp-story/1.0/amp-story.css +++ b/extensions/amp-story/1.0/amp-story.css @@ -360,22 +360,6 @@ amp-story-grid-layer .i-amphtml-embedded-component::after { left: 0 !important; } -.i-amphtml-expanded-mode .i-amphtml-embedded-component::after { - height: 0px !important; - width: 0px !important; -} - -.i-amphtml-expanded-mode amp-story-grid-layer, -.i-amphtml-expanded-mode amp-story-grid-layer * { - contain: none !important; - z-index: auto !important; -} - -.i-amphtml-expanded-mode .i-amphtml-embedded-component.i-amphtml-expanded-component { - z-index: 1 !important; - transition: transform 0.225s cubic-bezier(0.4, 0.0, 0.2, 1) !important; -} - .i-amphtml-story-grid-template-with-full-bleed-animation { position: absolute !important; display: block !important; @@ -770,28 +754,6 @@ amp-story .amp-video-eq, z-index: 10000 !important; } -.i-amphtml-story-expanded-view-overflow { - top: 0 !important; - left: 0 !important; - width: 100% !important; - height: 100% !important; - background-color: rgba(0, 0, 0, 1) !important; - position: absolute !important; -} - -.i-amphtml-expanded-view-close-button { - position: absolute !important; - top: 0 !important; - left: 0 !important; - margin: 12px !important; - height: 24px !important; - width: 24px !important; - background-image: url('data:image/svg+xml;charset=utf-8,') !important; - cursor: pointer !important; - text-align: center !important; - background-color: transparent !important; /* Resets default button background-color. */ -} - @keyframes play-button-fly-in { 0% { opacity: 0; diff --git a/extensions/amp-story/1.0/page-advancement.js b/extensions/amp-story/1.0/page-advancement.js index 83df6bad0ec3..e25416b683dc 100644 --- a/extensions/amp-story/1.0/page-advancement.js +++ b/extensions/amp-story/1.0/page-advancement.js @@ -16,8 +16,8 @@ import {dev, user} from '#utils/log'; import {escapeCssSelectorIdent} from '#core/dom/css-selectors'; import {getAmpdoc} from '../../../src/service-helpers'; import {hasTapAction, timeStrToMillis} from './utils'; -import {interactiveElementsSelectors} from './amp-story-embedded-component'; import {listenOnce} from '#utils/event-helper'; +import {interactiveElementsSelectors} from './amp-story-embedded-component'; /** @private @const {number} */ const HOLD_TOUCH_THRESHOLD_MS = 500; @@ -59,10 +59,6 @@ const MINIMUM_TIME_BASED_AUTO_ADVANCE_MS = 500; */ const MAX_LINK_SCREEN_PERCENT = 0.8; -const INTERACTIVE_EMBEDDED_COMPONENTS_SELECTORS = Object.values( - interactiveElementsSelectors() -).join(','); - /** @const {number} */ export const POLL_INTERVAL_MS = 300; @@ -396,12 +392,7 @@ export class ManualAdvancement extends AdvancementConfig { this.touchstartTimestamp_ = null; this.timer_.cancel(this.timeoutId_); this.timeoutId_ = null; - if ( - !this.storeService_.get(StateProperty.SYSTEM_UI_IS_VISIBLE_STATE) && - /** @type {InteractiveComponentDef} */ ( - this.storeService_.get(StateProperty.INTERACTIVE_COMPONENT_STATE) - ).state !== EmbeddedComponentState.EXPANDED - ) { + if (!this.storeService_.get(StateProperty.SYSTEM_UI_IS_VISIBLE_STATE)) { this.storeService_.dispatch(Action.TOGGLE_SYSTEM_UI_IS_VISIBLE, true); } } @@ -639,15 +630,10 @@ export class ManualAdvancement extends AdvancementConfig { */ isHandledByEmbeddedComponent_(event, pageRect) { const target = dev().assertElement(event.target); - const stored = /** @type {InteractiveComponentDef} */ ( - this.storeService_.get(StateProperty.INTERACTIVE_COMPONENT_STATE) - ); - const inExpandedMode = stored.state === EmbeddedComponentState.EXPANDED; return ( - inExpandedMode || - (matches(target, INTERACTIVE_EMBEDDED_COMPONENTS_SELECTORS) && - this.canShowTooltip_(event, pageRect)) + matches(target, interactiveElementsSelectors()) && + this.canShowTooltip_(event, pageRect) ); }