<!--
/*************************************************************
* This script is developed by Arturs Sosins aka ar2rsawseen, http://webcodingeasy.com
* Feel free to distribute and modify code, but keep reference to its creator
*
* Canvas Turtle provides LOGO Turtle Grpahics Javascript API
* and LOGO Turtle Grpahic language interpreter for drawing
* objects in Canvas
*
* For more information, examples and online documentation visit:
* http://webcodingeasy.com/JS-classes/Canvas-Turtle-graphics-using-javascript
**************************************************************/
-->
<html>
<head>
</head>
<body>
<div id='logo_div' style='border: 2px solid black; width: 70%; height: 600px; float: left;'></div>
<form method='post' action='' onsubmit='exec(); return false;'>
<p><textarea id='cmd' style='height: 600px; width: 25%; padding: 10px;'>
clear
REPEAT 10
REPEAT 4
DRAW 50
RIGHT 90
NEXT
RIGHT 36
NEXT
</textarea>
<input type='submit' value='Exec' style='float: right;'/>
<span style='float: right; margin-right: 20px;'><input type='checkbox' id='clear'/> clear on exec</span></p>
</form>
<script src="./canvas_turtle.packed.js" type="text/javascript"></script>
<script>
var l = new canvas_turtle("logo_div", {
//width of canvas
width: 800,
//height of canvas
height: 600,
//on error callback if canvas is unsupported
on_error: null,
//graphic for turtle (for debugging)
turtle: "./turtle.png"
});
var exec = function(){
var inp = document.getElementById("cmd");
l.exec(inp.value);
if(document.getElementById("clear").checked)
{
inp.value = "";
}
};
</script>
</body>
</html> |