diff --git a/.gitignore b/.gitignore
index 570d18019..dc35f5abd 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,8 +1,9 @@
-/nbproject/private/
-/nbproject/customs.json
-/nbproject/project.properties
-/nbproject/project.xml
-/nbproject/
-/src/bower_components/
-/src/demo/bower_components/
-/dist/
+/nbproject/private/
+/nbproject/customs.json
+/nbproject/project.properties
+/nbproject/project.xml
+/nbproject/
+/src/bower_components/
+/src/demo/bower_components/
+/dist/
+/bower_components/
\ No newline at end of file
diff --git a/README.md b/README.md
index 2cdc4237d..2bec0eced 100644
--- a/README.md
+++ b/README.md
@@ -1,9 +1,5 @@
 
-# web-map Customized Built-In &lt;map&gt; Element
-
-[![Build Status](https://travis-ci.org/prushforth/Web-Map-Custom-Element.svg?branch=master)](https://travis-ci.org/prushforth/Web-Map-Custom-Element)
-
-The web-map Customized Built-In &lt;map&gt; Element is a [prototype implementation](http://maps4html.github.io/Web-Map-Custom-Element/) of the [HTML-Map-Element specification](http://maps4html.github.io/HTML-Map-Element/spec/).
+# Customized Built-In &lt;map&gt; Element
 
 [![Build Status](https://travis-ci.org/prushforth/Web-Map-Custom-Element.svg?branch=master)](https://travis-ci.org/prushforth/Web-Map-Custom-Element)
 
diff --git a/bower.json b/bower.json
index 419d9443d..8fed8f811 100644
--- a/bower.json
+++ b/bower.json
@@ -7,7 +7,7 @@
     {"name": "Maps for HTML Community Group", "email": "public-maps4html@w3.org", "homepage": "https://www.w3.org/community/maps4html/"}
   ],
   "homepage": "http://maps4html.github.io/Web-Map-Custom-Element/",
-  "license": "W3C SOFTWARE AND DOCUMENT NOTICE AND LICENSE",
+  "license": "W3C",
   "keywords": [
     "framework",
     "web-components",
diff --git a/demo/index.html b/demo/index.html
index b49b53704..4bb7f9572 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -34,23 +34,24 @@
   <body>
     <div>
       <!-- the @width / @height attributes take precedence over properties, but currently don't change to reflect updates -->
-      <img usemap="#dowslake" src="map1.png" width="700" height="400" alt="Dow's Lake area" />
+<!--      <img usemap="#dowslake" src="map1.png" width="700" height="400" alt="Dow's Lake area" />-->
       <map name="dowslake" is="web-map" zoom="17" lat="45.398043" lon="-75.70683" width="700" height="400" controls hidden>
-        <layer- id="osm" src="http://geogratis.gc.ca/mapml/en/osmtile/osm/" label="Open Street Map" checked hidden></layer->
-        <layer- id="cbmt" label="Canada Base Map" src="http://geogratis.gc.ca/mapml/en/osmtile/cbmt/" checked></layer->
-        <layer- id="canvec" label="CanVec+ 031G" src="http://geogratis.gc.ca/mapml/canvec/50k/features/" class="transparency"></layer->
-        <!-- the HTML author can create MapML files and serve them as layers if they prefer -->
+        <layer- id="osm" src="http://geogratis.gc.ca/mapml/en/osmtile/osm/" label="Open Street Map" checked ></layer->
+        <device-location centered></device-location>
+<!--        <layer- id="cbmt" label="Canada Base Map" src="http://geogratis.gc.ca/mapml/en/osmtile/cbmt/" checked></layer->-->
+<!--        <layer- id="canvec" label="CanVec+ 031G" src="http://geogratis.gc.ca/mapml/canvec/50k/features/" class="transparency"></layer->
+         the HTML author can create MapML files and serve them as layers if they prefer 
         <layer- id="marker" label="Marker layer" src="marker.mapml"></layer->
 
-        <!-- or the HTML author can create map 'area's (links) within the HTML document -->
-<!--        <area is="map-area"id="wholemap" href='http://example.com/default/' alt="Default" shape="default" style="fill: salmon; stroke: none; fill-opacity: 0.01"></map-area>-->
+         or the HTML author can create map 'area's (links) within the HTML document 
+        <area is="map-area"id="wholemap" href='http://example.com/default/' alt="Default" shape="default" style="fill: salmon; stroke: none; fill-opacity: 0.01"></map-area>
         <area is="map-area" id="marker2" href='http://example.com/marker/' alt="Marker" coords="265,185,265,185" shape="marker">
         <area is="map-area" id="line" href='http://example.com/line/' alt="Line" coords="275,275,540,107" shape="line">
 
         <area is="map-area" id="doughnut" alt="Circle" href='http://example.com/circle/' coords="250,250,25" shape="circle" style="fill: white; stroke: aqua; stroke-width: 5px;fill-opacity: 0.0">
         <area is="map-area" id="hole" coords="250,250,7" shape="circle" style="fill: blue; stroke: none;fill-opacity: 0.3;">
         <area is="map-area" id="rect" href='http://example.com/rectangle/' alt="Rectangle" coords="345,290,415,320" shape="rect" style="fill: greenyellow; stroke: blue; stroke-width: 3px;fill-opacity: 0.4">
-        <area is="map-area" id="poly" href='http://example.com/polygon/' alt="Polygon" coords="392,116,430,100,441,128,405,145" shape="poly" style="fill: pink; stroke: blue; stroke-width: 3px;fill-opacity: 0.4">
+        <area is="map-area" id="poly" href='http://example.com/polygon/' alt="Polygon" coords="392,116,430,100,441,128,405,145" shape="poly" style="fill: pink; stroke: blue; stroke-width: 3px;fill-opacity: 0.4">-->
       </map>
     </div>
   </body>
diff --git a/device-location.html b/device-location.html
new file mode 100644
index 000000000..9189a7a73
--- /dev/null
+++ b/device-location.html
@@ -0,0 +1,96 @@
+<dom-module id="device-location">
+<script>
+  
+Polymer({
+    is: "device-location",
+    properties: {
+      lat : {
+        type: Number,
+        value: 0,
+        reflectToAttribute: false
+      },
+      lon : {
+        type: Number,
+        value: 0,
+        reflectToAttribute: false
+      },
+      centered : {
+          type: Boolean,
+          reflectToAttribute: true
+      }
+    },
+    observers: [
+      '_toggleCentered(centered)'
+    ],
+    _toggleCentered: function (centered) {
+        if (centered) {
+            // TODO create a point feature on the controls pane at the map center
+            // DONE register a watchPosition function to move the map as the device
+            // location changes
+            var self = this,
+                options = {
+                        enableHighAccuracy: true,
+                        timeout: 5000,
+                        maximumAge: 0
+                    };
+                function moveTo(position) {
+                    self.lat = position.coords.latitude;
+                    self.lon = position.coords.longitude;
+                    if (self.parentNode.zoomTo && self.parentNode._map) {
+                        // TODO when the zoomTo bug is fixed, remove zoom+1
+                        self.parentNode.zoomTo(self.lat,self.lon,self.parentNode.zoom+1);
+                    }
+                };
+            this._watchID = navigator.geolocation.watchPosition(moveTo,null,options);
+        } else {
+            this._deleteWatch();
+            // TODO replace the marker on the control pane at the center of the map
+            // with an actual point feature , or simply move that point from
+            // the control pane to the vector pane
+            
+            // TODO register a navigator.geolocation.watchPosition function to
+            // update the location of the above point feature
+        }
+    },
+    detached: function() {
+        this._deleteWatch();
+        // TODO if there is a point associated to this control, remove/delete it
+    },
+    ready: function() {
+        if (this.centered) {
+            var self = this,
+                options = {
+                        enableHighAccuracy: true,
+                        timeout: 5000,
+                        maximumAge: 0
+                    };
+                function moveTo(position) {
+                    self.lat = position.coords.latitude;
+                    self.lon = position.coords.longitude;
+                    if (self.parentNode.zoomTo && self.parentNode._map) {
+                        // TODO when the zoomTo bug is fixed, remove zoom+1
+                        self.parentNode.zoomTo(self.lat,self.lon,self.parentNode.zoom+1);
+                    }
+                };
+            this._watchID = navigator.geolocation.watchPosition(moveTo,null,options);
+        }
+    },
+//    attached: function() {
+//        this._deleteWatch();
+//        // could have a _watchID from being created without being detached
+//        // i.e. never having been attached before...
+//        if (this.centered) {
+//            // create point on the control layer at the map center...
+//            
+//        }
+//        
+//    },
+    _deleteWatch: function() {
+        if (this._watchID) {
+            navigator.geolocation.clearWatch(this._watchID);
+            delete this._watchID;
+        }
+    }
+});
+</script>
+</dom-module>
diff --git a/web-map.html b/web-map.html
index 3042623e0..d9fde3ffb 100644
--- a/web-map.html
+++ b/web-map.html
@@ -1,4 +1,5 @@
-<link rel="import" href="../polymer/polymer.html">
+<link rel="import" href="./bower_components/polymer/polymer.html">
+<link rel="import" href="device-location.html">
 <link rel="import" href="map-layer.html">
 <link rel="import" href="map-area.html">
 <!-- styles scoped to inside a custom element must be in a style module -->
