Upgrade to ExtJS 3.0.0 - Released 07/06/2009
[extjs.git] / docs / source / GMapPanel.html
diff --git a/docs/source/GMapPanel.html b/docs/source/GMapPanel.html
new file mode 100644 (file)
index 0000000..8addca1
--- /dev/null
@@ -0,0 +1,218 @@
+<html>\r
+<head>\r
+  <title>The source code</title>\r
+    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
+    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
+</head>\r
+<body  onload="prettyPrint();">\r
+    <pre class="prettyprint lang-js"><div id="cls-Ext.ux.GMapPanel"></div>/**\r
+ * @class Ext.ux.GMapPanel\r
+ * @extends Ext.Panel\r
+ * @author Shea Frederick\r
+ */\r
+Ext.ux.GMapPanel = Ext.extend(Ext.Panel, {\r
+    initComponent : function(){\r
+        \r
+        var defConfig = {\r
+            plain: true,\r
+            zoomLevel: 3,\r
+            yaw: 180,\r
+            pitch: 0,\r
+            zoom: 0,\r
+            gmapType: 'map',\r
+            border: false\r
+        };\r
+        \r
+        Ext.applyIf(this,defConfig);\r
+        \r
+        Ext.ux.GMapPanel.superclass.initComponent.call(this);        \r
+\r
+    },\r
+    afterRender : function(){\r
+        \r
+        var wh = this.ownerCt.getSize();\r
+        Ext.applyIf(this, wh);\r
+        \r
+        Ext.ux.GMapPanel.superclass.afterRender.call(this);    \r
+        \r
+        if (this.gmapType === 'map'){\r
+            this.gmap = new GMap2(this.body.dom);\r
+        }\r
+        \r
+        if (this.gmapType === 'panorama'){\r
+            this.gmap = new GStreetviewPanorama(this.body.dom);\r
+        }\r
+        \r
+        if (typeof this.addControl == 'object' && this.gmapType === 'map') {\r
+            this.gmap.addControl(this.addControl);\r
+        }\r
+        \r
+        if (typeof this.setCenter === 'object') {\r
+            if (typeof this.setCenter.geoCodeAddr === 'string'){\r
+                this.geoCodeLookup(this.setCenter.geoCodeAddr);\r
+            }else{\r
+                if (this.gmapType === 'map'){\r
+                    var point = new GLatLng(this.setCenter.lat,this.setCenter.lng);\r
+                    this.gmap.setCenter(point, this.zoomLevel);    \r
+                }\r
+                if (typeof this.setCenter.marker === 'object' && typeof point === 'object'){\r
+                    this.addMarker(point,this.setCenter.marker,this.setCenter.marker.clear);\r
+                }\r
+            }\r
+            if (this.gmapType === 'panorama'){\r
+                this.gmap.setLocationAndPOV(new GLatLng(this.setCenter.lat,this.setCenter.lng), {yaw: this.yaw, pitch: this.pitch, zoom: this.zoom});\r
+            }\r
+        }\r
+\r
+        GEvent.bind(this.gmap, 'load', this, function(){\r
+            this.onMapReady();\r
+        });\r
+\r
+    },\r
+    onMapReady : function(){\r
+        this.addMarkers(this.markers);\r
+        this.addMapControls();\r
+        this.addOptions();  \r
+    },\r
+    onResize : function(w, h){\r
+\r
+        if (typeof this.getMap() == 'object') {\r
+            this.gmap.checkResize();\r
+        }\r
+        \r
+        Ext.ux.GMapPanel.superclass.onResize.call(this, w, h);\r
+\r
+    },\r
+    setSize : function(width, height, animate){\r
+        \r
+        if (typeof this.getMap() == 'object') {\r
+            this.gmap.checkResize();\r
+        }\r
+        \r
+        Ext.ux.GMapPanel.superclass.setSize.call(this, width, height, animate);\r
+        \r
+    },\r
+    getMap : function(){\r
+        \r
+        return this.gmap;\r
+        \r
+    },\r
+    getCenter : function(){\r
+        \r
+        return this.getMap().getCenter();\r
+        \r
+    },\r
+    getCenterLatLng : function(){\r
+        \r
+        var ll = this.getCenter();\r
+        return {lat: ll.lat(), lng: ll.lng()};\r
+        \r
+    },\r
+    addMarkers : function(markers) {\r
+        \r
+        if (Ext.isArray(markers)){\r
+            for (var i = 0; i < markers.length; i++) {\r
+                var mkr_point = new GLatLng(markers[i].lat,markers[i].lng);\r
+                this.addMarker(mkr_point,markers[i].marker,false,markers[i].setCenter, markers[i].listeners);\r
+            }\r
+        }\r
+        \r
+    },\r
+    addMarker : function(point, marker, clear, center, listeners){\r
+        \r
+        Ext.applyIf(marker,G_DEFAULT_ICON);\r
+\r
+        if (clear === true){\r
+            this.getMap().clearOverlays();\r
+        }\r
+        if (center === true) {\r
+            this.getMap().setCenter(point, this.zoomLevel);\r
+        }\r
+\r
+        var mark = new GMarker(point,marker);\r
+        if (typeof listeners === 'object'){\r
+            for (evt in listeners) {\r
+                GEvent.bind(mark, evt, this, listeners[evt]);\r
+            }\r
+        }\r
+        this.getMap().addOverlay(mark);\r
+\r
+    },\r
+    addMapControls : function(){\r
+        \r
+        if (this.gmapType === 'map') {\r
+            if (Ext.isArray(this.mapControls)) {\r
+                for(i=0;i<this.mapControls.length;i++){\r
+                    this.addMapControl(this.mapControls[i]);\r
+                }\r
+            }else if(typeof this.mapControls === 'string'){\r
+                this.addMapControl(this.mapControls);\r
+            }else if(typeof this.mapControls === 'object'){\r
+                this.getMap().addControl(this.mapControls);\r
+            }\r
+        }\r
+        \r
+    },\r
+    addMapControl : function(mc){\r
+        \r
+        var mcf = window[mc];\r
+        if (typeof mcf === 'function') {\r
+            this.getMap().addControl(new mcf());\r
+        }    \r
+        \r
+    },\r
+    addOptions : function(){\r
+        \r
+        if (Ext.isArray(this.mapConfOpts)) {\r
+            var mc;\r
+            for(i=0;i<this.mapConfOpts.length;i++){\r
+                this.addOption(this.mapConfOpts[i]);\r
+            }\r
+        }else if(typeof this.mapConfOpts === 'string'){\r
+            this.addOption(this.mapConfOpts);\r
+        }        \r
+        \r
+    },\r
+    addOption : function(mc){\r
+        \r
+        var mcf = this.getMap()[mc];\r
+        if (typeof mcf === 'function') {\r
+            this.getMap()[mc]();\r
+        }    \r
+        \r
+    },\r
+    geoCodeLookup : function(addr) {\r
+        \r
+        this.geocoder = new GClientGeocoder();\r
+        this.geocoder.getLocations(addr, this.addAddressToMap.createDelegate(this));\r
+        \r
+    },\r
+    addAddressToMap : function(response) {\r
+        \r
+        if (!response || response.Status.code != 200) {\r
+            Ext.MessageBox.alert('Error', 'Code '+response.Status.code+' Error Returned');\r
+        }else{\r
+            place = response.Placemark[0];\r
+            addressinfo = place.AddressDetails;\r
+            accuracy = addressinfo.Accuracy;\r
+            if (accuracy === 0) {\r
+                Ext.MessageBox.alert('Unable to Locate Address', 'Unable to Locate the Address you provided');\r
+            }else{\r
+                if (accuracy < 7) {\r
+                    Ext.MessageBox.alert('Address Accuracy', 'The address provided has a low accuracy.<br><br>Level '+accuracy+' Accuracy (8 = Exact Match, 1 = Vague Match)');\r
+                }else{\r
+                    point = new GLatLng(place.Point.coordinates[1], place.Point.coordinates[0]);\r
+                    if (typeof this.setCenter.marker === 'object' && typeof point === 'object'){\r
+                        this.addMarker(point,this.setCenter.marker,this.setCenter.marker.clear,true, this.setCenter.listeners);\r
+                    }\r
+                }\r
+            }\r
+        }\r
+        \r
+    }\r
\r
+});\r
+\r
+Ext.reg('gmappanel', Ext.ux.GMapPanel); </pre>    \r
+</body>\r
+</html>
\ No newline at end of file