Merge pull request #376 from GoogleWebComponents/2.0-preview

2.0 preview
GoogleWebComponents · Aug 2, 2017 · b423421 · b423421
2 parents 9ca485d + 54bb297
commit b423421
Show file tree

Hide file tree

Showing 15 changed files with 62 additions and 42 deletions.
diff --git a/README.md b/README.md
@@ -24,3 +24,6 @@ google-map
   <google-map-marker latitude="37.78" longitude="-122.4" draggable="true"></google-map-marker>
 </google-map>
 ```
+
+Breaking changes:
+ * Markers added to `<google-map>` must now specify `slot="markers"` to be added correctly.
diff --git a/bower.json b/bower.json
@@ -28,13 +28,27 @@
     "maps"
   ],
   "dependencies": {
-    "polymer": "Polymer/polymer#^1.7.1",
-    "google-apis": "GoogleWebComponents/google-apis#^1.1.7",
-    "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.5",
-    "iron-selector": "PolymerElements/iron-selector#^1.5.2"
+    "polymer": "Polymer/polymer#1.9 - 2",
+    "google-apis": "GoogleWebComponents/google-apis#^2.0.0",
+    "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#1 - 2",
+    "iron-selector": "PolymerElements/iron-selector#1 - 2"
   },
   "devDependencies": {
-    "web-component-tester": "*",
-    "iron-component-page": "PolymerElements/iron-component-page#^1.1.7"
+    "web-component-tester": "^6.0.0",
+    "iron-component-page": "PolymerElements/iron-component-page#^1 - 2"
+  },
+  "variants": {
+    "1.x": {
+      "dependencies": {
+        "polymer": "Polymer/polymer#^1.9.0",
+        "google-apis": "GoogleWebComponents/google-apis#^1.1.7",
+        "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.5",
+        "iron-selector": "PolymerElements/iron-selector#^1.5.2"
+      },
+      "devDependencies": {
+        "web-component-tester": "^4.0.0",
+        "iron-component-page": "PolymerElements/iron-component-page#^1.1.7"
+      }
+    }
   }
 }
diff --git a/demo/index.html b/demo/index.html
@@ -4,7 +4,7 @@
 <head>
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
   <title>Google Map demo</title>
-  <script src="../../webcomponentsjs/webcomponents-lite.min.js"></script>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../google-map.html">
   <link rel="import" href="../google-map-marker.html">
   <link rel="import" href="../google-map-poly.html">
@@ -23,23 +23,25 @@
 </head>
 <body class="fullbleed">
 
-<template is="dom-bind">
-  <google-map latitude="37.779" longitude="-122.3892" min-zoom="9" max-zoom="11"
-              language="en" api-key="[[apiKey]]">
-    <google-map-marker latitude="37.779" longitude="-122.3892" label="GG"
-                       title="Go Giants!" draggable="true" drag-events>
-      <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/49/San_Francisco_Giants_Cap_Insignia.svg/200px-San_Francisco_Giants_Cap_Insignia.svg.png" />
-    </google-map-marker>
-    <google-map-poly closed fill-color="red" fill-opacity=".25" stroke-weight="1">
-      <google-map-point latitude="37.779" longitude="-122.3892"></google-map-point>
-      <google-map-point latitude="37.804" longitude="-122.2711"></google-map-point>
-      <google-map-point latitude="37.386" longitude="-122.0837"></google-map-point>
-    </google-map-poly>
-  </google-map>
+<dom-bind>
+  <template is="dom-bind">
+    <google-map latitude="37.779" longitude="-122.3892" min-zoom="9" max-zoom="11"
+                language="en" api-key="[[apiKey]]">
+      <google-map-marker slot="markers" latitude="37.779" longitude="-122.3892" label="GG"
+                         title="Go Giants!" draggable="true" drag-events>
+        <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/49/San_Francisco_Giants_Cap_Insignia.svg/200px-San_Francisco_Giants_Cap_Insignia.svg.png" />
+      </google-map-marker>
+      <google-map-poly closed fill-color="red" fill-opacity=".25" stroke-weight="1">
+        <google-map-point latitude="37.779" longitude="-122.3892"></google-map-point>
+        <google-map-point latitude="37.804" longitude="-122.2711"></google-map-point>
+        <google-map-point latitude="37.386" longitude="-122.0837"></google-map-point>
+      </google-map-poly>
+    </google-map>
 
-  <google-map-directions start-address="Oakland" end-address="Mountain View"
-                         language="en" api-key="[[apiKey]]"></google-map-directions>
-</template>
+    <google-map-directions start-address="Oakland" end-address="Mountain View"
+                           language="en" api-key="[[apiKey]]"></google-map-directions>
+  </template>
+</dom-bind>
 
 <button id="controlsToggle" onclick="toggleControls()">Toggle controls</button>
 

diff --git a/demo/kml.html b/demo/kml.html
@@ -4,7 +4,7 @@
 <head>
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
   <title>Google Map Poly demo</title>
-  <script src="../../webcomponentsjs/webcomponents-lite.min.js"></script>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../google-map.html">
   <link rel="import" href="../google-map-poly.html">
   <style>

diff --git a/demo/polys.html b/demo/polys.html
@@ -4,7 +4,7 @@
 <head>
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
   <title>Google Map Poly demo</title>
-  <script src="../../webcomponentsjs/webcomponents-lite.min.js"></script>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../google-map.html">
   <link rel="import" href="../google-map-poly.html">
   <style>

diff --git a/google-map-marker.html b/google-map-marker.html
@@ -40,7 +40,7 @@
       }
     </style>
 
-    <content></content>
+    <slot></slot>
   </template>
   <script>
     (function() {

diff --git a/google-map-poly.html b/google-map-poly.html
@@ -37,7 +37,7 @@
       }
     </style>
 
-    <content id="points" select="google-map-point"></content>
+    <slot id="points"></slot>
   </template>
   <script>
     (function() {
@@ -487,7 +487,8 @@
           this._building = true;
           this.path.clear();
           for (var i = 0, point; point = this._points[i]; ++i) {
-            this.path.push(point.getPosition());
+            if (point.tagName == 'google-map-point')
+              this.path.push(point.getPosition());
           }
           this._building = false;
 

diff --git a/google-map.html b/google-map.html
@@ -97,10 +97,10 @@
         selected-attribute="open"
         activate-event="google-map-marker-open"
         on-google-map-marker-close="_deselectMarker">
-      <content id="markers" select="google-map-marker"></content>
+      <slot id="markers" name="markers"></slot>
     </iron-selector>
 
-    <content id="objects" select="*"></content>
+    <slot id="objects"></slot>
   </template>
   <script>
     Polymer({

diff --git a/test/google-map-basic.html b/test/google-map-basic.html
@@ -4,7 +4,7 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
-  <script src="../../webcomponentsjs/webcomponents.js"></script>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <script src="../../web-component-tester/browser.js"></script>
   <link rel="import" href="../google-map.html">
 </head>

diff --git a/test/google-map-update-pos.html b/test/google-map-update-pos.html
@@ -4,7 +4,7 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
-  <script src="../../webcomponentsjs/webcomponents.js"></script>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <script src="../../web-component-tester/browser.js"></script>
   <link rel="import" href="../google-map.html">
 </head>

diff --git a/test/marker-basic.html b/test/marker-basic.html
@@ -4,16 +4,16 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
-  <script src="../../webcomponentsjs/webcomponents.js"></script>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <script src="../../web-component-tester/browser.js"></script>
   <link rel="import" href="../google-map.html">
 </head>
 <body>
 
   <google-map id="map1" latitude="37.77493" longitude="-122.41942">
-    <google-map-marker latitude="37.779" longitude="-122.3892"></google-map-marker>
-    <google-map-marker id="marker2" latitude="37.777" longitude="-122.38911" drag-events></google-map-marker>
-    <google-map-marker id="labeled-marker" label="GG" latitude="37.777" longitude="-122.38911" drag-events></google-map-marker>
+    <google-map-marker slot="markers" latitude="37.779" longitude="-122.3892"></google-map-marker>
+    <google-map-marker slot="markers" id="marker2" latitude="37.777" longitude="-122.38911" drag-events></google-map-marker>
+    <google-map-marker slot="markers" id="labeled-marker" label="GG" latitude="37.777" longitude="-122.38911" drag-events></google-map-marker>
   </google-map>
 
 <script>

diff --git a/test/markers-add-remove.html b/test/markers-add-remove.html
@@ -4,15 +4,15 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
-  <script src="../../webcomponentsjs/webcomponents.js"></script>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <script src="../../web-component-tester/browser.js"></script>
   <link rel="import" href="../google-map.html">
 </head>
 <body>
 
   <google-map id="map1" latitude="37.77493" longitude="-122.41942">
-    <google-map-marker latitude="37.779" longitude="-122.3892"></google-map-marker>
-    <google-map-marker latitude="37.777" longitude="-122.38911"></google-map-marker>
+    <google-map-marker slot="markers" latitude="37.779" longitude="-122.3892"></google-map-marker>
+    <google-map-marker slot="markers" latitude="37.777" longitude="-122.38911"></google-map-marker>
   </google-map>
 
 <script>

diff --git a/test/origin-tests.html b/test/origin-tests.html
@@ -4,7 +4,7 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
-  <script src="../../webcomponentsjs/webcomponents.js"></script>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <script src="../../web-component-tester/browser.js"></script>
   <link rel="import" href="../google-map.html">
 </head>

diff --git a/test/poly-basic.html b/test/poly-basic.html
@@ -4,7 +4,7 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
-  <script src="../../webcomponentsjs/webcomponents.js"></script>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <script src="../../web-component-tester/browser.js"></script>
   <link rel="import" href="../google-map.html">
   <link rel="import" href="../google-map-poly.html">

diff --git a/test/poly-custom-properties.html b/test/poly-custom-properties.html
@@ -4,7 +4,7 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
-  <script src="../../webcomponentsjs/webcomponents.js"></script>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <script src="../../web-component-tester/browser.js"></script>
   <link rel="import" href="../google-map.html">
   <link rel="import" href="../google-map-poly.html">