2016-04-05 38 views
0

Blocklyでコーディングを開始していますが、新しいブロックを作成しようとすると問題が発生します。私が作ったステップ:ブロックされていないブロック:ブロックされていないタイプのエラー:ブロックできません。

  • Blocklyアプリケーションcodeをダウンロードしてください。
  • すべてのファイルをBlocklyという名前のフォルダに入れます。
  • そのフォルダに新しいhtmlファイルを作成して、ツールボックスが正常に機能しているかどうかを確認しました。
  • 私はBlock Factoryで2つの新しいブロックを作成しました。
  • 新しいcustomBlocks.jsファイルを使用して、これらの新しいブロックをツールボックスに追加しようとしました。

2つの新しいブロックを追加したので問題が発生しますが、ツールボックスに表示されるのは最初のものだけですが、2番目のものは表示されません。ブロックの順番に関係して、ちょうど第2のものが決して正しく表示されることはありません。ここで

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="blockly_compressed.js"></script> 
     <script src="blocks_compressed.js"></script> 
     <script src="customBlocks.js"></script> 
     <script src="msg/js/en.js"></script> 
    </head> 
    <body> 
     <h1>This is a prove </h1> 
     <div id = "blocklyMove" style = "height: 100px; width: 100px; background-color: red;"></div> 
     <div id="blocklyDiv" style="height: 480px; width: 600px;"></div> 

     <xml id="toolbox" style="display: none"> 
      <block type="controls_if"></block> 
      <block type="controls_repeat_ext"></block> 
      <block type="logic_compare"></block> 
      <block type="math_number"></block> 
      <block type="math_arithmetic"></block> 
      <block type="text"></block> 
      <block type="text_print"></block> 
      <block type="move_right"></block> 
      <block type="blockObject"></block> 
     </xml> 

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

は私customBlocks.jsファイルです:

'use strict'; 

/* *********************** MOVES TO RIGHT *********************** */ 

Blockly.Blocks['move_right'] = { 
    init: function() { 
    this.appendValueInput("PIXELS") 
     .setCheck("Number") 
     .appendField("move to right"); 
    this.setInputsInline(true); 
    this.setOutput(true, null); 
    this.setColour(120); 
    this.setTooltip(''); 
    this.setHelpUrl('http://www.example.com/'); 
    } 
}; 

Blockly.JavaScript['move_right'] = function(block) { 
    var value_pixels = Blockly.JavaScript.valueToCode(block, 'PIXELS', Blockly.JavaScript.ORDER_ATOMIC); 
    // TODO: Assemble JavaScript into code variable. 
    var code = "$(document).ready(function(){ " + 
       "$(\"blocklyMove\").animate({ " + 
        "right: " + value_pixels + "px" + 
       "});" + 
      "});"; 
    // TODO: Change ORDER_NONE to the correct strength. 
    return [code, Blockly.JavaScript.ORDER_NONE]; 
}; 

/* *********************** BLOCK *********************** */ 

Blockly.Blocks['blockObject'] = { 
    init: function() { 
    this.appendValueInput("MOVEMENT") 
     .setCheck(null) 
     .appendField("Block"); 
    this.setColour(20); 
    this.setTooltip(''); 
    this.setHelpUrl('http://www.example.com/'); 
    } 
}; 

Blockly.JavaScript['blockObject'] = function(block) { 
    var value_movement = Blockly.JavaScript.valueToCode(block, 'MOVEMENT', Blockly.JavaScript.ORDER_ATOMIC); 
    // TODO: Assemble JavaScript into code variable. 
    var code = '...;\n'; 
    return code; 
}; 

私はそれが私にGoogle Chromeのコンソールに次のエラーを与えていることを見ることができました。ここ

は私htmlファイルです

Uncaught TypeError: Cannot set property 'move_right' of undefined

私はここにこだわっており、わかりません何が問題なの?どんな助けもありがとう。

P.S:まだ完成していないので、ブロックのロジックに集中しないでください。しかし、ロジックを終了する前に両方のブロックが正しく表示されることを確認したいと考えました。

ありがとうございます!

+0

私は気にしないでください。私は説明がないdownvoteは私たちの誰も助けてくれないと思います。ありがとうございました! –

答えて

1

最後に、解決策が見つかりました。私はそれが定義さBlockly.JavaScriptれている別のjsファイル(javascript_compressed.js)への参照を作成するには、以下の<script>のタグを追加する必要がありましたhtmlファイルに:あなたは私をdownvoteが、なぜ私に説明してください場合

<script src="javascript_compressed.js"></script>