Skip to content

Commit a0a3e2a

Browse files
oxxostudiooxxostudio
committed
add buzzer tutorial 1,2,3
1 parent 853f42d commit a0a3e2a

15 files changed

Lines changed: 558 additions & 44 deletions

File tree

‎blocks/msg/en.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -229,3 +229,8 @@ Blockly.Msg.WEBDUINO_SERVO_SET_ANGLE = "Set angle (1-180)";
229229
Blockly.Msg.WEBDUINO_SERVO_CURRENT_ANGLE = "Current angle";
230230
Blockly.Msg.WEBDUINO_SERVO_PLUS = "+";
231231
Blockly.Msg.WEBDUINO_SERVO_MINUS = "-";
232+
233+
Blockly.Msg.WEBDUINO_BUZZER_SHOW = "Show";
234+
Blockly.Msg.WEBDUINO_BUZZER_SHOW_NOTESANDTEMPOS = "'s notes and tempos";
235+
Blockly.Msg.WEBDUINO_BUZZER_CLICK = "Click";
236+
Blockly.Msg.WEBDUINO_BUZZER_DO = "do:";

‎blocks/msg/zh-hant.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -228,3 +228,8 @@ Blockly.Msg.WEBDUINO_SERVO_SET_ANGLE = "設定起始角度 ( 0-180 ) ";
228228
Blockly.Msg.WEBDUINO_SERVO_CURRENT_ANGLE = "當前角度";
229229
Blockly.Msg.WEBDUINO_SERVO_PLUS = "+";
230230
Blockly.Msg.WEBDUINO_SERVO_MINUS = "-";
231+
232+
Blockly.Msg.WEBDUINO_BUZZER_SHOW = "顯示";
233+
Blockly.Msg.WEBDUINO_BUZZER_SHOW_NOTESANDTEMPOS = "的音符和節奏";
234+
Blockly.Msg.WEBDUINO_BUZZER_CLICK = "點選";
235+
Blockly.Msg.WEBDUINO_BUZZER_DO = "執行：";

‎blocks/tutorials.js‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -685,3 +685,49 @@ Blockly.Blocks['tutorial_servo_calculate'] = {
685685
this.setHelpUrl('http://www.example.com/');
686686
}
687687
};
688+
689+
/*
690+
oooooooooo. ooooo ooo oooooooooooo oooooooooooo oooooooooooo ooooooooo.
691+
`888' `Y8b `888' `8' d'""""""d888' d'""""""d888' `888' `8 `888 `Y88.
692+
888 888 888 8 .888P .888P 888 888 .d88'
693+
888oooo888' 888 8 d888' d888' 888oooo8 888ooo88P'
694+
888 `88b 888 8 .888P .888P 888 " 888`88b.
695+
888 .88P `88. .8' d888' .P d888' .P 888 o 888 `88b.
696+
o888bood8P' `YbodP' .8888888888P .8888888888P o888ooooood8 o888o o888o
697+
*/
698+
699+
//https://blockly-demo.appspot.com/static/demos/blockfactory/index.html#s6hvit
700+
Blockly.Blocks['tutorial_buzzer_1'] = {
701+
init: function () {
702+
this.appendValueInput("var_")
703+
.appendField(Blockly.Msg.WEBDUINO_BUZZER_SHOW,"顯示");
704+
this.appendDummyInput()
705+
.appendField(Blockly.Msg.WEBDUINO_BUZZER_SHOW_NOTESANDTEMPOS,"的音符和節奏");
706+
this.setPreviousStatement(true);
707+
this.setNextStatement(true);
708+
this.setTooltip('');
709+
this.setColour(Blockly.Blocks.colour.HUE);
710+
this.setHelpUrl('http://www.example.com/');
711+
}
712+
};
713+
714+
// https://blockly-demo.appspot.com/static/demos/blockfactory/index.html#twivbo
715+
Blockly.Blocks['tutorial_buzzer_3'] = {
716+
init: function () {
717+
this.appendDummyInput()
718+
.appendField(Blockly.Msg.WEBDUINO_BUZZER_CLICK,"點選")
719+
.appendField(new Blockly.FieldDropdown([
720+
["music1", "m1"],
721+
["music2", "m2"],
722+
["music3", "m3"],
723+
["stop", "stop"]
724+
]), "btn_");
725+
this.appendStatementInput("do_")
726+
.appendField(Blockly.Msg.WEBDUINO_BUZZER_DO,"執行：");
727+
this.setPreviousStatement(true);
728+
this.setNextStatement(true);
729+
this.setTooltip('');
730+
this.setColour(Blockly.Blocks.colour.HUE);
731+
this.setHelpUrl('http://www.example.com/');
732+
}
733+
};

