Changed elevation chart to google interactive chart (image api is dep…

…ricated). Changed youtube vids to runtime injections/removals, so most users who don't pull up those windows don't have to wait for iframes and the videos stop when the ui dialog is closed. Added route to link in non-address info windows if there's a record selected. Improved apple touch icon and favicon. Clear our route not found message when route is found. Fixed photo attribution bug.

css/style.css

@@ -245,7 +245,7 @@ aside {
   left: 0;
   top: 64px;
   bottom: 0;
-  width: 390px;
+  width: 350px;
   overflow: auto;
   overflow-x: hidden;
   overflow-y: auto;
@@ -257,7 +257,7 @@ aside {
 #map-container {
   position: absolute;
   top: 65px;
-  left: 390px;
+  left: 350px;
   right: 0;
   bottom: 0;
   overflow: hidden;
@@ -326,8 +326,7 @@ footer hr { clear:both; width: 90%; margin: 3px auto 0; height: 3px; border-colo
 #map { border: 1px solid #D9D9D9; }
 #map div {-moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
 #opacitySlider { margin: 18px auto 30px auto; width: 90%}
-#elevation_chart { position: absolute; top: 35px; right: 7px; background: white; padding: 5px; text-align: center;}
-#elevation_chart span { font-weight: bold; position: relative; top: -10px;  }
+#elevation_chart { position: absolute; top: 65px; right: 7px; text-align: center; background: white; padding: 5px; box-shadow: 3px 3px 6px #666; }
 #streetview { position: absolute; bottom: 7px; right: 7px; width: 50%; height: 40%; border: 4px solid white; }
 #radius { width: 60px; }
 #layerswitcher ul { margin-left: 0; padding-left: 10px; }
@@ -343,6 +342,10 @@ footer hr { clear:both; width: 90%; margin: 3px auto 0; height: 3px; border-colo
 #housephoto button { margin-top: 8px; }
 .house_photo_selected { border-top: 2px solid #547472; box-shadow: 0 0 15px #547472, 0 3px 4px -2px black; }
 
+/*  Video holders */
+#help-dialog-video { width: 640px; height: 480px; }
+#search-dialog-video { width: 350px; height: 252px; margin: 0 auto 30px auto; }
+
 /*  jQuery UI Tweaks  */
 .ui-widget { font-family: Helmet, Freesans, sans-serif;}
 .ui-accordion-content { padding: 5px !important; overflow: hidden; font-size: 1em; }

default.htm

@@ -25,7 +25,7 @@
     <meta name="apple-mobile-web-app-capable" content="yes" />
 
     <!-- Favicon and apple touch icon. Apple touch icons should be 57x57px -->
-    <link rel="shortcut icon" href="favicon.ico" />
+    <link rel="shortcut icon" type="image/png" href="favicon.png" />
     <link rel="apple-touch-icon-precomposed" href="apple-touch-icon.png" />
     <link rel="apple-touch-icon-precomposed" sizes="72x72" href="apple-touch-icon-72x72.png" />
     <link rel="apple-touch-icon-precomposed" sizes="114x114" href="apple-touch-icon-114x114.png" />
@@ -97,8 +97,8 @@
 
             <!-- The following elements are positioned on top of the map as needed -->
             <div id="elevation_chart" class="boxshadow ui-corner-all hidden">
+                <strong>Path Elevation Profile (feet)</strong>
                 <div id="elevation_chart_image"></div>
-                <span>Path Elevation Profile (ft)</span>
             </div>
             <div id="streetview" class="boxshadow ui-corner-all hidden"></div>
 
@@ -847,20 +847,14 @@ <h5>Legend</h5>
         </aside>
 
 
-
     </div> <!-- end of #container -->
 
 
-
-
-
     <!-- The following content is not displayed at run time -->
 
-    <!-- Welcome screen - jQuery UI Dialog -->
+    <!-- Search Help - jQuery UI Dialog -->
     <div id="search-dialog" title="Search Help" class="hidden">
-        <p class="textcenter">
-            <iframe width="350" height="262" src="http://www.youtube-nocookie.com/embed/aGlmVQXRRj4?rel=0" frameborder="0" allowfullscreen></iframe>
-        </p>
+        <div class="textcenter" id="search-dialog-video"></div>
         <p>
           Type in the first part of an address or location and <em>let the search box do the work for you</em>.
           Select a match using either the mouse or the up/down arrow keys and Enter.
@@ -943,7 +937,7 @@ <h5 class="aligncenter">Enable open web technologies in Internet Explorer</h5>
 
     <!-- Video Tutorial - jQuery UI Dialog -->
     <div id="help-dialog" title="Video Tutorial" class="hidden">
-        <iframe width="640" height="480" src="http://www.youtube-nocookie.com/embed/O3S3QobjONM?rel=0" frameborder="0" allowfullscreen></iframe>
+        <div id="help-dialog-video"></div>
     </div>