mort
/
uni


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460
							<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
<style>
	body {
		margin: 0px;
		padding: 0px;
	}

	canvas {
		position: absolute;
	}

	* {
		white-space: nowrap;
	}

	class,
	Object {
		-moz-user-select: none;
		-ms-user-select: none;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		user-select: none;
		vertical-align: top;
		border-radius: 20px;
		border: 1px solid #333;
		display: inline-block;
		padding: 20px;
		margin: 10px;
		margin-top: 30px;
		min-width: 250px;
		cursor: pointer;
	}
	class {
		border-style: dashed;
	}
	class>name,
	object>name {
		position: absolute;
		margin-top: -40px;
		margin-left: -30px;
	}
	class>prop,
	object>prop {
		margin-bottom: 20px;
		width: 200px;
		display: block;
	}
	class>prop>name,
	class>prop>val,
	class>prop>type,
	object>prop>name,
	object>prop>val,
	object>prop>type {
		display: block;
		text-align: right;
	}
	class>prop>val,
	object>prop>val {
		border: 1px solid #333;
		height: 24px;
		line-height: 24px;
		text-align: center;
	}

	class>method,
	object>method {
		margin-bottom: 20px;
		display: block;
	}
	class>method:last-child,
	object>method:last-child {
		margin-bottom: 0px;
	}
	class>method>name,
	object>method>name {
		display: block;
		border-bottom: 1px solid #000;
		margin-left: -20px;
		margin-bottom: -1px;
	}
	class>method>name>.spacer,
	object>method>name>.spacer {
		width: 20px;
		display: inline-block;
	}
	class>method>name>.pre,
	class>method>name>.post,
	class>method>name>.args,
	object>method>name>.pre,
	object>method>name>.post,
	object>method>name>.args {
		font-weight: bold;
	}
	class>method>name>.pre,
	object>method>name>.pre {
		color: green;
	}
	class>method>name>.args,
	object>method>name>.args {
		color: #2ea2cc;
	}
	class>method>name>.post,
	object>method>name>.post {
		color: blue;
	}
	class>method>bod,
	object>method>bod {
		display: block;
		border: 1px solid #000;
		padding: 5px;
		white-space: pre-wrap;
	}
</style>
	</head>
	<body>


<object name="rotte" class="Rotte">
	<prop name="Tilstand" type="enum" val="Levende, Skadet, Dod"></prop>
	<prop name="tilstand" type="Tilstand" val="Skadet"></prop>
	<prop name="navn" type="String" val="Remy"></prop>

	<method pre="public void" name="bliAngrepet" post="throws Exception">
		Tilstand nyTilstand;
		if (this.tilstand == Tilstand.Levende)
			nyTilstand = Tilstand.Skadet;
		else if (this.tilstand == Tilstand.Skadet)
			nyTilstand = Tilstand.Dod;
		else
			return;

		System.out.println(...);

		tilstand = nyTilstand;
	</method>
</object>

<object name="rottebol" class="Bol<Rotte>">
	<prop name="dyr" type="Mus"><arrow to="rotte"></arrow></prop>

	<method pre="public boolean" name="erTomt">
		return dyr == null;
	</method>

	<method pre="public void" name="settInn" args="Mus dyr" post="throws Exception">
		if (!erTomt())
			throw new Exception("Bolet er ikke tomt!");
		this.dyr = dyr;
	</method>

	<method pre="public T" name="hent">
		return dyr;
	</method>
</object>

<class name="Oblig1">
	<prop name="musebol" type="Bol<Mus>"><arrow to="musebol"</arrow></prop>
	<prop name="rottebol" type="Bol<Rotte>"><arrow to="rottebol"</arrow></prop>
	<prop name="rotte" type="Rotte"><arrow to="rotte"></arrow></prop>
	<prop name="mus" type="Mus"><arrow to="mus"></arrow></prop>
	<prop name="katt" type="Katt"><arrow to="katt"></arrow></prop>
	<prop name="mus2" type="Mus"><arrow to="mus2"></arrow></prop>
</class>

<object name="musebol" class="Bol<Mus>">
	<prop name="dyr" type="Mus"><arrow to="mus"></arrow></prop>

	<method pre="public boolean" name="erTomt">
		return dyr == null;
	</method>

	<method pre="public void" name="settInn" args="Mus dyr" post="throws Exception">
		if (!erTomt())
			throw new Exception("Bolet er ikke tomt!");
		this.dyr = dyr;
	</method>

	<method pre="public T" name="hent">
		return dyr;
	</method>
