|
|
|
|
|
<!DOCTYPE html> |
|
|
<html lang="ja"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Arduinoビジュアルプログラミング</title> |
|
|
<style> |
|
|
body { |
|
|
font-family: Arial, sans-serif; |
|
|
margin: 0; |
|
|
padding: 20px; |
|
|
background-color: #f0f0f0; |
|
|
} |
|
|
|
|
|
.container { |
|
|
display: flex; |
|
|
gap: 20px; |
|
|
max-width: 1200px; |
|
|
margin: 0 auto; |
|
|
align-items: stretch; |
|
|
} |
|
|
|
|
|
#block-area { |
|
|
width: 60%; |
|
|
height: 500px; |
|
|
background-color: #fff; |
|
|
border: 2px solid #ccc; |
|
|
border-radius: 5px; |
|
|
position: relative; |
|
|
} |
|
|
|
|
|
#code-area { |
|
|
width: 40%; |
|
|
height: 500px; |
|
|
background-color: #333; |
|
|
color: #fff; |
|
|
border-radius: 5px; |
|
|
padding: 10px; |
|
|
overflow-y: auto; |
|
|
font-family: monospace; |
|
|
box-sizing: border-box; |
|
|
position: relative; |
|
|
} |
|
|
|
|
|
#copy-button { |
|
|
position: absolute; |
|
|
top: 10px; |
|
|
right: 10px; |
|
|
cursor: pointer; |
|
|
} |
|
|
|
|
|
#copy-message { |
|
|
position: absolute; |
|
|
top: 40px; |
|
|
right: 10px; |
|
|
background-color: rgba(0, 0, 0, 0.7); |
|
|
color: #fff; |
|
|
padding: 5px 10px; |
|
|
border-radius: 3px; |
|
|
font-size: 12px; |
|
|
display: none; |
|
|
} |
|
|
|
|
|
.highlight { |
|
|
background-color: #FFFF99 !important; |
|
|
color: #000 !important; |
|
|
} |
|
|
|
|
|
.button-container { |
|
|
max-width: 1200px; |
|
|
margin: 20px auto 0; |
|
|
display: flex; |
|
|
justify-content: space-between; |
|
|
align-items: center; |
|
|
} |
|
|
|
|
|
.left-buttons { |
|
|
display: flex; |
|
|
gap: 10px; |
|
|
} |
|
|
|
|
|
.right-buttons { |
|
|
display: flex; |
|
|
gap: 10px; |
|
|
} |
|
|
|
|
|
button { |
|
|
padding: 10px 20px; |
|
|
font-size: 16px; |
|
|
border: none; |
|
|
border-radius: 5px; |
|
|
cursor: pointer; |
|
|
} |
|
|
|
|
|
#save-btn { |
|
|
background-color: #28a745; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
#save-btn:hover { |
|
|
background-color: #218838; |
|
|
} |
|
|
|
|
|
#clear-btn { |
|
|
background-color: #dc3545; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
#clear-btn:hover { |
|
|
background-color: #b02a37; |
|
|
} |
|
|
|
|
|
#download-btn { |
|
|
background-color: #007bff; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
#download-btn:hover { |
|
|
background-color: #0056b3; |
|
|
} |
|
|
|
|
|
#print-btn { |
|
|
background-color: #ffc107; |
|
|
color: black; |
|
|
} |
|
|
|
|
|
#print-btn:hover { |
|
|
background-color: #e0a800; |
|
|
} |
|
|
|
|
|
#exit-btn { |
|
|
background-color: #6c757d; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
#exit-btn:hover { |
|
|
background-color: #5a6268; |
|
|
} |
|
|
|
|
|
|
|
|
.blocklyZoom { |
|
|
position: absolute; |
|
|
bottom: 100px; |
|
|
right: 43px; |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
gap: 2px; |
|
|
z-index: 10; |
|
|
} |
|
|
|
|
|
.blocklyZoom svg { |
|
|
width: 32px; |
|
|
height: 32px; |
|
|
cursor: pointer; |
|
|
} |
|
|
|
|
|
|
|
|
.blocklyTrash { |
|
|
bottom: 10px !important; |
|
|
right: 10px !important; |
|
|
} |
|
|
|
|
|
#serial-btn { |
|
|
background-color: #17a2b8; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
#serial-btn:hover { |
|
|
background-color: #138496; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="container"> |
|
|
<div id="block-area"></div> |
|
|
<div id="code-area"> |
|
|
<img id="copy-button" src="copy.png" alt="Copy Code" title="コードをコピー"> |
|
|
<div id="copy-message">クリップボードにコピーしました</div> |
|
|
<pre id="generated-code">// 生成されたArduinoコードがここに表示されます</pre> |
|
|
</div> |
|
|
</div> |
|
|
<div class="button-container"> |
|
|
<div class="left-buttons"> |
|
|
<button id="download-btn">ダウンロード</button> |
|
|
<button id="serial-btn">シリアル通信</button> |
|
|
<button id="clear-btn">クリア</button> |
|
|
</div> |
|
|
<div class="right-buttons"> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div id="serial-modal" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 1000;"> |
|
|
<div style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 875px; height: 400px; background: #fff; border-radius: 5px; overflow: hidden;"> |
|
|
<button id="close-modal" style="position: absolute; top: 10px; right: 10px; font-size: 20px; border: none; background: #fff; color: black; width: 30px; height: 30px; border-radius: 5px; cursor: pointer;">×</button> |
|
|
<iframe id="serial-iframe" src="" style="width: 100%; height: calc(100% - 50px); margin-top: 50px; border: none;"></iframe> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<xml id="toolbox" style="display: none"> |
|
|
<category name="制御" colour="120"> |
|
|
<block type="setup"></block> |
|
|
<block type="loop"></block> |
|
|
<block type="delay"> |
|
|
<value name="TIME"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">1000</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="delay_value"> |
|
|
<value name="TIME"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">1000</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="delay_microseconds"> |
|
|
<value name="TIME"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">100</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="delay_microseconds_value"> |
|
|
<value name="TIME"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">100</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="controls_while"></block> |
|
|
<block type="controls_if"></block> |
|
|
<block type="repeat_times"> |
|
|
<value name="TIMES"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">5</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="if_condition"></block> |
|
|
<block type="wait_until_condition"></block> |
|
|
</category> |
|
|
<category name="ピン" colour="160"> |
|
|
<block type="pin_mode"> |
|
|
<value name="PIN"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">13</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="digital_write"> |
|
|
<value name="PIN"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">13</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="digital_read"> |
|
|
<value name="PIN"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">13</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="analog_read"></block> |
|
|
<block type="analog_write"> |
|
|
<value name="PIN"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">9</field> |
|
|
</shadow> |
|
|
</value> |
|
|
<value name="VALUE"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">255</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
</category> |
|
|
<category name="テスト" colour="210"> |
|
|
<block type="logic_compare"></block> |
|
|
<block type="logic_operation"></block> |
|
|
<block type="string_compare"> |
|
|
<value name="A"> |
|
|
<shadow type="text"> |
|
|
<field name="TEXT">text1</field> |
|
|
</shadow> |
|
|
</value> |
|
|
<value name="B"> |
|
|
<shadow type="text"> |
|
|
<field name="TEXT">text2</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
</category> |
|
|
<category name="計算" colour="230"> |
|
|
<block type="math_arithmetic"></block> |
|
|
<block type="math_single"></block> |
|
|
<block type="math_trig"></block> |
|
|
<block type="random_number"> |
|
|
<value name="MIN"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">0</field> |
|
|
</shadow> |
|
|
</value> |
|
|
<value name="MAX"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">100</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="divide"> |
|
|
<value name="NUM"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">10</field> |
|
|
</shadow> |
|
|
</value> |
|
|
<value name="DIV"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">2</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="number_input"> |
|
|
<field name="VALUE">0</field> |
|
|
</block> |
|
|
<block type="string_input"> |
|
|
<field name="TEXT">Hello</field> |
|
|
</block> |
|
|
<block type="text_input"> |
|
|
<field name="TEXT">Hello</field> |
|
|
</block> |
|
|
</category> |
|
|
<category name="変数" colour="260"> |
|
|
<block type="variable_declare_int"></block> |
|
|
<block type="variable_set_int"></block> |
|
|
<block type="variable_get_int"></block> |
|
|
<block type="int_declare"></block> |
|
|
<block type="int_set"></block> |
|
|
<block type="int_get"></block> |
|
|
<block type="float_declare"></block> |
|
|
<block type="float_set"></block> |
|
|
<block type="float_get"></block> |
|
|
</category> |
|
|
<category name="Generic Hardware" colour="290"> |
|
|
<block type="servo_write"> |
|
|
<value name="PIN"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">9</field> |
|
|
</shadow> |
|
|
</value> |
|
|
<value name="ANGLE"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">90</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="ultrasonic_read"></block> |
|
|
<block type="ultrasonic_distance"></block> |
|
|
<block type="lcd_print"> |
|
|
<value name="TEXT"> |
|
|
<shadow type="text"> |
|
|
<field name="TEXT">Hello World!!</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="lcd_print_value"> |
|
|
<value name="VALUE"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">0</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="lcd_clear"></block> |
|
|
<block type="seven_segment_display"> |
|
|
<value name="NUMBER"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">0</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="tone"> |
|
|
<value name="FREQUENCY"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">440</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="noTone"></block> |
|
|
</category> |
|
|
<category name="通信" colour="320"> |
|
|
<block type="serial_begin"></block> |
|
|
<block type="serial_print"> |
|
|
<value name="TEXT"> |
|
|
<shadow type="text"> |
|
|
<field name="TEXT">Hello</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="serial_print_value"> |
|
|
<value name="VALUE"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">0</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="serial_println"> |
|
|
<value name="TEXT"> |
|
|
<shadow type="text"> |
|
|
<field name="TEXT">Hello</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="serial_println_value"> |
|
|
<value name="VALUE"> |
|
|
<shadow type="math_number"> |
|
|
<field name="NUM">0</field> |
|
|
</shadow> |
|
|
</value> |
|
|
</block> |
|
|
<block type="serial_read_number"></block> |
|
|
<block type="serial_read_string"></block> |
|
|
</category> |
|
|
<category name="拡張" colour="350"> |
|
|
<block type="custom_code"></block> |
|
|
<block type="custom_string"></block> |
|
|
<block type="custom_number"></block> |
|
|
</category> |
|
|
</xml> |
|
|
|
|
|
|
|
|
<script src="./blockly.min.js"></script> |
|
|
|
|
|
<script src="./ja.js"></script> |
|
|
|
|
|
<script src="./pako.min.js"></script> |
|
|
|
|
|
<script src="html2canvas.min.js"></script> |
|
|
|
|
|
<script> |
|
|
// 文字列をクリーンアップする関数 |
|
|
function cleanString(str) { |
|
|
if (!str) return '""'; |
|
|
let cleaned = str.replace(/^\s*\(?['"]?(.*?)['"]?\)?\s*$/, '$1'); |
|
|
if (cleaned === '') return '""'; |
|
|
if (!cleaned.startsWith('"') || !cleaned.endsWith('"')) { |
|
|
cleaned = `"${cleaned.replace(/"/g, '\\"')}"`; |
|
|
} |
|
|
return cleaned; |
|
|
} |
|
|
|
|
|
// 7セグメントLEDの数字マッピング（カソードコモン、HIGH=点灯） |
|
|
const segmentPatterns = [ |
|
|
[1, 1, 1, 1, 1, 1, 0], // 0 |
|
|
[0, 1, 1, 0, 0, 0, 0], // 1 |
|
|
[1, 1, 0, 1, 1, 0, 1], // 2 |
|
|
[1, 1, 1, 1, 0, 0, 1], // 3 |
|
|
[0, 1, 1, 0, 0, 1, 1], // 4 |
|
|
[1, 0, 1, 1, 0, 1, 1], // 5 |
|
|
[1, 0, 1, 1, 1, 1, 1], // 6 |
|
|
[1, 1, 1, 0, 0, 0, 0], // 7 |
|
|
[1, 1, 1, 1, 1, 1, 1], // 8 |
|
|
[1, 1, 1, 1, 0, 1, 1] // 9 |
|
|
]; |
|
|
|
|
|
// カスタムブロックの定義 |
|
|
// 制御 |
|
|
Blockly.Blocks['setup'] = { |
|
|
init: function () { |
|
|
this.appendStatementInput('SETUP_CODE').appendField('セットアップ'); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['loop'] = { |
|
|
init: function () { |
|
|
this.appendStatementInput('LOOP_CODE').appendField('ループ'); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['delay'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('待機:') |
|
|
.appendField(new Blockly.FieldNumber(1000, 0), 'TIME') |
|
|
.appendField('ms'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['delay_value'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('TIME') |
|
|
.setCheck('Number') |
|
|
.appendField('待機:'); |
|
|
this.appendDummyInput() |
|
|
.appendField('ms'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['delay_microseconds'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('待機:') |
|
|
.appendField(new Blockly.FieldNumber(100, 0), 'TIME') |
|
|
.appendField('μs'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['delay_microseconds_value'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('TIME') |
|
|
.setCheck('Number') |
|
|
.appendField('待機:'); |
|
|
this.appendDummyInput() |
|
|
.appendField('μs'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['controls_while'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('CONDITION').appendField('条件が真の間繰り返す'); |
|
|
this.appendStatementInput('DO').appendField('実行'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['controls_if'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('IF0').appendField('もし'); |
|
|
this.appendStatementInput('DO0').appendField('なら'); |
|
|
this.appendStatementInput('ELSE').appendField('でなければ'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['repeat_times'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('TIMES') |
|
|
.setCheck('Number') |
|
|
.appendField('繰り返し:'); |
|
|
this.appendStatementInput('DO') |
|
|
.appendField('回'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['if_condition'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('CONDITION') |
|
|
.setCheck('Boolean') |
|
|
.appendField('もし'); |
|
|
this.appendStatementInput('DO') |
|
|
.appendField('なら'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['wait_until_condition'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('CONDITION') |
|
|
.setCheck('Boolean') |
|
|
.appendField('条件が真になるまで待つ'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(120); |
|
|
} |
|
|
}; |
|
|
|
|
|
// ピン |
|
|
Blockly.Blocks['pin_mode'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('ピンのモードを設定:') |
|
|
.appendField(new Blockly.FieldNumber(0, 0, 53), 'PIN') |
|
|
.appendField(new Blockly.FieldDropdown([['出力', 'OUTPUT'], ['入力', 'INPUT'], ['入力プルアップ', 'INPUT_PULLUP']]), 'MODE'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(160); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['digital_write'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('デジタル出力:') |
|
|
.appendField(new Blockly.FieldNumber(0, 0, 53), 'PIN') |
|
|
.appendField(new Blockly.FieldDropdown([['HIGH', 'HIGH'], ['LOW', 'LOW']]), 'VALUE'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(160); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['digital_read'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('デジタル入力:') |
|
|
.appendField(new Blockly.FieldNumber(0, 0, 53), 'PIN'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(160); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['analog_read'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('アナログ入力:') |
|
|
.appendField(new Blockly.FieldDropdown([ |
|
|
['A0', 'A0'], ['A1', 'A1'], ['A2', 'A2'], ['A3', 'A3'], |
|
|
['A4', 'A4'], ['A5', 'A5'], ['A6', 'A6'], ['A7', 'A7'], |
|
|
['A8', 'A8'], ['A9', 'A9'], ['A10', 'A10'], ['A11', 'A11'], |
|
|
['A12', 'A12'], ['A13', 'A13'], ['A14', 'A14'], ['A15', 'A15'] |
|
|
]), 'PIN'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(160); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['analog_write'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('アナログ出力:') |
|
|
.appendField(new Blockly.FieldNumber(9, 0, 53), 'PIN'); |
|
|
this.appendValueInput('VALUE') |
|
|
.setCheck('Number') |
|
|
.appendField('値:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(160); |
|
|
} |
|
|
}; |
|
|
|
|
|
// テスト |
|
|
Blockly.Blocks['logic_compare'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('A').setCheck('Number'); |
|
|
this.appendDummyInput() |
|
|
.appendField(new Blockly.FieldDropdown([['=', 'EQ'], ['≠', 'NEQ'], ['<', 'LT'], ['≤', 'LTE'], ['>', 'GT'], ['≥', 'GTE']]), 'OP'); |
|
|
this.appendValueInput('B').setCheck('Number'); |
|
|
this.setOutput(true, 'Boolean'); |
|
|
this.setColour(210); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['logic_operation'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('A').setCheck('Boolean'); |
|
|
this.appendDummyInput() |
|
|
.appendField(new Blockly.FieldDropdown([['かつ', 'AND'], ['または', 'OR']]), 'OP'); |
|
|
this.appendValueInput('B').setCheck('Boolean'); |
|
|
this.setOutput(true, 'Boolean'); |
|
|
this.setColour(210); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['string_compare'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('A').setCheck('String'); |
|
|
this.appendDummyInput() |
|
|
.appendField(new Blockly.FieldDropdown([['=', 'EQ'], ['≠', 'NEQ']]), 'OP'); |
|
|
this.appendValueInput('B').setCheck('String'); |
|
|
this.setOutput(true, 'Boolean'); |
|
|
this.setColour(210); |
|
|
} |
|
|
}; |
|
|
|
|
|
// 計算 |
|
|
Blockly.Blocks['math_arithmetic'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('A').setCheck('Number'); |
|
|
this.appendDummyInput() |
|
|
.appendField(new Blockly.FieldDropdown([['+', 'ADD'], ['-', 'MINUS'], ['×', 'MULTIPLY'], ['÷', 'DIVIDE']]), 'OP'); |
|
|
this.appendValueInput('B').setCheck('Number'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(230); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['math_single'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('NUM').setCheck('Number') |
|
|
.appendField(new Blockly.FieldDropdown([['絶対値', 'ABS'], ['平方根', 'SQRT']]), 'OP'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(230); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['math_trig'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('NUM').setCheck('Number') |
|
|
.appendField(new Blockly.FieldDropdown([['sin', 'SIN'], ['cos', 'COS'], ['tan', 'TAN']]), 'OP'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(230); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['random_number'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('MIN') |
|
|
.setCheck('Number') |
|
|
.appendField('乱数:'); |
|
|
this.appendValueInput('MAX') |
|
|
.setCheck('Number') |
|
|
.appendField('から'); |
|
|
this.appendDummyInput() |
|
|
.appendField('まで'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(230); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['divide'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('NUM') |
|
|
.setCheck('Number') |
|
|
.appendField(''); |
|
|
this.appendValueInput('DIV') |
|
|
.setCheck('Number') |
|
|
.appendField('を'); |
|
|
this.appendDummyInput() |
|
|
.appendField('で割った値'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(230); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['number_input'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('数値:') |
|
|
.appendField(new Blockly.FieldNumber(0), 'VALUE'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(230); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['string_input'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('文字列:') |
|
|
.appendField(new Blockly.FieldTextInput('Hello'), 'TEXT'); |
|
|
this.setOutput(true, 'String'); |
|
|
this.setColour(230); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['text_input'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('テキスト:') |
|
|
.appendField(new Blockly.FieldTextInput('Hello'), 'TEXT'); |
|
|
this.setOutput(true, 'String'); |
|
|
this.setColour(230); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['variable_set_number'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('数値変数') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR') |
|
|
.appendField('に代入:'); |
|
|
this.appendValueInput('VALUE') |
|
|
.setCheck('Number'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(230); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['variable_set_string'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('文字列変数') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR') |
|
|
.appendField('に代入:'); |
|
|
this.appendValueInput('TEXT') |
|
|
.setCheck('String'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(230); |
|
|
} |
|
|
}; |
|
|
|
|
|
// 変数 |
|
|
Blockly.Blocks['variable_declare_int'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('整数変数宣言:') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(260); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['variable_set_int'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('VALUE') |
|
|
.setCheck('Number') |
|
|
.appendField('整数変数') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR') |
|
|
.appendField('に代入:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(260); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['variable_get_int'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('整数変数') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(260); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['int_declare'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('int変数宣言:') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(260); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['int_set'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('VALUE') |
|
|
.setCheck('Number') |
|
|
.appendField('int変数') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR') |
|
|
.appendField('に代入:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(260); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['int_get'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('int変数') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(260); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['float_declare'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('float変数宣言:') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(260); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['float_set'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('VALUE') |
|
|
.setCheck('Number') |
|
|
.appendField('float変数') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR') |
|
|
.appendField('に代入:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(260); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['float_get'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('float変数') |
|
|
.appendField(new Blockly.FieldVariable(null), 'VAR'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(260); |
|
|
} |
|
|
}; |
|
|
|
|
|
// Generic Hardware |
|
|
Blockly.Blocks['servo_write'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('サーボ:') |
|
|
.appendField(new Blockly.FieldNumber(9, 0, 53), 'PIN'); |
|
|
this.appendValueInput('ANGLE') |
|
|
.setCheck('Number') |
|
|
.appendField('角度:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(290); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['ultrasonic_read'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('超音波センサ: トリガ') |
|
|
.appendField(new Blockly.FieldNumber(12, 0, 53), 'TRIG') |
|
|
.appendField('エコー') |
|
|
.appendField(new Blockly.FieldNumber(11, 0, 53), 'ECHO'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(290); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['ultrasonic_distance'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('超音波センサ') |
|
|
.appendField('トリガ') |
|
|
.appendField(new Blockly.FieldNumber(12, 0, 53), 'TRIG'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(290); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['lcd_print'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('LCD表示 ピン RS:') |
|
|
.appendField(new Blockly.FieldNumber(8, 0, 53), 'RS') |
|
|
.appendField('E:') |
|
|
.appendField(new Blockly.FieldNumber(9, 0, 53), 'E') |
|
|
.appendField('D4:') |
|
|
.appendField(new Blockly.FieldNumber(4, 0, 53), 'D4'); |
|
|
this.appendDummyInput() |
|
|
.appendField('D5:') |
|
|
.appendField(new Blockly.FieldNumber(5, 0, 53), 'D5') |
|
|
.appendField('D6:') |
|
|
.appendField(new Blockly.FieldNumber(6, 0, 53), 'D6') |
|
|
.appendField('D7:') |
|
|
.appendField(new Blockly.FieldNumber(7, 0, 53), 'D7'); |
|
|
this.appendDummyInput() |
|
|
.appendField('列数:') |
|
|
.appendField(new Blockly.FieldNumber(16, 1), 'COLS') |
|
|
.appendField('行数:') |
|
|
.appendField(new Blockly.FieldNumber(2, 1), 'ROWS'); |
|
|
this.appendDummyInput() |
|
|
.appendField('カーソル 列:') |
|
|
.appendField(new Blockly.FieldNumber(0, 0), 'CURSOR_COL') |
|
|
.appendField('行:') |
|
|
.appendField(new Blockly.FieldNumber(0, 0), 'CURSOR_ROW'); |
|
|
this.appendValueInput('TEXT') |
|
|
.appendField('テキスト:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(290); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['lcd_print_value'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('LCD数値表示 ピン RS:') |
|
|
.appendField(new Blockly.FieldNumber(8, 0, 53), 'RS') |
|
|
.appendField('E:') |
|
|
.appendField(new Blockly.FieldNumber(9, 0, 53), 'E') |
|
|
.appendField('D4:') |
|
|
.appendField(new Blockly.FieldNumber(4, 0, 53), 'D4'); |
|
|
this.appendDummyInput() |
|
|
.appendField('D5:') |
|
|
.appendField(new Blockly.FieldNumber(5, 0, 53), 'D5') |
|
|
.appendField('D6:') |
|
|
.appendField(new Blockly.FieldNumber(6, 0, 53), 'D6') |
|
|
.appendField('D7:') |
|
|
.appendField(new Blockly.FieldNumber(7, 0, 53), 'D7'); |
|
|
this.appendDummyInput() |
|
|
.appendField('列数:') |
|
|
.appendField(new Blockly.FieldNumber(16, 1), 'COLS') |
|
|
.appendField('行数:') |
|
|
.appendField(new Blockly.FieldNumber(2, 1), 'ROWS'); |
|
|
this.appendDummyInput() |
|
|
.appendField('カーソル 列:') |
|
|
.appendField(new Blockly.FieldNumber(0, 0), 'CURSOR_COL') |
|
|
.appendField('行:') |
|
|
.appendField(new Blockly.FieldNumber(0, 0), 'CURSOR_ROW'); |
|
|
this.appendValueInput('VALUE') |
|
|
.setCheck('Number') |
|
|
.appendField('数値:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(290); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['lcd_clear'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('LCDクリア'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(290); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['seven_segment_display'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('7セグメントLED表示 ピン a:') |
|
|
.appendField(new Blockly.FieldNumber(2, 0, 53), 'PIN_A') |
|
|
.appendField('b:') |
|
|
.appendField(new Blockly.FieldNumber(3, 0, 53), 'PIN_B') |
|
|
.appendField('c:') |
|
|
.appendField(new Blockly.FieldNumber(4, 0, 53), 'PIN_C'); |
|
|
this.appendDummyInput() |
|
|
.appendField('d:') |
|
|
.appendField(new Blockly.FieldNumber(5, 0, 53), 'PIN_D') |
|
|
.appendField('e:') |
|
|
.appendField(new Blockly.FieldNumber(6, 0, 53), 'PIN_E') |
|
|
.appendField('f:') |
|
|
.appendField(new Blockly.FieldNumber(7, 0, 53), 'PIN_F'); |
|
|
this.appendDummyInput() |
|
|
.appendField('g:') |
|
|
.appendField(new Blockly.FieldNumber(8, 0, 53), 'PIN_G'); |
|
|
this.appendValueInput('NUMBER') |
|
|
.setCheck('Number') |
|
|
.appendField('数字:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(290); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['tone'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('トーン出力 ピン:') |
|
|
.appendField(new Blockly.FieldNumber(9, 0, 53), 'PIN'); |
|
|
this.appendValueInput('FREQUENCY') |
|
|
.setCheck('Number') |
|
|
.appendField('周波数(Hz):'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(290); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['noTone'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('トーン停止 ピン:') |
|
|
.appendField(new Blockly.FieldNumber(9, 0, 53), 'PIN'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(290); |
|
|
} |
|
|
}; |
|
|
|
|
|
// 通信 |
|
|
Blockly.Blocks['serial_begin'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('シリアル開始:') |
|
|
.appendField(new Blockly.FieldNumber(9600), 'BAUD'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(320); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['serial_print'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('TEXT') |
|
|
.appendField('シリアル出力(改行なし):'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(320); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['serial_print_value'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('VALUE') |
|
|
.setCheck('Number') |
|
|
.appendField('シリアル出力（数値、改行なし）:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(320); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['serial_println'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('TEXT') |
|
|
.appendField('シリアル出力:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(320); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['serial_println_value'] = { |
|
|
init: function () { |
|
|
this.appendValueInput('VALUE') |
|
|
.setCheck('Number') |
|
|
.appendField('シリアル出力（数値）:'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(320); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['serial_read_number'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('シリアル入力（数値）'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(320); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['serial_read_string'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('シリアル入力（文字列）'); |
|
|
this.setOutput(true, 'String'); |
|
|
this.setColour(320); |
|
|
} |
|
|
}; |
|
|
|
|
|
// 拡張 |
|
|
Blockly.Blocks['custom_code'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('カスタムコード:') |
|
|
.appendField(new Blockly.FieldTextInput(''), 'CODE'); |
|
|
this.setPreviousStatement(true); |
|
|
this.setNextStatement(true); |
|
|
this.setColour(350); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['custom_string'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('カスタム文字列:') |
|
|
.appendField(new Blockly.FieldTextInput(''), 'TEXT'); |
|
|
this.setOutput(true, 'String'); |
|
|
this.setColour(350); |
|
|
} |
|
|
}; |
|
|
Blockly.Blocks['custom_number'] = { |
|
|
init: function () { |
|
|
this.appendDummyInput() |
|
|
.appendField('カスタム数値:') |
|
|
.appendField(new Blockly.FieldTextInput(''), 'NUMBER'); |
|
|
this.setOutput(true, 'Number'); |
|
|
this.setColour(350); |
|
|
} |
|
|
}; |
|
|
|
|
|
// Blocklyワークスペースを初期化 |
|
|
const workspace = Blockly.inject('block-area', { |
|
|
toolbox: document.getElementById('toolbox'), |
|
|
scrollbars: true, |
|
|
trashcan: true, |
|
|
sounds: true, |
|
|
zoom: { |
|
|
controls: false, // デフォルトのズームコントロールを無効化 |
|
|
wheel: false, |
|
|
startScale: 1.0, |
|
|
maxScale: 2.0, |
|
|
minScale: 0.5, |
|
|
scaleSpeed: 1.2 |
|
|
} |
|
|
}); |
|
|
|
|
|
// ズームコントロールを手動で追加（インラインSVGを使用） |
|
|
const zoomControls = document.createElement('div'); |
|
|
zoomControls.className = 'blocklyZoom'; |
|
|
zoomControls.innerHTML = ` |
|
|
<svg id="zoom-in" viewBox="0 0 32 32" title="拡大"> |
|
|
<circle cx="16" cy="16" r="10" fill="none" stroke="#000" stroke-width="2"/> |
|
|
<path d="M12 16 h8 M16 12 v8" stroke="#000" stroke-width="2"/> |
|
|
<line x1="22" y1="22" x2="28" y2="28" stroke="#000" stroke-width="2"/> |
|
|
</svg> |
|
|
<svg id="zoom-out" viewBox="0 0 32 32" title="縮小"> |
|
|
<circle cx="16" cy="16" r="10" fill="none" stroke="#000" stroke-width="2"/> |
|
|
<path d="M12 16 h8" stroke="#000" stroke-width="2"/> |
|
|
<line x1="22" y1="22" x2="28" y2="28" stroke="#000" stroke-width="2"/> |
|
|
</svg> |
|
|
<svg id="zoom-reset" viewBox="0 0 32 32" title="中央寄せ"> |
|
|
<path d="M8 16 h16 M16 8 v16" stroke="#000" stroke-width="2"/> |
|
|
<path d="M8 12 l-4 4 l4 4 M24 12 l4 4 l-4 4" fill="none" stroke="#000" stroke-width="2"/> |
|
|
</svg> |
|
|
`; |
|
|
document.getElementById('block-area').appendChild(zoomControls); |
|
|
|
|
|
// ズームと中央寄せのイベントリスナー |
|
|
document.getElementById('zoom-in').addEventListener('click', function () { |
|
|
workspace.zoomCenter(1); // スケールを増加（ズームイン） |
|
|
}); |
|
|
|
|
|
document.getElementById('zoom-out').addEventListener('click', function () { |
|
|
workspace.zoomCenter(-1); // スケールを減少（ズームアウト） |
|
|
}); |
|
|
|
|
|
document.getElementById('zoom-reset').addEventListener('click', function () { |
|
|
const topBlocks = workspace.getTopBlocks(true); |
|
|
if (topBlocks.length > 0) { |
|
|
workspace.centerOnBlock(topBlocks[0].id); |
|
|
} else { |
|
|
workspace.scrollCenter(); |
|
|
} |
|
|
}); |
|
|
|
|
|
// コピーボタンのイベントリスナー |
|
|
document.getElementById('copy-button').addEventListener('click', function () { |
|
|
const code = document.getElementById('generated-code').textContent; |
|
|
navigator.clipboard.writeText(code).then(() => { |
|
|
const copyMessage = document.getElementById('copy-message'); |
|
|
copyMessage.style.display = 'block'; |
|
|
setTimeout(() => { |
|
|
copyMessage.style.display = 'none'; |
|
|
}, 3000); |
|
|
}).catch(err => { |
|
|
console.error('コードのコピーに失敗しました:', err); |
|
|
}); |
|
|
}); |
|
|
|
|
|
// URLからワークスペースを復元 |
|
|
function loadWorkspaceFromUrl() { |
|
|
const urlParams = new URLSearchParams(window.location.search); |
|
|
const compressed = urlParams.get('blocks'); |
|
|
if (compressed) { |
|
|
try { |
|
|
const binaryString = atob(compressed); |
|
|
const bytes = new Uint8Array(binaryString.length); |
|
|
for (let i = 0; i < binaryString.length; i++) { |
|
|
bytes[i] = binaryString.charCodeAt(i); |
|
|
} |
|
|
const xmlString = pako.inflate(bytes, { to: 'string' }); |
|
|
const xml = Blockly.utils.xml.textToDom(xmlString); |
|
|
workspace.clear(); |
|
|
Blockly.Xml.domToWorkspace(xml, workspace); |
|
|
} catch (e) { |
|
|
console.error('ワークスペースの復元に失敗しました:', e); |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
// ワークスペースをURLに保存 |
|
|
function saveWorkspaceToUrl() { |
|
|
try { |
|
|
const xml = Blockly.Xml.workspaceToDom(workspace); |
|
|
const xmlString = Blockly.Xml.domToText(xml); |
|
|
const compressed = pako.gzip(xmlString, { to: 'string' }); |
|
|
const base64 = btoa(String.fromCharCode.apply(null, compressed)); |
|
|
const url = new URL(window.location); |
|
|
url.searchParams.set('blocks', base64); |
|
|
history.pushState({}, '', url); |
|
|
} catch (e) { |
|
|
console.error('ワークスペースの保存に失敗しました:', e); |
|
|
} |
|
|
} |
|
|
|
|
|
// Arduinoコード生成ロジック |
|
|
function generateArduinoCode() { |
|
|
let includes = new Set(); |
|
|
let variables = new Set(); |
|
|
let servoObjects = new Set(); |
|
|
let servoSetup = new Set(); |
|
|
let lcdObjects = new Set(); |
|
|
let lcdSetup = new Set(); |
|
|
let sevenSegmentSetup = new Set(); |
|
|
let code = ''; |
|
|
const topBlocks = workspace.getTopBlocks(true); |
|
|
let lcdPinConfig = null; |
|
|
|
|
|
function collectDependencies(block) { |
|
|
if (!block) return; |
|
|
let currentBlock = block; |
|
|
while (currentBlock) { |
|
|
if (currentBlock.type === 'variable_declare_int' || currentBlock.type === 'variable_set_int' || currentBlock.type === 'variable_get_int') { |
|
|
const varField = currentBlock.getField('VAR'); |
|
|
if (varField && workspace.getVariableMap()) { |
|
|
const variable = varField.getVariable(); |
|
|
if (variable) { |
|
|
const varName = variable.name; |
|
|
if (varName) { |
|
|
variables.add(`uint8_t ${varName};`); |
|
|
} |
|
|
} |
|
|
} |
|
|
} else if (currentBlock.type === 'int_declare' || currentBlock.type === 'int_set' || currentBlock.type === 'int_get') { |
|
|
const varField = currentBlock.getField('VAR'); |
|
|
if (varField && workspace.getVariableMap()) { |
|
|
const variable = varField.getVariable(); |
|
|
if (variable) { |
|
|
const varName = variable.name; |
|
|
if (varName) { |
|
|
variables.add(`int ${varName};`); |
|
|
} |
|
|
} |
|
|
} |
|
|
} else if (currentBlock.type === 'float_declare' || currentBlock.type === 'float_set' || currentBlock.type === 'float_get') { |
|
|
const varField = currentBlock.getField('VAR'); |
|
|
if (varField && workspace.getVariableMap()) { |
|
|
const variable = varField.getVariable(); |
|
|
if (variable) { |
|
|
const varName = variable.name; |
|
|
if (varName) { |
|
|
variables.add(`float ${varName};`); |
|
|
} |
|
|
} |
|
|
} |
|
|
} else if (currentBlock.type === 'variable_set_number' || currentBlock.type === 'variable_set_string') { |
|
|
const varField = currentBlock.getField('VAR'); |
|
|
if (varField && workspace.getVariableMap()) { |
|
|
const variable = varField.getVariable(); |
|
|
if (variable) { |
|
|
const varName = variable.name; |
|
|
if (varName) { |
|
|
if (currentBlock.type === 'variable_set_number') { |
|
|
variables.add(`float ${varName};`); |
|
|
} else if (currentBlock.type === 'variable_set_string') { |
|
|
variables.add(`String ${varName};`); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} else if (currentBlock.type === 'servo_write') { |
|
|
const pinServo = currentBlock.getFieldValue('PIN'); |
|
|
includes.add('#include <Servo.h>'); |
|
|
servoObjects.add(`Servo servo_${pinServo};`); |
|
|
servoSetup.add(`servo_${pinServo}.attach(${pinServo});`); |
|
|
} else if (currentBlock.type === 'lcd_print' || currentBlock.type === 'lcd_print_value') { |
|
|
includes.add('#include <LiquidCrystal.h>'); |
|
|
const rs = currentBlock.getFieldValue('RS'); |
|
|
const e = currentBlock.getFieldValue('E'); |
|
|
const d4 = currentBlock.getFieldValue('D4'); |
|
|
const d5 = currentBlock.getFieldValue('D5'); |
|
|
const d6 = currentBlock.getFieldValue('D6'); |
|
|
const d7 = currentBlock.getFieldValue('D7'); |
|
|
const cols = currentBlock.getFieldValue('COLS'); |
|
|
const rows = currentBlock.getFieldValue('ROWS'); |
|
|
const newPinConfig = `${rs},${e},${d4},${d5},${d6},${d7}`; |
|
|
if (!lcdPinConfig) { |
|
|
lcdPinConfig = newPinConfig; |
|
|
lcdObjects.add(`LiquidCrystal lcd(${rs}, ${e}, ${d4}, ${d5}, ${d6}, ${d7});`); |
|
|
lcdSetup.add(`lcd.begin(${cols}, ${rows});`); |
|
|
lcdSetup.add(`lcd.clear();`); |
|
|
} else if (lcdPinConfig !== newPinConfig) { |
|
|
console.warn(`LCDピンの設定が異なります。最初の設定(${lcdPinConfig})を使用します。`); |
|
|
} |
|
|
} else if (currentBlock.type === 'lcd_clear') { |
|
|
includes.add('#include <LiquidCrystal.h>'); |
|
|
if (!lcdPinConfig) { |
|
|
lcdPinConfig = '8,9,4,5,6,7'; |
|
|
lcdObjects.add(`LiquidCrystal lcd(8, 9, 4, 5, 6, 7);`); |
|
|
lcdSetup.add(`lcd.begin(16, 2);`); |
|
|
lcdSetup.add(`lcd.clear();`); |
|
|
} |
|
|
} else if (currentBlock.type === 'seven_segment_display') { |
|
|
const pinA = currentBlock.getFieldValue('PIN_A'); |
|
|
const pinB = currentBlock.getFieldValue('PIN_B'); |
|
|
const pinC = currentBlock.getFieldValue('PIN_C'); |
|
|
const pinD = currentBlock.getFieldValue('PIN_D'); |
|
|
const pinE = currentBlock.getFieldValue('PIN_E'); |
|
|
const pinF = currentBlock.getFieldValue('PIN_F'); |
|
|
const pinG = currentBlock.getFieldValue('PIN_G'); |
|
|
sevenSegmentSetup.add(`pinMode(${pinA}, OUTPUT);`); |
|
|
sevenSegmentSetup.add(`pinMode(${pinB}, OUTPUT);`); |
|
|
sevenSegmentSetup.add(`pinMode(${pinC}, OUTPUT);`); |
|
|
sevenSegmentSetup.add(`pinMode(${pinD}, OUTPUT);`); |
|
|
sevenSegmentSetup.add(`pinMode(${pinE}, OUTPUT);`); |
|
|
sevenSegmentSetup.add(`pinMode(${pinF}, OUTPUT);`); |
|
|
sevenSegmentSetup.add(`pinMode(${pinG}, OUTPUT);`); |
|
|
} else if (currentBlock.type === 'ultrasonic_read') { |
|
|
const trig = currentBlock.getFieldValue('TRIG'); |
|
|
const echo = currentBlock.getFieldValue('ECHO'); |
|
|
variables.add(`long duration_${trig};`); |
|
|
variables.add(`int distance_${trig};`); |
|
|
sevenSegmentSetup.add(`pinMode(${trig}, OUTPUT);`); |
|
|
sevenSegmentSetup.add(`pinMode(${echo}, INPUT);`); |
|
|
} else if (currentBlock.type === 'tone') { |
|
|
const pin = currentBlock.getFieldValue('PIN'); |
|
|
sevenSegmentSetup.add(`pinMode(${pin}, OUTPUT);`); |
|
|
} |
|
|
|
|
|
if (currentBlock.getInput('DO')) collectDependencies(currentBlock.getInputTargetBlock('DO')); |
|
|
if (currentBlock.getInput('DO0')) collectDependencies(currentBlock.getInputTargetBlock('DO0')); |
|
|
if (currentBlock.getInput('ELSE')) collectDependencies(currentBlock.getInputTargetBlock('ELSE')); |
|
|
if (currentBlock.getInput('SETUP_CODE')) collectDependencies(currentBlock.getInputTargetBlock('SETUP_CODE')); |
|
|
if (currentBlock.getInput('LOOP_CODE')) collectDependencies(currentBlock.getInputTargetBlock('LOOP_CODE')); |
|
|
if (currentBlock.getInput('VALUE')) collectDependencies(currentBlock.getInputTargetBlock('VALUE')); |
|
|
if (currentBlock.getInput('TEXT')) collectDependencies(currentBlock.getInputTargetBlock('TEXT')); |
|
|
if (currentBlock.getInput('NUMBER')) collectDependencies(currentBlock.getInputTargetBlock('NUMBER')); |
|
|
if (currentBlock.getInput('FREQUENCY')) collectDependencies(currentBlock.getInputTargetBlock('FREQUENCY')); |
|
|
if (currentBlock.getInput('ANGLE')) collectDependencies(currentBlock.getInputTargetBlock('ANGLE')); |
|
|
if (currentBlock.getInput('TIME')) collectDependencies(currentBlock.getInputTargetBlock('TIME')); |
|
|
if (currentBlock.getInput('A')) collectDependencies(currentBlock.getInputTargetBlock('A')); |
|
|
if (currentBlock.getInput('B')) collectDependencies(currentBlock.getInputTargetBlock('B')); |
|
|
currentBlock = currentBlock.getNextBlock(); |
|
|
} |
|
|
} |
|
|
|
|
|
topBlocks.forEach(block => collectDependencies(block)); |
|
|
|
|
|
if (includes.size > 0) { |
|
|
code += Array.from(includes).join('\n') + '\n\n'; |
|
|
} |
|
|
|
|
|
if (variables.size > 0 || servoObjects.size > 0 || lcdObjects.size > 0) { |
|
|
code += [...variables, ...servoObjects, ...lcdObjects].join('\n') + '\n\n'; |
|
|
} |
|
|
|
|
|
topBlocks.forEach(block => { |
|
|
if (block.type === 'setup') { |
|
|
code += 'void setup() {\n'; |
|
|
if (servoSetup.size > 0 || lcdSetup.size > 0 || sevenSegmentSetup.size > 0) { |
|
|
code += ` ${[...servoSetup, ...lcdSetup, ...sevenSegmentSetup].join('\n ')}\n`; |
|
|
} |
|
|
const setupCode = generateCodeForBlock(block.getInputTargetBlock('SETUP_CODE')); |
|
|
code += setupCode ? ` ${setupCode.replace(/\n/g, '\n ')}` : ''; |
|
|
code += '\n}\n\n'; |
|
|
} else if (block.type === 'loop') { |
|
|
code += 'void loop() {\n'; |
|
|
const loopCode = generateCodeForBlock(block.getInputTargetBlock('LOOP_CODE')); |
|
|
code += loopCode ? ` ${loopCode.replace(/\n/g, '\n ')}` : ''; |
|
|
code += '\n}\n'; |
|
|
} |
|
|
}); |
|
|
|
|
|
return code || '// コードが生成されていません'; |
|
|
} |
|
|
|
|
|
// Arduinoコード生成ロジック内のgenerateValueCode関数 |
|
|
function generateValueCode(block) { |
|
|
if (!block) return ''; |
|
|
switch (block.type) { |
|
|
case 'digital_read': |
|
|
const pinDr = block.getFieldValue('PIN'); |
|
|
return `digitalRead(${pinDr})`; |
|
|
case 'analog_read': |
|
|
const pinAr = block.getFieldValue('PIN'); |
|
|
return `analogRead(${pinAr})`; |
|
|
case 'serial_read_number': |
|
|
return `Serial.parseInt()`; |
|
|
case 'serial_read_string': |
|
|
return `Serial.readString()`; // クリーンアップせず、そのまま返す |
|
|
case 'logic_compare': |
|
|
const aComp = generateValueCode(block.getInputTargetBlock('A')) || '0'; |
|
|
const opComp = block.getFieldValue('OP'); |
|
|
const bComp = generateValueCode(block.getInputTargetBlock('B')) || '0'; |
|
|
const operators = { 'EQ': '==', 'NEQ': '!=', 'LT': '<', 'LTE': '<=', 'GT': '>', 'GTE': '>=' }; |
|
|
return `(${aComp} ${operators[opComp]} ${bComp})`; |
|
|
case 'string_compare': |
|
|
let aStr = generateValueCode(block.getInputTargetBlock('A')) || '""'; |
|
|
let bStr = generateValueCode(block.getInputTargetBlock('B')) || '""'; |
|
|
const opStr = block.getFieldValue('OP'); |
|
|
// Serial.readString()の場合、クリーンアップしない |
|
|
if (block.getInputTargetBlock('A')?.type !== 'serial_read_string') { |
|
|
aStr = cleanString(aStr); |
|
|
} |
|
|
if (block.getInputTargetBlock('B')?.type !== 'serial_read_string') { |
|
|
bStr = cleanString(bStr); |
|
|
} |
|
|
if (opStr === 'EQ') { |
|
|
return `(${aStr} == ${bStr})`; |
|
|
} else { // NEQ |
|
|
return `(${aStr} != ${bStr})`; |
|
|
} |
|
|
case 'logic_operation': |
|
|
const aLogic = generateValueCode(block.getInputTargetBlock('A')) || 'true'; |
|
|
const opLogic = block.getFieldValue('OP'); |
|
|
const bLogic = generateValueCode(block.getInputTargetBlock('B')) || 'true'; |
|
|
const logicOps = { 'AND': '&&', 'OR': '||' }; |
|
|
return `(${aLogic} ${logicOps[opLogic]} ${bLogic})`; |
|
|
case 'math_arithmetic': |
|
|
const aMath = generateValueCode(block.getInputTargetBlock('A')) || '0'; |
|
|
const opMath = block.getFieldValue('OP'); |
|
|
const bMath = generateValueCode(block.getInputTargetBlock('B')) || '0'; |
|
|
const mathOps = { 'ADD': '+', 'MINUS': '-', 'MULTIPLY': '*', 'DIVIDE': '/' }; |
|
|
return `(${aMath} ${mathOps[opMath]} ${bMath})`; |
|
|
case 'math_single': |
|
|
const numSingle = generateValueCode(block.getInputTargetBlock('NUM')) || '0'; |
|
|
const opSingle = block.getFieldValue('OP'); |
|
|
return `${opSingle.toLowerCase()}(${numSingle})`; |
|
|
case 'math_trig': |
|
|
const numTrig = generateValueCode(block.getInputTargetBlock('NUM')) || '0'; |
|
|
const opTrig = block.getFieldValue('OP'); |
|
|
return `${opTrig.toLowerCase()}(${numTrig})`; |
|
|
case 'random_number': |
|
|
const min = generateValueCode(block.getInputTargetBlock('MIN')) || '0'; |
|
|
const max = generateValueCode(block.getInputTargetBlock('MAX')) || '100'; |
|
|
return `random(${min}, ${max})`; |
|
|
case 'divide': |
|
|
const num = generateValueCode(block.getInputTargetBlock('NUM')) || '10'; |
|
|
const div = generateValueCode(block.getInputTargetBlock('DIV')) || '2'; |
|
|
return `(${num} / ${div})`; |
|
|
case 'number_input': |
|
|
const numberValue = block.getFieldValue('VALUE'); |
|
|
return `${numberValue}`; |
|
|
case 'string_input': |
|
|
const stringValue = block.getFieldValue('TEXT'); |
|
|
return `"${stringValue.replace(/"/g, '\\"')}"`; // 通常の文字列はクリーンアップ |
|
|
case 'text_input': |
|
|
const textValue = block.getFieldValue('TEXT'); |
|
|
return `"${textValue.replace(/"/g, '\\"')}"`; // 通常の文字列はクリーンアップ |
|
|
case 'custom_string': |
|
|
const customStringValue = block.getFieldValue('TEXT'); |
|
|
return `"${customStringValue.replace(/"/g, '\\"')}"`; |
|
|
case 'custom_number': |
|
|
const customNumberValue = block.getFieldValue('NUMBER'); |
|
|
return `${customNumberValue}`; // そのまま数値として扱う |
|
|
case 'variable_get_int': |
|
|
const varField = block.getField('VAR'); |
|
|
return varField && varField.getVariable() ? varField.getVariable().name : 'unknown_var'; |
|
|
case 'int_get': |
|
|
const varFieldIntGet = block.getField('VAR'); |
|
|
return varFieldIntGet && varFieldIntGet.getVariable() ? varFieldIntGet.getVariable().name : 'unknown_var'; |
|
|
case 'float_get': |
|
|
const varFieldFloatGet = block.getField('VAR'); |
|
|
return varFieldFloatGet && varFieldFloatGet.getVariable() ? varFieldFloatGet.getVariable().name : 'unknown_var'; |
|
|
case 'ultrasonic_distance': |
|
|
const trig = block.getFieldValue('TRIG'); |
|
|
return `distance_${trig}`; |
|
|
default: |
|
|
return ''; |
|
|
} |
|
|
} |
|
|
|
|
|
function generateCodeForBlock(block) { |
|
|
if (!block) return ''; |
|
|
let code = ''; |
|
|
while (block) { |
|
|
switch (block.type) { |
|
|
case 'pin_mode': |
|
|
const pin = block.getFieldValue('PIN'); |
|
|
const mode = block.getFieldValue('MODE'); |
|
|
code += `pinMode(${pin}, ${mode});\n`; |
|
|
break; |
|
|
case 'digital_write': |
|
|
const pinDw = block.getFieldValue('PIN'); |
|
|
const value = block.getFieldValue('VALUE'); |
|
|
code += `digitalWrite(${pinDw}, ${value});\n`; |
|
|
break; |
|
|
case 'analog_write': |
|
|
const pinAw = block.getFieldValue('PIN'); |
|
|
const valueAw = generateValueCode(block.getInputTargetBlock('VALUE')) || '255'; |
|
|
code += `analogWrite(${pinAw}, ${valueAw});\n`; |
|
|
break; |
|
|
case 'delay': |
|
|
const time = block.getFieldValue('TIME'); |
|
|
code += `delay(${time});\n`; |
|
|
break; |
|
|
case 'delay_microseconds': |
|
|
const timeUs = block.getFieldValue('TIME'); |
|
|
code += `delayMicroseconds(${timeUs});\n`; |
|
|
break; |
|
|
case 'delay_microseconds_value': |
|
|
const timeUsValue = generateValueCode(block.getInputTargetBlock('TIME')) || '100'; |
|
|
code += `delayMicroseconds(${timeUsValue});\n`; |
|
|
break; |
|
|
case 'delay_value': |
|
|
const timeValue = generateValueCode(block.getInputTargetBlock('TIME')) || '1000'; |
|
|
code += `delay(${timeValue});\n`; |
|
|
break; |
|
|
case 'controls_while': |
|
|
const conditionW = generateValueCode(block.getInputTargetBlock('CONDITION')) || 'true'; |
|
|
const doCodeW = generateCodeForBlock(block.getInputTargetBlock('DO')); |
|
|
code += `while (${conditionW}) {\n ${doCodeW.replace(/\n/g, '\n ')}\n}\n`; |
|
|
break; |
|
|
case 'controls_if': |
|
|
const conditionIf = generateValueCode(block.getInputTargetBlock('IF0')) || 'true'; |
|
|
const doCodeIf = generateCodeForBlock(block.getInputTargetBlock('DO0')); |
|
|
const elseCode = generateCodeForBlock(block.getInputTargetBlock('ELSE')); |
|
|
code += `if (${conditionIf}) {\n ${doCodeIf.replace(/\n/g, '\n ')}\n}`; |
|
|
if (elseCode) code += ` else {\n ${elseCode.replace(/\n/g, '\n ')}\n}`; |
|
|
code += '\n'; |
|
|
break; |
|
|
case 'repeat_times': |
|
|
const times = generateValueCode(block.getInputTargetBlock('TIMES')) || '5'; |
|
|
const doCode = generateCodeForBlock(block.getInputTargetBlock('DO')); |
|
|
code += `for (int i = 0; i < ${times}; i++) {\n ${doCode.replace(/\n/g, '\n ')}\n}\n`; |
|
|
break; |
|
|
case 'if_condition': |
|
|
const condition = generateValueCode(block.getInputTargetBlock('CONDITION')) || 'true'; |
|
|
const ifCode = generateCodeForBlock(block.getInputTargetBlock('DO')); |
|
|
code += `if (${condition}) {\n ${ifCode.replace(/\n/g, '\n ')}\n}\n`; |
|
|
break; |
|
|
case 'wait_until_condition': |
|
|
const waitCondition = generateValueCode(block.getInputTargetBlock('CONDITION')) || 'false'; |
|
|
code += `while (!${waitCondition}) {\n delay(10);\n}\n`; |
|
|
break; |
|
|
case 'variable_declare_int': |
|
|
break; |
|
|
case 'variable_set_int': |
|
|
const varField = block.getField('VAR'); |
|
|
const varName = varField && varField.getVariable() ? varField.getVariable().name : 'unknown_var'; |
|
|
const valueIntNew = generateValueCode(block.getInputTargetBlock('VALUE')) || '0'; |
|
|
code += `${varName} = ${valueIntNew};\n`; |
|
|
break; |
|
|
case 'int_declare': |
|
|
break; |
|
|
case 'int_set': |
|
|
const varFieldInt = block.getField('VAR'); |
|
|
const varNameInt = varFieldInt && varFieldInt.getVariable() ? varFieldInt.getVariable().name : 'unknown_var'; |
|
|
const valueInt = generateValueCode(block.getInputTargetBlock('VALUE')) || '0'; |
|
|
code += `${varNameInt} = ${valueInt};\n`; |
|
|
break; |
|
|
case 'float_declare': |
|
|
break; |
|
|
case 'float_set': |
|
|
const varFieldFloat = block.getField('VAR'); |
|
|
const varNameFloat = varFieldFloat && varFieldFloat.getVariable() ? varFieldFloat.getVariable().name : 'unknown_var'; |
|
|
const valueFloat = generateValueCode(block.getInputTargetBlock('VALUE')) || '0.0'; |
|
|
code += `${varNameFloat} = ${valueFloat};\n`; |
|
|
break; |
|
|
case 'variable_set_number': |
|
|
const varFieldNum = block.getField('VAR'); |
|
|
const varNameNum = varFieldNum && varFieldNum.getVariable() ? varFieldNum.getVariable().name : 'unknown_var'; |
|
|
const valueNum = generateValueCode(block.getInputTargetBlock('VALUE')) || '0'; |
|
|
code += `${varNameNum} = ${valueNum};\n`; |
|
|
break; |
|
|
case 'variable_set_string': |
|
|
const varFieldStr = block.getField('VAR'); |
|
|
const varNameStr = varFieldStr && varFieldStr.getVariable() ? varFieldStr.getVariable().name : 'unknown_var'; |
|
|
let valueStr = generateValueCode(block.getInputTargetBlock('TEXT')) || '""'; |
|
|
if (block.getInputTargetBlock('TEXT')?.type !== 'serial_read_string') { |
|
|
valueStr = cleanString(valueStr); |
|
|
} |
|
|
code += `${varNameStr} = ${valueStr};\n`; |
|
|
break; |
|
|
case 'servo_write': |
|
|
const pinServo = block.getFieldValue('PIN'); |
|
|
const angle = generateValueCode(block.getInputTargetBlock('ANGLE')) || '90'; |
|
|
code += `servo_${pinServo}.write(${angle});\n`; |
|
|
break; |
|
|
case 'ultrasonic_read': |
|
|
const trig = block.getFieldValue('TRIG'); |
|
|
const echo = block.getFieldValue('ECHO'); |
|
|
code += `digitalWrite(${trig}, LOW);\n`; |
|
|
code += `delayMicroseconds(2);\n`; |
|
|
code += `digitalWrite(${trig}, HIGH);\n`; |
|
|
code += `delayMicroseconds(10);\n`; |
|
|
code += `digitalWrite(${trig}, LOW);\n`; |
|
|
code += `duration_${trig} = pulseIn(${echo}, HIGH);\n`; |
|
|
code += `distance_${trig} = duration_${trig} * 0.034 / 2;\n`; |
|
|
break; |
|
|
case 'lcd_print': |
|
|
const cursorCol = block.getFieldValue('CURSOR_COL'); |
|
|
const cursorRow = block.getFieldValue('CURSOR_ROW'); |
|
|
let textLcd = generateValueCode(block.getInputTargetBlock('TEXT')) || '"Hello World!!"'; |
|
|
if (block.getInputTargetBlock('TEXT')?.type !== 'serial_read_string') { |
|
|
textLcd = cleanString(textLcd); |
|
|
} |
|
|
code += `lcd.setCursor(${cursorCol}, ${cursorRow});\nlcd.print(${textLcd});\n`; |
|
|
break; |
|
|
case 'lcd_print_value': |
|
|
const cursorColVal = block.getFieldValue('CURSOR_COL'); |
|
|
const cursorRowVal = block.getFieldValue('CURSOR_ROW'); |
|
|
const valueLcd = generateValueCode(block.getInputTargetBlock('VALUE')) || '0'; |
|
|
code += `lcd.setCursor(${cursorColVal}, ${cursorRowVal});\nlcd.print(${valueLcd});\n`; |
|
|
break; |
|
|
case 'lcd_clear': |
|
|
code += `lcd.clear();\n`; |
|
|
break; |
|
|
case 'serial_begin': |
|
|
const baud = block.getFieldValue('BAUD'); |
|
|
code += `Serial.begin(${baud});\n`; |
|
|
break; |
|
|
case 'serial_print': |
|
|
let textSerial = generateValueCode(block.getInputTargetBlock('TEXT')) || '""'; |
|
|
if (block.getInputTargetBlock('TEXT')?.type !== 'serial_read_string') { |
|
|
textSerial = cleanString(textSerial); |
|
|
} |
|
|
code += `Serial.print(${textSerial});\n`; |
|
|
break; |
|
|
case 'serial_print_value': |
|
|
const valueSerial = generateValueCode(block.getInputTargetBlock('VALUE')) || '0'; |
|
|
code += `Serial.print(${valueSerial});\n`; |
|
|
break; |
|
|
case 'serial_println': |
|
|
let textSerialLn = generateValueCode(block.getInputTargetBlock('TEXT')) || '""'; |
|
|
if (block.getInputTargetBlock('TEXT')?.type !== 'serial_read_string') { |
|
|
textSerialLn = cleanString(textSerialLn); |
|
|
} |
|
|
code += `Serial.println(${textSerialLn});\n`; |
|
|
break; |
|
|
case 'serial_println_value': |
|
|
const valueSerialLn = generateValueCode(block.getInputTargetBlock('VALUE')) || '0'; |
|
|
code += `Serial.println(${valueSerialLn});\n`; |
|
|
break; |
|
|
case 'custom_code': |
|
|
const customCode = block.getFieldValue('CODE'); |
|
|
code += `${customCode}\n`; |
|
|
break; |
|
|
case 'seven_segment_display': |
|
|
const pinA = block.getFieldValue('PIN_A'); |
|
|
const pinB = block.getFieldValue('PIN_B'); |
|
|
const pinC = block.getFieldValue('PIN_C'); |
|
|
const pinD = block.getFieldValue('PIN_D'); |
|
|
const pinE = block.getFieldValue('PIN_E'); |
|
|
const pinF = block.getFieldValue('PIN_F'); |
|
|
const pinG = block.getFieldValue('PIN_G'); |
|
|
const number = generateValueCode(block.getInputTargetBlock('NUMBER')) || '0'; |
|
|
code += `if (${number} == -1) {\n`; |
|
|
code += ` digitalWrite(${pinA}, LOW);\n`; |
|
|
code += ` digitalWrite(${pinB}, LOW);\n`; |
|
|
code += ` digitalWrite(${pinC}, LOW);\n`; |
|
|
code += ` digitalWrite(${pinD}, LOW);\n`; |
|
|
code += ` digitalWrite(${pinE}, LOW);\n`; |
|
|
code += ` digitalWrite(${pinF}, LOW);\n`; |
|
|
code += ` digitalWrite(${pinG}, LOW);\n`; |
|
|
code += `} else {\n`; |
|
|
code += ` int digit = constrain(${number}, 0, 9);\n`; |
|
|
code += ` digitalWrite(${pinA}, ${segmentPatterns[0][0] ? 'HIGH' : 'LOW'});\n`; |
|
|
code += ` digitalWrite(${pinB}, ${segmentPatterns[0][1] ? 'HIGH' : 'LOW'});\n`; |
|
|
code += ` digitalWrite(${pinC}, ${segmentPatterns[0][2] ? 'HIGH' : 'LOW'});\n`; |
|
|
code += ` digitalWrite(${pinD}, ${segmentPatterns[0][3] ? 'HIGH' : 'LOW'});\n`; |
|
|
code += ` digitalWrite(${pinE}, ${segmentPatterns[0][4] ? 'HIGH' : 'LOW'});\n`; |
|
|
code += ` digitalWrite(${pinF}, ${segmentPatterns[0][5] ? 'HIGH' : 'LOW'});\n`; |
|
|
code += ` digitalWrite(${pinG}, ${segmentPatterns[0][6] ? 'HIGH' : 'LOW'});\n`; |
|
|
code += ` if (digit == 1) { digitalWrite(${pinA}, ${segmentPatterns[1][0] ? 'HIGH' : 'LOW'}); digitalWrite(${pinB}, ${segmentPatterns[1][1] ? 'HIGH' : 'LOW'}); digitalWrite(${pinC}, ${segmentPatterns[1][2] ? 'HIGH' : 'LOW'}); digitalWrite(${pinD}, ${segmentPatterns[1][3] ? 'HIGH' : 'LOW'}); digitalWrite(${pinE}, ${segmentPatterns[1][4] ? 'HIGH' : 'LOW'}); digitalWrite(${pinF}, ${segmentPatterns[1][5] ? 'HIGH' : 'LOW'}); digitalWrite(${pinG}, ${segmentPatterns[1][6] ? 'HIGH' : 'LOW'}); }\n`; |
|
|
code += ` else if (digit == 2) { digitalWrite(${pinA}, ${segmentPatterns[2][0] ? 'HIGH' : 'LOW'}); digitalWrite(${pinB}, ${segmentPatterns[2][1] ? 'HIGH' : 'LOW'}); digitalWrite(${pinC}, ${segmentPatterns[2][2] ? 'HIGH' : 'LOW'}); digitalWrite(${pinD}, ${segmentPatterns[2][3] ? 'HIGH' : 'LOW'}); digitalWrite(${pinE}, ${segmentPatterns[2][4] ? 'HIGH' : 'LOW'}); digitalWrite(${pinF}, ${segmentPatterns[2][5] ? 'HIGH' : 'LOW'}); digitalWrite(${pinG}, ${segmentPatterns[2][6] ? 'HIGH' : 'LOW'}); }\n`; |
|
|
code += ` else if (digit == 3) { digitalWrite(${pinA}, ${segmentPatterns[3][0] ? 'HIGH' : 'LOW'}); digitalWrite(${pinB}, ${segmentPatterns[3][1] ? 'HIGH' : 'LOW'}); digitalWrite(${pinC}, ${segmentPatterns[3][2] ? 'HIGH' : 'LOW'}); digitalWrite(${pinD}, ${segmentPatterns[3][3] ? 'HIGH' : 'LOW'}); digitalWrite(${pinE}, ${segmentPatterns[3][4] ? 'HIGH' : 'LOW'}); digitalWrite(${pinF}, ${segmentPatterns[3][5] ? 'HIGH' : 'LOW'}); digitalWrite(${pinG}, ${segmentPatterns[3][6] ? 'HIGH' : 'LOW'}); }\n`; |
|
|
code += ` else if (digit == 4) { digitalWrite(${pinA}, ${segmentPatterns[4][0] ? 'HIGH' : 'LOW'}); digitalWrite(${pinB}, ${segmentPatterns[4][1] ? 'HIGH' : 'LOW'}); digitalWrite(${pinC}, ${segmentPatterns[4][2] ? 'HIGH' : 'LOW'}); digitalWrite(${pinD}, ${segmentPatterns[4][3] ? 'HIGH' : 'LOW'}); digitalWrite(${pinE}, ${segmentPatterns[4][4] ? 'HIGH' : 'LOW'}); digitalWrite(${pinF}, ${segmentPatterns[4][5] ? 'HIGH' : 'LOW'}); digitalWrite(${pinG}, ${segmentPatterns[4][6] ? 'HIGH' : 'LOW'}); }\n`; |
|
|
code += ` else if (digit == 5) { digitalWrite(${pinA}, ${segmentPatterns[5][0] ? 'HIGH' : 'LOW'}); digitalWrite(${pinB}, ${segmentPatterns[5][1] ? 'HIGH' : 'LOW'}); digitalWrite(${pinC}, ${segmentPatterns[5][2] ? 'HIGH' : 'LOW'}); digitalWrite(${pinD}, ${segmentPatterns[5][3] ? 'HIGH' : 'LOW'}); digitalWrite(${pinE}, ${segmentPatterns[5][4] ? 'HIGH' : 'LOW'}); digitalWrite(${pinF}, ${segmentPatterns[5][5] ? 'HIGH' : 'LOW'}); digitalWrite(${pinG}, ${segmentPatterns[5][6] ? 'HIGH' : 'LOW'}); }\n`; |
|
|
code += ` else if (digit == 6) { digitalWrite(${pinA}, ${segmentPatterns[6][0] ? 'HIGH' : 'LOW'}); digitalWrite(${pinB}, ${segmentPatterns[6][1] ? 'HIGH' : 'LOW'}); digitalWrite(${pinC}, ${segmentPatterns[6][2] ? 'HIGH' : 'LOW'}); digitalWrite(${pinD}, ${segmentPatterns[6][3] ? 'HIGH' : 'LOW'}); digitalWrite(${pinE}, ${segmentPatterns[6][4] ? 'HIGH' : 'LOW'}); digitalWrite(${pinF}, ${segmentPatterns[6][5] ? 'HIGH' : 'LOW'}); digitalWrite(${pinG}, ${segmentPatterns[6][6] ? 'HIGH' : 'LOW'}); }\n`; |
|
|
code += ` else if (digit == 7) { digitalWrite(${pinA}, ${segmentPatterns[7][0] ? 'HIGH' : 'LOW'}); digitalWrite(${pinB}, ${segmentPatterns[7][1] ? 'HIGH' : 'LOW'}); digitalWrite(${pinC}, ${segmentPatterns[7][2] ? 'HIGH' : 'LOW'}); digitalWrite(${pinD}, ${segmentPatterns[7][3] ? 'HIGH' : 'LOW'}); digitalWrite(${pinE}, ${segmentPatterns[7][4] ? 'HIGH' : 'LOW'}); digitalWrite(${pinF}, ${segmentPatterns[7][5] ? 'HIGH' : 'LOW'}); digitalWrite(${pinG}, ${segmentPatterns[7][6] ? 'HIGH' : 'LOW'}); }\n`; |
|
|
code += ` else if (digit == 8) { digitalWrite(${pinA}, ${segmentPatterns[8][0] ? 'HIGH' : 'LOW'}); digitalWrite(${pinB}, ${segmentPatterns[8][1] ? 'HIGH' : 'LOW'}); digitalWrite(${pinC}, ${segmentPatterns[8][2] ? 'HIGH' : 'LOW'}); digitalWrite(${pinD}, ${segmentPatterns[8][3] ? 'HIGH' : 'LOW'}); digitalWrite(${pinE}, ${segmentPatterns[8][4] ? 'HIGH' : 'LOW'}); digitalWrite(${pinF}, ${segmentPatterns[8][5] ? 'HIGH' : 'LOW'}); digitalWrite(${pinG}, ${segmentPatterns[8][6] ? 'HIGH' : 'LOW'}); }\n`; |
|
|
code += ` else if (digit == 9) { digitalWrite(${pinA}, ${segmentPatterns[9][0] ? 'HIGH' : 'LOW'}); digitalWrite(${pinB}, ${segmentPatterns[9][1] ? 'HIGH' : 'LOW'}); digitalWrite(${pinC}, ${segmentPatterns[9][2] ? 'HIGH' : 'LOW'}); digitalWrite(${pinD}, ${segmentPatterns[9][3] ? 'HIGH' : 'LOW'}); digitalWrite(${pinE}, ${segmentPatterns[9][4] ? 'HIGH' : 'LOW'}); digitalWrite(${pinF}, ${segmentPatterns[9][5] ? 'HIGH' : 'LOW'}); digitalWrite(${pinG}, ${segmentPatterns[9][6] ? 'HIGH' : 'LOW'}); }\n`; |
|
|
code += `}\n`; |
|
|
break; |
|
|
case 'tone': |
|
|
const tonePin = block.getFieldValue('PIN'); |
|
|
const frequency = generateValueCode(block.getInputTargetBlock('FREQUENCY')) || '440'; |
|
|
code += `tone(${tonePin}, ${frequency});\n`; |
|
|
break; |
|
|
case 'noTone': |
|
|
const noTonePin = block.getFieldValue('PIN'); |
|
|
code += `noTone(${noTonePin});\n`; |
|
|
break; |
|
|
} |
|
|
block = block.getNextBlock(); |
|
|
} |
|
|
return code; |
|
|
} |
|
|
|
|
|
workspace.addChangeListener(function (event) { |
|
|
const arduinoCode = generateArduinoCode(); |
|
|
document.getElementById('generated-code').textContent = arduinoCode; |
|
|
if (event.type === Blockly.Events.BLOCK_CREATE || |
|
|
event.type === Blockly.Events.BLOCK_DELETE || |
|
|
event.type === Blockly.Events.BLOCK_MOVE || |
|
|
event.type === Blockly.Events.BLOCK_CHANGE) { |
|
|
saveWorkspaceToUrl(); |
|
|
} |
|
|
}); |
|
|
|
|
|
document.getElementById('clear-btn').addEventListener('click', function () { |
|
|
workspace.clear(); |
|
|
document.getElementById('generated-code').textContent = '// 生成されたArduinoコードがここに表示されます'; |
|
|
const url = new URL(window.location); |
|
|
url.searchParams.delete('blocks'); |
|
|
history.pushState({}, '', url); |
|
|
}); |
|
|
|
|
|
document.getElementById('save-btn').addEventListener('click', function () { |
|
|
const url = window.location.href; |
|
|
navigator.clipboard.writeText(url).then(() => { |
|
|
alert('URLがクリップボードにコピーされました！'); |
|
|
}).catch(err => { |
|
|
console.error('URLのコピーに失敗しました:', err); |
|
|
}); |
|
|
}); |
|
|
|
|
|
document.getElementById('download-btn').addEventListener('click', function () { |
|
|
const code = document.getElementById('generated-code').textContent; |
|
|
const now = new Date(); |
|
|
const timestamp = now.getFullYear() + |
|
|
('0' + (now.getMonth() + 1)).slice(-2) + |
|
|
('0' + now.getDate()).slice(-2) + |
|
|
('0' + now.getHours()).slice(-2) + |
|
|
('0' + now.getMinutes()).slice(-2); |
|
|
const filename = `${timestamp}.ino`; |
|
|
const blob = new Blob([code], { type: 'text/x-arduino' }); |
|
|
const url = window.URL.createObjectURL(blob); |
|
|
const a = document.createElement('a'); |
|
|
a.href = url; |
|
|
a.download = filename; |
|
|
document.body.appendChild(a); |
|
|
a.click(); |
|
|
document.body.removeChild(a); |
|
|
window.URL.revokeObjectURL(url); |
|
|
}); |
|
|
|
|
|
document.getElementById('print-btn').addEventListener('click', function () { |
|
|
html2canvas(document.getElementById('block-area')).then(canvas => { |
|
|
const image = canvas.toDataURL('image/png'); |
|
|
const printWindow = window.open(''); |
|
|
printWindow.document.write('<img src="' + image + '" onload="window.print();window.close()" />'); |
|
|
printWindow.document.close(); |
|
|
}); |
|
|
}); |
|
|
|
|
|
// シリアル通信ボタンのイベントリスナー |
|
|
document.getElementById('serial-btn').addEventListener('click', function () { |
|
|
const modal = document.getElementById('serial-modal'); |
|
|
const iframe = document.getElementById('serial-iframe'); |
|
|
iframe.src = 'pv17-3.html'; // index2.htmlを読み込む |
|
|
modal.style.display = 'block'; // モーダルを表示 |
|
|
}); |
|
|
|
|
|
// 閉じるボタンのイベントリスナー |
|
|
document.getElementById('close-modal').addEventListener('click', function () { |
|
|
const modal = document.getElementById('serial-modal'); |
|
|
const iframe = document.getElementById('serial-iframe'); |
|
|
modal.style.display = 'none'; // モーダルを非表示 |
|
|
iframe.src = ''; // iframeの内容をリセット |
|
|
}); |
|
|
|
|
|
document.getElementById('exit-btn').addEventListener('click', function () { |
|
|
window.location.href = 'https://huggingface.co/ek15072809'; |
|
|
}); |
|
|
|
|
|
loadWorkspaceFromUrl(); |
|
|
</script> |
|
|
</body> |
|
|
</html> |
