Base platformer structure
with matter.js physics engine
WASD and mouse to move
A Pen by lilgreenland on CodePen.
<!-- | |
LaTex equations are form the mathjax library | |
http://docs.mathjax.org/en/latest/# | |
put LaTex between $$ $$ example: $$v = \lambda f$$ | |
use this to generate LaTex | |
http://www.hostmath.com/ | |
--> | |
<body onload="vectorDiagram()"> |
<p><b>Orientation</b> | |
<br>α(z) [0, 360]: <span class="data"><a id='alpha'> </a>°</span> | |
<br>β(x) [-180,180]: <span class="data"><a id='beta'> </a>°</span> | |
<br>γ(y) [-90,90]: <span class="data"><a id='gamma'> </a>°</span> | |
</p> | |
<hr> | |
<p> | |
<b>Rotation</b> | |
<br>α: <span class="data"><a id='rx'></a>°</span> |
Base platformer structure
with matter.js physics engine
WASD and mouse to move
A Pen by lilgreenland on CodePen.
<div id="keysleft"> | |
move: WASD | |
<br>hold/drop: E | |
<br>pause: F | |
<br>gravity: R | |
</div> | |
<div id="keysright"> | |
zoom: + - | |
<br>fire: click | |
<br>testing: T |
<canvas id="canvas"></canvas> | |
<svg class='background'> | |
<defs> | |
<style type="text/css"><![CDATA[ | |
.keyrect { | |
stroke: #333; | |
fill: "#555"; | |
rx: 5; | |
} |
A Pen by lilgreenland on CodePen.
A Pen by lilgreenland on CodePen.
<center> | |
<button type="button" class="button" onclick="nextPeriod()">period <span id='period'>1</span></button> | |
<button type="button" class="button blue" onclick="pickRandom(1)"><span>random</span></button> | |
</center> | |
<ul class="grid" id='grid'></ul> | |
<center> | |
<button type="button" class="button red" onclick="reset()">reset</button> | |
<button type="button" class="button" onclick="exportToJsonFile(localStorage.getItem('classes'))">export</button> | |
<button type="button" class="button" onclick="import()">import</button> | |
<button type="button" class="button" onclick="add()">add</button> |
<div id='bodybox'> | |
<select id = 'language'> | |
<option value="en-GB">GB</option> | |
<option value="en-US">US</option> | |
<option value="en-AU">AU</option> | |
<option value="fr-FR">FR</option> | |
<option value="de-DE">DE</option> | |
<option value="en-IN">IN</option> | |
<option value="zh-CN">CN</option> | |
<option value="pl">PL</option> |