概要
jsdoでblocklyやってみた。
blocklyでobelisk積んでみた。
写真
スクリプト
サンプルコード
var canvas = document.getElementById('canvas-demo');
var point = new obelisk.Point(200, 200);
var pixelView = new obelisk.PixelView(canvas, point);
var kame = function(pixelView) {
this.pixelView = pixelView;
};
kame.prototype.say = function(text) {
var cond = text.split(',');
var p3d = new obelisk.Point3D(30 * cond[0], 30 * cond[1], (32 + 1) * cond[2]);
var cubeDms = new obelisk.CubeDimension(30, 30, 32);
var cubeColor = new obelisk.CubeColor().getByHorizontalColor(obelisk.ColorPattern.getRandomComfortableColor());
var cube = new obelisk.Cube(cubeDms, cubeColor, false);
this.pixelView.renderObject(cube, p3d);
};
var k0 = new kame(pixelView);
var demoWorkspace = Blockly.inject(document.getElementById('blocklyDiv'), {
path: 'http://jeromeetienne.github.io/blockly-threex/apps/frame-edit/../../',
toolbox: document.getElementById('toolbox')
});
Blockly.Xml.domToWorkspace(Blockly.getMainWorkspace(), document.getElementById('startBlocks'));
function showCode() {
Blockly.JavaScript.INFINITE_LOOP_TRAP = null;
var code = Blockly.JavaScript.workspaceToCode(demoWorkspace);
alert(code);
}
function runCode() {
var code = Blockly.JavaScript.workspaceToCode(demoWorkspace);
run(code);
}
function showXml() {
var xml = Blockly.Xml.workspaceToDom(Blockly.getMainWorkspace());
var code = Blockly.Xml.domToPrettyText(xml);
var out = document.getElementById('output');
alert(code);
out.value = code;
}
window.run = function run(generatedCode) {
commands = [];
eval(generatedCode)
setTimeout(function callback() {
var command = commands.shift()
eval(command)
if (commands.length === 0) return
setTimeout(callback, stepDelay * 1000)
}, 0)
}
var updateFcts = []
var commands;
var stepDelay = 0.5
var Turtle = {}
window.Turtle = Turtle
Turtle._say = function(text) {
k0.say(text);
}
Turtle.say = function(text) {
commands.push('Turtle._say("' + text + '");');
}
成果物
以上。