blockly

block.js
Blockly.Blocks['print'] = {
    init: function() {
      this.appendValueInput("input")
          .setCheck("String")
          .appendField("print");
      this.setInputsInline(true);
      this.setPreviousStatement(true, null);
      this.setNextStatement(true, null);
      this.setColour(230);
   this.setTooltip("This block displays an alert box with the specified message");
   this.setHelpUrl("");
    }
  };

  Blockly.Blocks['text_input'] = {
    init: function() {
      this.appendDummyInput()
          .appendField("\"")
          .appendField(new Blockly.FieldTextInput("text"), "NAME")
          .appendField("\"");
      this.setInputsInline(true);
      this.setOutput(true, "String");
      this.setColour(180);
   this.setTooltip("This block displays the text typed by the user");
   this.setHelpUrl("");
    }
  };

generator
Blockly.JavaScript['print'] = function(block) {
    var value_input = Blockly.JavaScript.valueToCode(block, 'input', Blockly.JavaScript.ORDER_ATOMIC);
    var code = 'alert('+ value_input+');\n';
    return code;
  };

  Blockly.JavaScript['text_input'] = function(block) {
    var text_name = block.getFieldValue('NAME');
    var code = '"'+text_name+'"';
    return [code, Blockly.JavaScript.ORDER_ATOMIC];
  };

index.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Blockly Demo</title>
  <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
  <script src="blockly_compressed.js"></script>
  <script src="blocks_compressed.js"></script>
  <script src="javascript_compressed.js"></script>
  <script src="en.js"></script>
  <script src="blocks.js"></script>
  <script src="generator_stub.js"></script>
  <style>
    body {
      background-color: #fff;
      font-family: sans-serif;
    }
    h1 {
      font-weight: normal;
      font-size: 140%;
    }
    a-scene {
    height: 700px;
    width: auto;
    }
  </style>
</head>
<body>
  <p>
    <button onclick="showCode()">Show Code</button>
    <button onclick="runCode()">Run</button>
  </p>
  <table style="table-layout: auto; width: 100%">
      <tr>
          <td id="blocklyArea" width=50%>
              <div id="blocklyDiv" style="height: 700px; width:auto;"></div>
          </td>
          <td id ="GUI" width=50%>
            <div style="height: 700px; width:auto;">
                <a-scene embedded>
                    <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane>
                    <a-sky color="#ECECEC"></a-sky>
              </a-scene>
            </div>
          </td>
      </tr>
  </table>

  <xml id="toolbox" style="display: none">
    <category name="Basic blocks" colour="180">
        <block type="print"></block>
        <block type="text_input"></block>
    </category>
  </xml>

  <script>
    var demoWorkspace = Blockly.inject('blocklyDiv',
        {toolbox: document.getElementById('toolbox')});

    function updateRealTimeCodeGeneration(event) {
        var code = Blockly.JavaScript.workspaceToCode(demoWorkspace);
    }

    demoWorkspace.addChangeListener(updateRealTimeCodeGeneration);

    function showCode() {
      var code = Blockly.JavaScript.workspaceToCode(demoWorkspace);
      alert(code);
    }

    function runCode() {
      // Generate JavaScript code and run it.
      window.LoopTrap = 1000;
      Blockly.JavaScript.INFINITE_LOOP_TRAP = 'if (--window.LoopTrap == 0) throw "Infinite loop.";\n';
      var code = Blockly.JavaScript.workspaceToCode(demoWorkspace);
      Blockly.JavaScript.INFINITE_LOOP_TRAP = null;
      try {
        eval(code);
      } catch (e) {
        alert(e);
      }
    }
  </script>
</body>
</html>