modified searchbox example

Author: kandizzy

app/views/examples/search-box/index.html

@@ -1,7 +1,4 @@
 <div id="map_canvas" ng-controller="mainCtrl">
-    <script type="text/ng-template" id="searchbox.tpl.html">
-        <input type="text" placeholder="Search Box">
-    </script>
     <ui-gmap-google-map center="map.center" zoom="map.zoom" draggable="true" options="options">
         <ui-gmap-search-box template="searchbox.template" events="searchbox.events"></ui-gmap-search-box>
     </ui-gmap-google-map>

app/views/examples/search-box/script.js

@@ -1,16 +1,39 @@
 angular.module('appMaps', ['uiGmapgoogle-maps'])
-    .config(function(uiGmapGoogleMapApiProvider) {
-      uiGmapGoogleMapApiProvider.configure({
-          //    key: 'your api key',
-          v: '3.20', //defaults to latest 3.X anyhow
-          libraries: 'places' // Required for SearchBox.
-      });
-    })
-    .controller('mainCtrl', function ($scope, $log) {
-        $scope.map = {center: {latitude: 40.1451, longitude: -99.6680 }, zoom: 4 };
-        $scope.options = {scrollwheel: false};
-        var events = {
-          places_changed: function (searchBox) {}
-        }
-        $scope.searchbox = { template:'searchbox.tpl.html', events:events};
+
+  .config(['uiGmapGoogleMapApiProvider', function (GoogleMapApi) {
+    GoogleMapApi.configure({
+  //  key: 'your api key',
+      v: '3.20',
+      libraries: 'places'
     });
+  }])
+  
+  .run(['$templateCache', function ($templateCache) {
+    $templateCache.put('searchbox.tpl.html', '<input type="text" placeholder="Search">');
+  }])
+
+  .controller('mainCtrl', ['$scope', '$log', 'uiGmapGoogleMapApi', function ($scope, $log, GoogleMapApi) {
+      
+      angular.extend($scope, {
+        map: {center: 
+          {
+            latitude: 40.1451, 
+            longitude: -99.6680  
+          }, 
+          zoom: 4 
+        },
+        searchbox: { 
+          template:'searchbox.tpl.html', 
+          events:{
+            places_changed: function (searchBox) {}
+          }
+        },
+        options: {
+          scrollwheel: false
+        }
+      });
+      
+      GoogleMapApi.then(function(maps) {
+        maps.visualRefresh = true;
+      });
+  }]);