amp-bind: Improve e-commerce example (ampproject#8924)

* first pass on prettifying ecommerce sample * more progress on ecommerce sample * add more sizes * inline material design lite css * fix initial value issues * kevin's comments * elaborate comment
spotxchange · May 3, 2017 · 3996ceb · 3996ceb
1 parent ef19e59
commit 3996ceb
Show file tree

Hide file tree

Showing 23 changed files with 294 additions and 54 deletions.
diff --git a/build-system/app.js b/build-system/app.js
@@ -638,32 +638,58 @@ app.use('/bind/ecommerce/sizes', function(req, res, next) {
   setTimeout(() => {
     var prices = {
       "0": {
-        "sizes": ["XS"]
+        "sizes": {
+          "XS": 8.99,
+          "S": 9.99,
+        },
       },
       "1": {
-        "sizes": ["S", "M", "L"]
+        "sizes": {
+          "S": 10.99,
+          "M": 12.99,
+          "L": 14.99,
+        },
       },
       "2": {
-        "sizes": ["XL"]
+        "sizes": {
+          "L": 11.99,
+          "XL": 13.99,
+        },
       },
       "3": {
-        "sizes": ["M", "XL"]
+        "sizes": {
+          "M": 7.99,
+          "L": 9.99,
+          "XL": 11.99,
+        },
       },
       "4": {
-        "sizes": ["S", "L"]
+        "sizes": {
+          "XS": 8.99,
+          "S": 10.99,
+          "L": 15.99,
+        },
       },
       "5": {
-        "sizes": ["S", "XL"]
+        "sizes": {
+          "S": 8.99,
+          "L": 14.99,
+          "XL": 11.99,
+        },
       },
       "6": {
-        "sizes": ["XS", "M"]
+        "sizes": {
+          "XS": 8.99,
+          "S": 9.99,
+          "M": 12.99,
+        },
       },
       "7": {
-        "sizes": ["M", "L", "XL"]
+        "sizes": {
+          "M": 10.99,
+          "L": 11.99,
+        },
       },
-      "8": {
-        "sizes": ["XS", "M", "XL"]
-      }
     };
     const object = {};
     object[req.query.shirt] = prices[req.query.shirt];

diff --git a/examples/bind/ecommerce.amp.html b/examples/bind/ecommerce.amp.html
diff --git a/examples/bind/img/ic_menu_white_24dp_1x.png b/examples/bind/img/ic_menu_white_24dp_1x.png
diff --git a/examples/bind/img/ic_menu_white_24dp_2x.png b/examples/bind/img/ic_menu_white_24dp_2x.png
diff --git a/examples/bind/img/ic_search_white_24dp_1x.png b/examples/bind/img/ic_search_white_24dp_1x.png
diff --git a/examples/bind/img/ic_search_white_24dp_2x.png b/examples/bind/img/ic_search_white_24dp_2x.png
diff --git a/examples/bind/shirts/black.jpg b/examples/bind/shirts/black.jpg
diff --git a/examples/bind/shirts/blue.jpg b/examples/bind/shirts/blue.jpg
diff --git a/examples/bind/shirts/brown.jpg b/examples/bind/shirts/brown.jpg
diff --git a/examples/bind/shirts/dark-green.jpg b/examples/bind/shirts/dark-green.jpg
diff --git a/examples/bind/shirts/gray.jpg b/examples/bind/shirts/gray.jpg
diff --git a/examples/bind/shirts/light-gray.jpg b/examples/bind/shirts/light-gray.jpg
diff --git a/examples/bind/shirts/navy.jpg b/examples/bind/shirts/navy.jpg
diff --git a/examples/bind/shirts/swatch/black.jpg b/examples/bind/shirts/swatch/black.jpg
diff --git a/examples/bind/shirts/swatch/blue.jpg b/examples/bind/shirts/swatch/blue.jpg
diff --git a/examples/bind/shirts/swatch/brown.jpg b/examples/bind/shirts/swatch/brown.jpg
diff --git a/examples/bind/shirts/swatch/dark-green.jpg b/examples/bind/shirts/swatch/dark-green.jpg
diff --git a/examples/bind/shirts/swatch/gray.jpg b/examples/bind/shirts/swatch/gray.jpg
diff --git a/examples/bind/shirts/swatch/light-gray.jpg b/examples/bind/shirts/swatch/light-gray.jpg
diff --git a/examples/bind/shirts/swatch/navy.jpg b/examples/bind/shirts/swatch/navy.jpg
diff --git a/examples/bind/shirts/swatch/wine.jpg b/examples/bind/shirts/swatch/wine.jpg
diff --git a/examples/bind/shirts/white.jpg b/examples/bind/shirts/white.jpg
diff --git a/examples/bind/shirts/wine.jpg b/examples/bind/shirts/wine.jpg