Commit c64915c328547c5d94853531ef969fa5280d1c2c - HTML5-Gewgaws

+0

-87

~~common-yoob.js-0.5/animation-frame.js~~ less more

0		/*
1		* This file is part of yoob.js version 0.5
2		* Available from https://github.com/catseye/yoob.js/
3		* This file is in the public domain. See http://unlicense.org/ for details.
4		*/
5		if (window.yoob === undefined) yoob = {};
6
7		/*
8		* Pretty standard shim to get window.{request,cancelRequest}AnimationFrame
9		* functions, synthesized from the theory and the many examples I've seen.
10		*/
11
12		window.requestAnimationFrame =
13		window.requestAnimationFrame \|\|
14		window.webkitRequestAnimationFrame \|\|
15		window.mozRequestAnimationFrame \|\|
16		window.oRequestAnimationFrame \|\|
17		window.msRequestAnimationFrame \|\|
18		function(f, elem) {
19		return setTimeout(function() {
20		f(Date.now());
21		}, 1000 / 60);
22		};
23
24		window.cancelRequestAnimationFrame =
25		window.cancelRequestAnimationFrame \|\|
26		window.webkitCancelRequestAnimationFrame \|\|
27		window.mozCancelRequestAnimationFrame \|\|
28		window.oCancelRequestAnimationFrame \|\|
29		window.msCancelRequestAnimationFrame \|\|
30		clearTimeout;
31
32		/*
33		* Convenience function for using requestAnimationFrame. Calls the
34		* object's draw() method on each animation frame, and calls update()
35		* as necessary to ensure it is called once every tickTime milliseconds.
36		* By default, tickTime = 1/60th of a second. It can be configured by
37		* passing in a configuration dictionary after the object. If the
38		* configuration dictionary is assigned to a variable outside this
39		* function, after this function returns, the request entry in the
40		* dictionary will contain the animation request handle. e.g.,
41		*
42		* var cfg = {};
43		* cfg.tickTime = 1000.0 / 50.0;
44		* yoob.setUpQuantumAnimationFrame(this, cfg);
45		* cancelRequestAnimationFrame(cfg.request);
46		*
47		*/
48		yoob.setUpQuantumAnimationFrame = function(object, cfg) {
49		cfg = cfg \|\| {};
50		cfg.lastTime = cfg.lastTime \|\| null;
51		cfg.accumDelta = cfg.accumDelta \|\| 0;
52		cfg.tickTime = cfg.tickTime \|\| (1000.0 / 60.0);
53		var animFrame = function(time) {
54		object.draw();
55		if (cfg.lastTime === null) {
56		cfg.lastTime = time;
57		}
58		cfg.accumDelta += (time - cfg.lastTime);
59		while (cfg.accumDelta > cfg.tickTime) {
60		cfg.accumDelta -= cfg.tickTime;
61		object.update();
62		}
63		cfg.lastTime = time;
64		cfg.request = requestAnimationFrame(animFrame);
65		};
66		cfg.request = requestAnimationFrame(animFrame);
67		};
68
69		/*
70		* Convenience function for using requestAnimationFrame. Calls the
71		* object's draw() method on each animation frame, passing the amount
72		* of time that has elapsed (in milliseconds) since the last time it
73		* was called (or 0 if it was never previously called.) Otherwise
74		* similar to yoob.setUpQuantumAnimationFrame.
75		*/
76		yoob.setUpProportionalAnimationFrame = function(object, cfg) {
77		cfg = cfg \|\| {};
78		cfg.lastTime = cfg.lastTime \|\| null;
79		var animFrame = function(time) {
80		var timeElapsed = cfg.lastTime == null ? 0 : time - cfg.lastTime;
81		cfg.lastTime = time;
82		object.draw(timeElapsed);
83		cfg.request = requestAnimationFrame(animFrame);
84		};
85		cfg.request = requestAnimationFrame(animFrame);
86		};

+0

-53

~~common-yoob.js-0.5/full-screen-detector.js~~ less more

