diff --git a/src/ui-map.js b/src/ui-map.js index 7df3e36..a24908c 100644 --- a/src/ui-map.js +++ b/src/ui-map.js @@ -81,6 +81,43 @@ }; }]); + /* + * Support for Infobubble [http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobubble/] + * "A InfoBubble is a customizable css3 infowindow." + * Fully customizable with support for tabs + */ + app.directive('uiMapInfoBubble', + ['ui.config', '$parse', '$compile', function (uiConfig, $parse, $compile) { + + var infoBubbleEvents = 'closeclick content_change domready ' + + 'position_changed zindex_changed'; + var options = uiConfig.mapInfoBubble || {}; + window.infoBubbleOptions = options; + return { + link: function (scope, elm, attrs) { + var opts = angular.extend({}, options, scope.$eval(attrs.uiOptions)); + opts.content = elm[0]; + var model = $parse(attrs.uiMapInfoBubble); + var infoBubble = model(scope); + + window.infoBubbleOptions = opts; + if (!infoBubble) { + infoBubble = new InfoBubble(opts); + model.assign(scope, infoBubble); + } + + bindMapEvents(scope, infoBubbleEvents, infoBubble, elm); + + //Decorate infoWindow.open to $compile contents before opening + var _open = infoBubble.open; + infoBubble.open = function open(a1, a2, a3, a4, a5, a6) { + //$compile(elm.contents())(scope); + _open.call(infoBubble, a1, a2, a3, a4, a5, a6); + }; + } + }; + }]); + /* * Map overlay directives all work the same. Take map marker for example * will $watch 'myMarker' and each time it changes,