improvements to geolocation demo and other cleanup

wesleyhales · Jun 2, 2012 · c64f254 · c64f254
1 parent 6428b4a
commit c64f254
Show file tree

Hide file tree

Showing 6 changed files with 40 additions and 35 deletions.
diff --git a/example/Example.iml b/example/Example.iml
diff --git a/example/demo.css b/example/demo.css
@@ -37,4 +37,25 @@ nav.primary > ul li a {
     background-color: #ff1493;
     width: 100%;
     height: 100%;
-}
+}
+
+.worker-table {
+    border:  1px solid black;
+}
+
+.worker-table tr td {
+    border:  1px solid black
+}
+
+.worker-table tr td.a6 {
+    background-color: white;
+}
+
+.worker-table tr td.a7 {
+    background-color: green;
+}
+
+.worker-table tr td.a8 {
+    background-color: yellow;
+}
+
diff --git a/example/geo/index.html b/example/geo/index.html
@@ -17,9 +17,12 @@
 slidfast({
    defaultPageID:'home-page',
    touchEnabled: true,
-   geo: {on:true,track:true,interval:10000}
+   geo: {on:true,track:true,interval:10000,callback:geoCallback}
 });
 
+function geoCallback(e){
+    document.querySelector("#log").innerHTML += e + "<br/>";
+}
 
 </script>
 
@@ -31,7 +34,6 @@
             <li><a href="#sf-home-page" onclick="slidfast.ui.slideTo('home-page')">Home</a></li>
             <li><a href="#sf-products-page" onclick="slidfast.ui.slideTo('products-page')">Products</a></li>
             <li><a href="#sf-about-page" onclick="slidfast.ui.slideTo('about-page')">About</a></li>
-            <li><a href="#sf-contact-page" onclick="slidfast.ui.flip('contact-page')">Contact</a></li>
         </ul>
     </nav>
 
@@ -41,27 +43,19 @@
 
             <div id="home-page" class="page">
                 <h1>Home Page</h1>
-                <a href="demo/home-detail.html" class="fetch">Find out more about the home page!</a>
+                <div id="log"></div>
             </div>
 
             <div id="products-page" class="page stage-right">
                 <h1>Products Page</h1>
-                <a href="demo/product-listing.html" class="fetch">We got some product listings fer ya!</a>
+                <a href="../demo/product-listing.html" class="fetch">We got some product listings fer ya!</a>
             </div>
 
             <div id="about-page" class="page stage-left">
                 <h1>About Page</h1>
-                <a href="demo/about-cto.html">You know you want to know more about us!</a>
+                <a href="../demo/about-cto.html">You know you want to know more about us!</a>
             </div>
         </div>
-        <div id="back" class="flipped">
-
-            <div id="contact-page" class="page">
-                <h1>Contact Page</h1>
-                <a href="demo/contact-map.html" class="fetch">Check out our map!</a>
-            </div>
-
-        </div>
 
     </div>
 </div>

diff --git a/example/orientation/index.html b/example/orientation/index.html
@@ -43,17 +43,17 @@
 
                 </div>
                 <h1>Home Page</h1>
-                <a href="demo/home-detail.html" class="fetch">Find out more about the home page!</a>
+                <a href="../demo/home-detail.html" class="fetch">Find out more about the home page!</a>
             </div>
 
             <div id="products-page" class="page stage-left">
                 <h1>Products Page</h1>
-                <a href="demo/product-listing.html" class="fetch">We got some product listings fer ya!</a>
+                <a href="../demo/product-listing.html" class="fetch">We got some product listings fer ya!</a>
             </div>
 
             <div id="about-page" class="page stage-left">
                 <h1>About Page</h1>
-                <a href="demo/about-cto.html">You know you want to know more about us!</a>
+                <a href="../demo/about-cto.html">You know you want to know more about us!</a>
             </div>
         </div>
 

diff --git a/example/workers/index.html b/example/workers/index.html
@@ -17,14 +17,13 @@
 
         slidfast({
             defaultPageID:'home-page',
-            touchEnabled: true,
             workers: {script:'worker1.js', threads:9, mycallback:workerCallback}
         });
 
         slidfast.worker.obj().foo = 1;
 
         function workerCallback(e){
-            document.querySelector("#log tbody").innerHTML += "<tr><td>" + e.data.foo + "</td><td>" + e.data.index + "</td></tr>";
+            document.querySelector("#log tbody").innerHTML += "<tr><td class="+ 'a' + e.data.index +">" + e.data.foo + "</td><td class="+ 'a' + e.data.index +">" + e.data.index + "</td></tr>";
         }
 
     </script>
@@ -45,7 +44,7 @@
 
             <div id="home-page" class="page">
                 <h1>Home Page</h1>
-                <table id="log" style="border:1px solid black">
+                <table id="log" class="worker-table">
                     <thead>
                         <tr>
                             <td>Data</td>
@@ -60,12 +59,12 @@ <h1>Home Page</h1>
 
             <div id="products-page" class="page stage-right">
                 <h1>Products Page</h1>
-                <a href="demo/product-listing.html" class="fetch">We got some product listings fer ya!</a>
+                <a href="../demo/product-listing.html" class="fetch">We got some product listings fer ya!</a>
             </div>
 
             <div id="about-page" class="page stage-left">
                 <h1>About Page</h1>
-                <a href="demo/about-cto.html">You know you want to know more about us!</a>
+                <a href="../demo/about-cto.html">You know you want to know more about us!</a>
             </div>
         </div>
 

diff --git a/slidfast.js b/slidfast.js
@@ -368,7 +368,6 @@
                 focusPage.className = 'page transition stage-center';
 
                 //6. make this transition bookmarkable
-                //console.log(focusPage.id);
                 slidfast.core.locationChange(focusPage.id);
 
                 if (touchEnabled) {
@@ -636,14 +635,15 @@
 
         };
 
-        var geolocationID, currentPosition, interval;
+        var geolocationID, currentPosition, interval, callback;
         slidfast.location = slidfast.prototype = {
 
             init:function (geo) {
                 if (slidfast.html5e.supports_geolocation()) {
                     if (geo.track) {
                         slidfast.location.track();
                         interval = geo.interval ? geo.interval : 10000;
+                        callback = geo.callback;
                     } else {
                         if (currentPosition === undefined) {
                             navigator.geolocation.getCurrentPosition(function (position) {
@@ -676,6 +676,7 @@
             setPosition:function (position) {
                 currentPosition = position;
                 console.log('position ' + position.coords.latitude + ' ' + position.coords.longitude);
+                callback('position ' + position.coords.latitude + ' ' + position.coords.longitude);
             },
 
             currentPosition:function () {
@@ -958,7 +959,7 @@
                     return false;
                 }
             },
-
+            //geolocation cannot be accessed with dot notation in iOS5... will prevent page caching
             supports_geolocation:function () {
                 try {
                     return 'geolocation' in navigator && navigator['geolocation'] !== null;