0		/*
1		* This file is part of yoob.js version 0.5
2		* Available from https://github.com/catseye/yoob.js/
3		* This file is in the public domain. See http://unlicense.org/ for details.
4		*/
5		if (window.yoob === undefined) yoob = {};
6
7		/*
8		* A shim (of sorts) which detects when the user has toggled their browser's
9		* full-screen mode (usually but not necessarily by pressing the F11 key) and
10		* fires an 'onchange' event, in which you can resize DOM elements of your
11		* choosing to suit the (non-)full-screen display (or whatever else you wish.)
12		*
13		* Tested in recent Firefox, Chromium, and IE. Sure to fail in older versions
14		* of some of those.
15		*/
16		yoob.FullScreenDetector = function(cfg) {
17		this.init = function(cfg) {
18		this.period = cfg.period \|\| 250;
19		this.onchange = cfg.onchange \|\| function() {};
20		this.fullScreen = false;
21		this.start();
22		return this;
23		};
24
25		this.start = function() {
26		if (this.intervalId) return;
27		var $this = this;
28		this.intervalId = setInterval(function() {
29		if (!$this.fullScreen) {
30		if (window.fullScreen \|\|
31		((!window.screenTop) && (!window.screenY))) {
32		$this.fullScreen = true;
33		$this.onchange($this.fullScreen);
34		}
35		} else {
36		if (window.screenTop \|\| window.screenY \|\|
37		(window.fullScreen === false)) {
38		$this.fullScreen = false;
39		$this.onchange($this.fullScreen);
40		}
41		}
42		}, this.period);
43		};
44
45		this.stop = function() {
46		if (!this.intervalId) return;
47		clearInterval(this.intervalId);
48		this.intervalId = undefined;
49		};
50
51		this.init(cfg);
52		};

+0

-43

~~common-yoob.js-0.5/splash-screen.js~~ less more

0		/*
1		* This file is part of yoob.js version 0.5
2		* Available from https://github.com/catseye/yoob.js/
3		* This file is in the public domain. See http://unlicense.org/ for details.
4		*/
5		if (window.yoob === undefined) yoob = {};
6
7		/*
8		* An adapter-type thing which displays a div element with some inner HTML
9		* (typically containing a message or logo or such) and a "Proceed" button,
10		* all in place of a given element. When the button is clicked, the div is
11		* hidden, the given element is displayed, and the passed-in `onproceed`
12		* callback is invoked.
13		*
14		* The intention is to allow a "splash screen", which may contain a disclaimer
15		* or similar, warning of epileptic seizures or nudity or whatever, before the
16		* "main canvas" or whatever is actually displayed and started. Yeah.
17		*/
18		yoob.showSplashScreen = function(cfg) {
19		var elem = document.getElementById(cfg.elementId);
20		var coveringDiv = document.createElement("div");
21		coveringDiv.style.left = elem.offsetLeft + 'px';
22		coveringDiv.style.top = elem.offsetTop + 'px';
23		coveringDiv.style.width = elem.offsetWidth + 'px';
24		coveringDiv.style.height = elem.offsetHeight + 'px';
25		coveringDiv.style.position = "absolute";
26		coveringDiv.style.border = elem.style.border;
27		coveringDiv.style.background = cfg.background \|\| '#ffffff';
28		if (parseInt(elem.style.zIndex) === NaN) {
29		coveringDiv.style.zIndex = 100;
30		} else {
31		coveringDiv.style.zIndex = parseInt(elem.style.zIndex) + 1;
32		}
33		coveringDiv.innerHTML = cfg.innerHTML;
34		var button = document.createElement("button");
35		button.innerHTML = cfg.buttonText \|\| "Proceed";
36		button.onclick = function() {
37		coveringDiv.style.display = 'none';
38		(cfg.onproceed \|\| function() {})();
39		};
40		coveringDiv.appendChild(button);
41		document.body.appendChild(coveringDiv);
42		};

+87

-0

