blocklyでobjectを動かす。 その10

概要

blocklyでobjectを動かして見る。
obelisk.js、やってみた。

写真

ステージを作る。

<canvas id="canvas" width="300" height="300"></canvas>

ブロックを書く。

Blockly.Blocks.say = {
	init: function() {
		this.jsonInit({
    		message0: "say x %1 y %2 z %3",
	    	args0: [{
        		type: "input_value",
		        name: "x",
		        check: "Number",
	        	align: "RIGHT"
        	},{
	        	type: "input_value",
	        	name: "y",
	        	check: "Number",
	        	align: "RIGHT"
	        },{
	        	type: "input_value",
	        	name: "z",
	        	check: "Number",
	        	align: "RIGHT"
		    }],
		    previousStatement: null,
		    nextStatement: null,
		    style: "text_blocks",
		    tooltip: Blockly.Msg.TEXT_PRINT_TOOLTIP,
		    helpUrl: Blockly.Msg.TEXT_PRINT_HELPURL
	    })
    }
};

フローを書く。

objectを書く。

Blockly.JavaScript.say = function(a) {
   	var b = Blockly.JavaScript.valueToCode(a, "x", Blockly.JavaScript.ORDER_COMMA) || 0,
		c = Blockly.JavaScript.valueToCode(a, "y", Blockly.JavaScript.ORDER_COMMA) || 0;
	    a = Blockly.JavaScript.valueToCode(a, "z", Blockly.JavaScript.ORDER_COMMA) || 0;

    return "k0.saa(" + b + "," + c + "," + a + ");\n"
};

var canvas = document.getElementById('canvas');
var point = new obelisk.Point(100, 100);
var pixelView = new obelisk.PixelView(canvas, point);
var kame = function(pixelView) {
    this.pixelView = pixelView;
};
kame.prototype.saa = function(x, y, z) {
    var p3d = new obelisk.Point3D(30 * x, 30 * y, (32 + 1) * z);
    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);

成果物

以上。