‎generators/tutorials.js‎

Lines changed: 73 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -465,15 +465,15 @@ Blockly.JavaScript['tutorial_dht_areachart'] = function (block) {
465465
var value_name_ = Blockly.JavaScript.valueToCode(block, 'name_', Blockly.JavaScript.ORDER_ATOMIC);
466466
var value_color_t_ = Blockly.JavaScript.valueToCode(block, 'color_t_', Blockly.JavaScript.ORDER_ATOMIC);
467467
var value_color_h_ = Blockly.JavaScript.valueToCode(block, 'color_h_', Blockly.JavaScript.ORDER_ATOMIC);
468-
var code = 'var '+value_name_+' = {};\n' +
469-
value_name_+'.areachart = false;\n' +
470-
value_name_+'.origin = [\n' +
468+
var code = 'var ' + value_name_ + ' = {};\n' +
469+
value_name_ + '.areachart = false;\n' +
470+
value_name_ + '.origin = [\n' +
471471
' ["Time", "temperature", "humidity"]\n' +
472472
'];\n' +
473473
'google.load("visualization", "1", {\n' +
474474
' packages: ["corechart"],\n' +
475475
' callback: function() {\n' +
476-
' '+value_name_+'.areachart = true;\n' +
476+
' ' + value_name_ + '.areachart = true;\n' +
477477
' }\n' +
478478
'});\n' +
479479
'function drawAreaChart(d) {\n' +
@@ -496,18 +496,18 @@ Blockly.JavaScript['tutorial_dht_areachart'] = function (block) {
496496

497497
Blockly.JavaScript['tutorial_dht_gauge'] = function (block) {
498498
var value_name_ = Blockly.JavaScript.valueToCode(block, 'name_', Blockly.JavaScript.ORDER_ATOMIC);
499-
var code = 'var '+value_name_+' = {};\n' +
500-
value_name_+'.guage = false;\n' +
501-
value_name_+'.origin1 = [\n' +
499+
var code = 'var ' + value_name_ + ' = {};\n' +
500+
value_name_ + '.guage = false;\n' +
501+
value_name_ + '.origin1 = [\n' +
502502
' ["Label", "Value"],["humidity", 55]\n' +
503503
'];\n' +
504-
value_name_+'.origin2 = [\n' +
504+
value_name_ + '.origin2 = [\n' +
505505
' ["Label", "Value"],["temperature", 30]\n' +
506506
'];\n' +
507507
'google.load("visualization", "1", {\n' +
508508
' packages: ["gauge"],\n' +
509509
' callback: function() {\n' +
510-
' '+value_name_+'.gauge = true;\n' +
510+
' ' + value_name_ + '.gauge = true;\n' +
511511
' }\n' +
512512
'});\n' +
513513
'function drawGuage(d1,d2) {\n' +
@@ -522,14 +522,14 @@ Blockly.JavaScript['tutorial_dht_gauge'] = function (block) {
522522
' yellowFrom:75, yellowTo: 90,\n' +
523523
' minorTicks: 5,\n' +
524524
' redColor:"#00f", yellowColor:"#9cf",\n' +
525-
' animation:{easing:"in"}\n'+
525+
' animation:{easing:"in"}\n' +
526526
' };\n' +
527527
' var options2 = {\n' +
528528
' width: 400, height: 120,\n' +
529529
' redFrom: 90, redTo: 100,\n' +
530530
' yellowFrom:75, yellowTo: 90,\n' +
531531
' minorTicks: 5,\n' +
532-
' animation:{easing:"in"}\n'+
532+
' animation:{easing:"in"}\n' +
533533
' };\n' +
534534
'var chart1 = new google.visualization.Gauge(document.getElementById("chart_div1"));\n' +
535535
'chart1.draw(data1, options1);\n' +
@@ -539,7 +539,7 @@ Blockly.JavaScript['tutorial_dht_gauge'] = function (block) {
539539
return code;
540540
};
541541

542-
Blockly.JavaScript['tutorial_dht_draw'] = function(block) {
542+
Blockly.JavaScript['tutorial_dht_draw'] = function (block) {
543543
var variable_chart_ = Blockly.JavaScript.variableDB_.getName(block.getFieldValue('chart_'), Blockly.Variables.NAME_TYPE);
544544
var value_t_ = Blockly.JavaScript.valueToCode(block, 't_', Blockly.JavaScript.ORDER_ATOMIC);
545545
var value_h_ = Blockly.JavaScript.valueToCode(block, 'h_', Blockly.JavaScript.ORDER_ATOMIC);
@@ -550,23 +550,23 @@ Blockly.JavaScript['tutorial_dht_draw'] = function(block) {
550550
'var tm = time.getMinutes();\n' +
551551
'var th = time.getHours();\n' +
552552
'var a = [];\n' +
553-
'if ('+variable_chart_+'.areachart) {\n' +
554-
' document.getElementById("chart_div").style.display="block";\n'+
555-
' document.getElementById("chart_div1").style.display="none";\n'+
556-
' document.getElementById("chart_div2").style.display="none";\n'+
553+
'if (' + variable_chart_ + '.areachart) {\n' +
554+
' document.getElementById("chart_div").style.display="block";\n' +
555+
' document.getElementById("chart_div1").style.display="none";\n' +
556+
' document.getElementById("chart_div2").style.display="none";\n' +
557557
' a[0] = th + ":" + tm + ":" + ts;\n' +
558558
' a[1] = ' + value_t_ + ';\n' +
559559
' a[2] = ' + value_h_ + ';\n' +
560-
' '+variable_chart_+'.origin.push(a);\n' +
561-
' drawAreaChart('+variable_chart_+'.origin);\n' +
562-
'}\n'+
563-
'if ('+variable_chart_+'.gauge) {\n' +
564-
' document.getElementById("chart_div").style.display="none";\n'+
565-
' document.getElementById("chart_div1").style.display="inline-block";\n'+
566-
' document.getElementById("chart_div2").style.display="inline-block";\n'+
567-
' '+variable_chart_+'.origin1 = [["Label", "Value"],["humidity", '+value_h_+']];\n' +
568-
' '+variable_chart_+'.origin2 = [["Label", "Value"],["temperature", '+value_t_+']];\n' +
569-
' drawGuage('+variable_chart_+'.origin1,'+variable_chart_+'.origin2);\n' +
560+
' ' + variable_chart_ + '.origin.push(a);\n' +
561+
' drawAreaChart(' + variable_chart_ + '.origin);\n' +
562+
'}\n' +
563+
'if (' + variable_chart_ + '.gauge) {\n' +
564+
' document.getElementById("chart_div").style.display="none";\n' +
565+
' document.getElementById("chart_div1").style.display="inline-block";\n' +
566+
' document.getElementById("chart_div2").style.display="inline-block";\n' +
567+
' ' + variable_chart_ + '.origin1 = [["Label", "Value"],["humidity", ' + value_h_ + ']];\n' +
568+
' ' + variable_chart_ + '.origin2 = [["Label", "Value"],["temperature", ' + value_t_ + ']];\n' +
569+
' drawGuage(' + variable_chart_ + '.origin1,' + variable_chart_ + '.origin2);\n' +
570570
'}\n';
571571
return code;
572572
};
@@ -581,39 +581,68 @@ oo .d8P 888 o 888 `88b. `888' `88b d88'
581581
8""88888P' o888ooooood8 o888o o888o `8' `Y8bood8P'
582582
*/
583583

584-
Blockly.JavaScript['tutorial_servo_button'] = function(block) {
584+
Blockly.JavaScript['tutorial_servo_button'] = function (block) {
585585
var dropdown_btn_ = block.getFieldValue('btn_');
586586
var statements_do_ = Blockly.JavaScript.statementToCode(block, 'do_');
587-
var code = 'document.getElementById("'+dropdown_btn_+'").addEventListener("click",function(){\n'+
588-
statements_do_+'\n'+
589-
'});\n';
587+
var code = 'document.getElementById("' + dropdown_btn_ + '").addEventListener("click",function(){\n' +
588+
statements_do_ + '\n' +
589+
'});\n';
590590
return code;
591591
};
592592

593-
Blockly.JavaScript['tutorial_servo_button_set'] = function(block) {
593+
Blockly.JavaScript['tutorial_servo_button_set'] = function (block) {
594594
var angle_angle_ = block.getFieldValue('angle_');
595-
if(angle_angle_>=180){angle_angle_=180;}
596-
var code = 'document.getElementById("show").innerHTML = '+angle_angle_+';\n';
595+
if (angle_angle_ >= 180) {
596+
angle_angle_ = 180;
597+
}
598+
var code = 'document.getElementById("show").innerHTML = ' + angle_angle_ + ';\n';
597599
return code;
598600
};
599601

600-
Blockly.JavaScript['tutorial_servo_calculate'] = function(block) {
602+
Blockly.JavaScript['tutorial_servo_calculate'] = function (block) {
601603
var dropdown_calculate_ = block.getFieldValue('calculate_');
602604
var value_angle_ = Blockly.JavaScript.valueToCode(block, 'angle_', Blockly.JavaScript.ORDER_ATOMIC);
603605
var varAngle = Blockly.JavaScript.variableDB_.getDistinctName(
604606
'varAngle', Blockly.Variables.NAME_TYPE);
605607
var a;
606-
if(dropdown_calculate_=="plus"){
607-
a=" + ";
608+
if (dropdown_calculate_ == "plus") {
609+
a = " + ";
608610
}
609-
if(dropdown_calculate_=="minus"){
610-
a=" - ";
611+
if (dropdown_calculate_ == "minus") {
612+
a = " - ";
611613
}
612-
var code = '(function(){\n'+
613-
' var '+varAngle+' = document.getElementById("show").innerHTML;\n'+
614-
' '+varAngle+' = ( '+varAngle+'* 1 ) '+a+value_angle_ +';\n'+
615-
' document.getElementById("show").innerHTML = '+varAngle+';\n'+
616-
' return '+varAngle+';\n'+
617-
'})()';
614+
var code = '(function(){\n' +
615+
' var ' + varAngle + ' = document.getElementById("show").innerHTML;\n' +
616+
' ' + varAngle + ' = ( ' + varAngle + '* 1 ) ' + a + value_angle_ + ';\n' +
617+
' document.getElementById("show").innerHTML = ' + varAngle + ';\n' +
618+
' return ' + varAngle + ';\n' +
619+
'})()';
618620
return [code, Blockly.JavaScript.ORDER_ATOMIC];
619621
};
622+
623+
624+
/*
625+
oooooooooo. ooooo ooo oooooooooooo oooooooooooo oooooooooooo ooooooooo.
626+
`888' `Y8b `888' `8' d'""""""d888' d'""""""d888' `888' `8 `888 `Y88.
627+
888 888 888 8 .888P .888P 888 888 .d88'
628+
888oooo888' 888 8 d888' d888' 888oooo8 888ooo88P'
629+
888 `88b 888 8 .888P .888P 888 " 888`88b.
630+
888 .88P `88. .8' d888' .P d888' .P 888 o 888 `88b.
631+
o888bood8P' `YbodP' .8888888888P .8888888888P o888ooooood8 o888o o888o
632+
*/
633+
634+
Blockly.JavaScript['tutorial_buzzer_1'] = function (block) {
635+
var value_var_ = Blockly.JavaScript.valueToCode(block, 'var_', Blockly.JavaScript.ORDER_ATOMIC);
636+
var code = 'document.getElementById("buzzerNotes").innerHTML = ' + value_var_ + '.notes;\n' +
637+
'document.getElementById("buzzerTempos").innerHTML = ' + value_var_ + '.tempos;\n';
638+
return code;
639+
};
640+
641+
Blockly.JavaScript['tutorial_buzzer_3'] = function (block) {
642+
var dropdown_btn_ = block.getFieldValue('btn_');
643+
var statements_do_ = Blockly.JavaScript.statementToCode(block, 'do_');
644+
var code = 'document.getElementById("' + dropdown_btn_ + '").addEventListener("click",function(){\n' +
645+
' ' + statements_do_ + '\n' +
646+
'});\n';
647+
return code;
648+
};

‎generators/webduino.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -260,6 +260,9 @@ Blockly.JavaScript['buzzer_notes_tempos'] = function (block) {
260260
var dropdown_tone_ = block.getFieldValue('tone_');
261261
var dropdown_pitch_ = block.getFieldValue('pitch_');
262262
var dropdown_tempos_ = block.getFieldValue('tempos_');
263+
if(dropdown_tone_=='0'){
264+
dropdown_pitch_='';
265+
}
263266
var code = 'musicNotes.notes.push("' + dropdown_tone_ + dropdown_pitch_ + '");\n' +
264267
'musicNotes.tempos.push("' + dropdown_tempos_ + '");\n';
265268
return code;

‎index-tutorials.html‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -213,6 +213,22 @@ <h4><a href="./?lang=zh-hant&page=tutorials/servo-2" target="_blank">利用按
213213
</li>
214214
</ul>
215215
<br/>
216+
<h3>蜂鳴器</h3>
217+
<ul>
218+
<li>
219+
<h4><a href="./?lang=zh-hant&page=tutorials/buzzer-1" target="_blank">製作音樂並用蜂鳴器播放 (1)</a></h4>
220+
( <a href="./?lang=zh-hant&page=tutorials/buzzer-1#-Jw0GJqmMclVbEodf3vd" target="_blank">解答</a> )
221+
</li>
222+
<li>
223+
<h4><a href="./?lang=zh-hant&page=tutorials/buzzer-2" target="_blank">製作音樂並用蜂鳴器播放 (2)</a></h4>
224+
( <a href="./?lang=zh-hant&page=tutorials/buzzer-2#-Jw0aEoyT2sxCaftUdTD" target="_blank">解答</a> )
225+
</li>
226+
<li>
227+
<h4><a href="./?lang=zh-hant&page=tutorials/buzzer-3" target="_blank">切換音樂，並用蜂鳴器播放</a></h4>
228+
( <a href="./?lang=zh-hant&page=tutorials/buzzer-3#-Jw0e5c4wXxYC9xSO7Lq" target="_blank">解答</a> )
229+
</li>
230+
</ul>
231+
<br/>
216232
<script>
217233
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
218234
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

‎msg/tutorials/buzzer-1/en.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
MSG.backIndex = "Webduino Blockly Tutorials";
2+
MSG.demoTitle = "Blockly Demo Area";
3+
MSG.catTutorials = "Tutorials";
4+
MSG.timerVariable = "timer";
5+
6+
MSG.subTitle = "Chapter 9-1 : Buzzer";
7+
MSG.demoDescription = "Create a music and display notes and tempos, play this music by buzzer";
8+
MSG.notes = "Notes:";
9+
MSG.tempos = "Tempos:";

‎msg/tutorials/buzzer-1/zh-hant.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
MSG.backIndex = "Webduino 積木教學";
2+
MSG.demoTitle = "Blockly 範例測試區";
3+
MSG.catTutorials = "教學積木";
4+
MSG.timerVariable = "計時器";
5+
6+
MSG.subTitle = "課程 9-1：蜂鳴器播放音樂";
7+
MSG.demoDescription = "製作一首音樂並用蜂鳴器播放，將音樂簡譜顯示在下方";
8+
MSG.notes = "音符：";
9+
MSG.tempos = "節奏：";

‎msg/tutorials/buzzer-2/en.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
MSG.backIndex = "Webduino Blockly Tutorials";
2+
MSG.demoTitle = "Blockly Demo Area";
3+
MSG.catTutorials = "Tutorials";
4+
MSG.timerVariable = "timer";
5+
6+
MSG.subTitle = "Chapter 9-2 : Buzzer";
7+
MSG.demoDescription = "Create a music and play this music by buzzer";

‎msg/tutorials/buzzer-2/zh-hant.js‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
MSG.backIndex = "Webduino 積木教學";
2+
MSG.demoTitle = "Blockly 範例測試區";
3+
MSG.catTutorials = "教學積木";
4+
MSG.timerVariable = "計時器";
5+
6+
MSG.subTitle = "課程 9-2：蜂鳴器播放音樂";
7+
MSG.demoDescription = "嘗試用其他的方式製作一首音樂，並用蜂鳴器播放";
8+

0 commit comments

Comments
 (0)