import flash.events.MouseEvent;
import flash.display.*;
import flash.text.TextField;
+ import flash.external.*;
// import bustin.dev.Inspector;
public class halcyon_viewer extends Sprite {
t.multiline=true;
addChild(t);
Globals.vars.debug=t;
- t.visible = true;
+ t.visible = loaderInfo.parameters["show_debug"] == 'true';
stage.addEventListener(MouseEvent.MOUSE_UP, theMap.mouseUpHandler);
stage.addEventListener(MouseEvent.MOUSE_MOVE, theMap.mouseMoveHandler);
var controller:JSController = new JSController(theMap, loaderInfo.parameters['responder']);
controller.setActive();
}
+
+ ExternalInterface.addCallback('refreshCSS', onRefreshCSS);
+ ExternalInterface.addCallback('jumpTo', onJumpTo);
+ }
+
+ private function onRefreshCSS(str:String):void {
+ theMap.ruleset.loadFromCSS(str);
+ theMap.redraw();
+ }
+ private function onJumpTo(lat:Number,lon:Number):void {
+ theMap.init(lat,lon);
}
-
+
private function zoomInHandler(e:MouseEvent):void { e.stopPropagation(); theMap.zoomIn(); }
private function zoomOutHandler(e:MouseEvent):void { e.stopPropagation(); theMap.zoomOut(); }
+
+
}
}
// Map constructor function
public function Map(initparams:Object) {
+ this.initparams=initparams;
+ connection = Connection.getConnection(initparams);
+ connection.addEventListener(Connection.NEW_WAY, newWayCreated);
+ connection.addEventListener(Connection.NEW_POI, newPOICreated);
+ gotEnvironment(null);
- // Add 900913 tile background
- tileset=new TileSet(this);
- addChild(tileset);
- tileset.init("http://npe.openstreetmap.org/$z/$x/$y.png");
+ addEventListener(Event.ENTER_FRAME, everyFrame);
+ }
+
+ // Set up layering
+ // [layer][3] - names
+ // [layer][2][sublayer] - stroke
+ // [layer][1] - casing
+ // [layer][0] - fill
- // Set up layering
- // [layer][3] - names
- // [layer][2][sublayer] - stroke
- // [layer][1] - casing
- // [layer][0] - fill
+ private function createSprites():void {
+ tileset=new TileSet(this); // 900913 background
+ addChild(tileset); // |
+ addChild(new Sprite()); // GPS
for (var l:int=0; l<13; l++) { // 11 layers (11 is +5, 1 is -5)
var s:Sprite = getHitSprite(); // |
}
addChild(getPaintSprite()); // 12 - POIs
addChild(getPaintSprite()); // 13 - shields and POI names
-
- this.initparams=initparams;
- connection = Connection.getConnection(initparams);
- connection.addEventListener(Connection.NEW_WAY, newWayCreated);
- connection.addEventListener(Connection.NEW_POI, newPOICreated);
- gotEnvironment(null);
-
- addEventListener(Event.ENTER_FRAME, everyFrame);
- }
+ }
+
+ private function removeSprites():void {
+ while (numChildren) { removeChildAt(0); }
+ }
private function getPaintSprite():Sprite {
var s:Sprite = new Sprite();
init(initparams['lat'],
initparams['lon'],
initparams['zoom'],
- initparams['style']);
+ initparams['style'],
+ initparams['tileurl']);
} else {
// somewhere innocuous
- init(53.09465,-2.56495,17,"test.css?d="+Math.random());
+ init(53.09465,-2.56495,17,"test.css?d="+Math.random(),"");
}
}
// ------------------------------------------------------------------------------------------
// Initialise map at a given lat/lon
- public function init(startlat:Number,startlon:Number,startscale:uint,style:String):void {
- ruleset=new RuleSet(this,redrawPOIs);
- ruleset.loadFromCSS(style);
- //updateSize();
+ public function init(startlat:Number,startlon:Number,startscale:uint=0,style:String=null,tileurl:String=''):void {
+ removeSprites();
+ createSprites();
+ tileset.init(tileurl);
+
+ if (style) {
+ ruleset=new RuleSet(this,redrawPOIs);
+ ruleset.loadFromCSS(style);
+ }
+ if (startscale>0) { scale=startscale; }
- scale=startscale;
scalefactor=MASTERSCALE/Math.pow(2,13-scale);
baselon =startlon -(mapwidth /2)/scalefactor;
basey =lat2latp(startlat)+(mapheight/2)/scalefactor;
// Do every frame
private function everyFrame(event:Event):void {
- tileset.serviceQueue();
+ if (tileset) { tileset.serviceQueue(); }
}
// ------------------------------------------------------------------------------------------
var tags:Object = node.getTagsCopy();
// ** apply :hover etc.
if (!sl) { sl=map.ruleset.getStyles(this.node,tags); }
- if (!sl.hasStyles()) { return false; }
+ if (!sl.hasStyles() && iconname=='') { return false; }
var r:Boolean=false; // ** rendered
var l:DisplayObject;
icon.addChild(Bitmap(event.target.content));
var l:DisplayObject=map.getChildAt(map.POISPRITE);
Sprite(l).addChild(icon);
+ loaded=true;
updatePosition();
icon.addEventListener(MouseEvent.CLICK, mouseEvent);
icon.buttonMode = true;
icon.mouseEnabled = true;
- loaded=true;
}
private function mouseEvent(event:MouseEvent):void {
}
private function updatePosition():void {
+ if (!loaded) { return; }
icon.x=map.lon2coord(node.lon)-icon.width/2;
icon.y=map.latp2coord(node.latp)-icon.height/2;
}
// ---------------------------------------------------------------------------------------------------------
// Loading stylesheet
- public function loadFromCSS(url:String):void {
- var request:URLRequest=new URLRequest(url);
+ public function loadFromCSS(str:String):void {
+ if (str.match(/[\s\n\r\t]/)!=null) { parseCSS(str); return; }
+
+ var request:URLRequest=new URLRequest(str);
var loader:URLLoader=new URLLoader();
request.method=URLRequestMethod.GET;
}
private function loadedCSS(event:Event):void {
+ parseCSS(event.target.data);
+ }
+
+ private function parseCSS(str:String):void {
var css:MapCSS=new MapCSS(map);
- choosers=css.parse(event.target.data);
+ choosers=css.parse(str);
// Inspector.getInstance().show();
// Inspector.getInstance().shelf('Choosers', choosers);
loadImages();
<body>
-<div id="map" style="width:800px; height: 600px; border: 1px solid black">
+<div id="map" style="width:800px; height: 600px; border: 1px solid black; float:left; margin-right: 10px">
</div>
<script>
alert (event+": "+object+" "+id+", highway="+attr['highway']);
}
- var fo = new SWFObject("halcyon_viewer.swf?d="+Math.round(Math.random()*1000), "map", "100%", "100%", "9", "#FFFFFF");
+ var fo = new SWFObject("halcyon_viewer.swf?d="+Math.round(Math.random()*1000), "mapswf", "100%", "100%", "9", "#FFFFFF");
fo.addVariable("lat",51.875);
fo.addVariable("lon",-1.482);
- fo.addVariable("zoom",16);
+ fo.addVariable("zoom",14);
fo.addVariable("api","http://www.openstreetmap.org/api/0.6/");
fo.addVariable("policy","http://www.openstreetmap.org/api/crossdomain.xml");
fo.addVariable("connection","AMF");
fo.addVariable("responder","respond");
- fo.addVariable("style","test.css");
+ fo.addVariable("tileurl","http://npe.openstreetmap.org/$z/$x/$y.png");
+ fo.addVariable("style","test.css?d="+Math.round(Math.random()*1000));
fo.addVariable("show_debug","false");
fo.write("map");
+ function refreshCSS() {
+ if (document.getElementById("mapswf")) {
+ document.getElementById("mapswf").refreshCSS(document.getElementById("mapcss").value);
+ }
+ }
+
+ function jumpTo() {
+ if (document.getElementById("mapswf")) {
+ document.getElementById("mapswf").jumpTo(document.getElementById("lat").value,document.getElementById("lon").value);
+ }
+ }
+
</script>
+<div id="ui">
+<p>Lat: <input id='lat' value='51.875' size='6'> Lon: <input id='lon' value='-1.482' size='6'>
+<input type='button' onClick='javascript:jumpTo();' value=" Go ">
+<p>
+<input type='button' onClick='javascript:refreshCSS();' value=" Refresh CSS ">
+<textarea cols=40 rows=40 id='mapcss'>
+/* Type MapCSS here */
+</textarea>
+</p>
+</div>
+
</body>
</html>
projects / potlatch2.git / commitdiff