</object>

<object name="mus" class="Mus">
	<prop name="Tilstand" type="enum" val="Levende, Dod"></prop>
	<prop name="tilstand" type="Tilstand" val="Dod"></prop>
	<prop name="navn" type="String" val="Jerry"></prop>

	<method pre="public boolean" name="erDod">
		return tilstand == Tilstand.Dod;
	</method>

	<method pre="public void" name="bliAngrepet">
		Tilstand nyTilstand;
		if (tilstand == Tilstand.Levende)
			nyTilstand = Tilstand.Dod;
		else
			return;

		System.out.println(...);
		tilstand = nyTilstand;
	</method>
</object>

<object name="katt" class="Katt">
	<prop name="navn" type="String" val="Tom"></prop>

	<method pre="public void" name="jakt" args="Bol<Mus> musebol, Bol<Rotte> rottebol" post="throws Exception">
		if (!musebol.erTomt() && !musebol.hent().erDod()) {
			Mus mus = musebol.hent();
			System.out.println(...);
			mus.bliAngrepet();
			return;
		} else if (!rottebol.erTomt() && !rottebol.hent().erDod()) {
			Rotte rotte = rottebol.hent();
			System.out.println(...);
			rotte.bliAngrepet();
			return;
		}

		System.out.println(...);
	</method>
</object>

<object name="mus2" class="Mus">
	<prop name="Tilstand" type="enum" val="Levende, Dod"></prop>
	<prop name="tilstand" type="Tilstand" val="Levende"></prop>
	<prop name="navn" type="String" val="Cray"></prop>

	<method pre="public boolean" name="erDod">
		return tilstand == Tilstand.Dod;
	</method>

	<method pre="public void" name="bliAngrepet">
		Tilstand nyTilstand;
		if (tilstand == Tilstand.Levende)
			nyTilstand = Tilstand.Dod;
		else
			return;

		System.out.println(...);
		tilstand = nyTilstand;
	</method>
</object>


