[Greasemonkey] Editor for Canvascape - "3D Walker"

[Valentin Laube]

Hi!

I guess you have all seen "3D Walker" by now, at least those with
Firefox 1.5.
For those who haven't check it out here:
	http://www.abrahamjoffe.com.au/ben/canvascape/

Here is a screenshot for anyone with a pre-1.5 browser:
	http://www.cs.uni-magdeburg.de/~vlaube/3dwalkerscreenshot.png

Attached is a GreaseMonkey script that allows you to edit the level.
To use it just click in the minimap.

- Valentin Laube


-------------- next part --------------
// ==UserScript=var mapwidth = =
// @name          WalkEd
// @namespace     http://www.cs.uni-magdeburg.de/~vlaube/
// @description	  Leveleditor for "Canvascape - 3D walker"
// @include       http://www.abrahamjoffe.com.au/ben/canvascape/
// ==/UserScript==

function getLeft(element) {
	var left = element.offsetLeft;
	var parent = element.offsetParent;
	
	while(parent) {
		left += parent.offsetLeft;
		parent = parent.offsetParent;
	}
	
	return left;
}

function getTop(element) {
	var top = element.offsetTop;
	var parent = element.offsetParent;
	
	while(parent) {
		top += parent.offsetTop;
		parent = parent.offsetParent;
	}
	
	return top;
}

////////////////////////////

function mousemove(e) {
	if(!ismousedown)
		return;

	if(e.pageX >= mapleft && e.pageX <= mapleft+mapwidth &&
			e.pageY >= maptop  && e.pageY <= maptop +mapheight) {
		var x = Math.floor((e.pageX-mapleft+1)/8);
		var y = Math.floor((e.pageY-maptop+1)/8);
		if(x==lastx && y==lasty)
			return;
		lastx=x;
		lasty=y;
		if(value==-1)
			value= arena[x][y] = arena[x][y]?0:1;
		else
			arena[x][y] = value;
		initUnderMap();
		drawCanvas();
	}
	else {
		//mouseup(e);
	}
}

function mousedown(e) {
	ismousedown=true
}

function mouseup(e) {
	ismousedown=false;
	value=-1;
}

function click(e) {
	mousedown(e);
	mousemove(e);
	mouseup(e);
	lastx=lasty=-1;
}

function save(e) {
	var level = arena.toString();
	level+=","+playerPos.toString();
	level+=","+playerDir.toString();
	level+=","+playerPosZ.toString();
	alert(playerDir);
	GM_setValue("level", level);
}

function load(e) {
	var level = GM_getValue("level").split(",");
	if(level) {
		for(var i=0; i<100; i++) {
			arena[Math.floor(i/10)][i%10] = parseInt(level[i]);
		}
		
		playerPos[0] = parseFloat(level[100]);
		playerPos[1] = parseFloat(level[101]);
		playerDir = parseFloat(level[102]);//XXX: doesn't work
		playerPosZ = parseFloat(level[103]);
		initUnderMap();
		drawCanvas();
	}
}

////////////////////////////

var map = document.getElementById("underMap");
var mapleft = getLeft(map);
var maptop = getTop(map);
var mapwidth = map.offsetWidth;
var mapheight = map.offsetHeight;

var ismousedown = false;
var lastx=-1;
var lasty=-1;
var value=-1;

var button1 = document.createElement("input");
button1.type = "button";
button1.value = "Save";
button1.style.position="absolute";
button1.style.top="200px";
button1.style.left="15px";
map.parentNode.insertBefore(button1, map.nextSibling);

var button2 = document.createElement("input");
button2.type = "button";
button2.value = "Load";
button2.style.position="absolute";
button2.style.top="230px";
button2.style.left="15px";
map.parentNode.insertBefore(button2, map.nextSibling);

document.addEventListener("mousedown", mousedown, false);
document.addEventListener("mouseup", mouseup, false);
document.addEventListener("mousemove", mousemove, false);
document.addEventListener("click", click, false);
button1.addEventListener("click", save, false);
button2.addEventListener("click", load, false);