common-yoob.js-0.6/animation-frame.js less more

	0	/*
	1	* This file is part of yoob.js version 0.5
	2	* Available from https://github.com/catseye/yoob.js/
	3	* This file is in the public domain. See http://unlicense.org/ for details.
	4	*/
	5	if (window.yoob === undefined) yoob = {};
	6
	7	/*
	8	* Pretty standard shim to get window.{request,cancelRequest}AnimationFrame
	9	* functions, synthesized from the theory and the many examples I've seen.
	10	*/
	11
	12	window.requestAnimationFrame =
	13	window.requestAnimationFrame \|\|
	14	window.webkitRequestAnimationFrame \|\|
	15	window.mozRequestAnimationFrame \|\|
	16	window.oRequestAnimationFrame \|\|
	17	window.msRequestAnimationFrame \|\|
	18	function(f, elem) {
	19	return setTimeout(function() {
	20	f(Date.now());
	21	}, 1000 / 60);
	22	};
	23
	24	window.cancelRequestAnimationFrame =
	25	window.cancelRequestAnimationFrame \|\|
	26	window.webkitCancelRequestAnimationFrame \|\|
	27	window.mozCancelRequestAnimationFrame \|\|
	28	window.oCancelRequestAnimationFrame \|\|
	29	window.msCancelRequestAnimationFrame \|\|
	30	clearTimeout;
	31
	32	/*
	33	* Convenience function for using requestAnimationFrame. Calls the
	34	* object's draw() method on each animation frame, and calls update()
	35	* as necessary to ensure it is called once every tickTime milliseconds.
	36	* By default, tickTime = 1/60th of a second. It can be configured by
	37	* passing in a configuration dictionary after the object. If the
	38	* configuration dictionary is assigned to a variable outside this
	39	* function, after this function returns, the request entry in the
	40	* dictionary will contain the animation request handle. e.g.,
	41	*
	42	* var cfg = {};
	43	* cfg.tickTime = 1000.0 / 50.0;
	44	* yoob.setUpQuantumAnimationFrame(this, cfg);
	45	* cancelRequestAnimationFrame(cfg.request);
	46	*
	47	*/
	48	yoob.setUpQuantumAnimationFrame = function(object, cfg) {
	49	cfg = cfg \|\| {};
	50	cfg.lastTime = cfg.lastTime \|\| null;
	51	cfg.accumDelta = cfg.accumDelta \|\| 0;
	52	cfg.tickTime = cfg.tickTime \|\| (1000.0 / 60.0);
	53	var animFrame = function(time) {
	54	object.draw();
	55	if (cfg.lastTime === null) {
	56	cfg.lastTime = time;
	57	}
	58	cfg.accumDelta += (time - cfg.lastTime);
	59	while (cfg.accumDelta > cfg.tickTime) {
	60	cfg.accumDelta -= cfg.tickTime;
	61	object.update();
	62	}
	63	cfg.lastTime = time;
	64	cfg.request = requestAnimationFrame(animFrame);
	65	};
	66	cfg.request = requestAnimationFrame(animFrame);
	67	};
	68
	69	/*
	70	* Convenience function for using requestAnimationFrame. Calls the
	71	* object's draw() method on each animation frame, passing the amount
	72	* of time that has elapsed (in milliseconds) since the last time it
	73	* was called (or 0 if it was never previously called.) Otherwise
	74	* similar to yoob.setUpQuantumAnimationFrame.
	75	*/
	76	yoob.setUpProportionalAnimationFrame = function(object, cfg) {
	77	cfg = cfg \|\| {};
	78	cfg.lastTime = cfg.lastTime \|\| null;
	79	var animFrame = function(time) {
	80	var timeElapsed = cfg.lastTime == null ? 0 : time - cfg.lastTime;
	81	cfg.lastTime = time;
	82	object.draw(timeElapsed);
	83	cfg.request = requestAnimationFrame(animFrame);
	84	};
	85	cfg.request = requestAnimationFrame(animFrame);
	86	};

+53

-0