<script>
	window.scrollTo(0, 0);

	var defaultPos = {
		rotte: { x: 23, y: 10 },
		katt: { x: 187, y: 607 },
		musebol: { x: 1620, y: 47 },
		mus2: { x: 1619, y: 575 },
		mus: { x: 2145, y: 58 },
		Oblig1: { x: 1000, y: 52 },
		rottebol: { x: 490, y: 190 }
	};

	document.addEventListener("dragstart", function(evt) {
		evt.preventDefault();
	});

	function draggable(elem) {
		var pos;
		if (localStorage[elem.id]) {
			pos = JSON.parse(localStorage[elem.id]);
		} else {
			pos = defaultPos[elem.id];
		}

		function updatePos() {
			elem.style.top = pos.y+"px";
			elem.style.left = pos.x+"px";
			elem.style.position = "absolute";
			drawArrows();
		}
		setTimeout(updatePos, 10);

		var mx, my = 0;
		elem.addEventListener("mousedown", function(evt) {
			mx = evt.clientX;
			my = evt.clientY;
		});

		elem.addEventListener("mousemove", function(evt) {
			if (evt.buttons !== 1)
				return;

			pos.x += evt.clientX - mx;
			pos.y += evt.clientY - my;
			mx = evt.clientX;
			my = evt.clientY;
			updatePos();
		});

		elem.addEventListener("mouseup", function() {
			localStorage[elem.id] = JSON.stringify(pos);
		});
	}

	function htents(str) {
		if (!str)
			return "";
		return str
			.replace(/&/g, "&amp;")
			.replace(/</g, "&lt;")
			.replace(/>/g, "&gt;")
			.replace(/{{/g, "&lt;")
			.replace(/}}/g, "&gt;")
			.replace(/^\t\t/gm, "")
			.trim();
	}

	function attr(elem, attr, noescape) {
		if (noescape)
			return elem.getAttribute(attr);
		else
			return htents(elem.getAttribute(attr));
	}

	function elemPos(elem) {
		var rect = elem.getBoundingClientRect();
		return {
			mid: {
				x: rect.left + (rect.width / 2),
				y: rect.top + (rect.height / 2)
			},
			top: rect.top,
			bot: rect.top + rect.height,
			left: rect.left,
			right: rect.right
		};
	}

	function drawArrow(ctx, fromx, fromy, tox, toy){
		var headlen = 10;   // length of head in pixels
		var angle = Math.atan2(toy-fromy,tox-fromx);
		ctx.beginPath();
		ctx.moveTo(fromx, fromy);
		ctx.lineTo(tox, toy);
		ctx.lineTo(tox-headlen*Math.cos(angle-Math.PI/6),toy-headlen*Math.sin(angle-Math.PI/6));
		ctx.moveTo(tox, toy);
		ctx.lineTo(tox-headlen*Math.cos(angle+Math.PI/6),toy-headlen*Math.sin(angle+Math.PI/6));
		ctx.closePath();
		ctx.stroke();
	}

	//setup classes
	var classes = document.querySelectorAll("class");
	for (var i in classes) {
		if (!classes.hasOwnProperty(i)) continue;
		var c = classes[i];
		c.id = attr(c, "name", true);

		var eName = document.createElement("name");
		eName.innerHTML = "Klassedatastruktur <b>"+attr(c, "name")+"</b>";
		c.insertBefore(eName, c.firstChild);
	}

	//setup objects
	var objects = document.querySelectorAll("object");
	for (var i in objects) {
		if (!objects.hasOwnProperty(i)) continue;
		var obj = objects[i];
		obj.id = attr(obj, "name", true);

		var eName = document.createElement("name");
		eName.innerHTML =
			"Objekt <b>"+attr(obj, "name")+"</b>"+
			" av klassen <b>"+attr(obj, "class")+"</b>";
		obj.insertBefore(eName, obj.firstChild);
	}

	//setup props
	var props = document.querySelectorAll("prop");
	for (var i in props) {
		if (!props.hasOwnProperty(i)) continue;
		var prop = props[i];

		var eName = document.createElement("name");
		eName.innerHTML = "Navn: <b>"+attr(prop, "name")+"</b>";
		prop.appendChild(eName);

		var eVal = document.createElement("val");
		eVal.innerHTML = attr(prop, "val");
		prop.appendChild(eVal);

		var eType = document.createElement("type");
		eType.innerHTML = "Type: <b>"+attr(prop, "type")+"</b>";
		prop.appendChild(eType);
	}

	//setup methods
	var meths = document.querySelectorAll("method");
	for (var i in meths) {
		if (!meths.hasOwnProperty(i)) continue;
		var meth = meths[i];

		var body = htents(meth.innerHTML);
		meth.innerHTML = "";

		var eName = document.createElement("name");
		eName.innerHTML = "<span class='spacer'></span>"+
			" <span class='pre'>"+attr(meth, "pre")+"</span>"+
			" <span class='main'>"+attr(meth, "name")+"</span>"+
			"(<span class='args'>"+attr(meth, "args")+"</span>)"+
			" <span class='post'>"+attr(meth, "post")+"</span>";
		meth.appendChild(eName);

		var eBody = document.createElement("bod");
		eBody.innerHTML = body;
		meth.appendChild(eBody);
	}

	//create canvas
	var canvas = document.createElement("canvas");
	document.body.insertBefore(canvas, document.body.firstChild);
	var ctx = canvas.getContext("2d");

	//draw arrows
	function drawArrows() {
		canvas.height = window.innerHeight * 2;
		canvas.width = window.innerWidth * 2;
		var arrows = document.querySelectorAll("arrow");
		for (var i in arrows) {
			if (!arrows.hasOwnProperty(i)) continue;
			var arrow = arrows[i];

			var from = elemPos(arrow.parentNode);
			var to = elemPos(document.getElementById(arrow.getAttribute("to")));

			var fx, fy, tx, ty;
			fx = from.mid.x;
			fy = from.mid.y;
			if (from.mid.x > to.mid.x)
				tx = to.right;
			else
				tx = to.left;
			if (from.mid.y > to.mid.y)
				ty = to.bot;
			else
				ty = to.top;

			drawArrow(ctx, fx, fy, tx, ty);
		}
	}
	drawArrows();

	//draggable
	var draggables = document.querySelectorAll("class, object");
	for (var i in draggables) {
		if (!draggables.hasOwnProperty(i)) continue;
		draggable(draggables[i]);
	}
</script>
	</body>
</html>