Repository: flex-asjs Updated Branches: refs/heads/develop 25b9fe127 -> c9f9db9c2
Adding Map class for use with Google Map API. FlexJS AIR app can display the map and the app can be cross-compiled into JavaScript. Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/2eb8cbc2 Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/2eb8cbc2 Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/2eb8cbc2 Branch: refs/heads/develop Commit: 2eb8cbc2fe96e89927c2c2c1c7d723f410cc6491 Parents: 25b9fe1 Author: Peter Ent <[email protected]> Authored: Tue May 13 11:36:10 2014 -0400 Committer: Peter Ent <[email protected]> Committed: Tue May 13 11:36:10 2014 -0400 ---------------------------------------------------------------------- .../as/projects/FlexJSUI/basic-manifest.xml | 2 + .../as/projects/FlexJSUI/src/FlexJSUIClasses.as | 1 + .../src/org/apache/flex/maps/google/Map.as | 95 +++++++++++ .../apache/flex/maps/google/beads/MapView.as | 169 +++++++++++++++++++ .../src/org/apache/flex/maps/google/Map.js | 75 ++++++++ 5 files changed, 342 insertions(+) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/2eb8cbc2/frameworks/as/projects/FlexJSUI/basic-manifest.xml ---------------------------------------------------------------------- diff --git a/frameworks/as/projects/FlexJSUI/basic-manifest.xml b/frameworks/as/projects/FlexJSUI/basic-manifest.xml index 7ac02b3..2cf68ff 100644 --- a/frameworks/as/projects/FlexJSUI/basic-manifest.xml +++ b/frameworks/as/projects/FlexJSUI/basic-manifest.xml @@ -72,4 +72,6 @@ <component id="TextPromptBead" class="org.apache.flex.html.accessories.TextPromptBead" /> <component id="MixinManager" class="org.apache.flex.utils.MixinManager" /> + <component id="Map" class="org.apache.flex.maps.google.Map" /> + </componentPackage> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/2eb8cbc2/frameworks/as/projects/FlexJSUI/src/FlexJSUIClasses.as ---------------------------------------------------------------------- diff --git a/frameworks/as/projects/FlexJSUI/src/FlexJSUIClasses.as b/frameworks/as/projects/FlexJSUI/src/FlexJSUIClasses.as index 6b46e35..bc5823b 100644 --- a/frameworks/as/projects/FlexJSUI/src/FlexJSUIClasses.as +++ b/frameworks/as/projects/FlexJSUI/src/FlexJSUIClasses.as @@ -30,6 +30,7 @@ internal class FlexJSUIClasses import org.apache.cordova.camera.Camera; Camera; import org.apache.cordova.Application; Application; import org.apache.cordova.Weinre; Weinre; + import org.apache.flex.maps.google.Map; Map; import org.apache.flex.html.accessories.NumericOnlyTextInputBead; NumericOnlyTextInputBead; import org.apache.flex.html.accessories.PasswordInputBead; PasswordInputBead; http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/2eb8cbc2/frameworks/as/projects/FlexJSUI/src/org/apache/flex/maps/google/Map.as ---------------------------------------------------------------------- diff --git a/frameworks/as/projects/FlexJSUI/src/org/apache/flex/maps/google/Map.as b/frameworks/as/projects/FlexJSUI/src/org/apache/flex/maps/google/Map.as new file mode 100644 index 0000000..56ab358 --- /dev/null +++ b/frameworks/as/projects/FlexJSUI/src/org/apache/flex/maps/google/Map.as @@ -0,0 +1,95 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// Licensed to the Apache Software Foundation (ASF) under one or more +// contributor license agreements. See the NOTICE file distributed with +// this work for additional information regarding copyright ownership. +// The ASF licenses this file to You under the Apache License, Version 2.0 +// (the "License"); you may not use this file except in compliance with +// the License. You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// +//////////////////////////////////////////////////////////////////////////////// +package org.apache.flex.maps.google +{ + import org.apache.flex.core.IBeadView; + import org.apache.flex.core.UIBase; + import org.apache.flex.core.ValuesManager; + import org.apache.flex.maps.google.beads.MapView; + + /** + * The Map class displays a Google Map centered on lat/lng coordinates. The Map uses + * the following bead type: + * + * org.apache.flex.maps.beads.MapView: Uses HTMLLoader to display the map. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public class Map extends UIBase + { + /** + * constructor. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function Map() + { + super(); + } + + private var _token:String; + + /** + * The Google API developer token. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function set token(value:String):void + { + _token = value; + + var viewBead:MapView = getBeadByType(IBeadView) as MapView; + if (viewBead == null) { + viewBead = new MapView(); + viewBead.token = value; + addBead(viewBead); + } + } + + /** + * Loads a map centered on the given latitude and longitude coodinates at the + * zoom level provided. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function loadMap( centerLat:Number, centerLong:Number, zoom:Number ) : void + { + var viewBead:MapView = getBeadByType(IBeadView) as MapView; + if (viewBead == null) { + viewBead = new MapView(); + addBead(viewBead); + } + if (viewBead) { + viewBead.mapit(centerLat, centerLong, zoom); + } + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/2eb8cbc2/frameworks/as/projects/FlexJSUI/src/org/apache/flex/maps/google/beads/MapView.as ---------------------------------------------------------------------- diff --git a/frameworks/as/projects/FlexJSUI/src/org/apache/flex/maps/google/beads/MapView.as b/frameworks/as/projects/FlexJSUI/src/org/apache/flex/maps/google/beads/MapView.as new file mode 100644 index 0000000..879a9fb --- /dev/null +++ b/frameworks/as/projects/FlexJSUI/src/org/apache/flex/maps/google/beads/MapView.as @@ -0,0 +1,169 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// Licensed to the Apache Software Foundation (ASF) under one or more +// contributor license agreements. See the NOTICE file distributed with +// this work for additional information regarding copyright ownership. +// The ASF licenses this file to You under the Apache License, Version 2.0 +// (the "License"); you may not use this file except in compliance with +// the License. You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// +//////////////////////////////////////////////////////////////////////////////// +package org.apache.flex.maps.google.beads +{ + import flash.events.Event; + import flash.html.HTMLLoader; + import flash.net.URLRequest; + + import org.apache.flex.core.IBeadView; + import org.apache.flex.core.IStrand; + import org.apache.flex.core.UIBase; + import org.apache.flex.events.IEventDispatcher; + + /** + * The MapView bead class displays a Google Map using HTMLLoader. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public class MapView implements IBeadView + { + /** + * constructor. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function MapView() + { + } + + private var _loader:HTMLLoader; + + private var _strand:IStrand; + + /** + * @copy org.apache.flex.core.IBead#strand + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function set strand(value:IStrand):void + { + _strand = value; + + _loader = new HTMLLoader(); + _loader.x = 0; + _loader.y = 0; + _loader.width = UIBase(value).width; + _loader.height = UIBase(value).height; + + IEventDispatcher(_strand).addEventListener("widthChanged",handleSizeChange); + IEventDispatcher(_strand).addEventListener("heightChanged",handleSizeChange); + + (_strand as UIBase).addChild(_loader); + + if (page) { + _loader.loadString(page); + } + } + + private var _token:String; + + /** + * Sets the API token and modifies the pageTemplate so that a proper + * HTML DOM can be constructed to house the Google Map. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function set token(value:String):void + { + _token = value; + + page = pageTemplate.replace("{Your-Google-Token-Here}",_token); + + if (_loader) { + _loader.loadString(page); + } + } + + private var page:String; + + /** + * Adjusts the map to the given coordinate and zoom level. + * + * @langversion 3.0 + * @playerversion Flash 10.2 + * @playerversion AIR 2.6 + * @productversion FlexJS 0.0 + */ + public function mapit(lat:Number, lng:Number, zoomLevel:Number):void + { + if (_loader && page) { + _loader.window.mapit(lat,lng,zoomLevel); + } + } + + /** + * @private + */ + private function handleSizeChange(event:Event):void + { + _loader.width = UIBase(_strand).width; + _loader.height = UIBase(_strand).height; + } + + /** + * @private + * This page definition is used with HTMLLoader to bring in the Google Maps + * API (a Google APP token is required). + */ + private static var pageTemplate:String = '<!DOCTYPE html>'+ + '<html>'+ + ' <head>'+ + ' <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />'+ + ' <style type="text/css">'+ + ' html { height: 100% }'+ + ' body { height: 100%; margin: 0; padding: 0 }'+ + ' #map-canvas { height: 100% }'+ + ' </style>'+ + ' <script type="text/javascript"'+ + ' src="https://maps.googleapis.com/maps/api/js?key={Your-Google-Token-Here}&sensor=false";>'+ + ' </script>'+ + ' <script type="text/javascript">'+ + ' function mapit(lat, lng, zoomLevel) {'+ + ' var mapOptions = {'+ + ' center: new google.maps.LatLng(lat, lng),'+ + ' zoom: zoomLevel'+ + ' };'+ + ' var map = new google.maps.Map(document.getElementById("map-canvas"),'+ + ' mapOptions);'+ + ' };'+ + ' function initialize() {'+ + ' mapit(-34.397, 150.644, 8);'+ + ' };'+ + ' google.maps.event.addDomListener(window, "load", initialize);'+ + ' </script>'+ + ' </head>'+ + ' <body>'+ + ' <div id="map-canvas"/>'+ + ' </body>'+ + '</html>'; + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/2eb8cbc2/frameworks/js/FlexJS/src/org/apache/flex/maps/google/Map.js ---------------------------------------------------------------------- diff --git a/frameworks/js/FlexJS/src/org/apache/flex/maps/google/Map.js b/frameworks/js/FlexJS/src/org/apache/flex/maps/google/Map.js new file mode 100644 index 0000000..23c622d --- /dev/null +++ b/frameworks/js/FlexJS/src/org/apache/flex/maps/google/Map.js @@ -0,0 +1,75 @@ +/** + * Licensed under the Apache License, Version 2.0 (the 'License'); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an 'AS IS' BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +goog.provide('org.apache.flex.maps.google.Map'); + + +// IMPORTANT: +// In order to use this class, the Google MAP API must be downloaded +// from the <head> section of the main HTML file. + + + +/** + * @constructor + * @extends {org.apache.flex.core.UIBase} + */ +org.apache.flex.maps.google.Map = function() { + goog.base(this); +}; +goog.inherits(org.apache.flex.maps.google.Map, + org.apache.flex.core.UIBase); + + +/** + * @override + * @protected + * @return {Object} The actual element to be parented. + */ +org.apache.flex.maps.google.Map.prototype.createElement = + function() { + + this.element = document.createElement('div'); + + this.positioner = this.element; + this.element.flexjs_wrapper = this; + + return this.element; +}; + + +/** + * @expose + * @param {String} value Google API dev token. + */ +org.apache.flex.maps.google.Map.prototype.set_token = function(value) { + // not used in JavaScript version as Google API token is processed + // in the main HTML index file. +}; + + +/** + * @expose + * @param {Number} centerLat center latitude. + * @param {Number} centerLong center longitude. + * @param {Number} zoom zoom level. + */ +org.apache.flex.maps.google.Map.prototype.loadMap = + function(centerLat, centerLong, zoom) { + var mapOptions = { + center: new google.maps.LatLng(centerLat, centerLong), + zoom: zoom + }; + this.map = new google.maps.Map(this.element, mapOptions); +};