common-yoob.js-0.6/full-screen-detector.js less more

	0	/*
	1	* This file is part of yoob.js version 0.5
	2	* Available from https://github.com/catseye/yoob.js/
	3	* This file is in the public domain. See http://unlicense.org/ for details.
	4	*/
	5	if (window.yoob === undefined) yoob = {};
	6
	7	/*
	8	* A shim (of sorts) which detects when the user has toggled their browser's
	9	* full-screen mode (usually but not necessarily by pressing the F11 key) and
	10	* fires an 'onchange' event, in which you can resize DOM elements of your
	11	* choosing to suit the (non-)full-screen display (or whatever else you wish.)
	12	*
	13	* Tested in recent Firefox, Chromium, and IE. Sure to fail in older versions
	14	* of some of those.
	15	*/
	16	yoob.FullScreenDetector = function(cfg) {
	17	this.init = function(cfg) {
	18	this.period = cfg.period \|\| 250;
	19	this.onchange = cfg.onchange \|\| function() {};
	20	this.fullScreen = false;
	21	this.start();
	22	return this;
	23	};
	24
	25	this.start = function() {
	26	if (this.intervalId) return;
	27	var $this = this;
	28	this.intervalId = setInterval(function() {
	29	if (!$this.fullScreen) {
	30	if (window.fullScreen \|\|
	31	((!window.screenTop) && (!window.screenY))) {
	32	$this.fullScreen = true;
	33	$this.onchange($this.fullScreen);
	34	}
	35	} else {
	36	if (window.screenTop \|\| window.screenY \|\|
	37	(window.fullScreen === false)) {
	38	$this.fullScreen = false;
	39	$this.onchange($this.fullScreen);
	40	}
	41	}
	42	}, this.period);
	43	};
	44
	45	this.stop = function() {
	46	if (!this.intervalId) return;
	47	clearInterval(this.intervalId);
	48	this.intervalId = undefined;
	49	};
	50
	51	this.init(cfg);
	52	};

+43

-0

common-yoob.js-0.6/splash-screen.js less more

	0	/*
	1	* This file is part of yoob.js version 0.5
	2	* Available from https://github.com/catseye/yoob.js/
	3	* This file is in the public domain. See http://unlicense.org/ for details.
	4	*/
	5	if (window.yoob === undefined) yoob = {};
	6
	7	/*
	8	* An adapter-type thing which displays a div element with some inner HTML
	9	* (typically containing a message or logo or such) and a "Proceed" button,
	10	* all in place of a given element. When the button is clicked, the div is
	11	* hidden, the given element is displayed, and the passed-in `onproceed`
	12	* callback is invoked.
	13	*
	14	* The intention is to allow a "splash screen", which may contain a disclaimer
	15	* or similar, warning of epileptic seizures or nudity or whatever, before the
	16	* "main canvas" or whatever is actually displayed and started. Yeah.
	17	*/
	18	yoob.showSplashScreen = function(cfg) {
	19	var elem = document.getElementById(cfg.elementId);
	20	var coveringDiv = document.createElement("div");
	21	coveringDiv.style.left = elem.offsetLeft + 'px';
	22	coveringDiv.style.top = elem.offsetTop + 'px';
	23	coveringDiv.style.width = elem.offsetWidth + 'px';
	24	coveringDiv.style.height = elem.offsetHeight + 'px';
	25	coveringDiv.style.position = "absolute";
	26	coveringDiv.style.border = elem.style.border;
	27	coveringDiv.style.background = cfg.background \|\| '#ffffff';
	28	if (parseInt(elem.style.zIndex) === NaN) {
	29	coveringDiv.style.zIndex = 100;
	30	} else {
	31	coveringDiv.style.zIndex = parseInt(elem.style.zIndex) + 1;
	32	}
	33	coveringDiv.innerHTML = cfg.innerHTML;
	34	var button = document.createElement("button");
	35	button.innerHTML = cfg.buttonText \|\| "Proceed";
	36	button.onclick = function() {
	37	coveringDiv.style.display = 'none';
	38	(cfg.onproceed \|\| function() {})();
	39	};
	40	coveringDiv.appendChild(button);
	41	document.body.appendChild(coveringDiv);
	42	};

+4

-1

cyclobots/cyclobots.js less more

151	151	e.preventDefault();
152	152	});
153	153
154		yoob.setUpQuantumAnimationFrame(this);
	154	this.animation = (new yoob.Animation()).init({
	155	object: this
	156	});
	157	this.animation.start();
155	158	};
156	159
157	160	this.selectABot = function(canvasX, canvasY) {

+1

-1

multicolouralism/index.html less more

20	20
21	21	</body>
22	22	<script src="../common-yoob.js-0.6/animation.js"></script>
23		<script src="../common-yoob.js-0.5/splash-screen.js"></script>
	23	<script src="../common-yoob.js-0.6/splash-screen.js"></script>
24	24	<script src="multicolouralism.js"></script>
25	25	<script>
26	26	yoob.showSplashScreen({