clonedModel attribute for uiGmapModel-Key to be used in ModelWatcher

- This is ripe for a ChildBase Class
This makes angular-ui#946 and angular-ui#772 compatible

Author: nmccready

dist/angular-google-maps.js

@@ -1366,7 +1366,7 @@ Nicholas McCready - https://twitter.com/nmccready
                 return adds.push(m);
               } else {
                 child = childObjects.get(m[idKey]);
-                if (!comparison(m, child.model)) {
+                if (!comparison(m, child.clonedModel)) {
                   return updates.push({
                     model: m,
                     child: child
@@ -2413,6 +2413,7 @@ Nicholas McCready - https://twitter.com/nmccready
             this.defaults = defaults;
             this.model = model;
             this.clean = __bind(this.clean, this);
+            this.clonedModel = _.clone(this.model, true);
             this.isDragging = false;
             this.internalEvents = {
               dragend: (function(_this) {
@@ -2754,6 +2755,7 @@ Original idea from: http://stackoverflow.com/questions/22758950/google-map-drawi
           this.updateModel = __bind(this.updateModel, this);
           this.handleModelChanges = __bind(this.handleModelChanges, this);
           this.destroy = __bind(this.destroy, this);
+          this.clonedModel = _.clone(this.model, true);
           this.deferred = uiGmapPromise.defer();
           _.each(this.keys, (function(_this) {
             return function(v, k) {
@@ -2828,7 +2830,8 @@ Original idea from: http://stackoverflow.com/questions/22758950/google-map-drawi
         };
 
         MarkerChildModel.prototype.updateModel = function(model) {
-          return this.setMyScope('all', _.clone(model, true), this.model);
+          this.cloneModel = _.clone(model, true);
+          return this.setMyScope('all', model, this.model);
         };
 
         MarkerChildModel.prototype.renderGMarker = function(doDraw, validCb) {
@@ -3148,16 +3151,18 @@ Original idea from: http://stackoverflow.com/questions/22758950/google-map-drawi
 
         WindowChildModel.include(EventsHelper);
 
-        function WindowChildModel(model, scope, opts, isIconVisibleOnClick, mapCtrl, markerScope, element, needToManualDestroy, markerIsVisibleAfterWindowClose) {
+        function WindowChildModel(model, scope, opts, isIconVisibleOnClick, mapCtrl, markerScope, element, clonedModel, needToManualDestroy, markerIsVisibleAfterWindowClose, trackModel) {
           this.model = model;
           this.scope = scope;
           this.opts = opts;
           this.isIconVisibleOnClick = isIconVisibleOnClick;
           this.mapCtrl = mapCtrl;
           this.markerScope = markerScope;
           this.element = element;
+          this.clonedModel = clonedModel != null ? clonedModel : _.clone(this.model, true);
           this.needToManualDestroy = needToManualDestroy != null ? needToManualDestroy : false;
           this.markerIsVisibleAfterWindowClose = markerIsVisibleAfterWindowClose != null ? markerIsVisibleAfterWindowClose : true;
+          this.trackModel = trackModel != null ? trackModel : false;
           this.destroy = __bind(this.destroy, this);
           this.remove = __bind(this.remove, this);
           this.getLatestPosition = __bind(this.getLatestPosition, this);
@@ -4113,7 +4118,7 @@ Original idea from: http://stackoverflow.com/questions/22758950/google-map-drawi
           _.each(IMarker.scopeKeys, function(v, k) {
             return keys[k] = scope[k];
           });
-          child = new MarkerChildModel(childScope, _.clone(model, true), keys, this.map, this.DEFAULTS, this.doClick, this.gMarkerManager, doDrawSelf = false);
+          child = new MarkerChildModel(childScope, model, keys, this.map, this.DEFAULTS, this.doClick, this.gMarkerManager, doDrawSelf = false);
           this.scope.markerModels.put(model[this.idKey], child);
           return child;
         };
@@ -5324,7 +5329,7 @@ Original idea from: http://stackoverflow.com/questions/22758950/google-map-drawi
           };
           this.DEFAULTS = this.scopeOrModelVal(this.optionsKey, this.scope, model) || {};
           opts = this.createWindowOptions(gMarker, childScope, fakeElement.html(), this.DEFAULTS);
-          child = new WindowChildModel(model, childScope, opts, this.isIconVisibleOnClick, gMap, (_ref = this.markersScope) != null ? (_ref1 = _ref.markerModels.get(model[this.idKey])) != null ? _ref1.scope : void 0 : void 0, fakeElement, false, true);
+          child = new WindowChildModel(model, childScope, opts, this.isIconVisibleOnClick, gMap, (_ref = this.markersScope) != null ? (_ref1 = _ref.markerModels.get(model[this.idKey])) != null ? _ref1.scope : void 0 : void 0, fakeElement, false, true, true);
           if (model[this.idKey] == null) {
             this.$log.error('Window model has no id to assign a child to. This is required for performance. Please assign id, or redirect id to a different key.');
             return;

dist/angular-google-maps.min.js

@@ -6,7 +6,7 @@ angular.module('appMaps', ['uiGmapgoogle-maps'])
     zoom: 4,
     bounds: {}
   };
-  $scope.options = {scrollwheel: false};
+  $scope.options = {scrollwheel: false, draggable: true};
   var createRandomMarker = function (i, bounds, idKey) {
     var lat_min = bounds.southwest.latitude,
     lat_range = bounds.northeast.latitude - lat_min,
@@ -52,8 +52,16 @@ angular.module('appMaps', ['uiGmapgoogle-maps'])
 
   $scope.markersEvents = {
     mouseover: function (gMarker, eventName, model) {
+      console.debug('mouseover');
       model.show = true;
-      $scope.$apply();
+//      $scope.$apply();
     }
   };
+
+  $scope.shownMarkers = function(){
+    return _.filter($scope.randomMarkers, function(m){
+      return m.show;
+    }).length;
+  };
+
 });

dist/angular-google-maps_dev_mapped.js

@@ -1,30 +1,32 @@
 <!DOCTYPE html>
 <html>
 <head>
-  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
+  <!--<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">-->
   <link rel="stylesheet" href="assets/stylesheets/example.css"/>
   <script src="../bower_components/angular/angular.js"></script>
-  <script src="../bower_components/angular-route/angular-route.js"></script>
+  <!--<script src="../bower_components/angular-route/angular-route.js"></script>-->
   <script src="../bower_components/lodash/dist/lodash.js"></script>
 
-  <script src="../dist/angular-google-maps.js"></script>
+  <script src="../dist/angular-google-maps_dev_mapped.js"></script>
   <script src="assets/scripts/controllers/issue-772-info-window-show-state.js"></script>
 </head>
 <body ng-app="appMaps">
     <div id="map_canvas" ng-controller="mainCtrl">
-      <ui-gmap-google-map center="map.center" zoom="map.zoom"
-      draggable="true" options="options" bounds="map.bounds">
+      <ui-gmap-google-map center="map.center" zoom="map.zoom" options="options" bounds="map.bounds">
 
           <ui-gmap-markers models="randomMarkers" coords="'self'"
           icon="'icon'" fit='true' click="'onClick'" events="markersEvents" doCluster='true'>
 
-              <ui-gmap-windows show="'show'">
+              <ui-gmap-windows show="'show'" >
                   <div ng-non-bindable>{{text}}</div>
               </ui-gmap-windows>
 
           </ui-gmap-markers>
 
       </ui-gmap-google-map>
+       markers shown: {{shownMarkers()}}
+        <br/>
+       markers:{{randomMarkers}}
     </div>
 </body>
 </html>

dist/angular-google-maps_dev_mapped.js.map

@@ -7,6 +7,10 @@ angular.module('uiGmapgoogle-maps.directives.api')
         @include GmapUtil
         @include EventsHelper
         constructor: (@scope, @attrs, @map, @defaults, @model) ->
+          #where @model is a reference to model in the controller scope
+          #clonedModel is a copy for comparison
+          @clonedModel = _.clone @model, true
+
           @isDragging = false
           @internalEvents =
             dragend: =>

dist/angular-google-maps_dev_mapped.min.js

@@ -21,7 +21,9 @@ angular.module('uiGmapgoogle-maps.directives.api.models.child')
 
       constructor: (scope, @model, @keys, @gMap, @defaults, @doClick, @gMarkerManager, @doDrawSelf = true,
         @trackModel = true, @needRedraw = false) ->
-
+        #where @model is a reference to model in the controller scope
+        #clonedModel is a copy for comparison
+        @clonedModel = _.clone @model,true
         @deferred = uiGmapPromise.defer()
         _.each @keys, (v, k) =>
           @[k + 'Key'] = if _.isFunction @keys[k] then @keys[k]() else @keys[k]
@@ -76,7 +78,8 @@ angular.module('uiGmapgoogle-maps.directives.api.models.child')
             @needRedraw = true
 
       updateModel: (model) =>
-        @setMyScope 'all', _.clone(model,true), @model
+        @cloneModel = _.clone(model,true)
+        @setMyScope 'all', model, @model
 
       renderGMarker: (doDraw = true, validCb) ->
         #doDraw is to only update the marker on the map when it is really ready

dist/angular-google-maps_dev_mapped.min.js.map

@@ -7,7 +7,10 @@ angular.module('uiGmapgoogle-maps.directives.api.models.child')
         @include GmapUtil
         @include EventsHelper
         constructor: (@model, @scope, @opts, @isIconVisibleOnClick, @mapCtrl, @markerScope, @element,
-          @needToManualDestroy = false, @markerIsVisibleAfterWindowClose = true) ->
+          #where @model is a reference to model in the controller scope
+          #clonedModel is a copy for comparison
+          @clonedModel = _.clone @model, true
+          @needToManualDestroy = false, @markerIsVisibleAfterWindowClose = true, @trackModel = false) ->
 
           @getGmarker = ->
             @markerScope?.getGMarker() if @markerScope?['getGMarker']?

example/assets/scripts/controllers/issue-772-info-window-show-state.js

@@ -169,7 +169,7 @@ angular.module("uiGmapgoogle-maps.directives.api.models.parent")
             keys = {}
             _.each IMarker.scopeKeys, (v,k) ->
               keys[k] = scope[k]
-            child = new MarkerChildModel(childScope, _.clone(model,true), keys, @map, @DEFAULTS,
+            child = new MarkerChildModel(childScope, model, keys, @map, @DEFAULTS,
               @doClick, @gMarkerManager, doDrawSelf = false) #this is managed so child is not drawing itself
             @scope.markerModels.put(model[@idKey], child) #major change this makes model.id a requirement
             child

example/issue-772-info-window-show-state.html

@@ -190,7 +190,7 @@ angular.module('uiGmapgoogle-maps.directives.api.models.parent')
                 @interpolateContent(@linked.element.html(), model)
             @DEFAULTS = @scopeOrModelVal(@optionsKey, @scope, model) or {}
             opts = @createWindowOptions gMarker, childScope, fakeElement.html(), @DEFAULTS
-            child = new WindowChildModel model, childScope, opts, @isIconVisibleOnClick, gMap, @markersScope?.markerModels.get(model[@idKey])?.scope, fakeElement, false, true
+            child = new WindowChildModel model, childScope, opts, @isIconVisibleOnClick, gMap, @markersScope?.markerModels.get(model[@idKey])?.scope, fakeElement, false, true, true
 
             unless model[@idKey]?
               @$log.error('Window model has no id to assign a child to. This is required for performance. Please assign id, or redirect id to a different key.')

src/coffee/directives/api/models/child/base-poly-child-model.coffee

@@ -51,7 +51,7 @@ angular.module('uiGmapgoogle-maps.directives.api.utils')
             else
               child = childObjects.get(m[idKey])
               #we're UPDATE in this case
-              unless comparison m, child.model
+              unless comparison m, child.clonedModel
                 updates.push
                   model: m
                   child: child