Refactor swg example using amp-access-iframe (#28320)

ampproject · May 12, 2020 · e0498eb · e0498eb
1 parent b65705a
commit e0498eb
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 9 deletions.
diff --git a/examples/amp-subscriptions-iframe.amp.html → ...-google/amp-subscriptions-iframe.amp.html b/examples/amp-subscriptions-iframe.amp.html → ...-google/amp-subscriptions-iframe.amp.html
@@ -28,7 +28,7 @@
       "services": [
         {
           "type": "iframe",
-          "iframeSrc": "//localhost:8000/examples/amp-subscriptions-iframe.provider.html",
+          "iframeSrc": "//localhost:8000/examples/amp-subscriptions-google/amp-subscriptions-iframe.provider.html",
           "iframeVars": [
             "READER_ID",
             "CANONICAL_URL",
@@ -167,6 +167,15 @@
       padding: 16px;
       background: #ffc;
     }
+
+    amp-subscriptions-dialog {
+      text-align: center;
+      padding: 5px;
+    }
+
+    #subscribebutton {
+      display: inline-block;
+    }
 
   </style>
 </head>
@@ -217,8 +226,8 @@
     <article>
       <figure>
         <amp-img
-            src="img/hero@1x.jpg"
-            srcset="img/hero@1x.jpg 1x, img/hero@2x.jpg 2x"
+            src="../img/hero@1x.jpg"
+            srcset="../img/hero@1x.jpg 1x, ../img/hero@2x.jpg 2x"
             layout="responsive" width="360" placeholder
             alt="Curabitur convallis, urna quis pulvinar feugiat, purus diam posuere turpis, sit amet tincidunt purus justo et mi."
             height="216">
@@ -236,7 +245,7 @@ <h1 itemprop="headline">Lorem Ipsum</h1>
         </header>
 
         <div class="author">
-          <amp-img src="img/sample.jpg" id="author-avatar" placeholder
+          <amp-img src="../img/sample.jpg" id="author-avatar" placeholder
               height="50" width="50">
           </amp-img>
           <div class="byline">
@@ -311,8 +320,8 @@ <h1 itemprop="headline">Lorem Ipsum</h1>
 
           <figure>
             <amp-img class="full-bleed" placeholder
-                src="img/sea@1x.jpg"
-                srcset="img/sea@1x.jpg 1x, img/sea@2x.jpg 2x"
+                src="../img/sea@1x.jpg"
+                srcset="../img/sea@1x.jpg 1x, img/sea@2x.jpg 2x"
                 layout="responsive" width="360"
                 alt="Fusce pretium tempor justo, vitae consequat dolor maximus eget."
                 height="216">
@@ -362,7 +371,7 @@ <h1 itemprop="headline">Lorem Ipsum</h1>
   </template>
   <template type="amp-mustache" subscriptions-dialog subscriptions-display="NOT data.loggedIn">
     <div>Dialog for non logged in users<div>
-    <div subscriptions-display="NOT data.loggedIn"
+    <div id="subscribebutton" subscriptions-display="NOT data.loggedIn"
       subscriptions-action="subscribe"
       subscriptions-service="subscribe.google.com"
       subscriptions-decorate>Login</div>

diff --git a/...es/amp-subscriptions-iframe.provider.html → ...le/amp-subscriptions-iframe.provider.html b/...es/amp-subscriptions-iframe.provider.html → ...le/amp-subscriptions-iframe.provider.html
@@ -1,8 +1,8 @@
 <!doctype html>
 <html>
 <head>
-  <script src="../extensions/amp-access/0.1/iframe-api/build/index.js"></script>
-
+  <script src="/extensions/amp-access/0.1/iframe-api/build/index.js"></script>
+  
   <script>
 
     var pageConfig;