update

cocoblockly.css

@@ -1615,17 +1615,20 @@ nav ul li {
     transition: none;
     float: left;
     padding: 0;
+    font-size: 14px;
 }
 
 #button_load span,#button_import_cloud span,#button_save span,#button_save_cloud span{
     color: #222222;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #button_load:hover span,#button_import_cloud:hover span,#button_save:hover span,#button_save_cloud:hover span{
     background-color: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #plugin_download span,#button_upgrade_firmware span,#button_connection_type span{
@@ -1637,18 +1640,21 @@ nav ul li {
 #local_help_ai span,#local_help_extends span,#local_help_error span {
     color: #222222;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #plugin_download:hover span,#button_upgrade_firmware:hover span,#button_connection_type:hover span{
     background-color: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #local_help_ai:hover span,#local_help_extends:hover span,#local_help_error:hover span {
     background-color: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 .sketch_name::-webkit-input-placeholder{
@@ -1667,10 +1673,12 @@ nav ul li {
 #EN span,#TC span,#CN span{
     color: #222222;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #EN:hover span,#TC:hover span,#CN:hover span{
     background-color: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size: 14px;
 }

index.css

@@ -700,10 +700,7 @@ ul, li {
     box-shadow: 1px 1px 4px #cccccc;
     display: none;
 }
-.translatable_download_uploader{
 
-    font-size: 14px;
-}
 .downbox div {
     /* background: #ffffff; */
     width: 100%;
@@ -712,7 +709,7 @@ ul, li {
     line-height: 40px;
     color: #222222;
     cursor: pointer;
-    font-size: 15px;
+    font-size: 14px;
     text-align: center;
 }
 
@@ -746,12 +743,14 @@ ul, li {
 .MouduleBox div a{
     background: #fff !important;
     color: #222222;
+    font-size: 14px;
 }
 
 
 .MouduleBox div a:hover {
     color: #4A6AFF !important;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 .ModeSelectBox .ModeSelect .downbox-style {
@@ -1195,6 +1194,7 @@ table td, th {
     overflow-y: auto;
     opacity: 0;
     z-index: 999;
+    font-size:14px;
  }
 
  #plugin_mac_or_windows li,#connect_method li,#local_help_ai_kit li, #help_extends li{
@@ -1205,22 +1205,26 @@ table td, th {
     line-height: 1.5rem;
     width: 100%;
     text-align: left;
+    font-size:14px;
 }
 
 
 #plugin_mac_or_windows #Mac span, #plugin_mac_or_windows #Windows span, #connect_method #select_connecteds span, #connect_method #no_select_connecteds span{
     color: #222222;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #local_help_ai_kit #ai_kit_0 span, #local_help_ai_kit #ai_kit_1 span, #local_help_ai_kit #ai_kit_2 span, #local_help_ai_kit #ai_kit_3 span{
     color: #222222;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #help_extends #extends_0 span,#help_extends #extends_1 span,#help_extends #extends_2 span {
     color: #222222;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #plugin_mac_or_windows #Mac:hover span, #plugin_mac_or_windows #Windows:hover span, 
@@ -1228,18 +1232,21 @@ table td, th {
     background: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #local_help_ai_kit #ai_kit_0:hover span, #local_help_ai_kit #ai_kit_1:hover span, #local_help_ai_kit #ai_kit_2:hover span, #local_help_ai_kit #ai_kit_3:hover span{
     background: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #help_extends #extends_0:hover span,#help_extends #extends_1:hover span,#help_extends #extends_2:hover span {
     background: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #Mac img, #Windows img{

index.html

@@ -320,7 +320,7 @@
                         <div style="margin: 0px 20px 0px 0px;">
                             <input type="text" value="A.I. Module" id="iot_modules" readonly
                                 class="selectMode_input browser-default"
-                                style="font-size: 0.9rem;border: none;width: 120px;">
+                                style="font-size:14px;border: none;width: 120px;">
                             <i id="down" class="down"
                                 style="position: relative;top: -20px;float: right;right: 9px;"></i>
                             <div class="downbox MouduleBox" id="downboxModule" style="top: 64px;">
@@ -341,7 +341,7 @@
                     <li class="Mode_select_box">
                         <div class="ModeSelectBox">
                             <div class="ModeSelect">
-                                <div style="font-size: 0.9rem;">样例 </div>
+                                <div style="font-size: 14px;">样例 </div>
                                 <i class="down" style="position: relative;top: -34px;left: 20px;float: right;"></i>
                                 <div class="downbox ModeBox downbox-style">
                                     <div style="display: block;">
@@ -699,7 +699,7 @@
 
                     <li id="downloadbutton-li" style="position: absolute;right: 68px;">
                         <button id="downloadbutton" class="translatable_sketch_save"
-                            style="color: #fff;font-weight: 700;background: #4A6AFF;border: none;font-size: 14px;padding:13px 20px 9px 20px;cursor: pointer;">保存</button>
+                            style="color: #fff;font-weight: 700;background: #4A6AFF;border: none;font-size: 14px;padding:13px 20px 9px 20px;cursor: pointer;margin-top: 13px;">保存</button>
                     </li>
 
                     <!-- App Center demo -->
@@ -2854,7 +2854,7 @@
             <span class="modal_close" style="padding: 15px;">
                 <i class="small material-icons" style="font-size: 1.5rem;">close</i>
             </span>
-            <h4 class="cloudStorage translatable_cloudStorageTitle">Cloud Storage</h4>
+            <h4 class="cloudStorage translatable_localStorageTitle">Cloud Storage</h4>
             <!-- <div id="cloud_askLogin"></div> -->
             <div class="cloud_fileName">
                 <div class="translatable_project_name"

msg/en.js

@@ -52,6 +52,7 @@ Ardublockly.LOCALISED_TEXT = {
     ExportFileContent: "Will export as an *xml file.<br>for you to continuing code nextime",
     ExportSnapContent: "Will export to a *png picture.<br>for your reference",
     cloudStorageTitle: "Save to cloud",
+    localStorageTitle: "Save to local",
     project_name: "the title of works",
     cofirm_btn: "confirm",
     cancel_btn: "cancel",

msg/zh-hans.js

@@ -60,6 +60,7 @@ Ardublockly.LOCALISED_TEXT = {
     ExportFileContent: "导出成XML文件,便于下次继续编程",
     ExportSnapContent: "导出成PNG图片,便于参考",
     cloudStorageTitle: "保存到云端",
+    localStorageTitle: "保存到本地",
     project_name: "作品名称",
     cofirm_btn: "确 定",
     cancel_btn: "取 消",

msg/zh-hant.js

@@ -61,6 +61,7 @@ Ardublockly.LOCALISED_TEXT = {
     ExportFileContent: "導出成XML檔案,便於你的下次繼續編程",
     ExportSnapContent: "導出成PNG圖片,便於參考",
     cloudStorageTitle: "保存到雲端",
+    localStorageTitle: "保存到本地",
     project_name: "作品名稱",
     cofirm_btn: "確 定",
     cancel_btn: "取 消",

python/cocoblockly.css

@@ -786,7 +786,7 @@ footer.page-footer {
     overflow-y: auto;
     opacity: 0;
     position: absolute;
-    z-index: 999;
+    z-index: 9999;
     /* will-change: width, height; */
 }
 
@@ -874,7 +874,7 @@ footer.page-footer {
 }
 
 nav ul a {
-    font-size: 0.9rem;
+    font-size: 14px;
     padding: 0 10px;
 }
 
@@ -1614,39 +1614,46 @@ nav ul li {
     transition: none;
     float: left;
     padding: 0;
+    font-size: 14px;
 }
 
 #button_load span,#button_import_cloud span,#button_save span,#button_save_cloud span{
     color: #222222;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #button_load:hover span,#button_import_cloud:hover span,#button_save:hover span,#button_save_cloud:hover span{
     background-color: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #plugin_download span,#button_upgrade_firmware span,#button_connection_type span{
     color: #222222;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #local_help_ai span,#local_help_extends span,#local_help_error span {
     color: #222222;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #plugin_download:hover span,#button_upgrade_firmware:hover span,#button_connection_type:hover span{
     background-color: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #local_help_ai:hover span,#local_help_extends:hover span,#local_help_error:hover span {
     background-color: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 .sketch_name::-webkit-input-placeholder{
@@ -1665,10 +1672,12 @@ nav ul li {
 #EN span,#TC span,#CN span{
     color: #222222;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 #EN:hover span,#TC:hover span,#CN:hover span{
     background-color: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size: 14px;
 }

python/index.css

@@ -693,7 +693,7 @@ ul, li {
     position: absolute;
     top: 64px;
     width: 177px;
-    z-index: 1000;
+    z-index: 9999;
     background: #fff;
     border-radius: 4px;
     border: 1px solid #e6e6e6;
@@ -732,11 +732,13 @@ ul, li {
 .MouduleBox div a{
     background: #fff !important;
     color: #222222;
+    font-size: 14px;
 }
 
 .MouduleBox div a:hover {
     color: #4A6AFF !important;
     font-family: "微软雅黑";
+    font-size: 14px;
 }
 
 .downbox div {
@@ -747,7 +749,7 @@ ul, li {
     line-height: 40px;
     color: #222222;
     cursor: pointer;
-    font-size: 15px;
+    font-size: 14px;
     text-align: center;
 }
 
@@ -1195,6 +1197,7 @@ table td, th {
     overflow-y: auto;
     opacity: 0;
     z-index: 999;
+    font-size:14px;
  }
 
  #plugin_mac_or_windows li,#connect_method li,#local_help_ai_kit li, #help_extends li{
@@ -1205,22 +1208,26 @@ table td, th {
     line-height: 1.5rem;
     width: 100%;
     text-align: left;
+    font-size:14px;
 }
 
 
 #plugin_mac_or_windows #Mac span, #plugin_mac_or_windows #Windows span, #connect_method #select_connecteds span, #connect_method #no_select_connecteds span{
     color: #222222;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #local_help_ai_kit #ai_kit_0 span, #local_help_ai_kit #ai_kit_1 span, #local_help_ai_kit #ai_kit_2 span, #local_help_ai_kit #ai_kit_3 span{
     color: #222222;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #help_extends #extends_0 span,#help_extends #extends_1 span,#help_extends #extends_2 span {
     color: #222222;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #plugin_mac_or_windows #Mac:hover span, #plugin_mac_or_windows #Windows:hover span, 
@@ -1228,18 +1235,21 @@ table td, th {
     background: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #local_help_ai_kit #ai_kit_0:hover span, #local_help_ai_kit #ai_kit_1:hover span, #local_help_ai_kit #ai_kit_2:hover span, #local_help_ai_kit #ai_kit_3:hover span{
     background: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #help_extends #extends_0:hover span,#help_extends #extends_1:hover span,#help_extends #extends_2:hover span {
     background: #fff;
     color: #4A6AFF;
     font-family: "微软雅黑";
+    font-size:14px;
 }
 
 #Mac img, #Windows img{
@@ -1316,4 +1326,47 @@ table td, th {
    color: #FFFFFF;
    letter-spacing: 0;
 }
+
+.donload_file_cocorobo, .cloud_storage_name_modal {
+    top: 25% !important;
+    width: 360px;
+    max-height: 240px;
+    background-color:  #F0F0F2;
+    box-shadow: 0 0 10px 0 rgba(0,0,0,0.25);
+    border-radius: 3px;
+}
+
+.cloud_fileName {
+    height: 193px;
+    overflow-y: auto;
+    background-color:#F0F0F2;;
+}
+
+.cloudStorage {
+    background:#FFFFFF;
+    border-radius: 3px 3px 0 0;
+    margin-bottom: 0;
+    font-size: 16px;
+    color: #3D3D3D;
+    letter-spacing: 0;
+    padding: 15px;
+    text-align: center;
+}
+
+#donload_file_cloud_input, #cloud_input {
+    background: #FFFFFF;
+    border: 1px solid #CCCCCC;
+    border-radius: 3px;
+    width: 320px;
+    height: 34px;
+    box-shadow: none;
+    padding-left: 10px;
+    font-size: 14px;
+    color: #2D2F33;
+    letter-spacing: 0;
+}
+
+.cancelBtn:focus{
+     background-color: #CCCCCC;
+}
   

python/index.html

@@ -214,7 +214,7 @@
                             <!-- <li id="button_import_cloud">
                                 <span class="translatable_import_cloud_file">导入云端文件</span>
                             </li> -->
-                            <li id="button_save">
+                            <li id="button_save" class='modal-trigger' href="#donload_file_cocorobo">
                                 <span class="translatable_export_local_file">保存到本地</span>
                             </li>
                             <!-- <li id="button_save_cloud">
@@ -321,7 +321,7 @@
                         <div style="margin: 0px 20px 0px 0px;">
                             <input type="text" value="A.I. Module" id="iot_modules" readonly
                                 class="selectMode_input browser-default"
-                                style="font-size: 0.9rem;border: none;width: 145px;">
+                                style="font-size:14px;border: none;width: 145px;">
                             <i id="down" class="down"
                                 style="position: relative;top: -20px;float: right;right: 9px;"></i>
                             <div class="downbox MouduleBox" id="downboxModule" style="top: 64px;">
@@ -341,7 +341,7 @@
                     <li class="Mode_select_box">
                         <div class="ModeSelectBox">
                             <div class="ModeSelect">
-                                <div style="font-size: 0.9rem;">样例 </div>
+                                <div style="font-size: 14px;">样例 </div>
                                 <i class="down" style="position: relative;top: -34px;left: 20px;float: right;"></i>
                                 <div class="downbox ModeBox downbox-style">
                                     <div style="display: block;">
@@ -692,13 +692,13 @@
 
                     <li id="sketch_name-li" style="position: absolute;right: 135px;">
                         <input id="sketch_name" placeholder="请输入作品名称" class="sketch_name"
-                            style="background: #fff;padding: 4px 10px 4px 7px;color:#222222;width:200px;font-style: initial;line-height: 30px;font-size: 15px;"
+                            style="background: #fff;padding: 4px 10px 4px 7px;color:#222222;width:200px;font-style: initial;line-height: 30px;font-size: 14px;"
                             type="text">
                     </li>
 
                     <li id="downloadbutton-li" style="position: absolute;right: 68px;">
                         <button id="downloadbutton" class="translatable_sketch_save"
-                            style="color: #fff;font-weight: 700;background: #4A6AFF;border: none;font-size: 14px;padding:13px 20px 9px 20px;cursor: pointer;">保存</button>
+                            style="color: #fff;font-weight: 700;background: #4A6AFF;border: none;font-size: 14px;padding:13px 20px 9px 20px;cursor: pointer;margin-top: 13px;">保存</button>
                     </li>
 
                     <!-- App Center demo -->
@@ -2072,6 +2072,36 @@
             </div>
         </div>
 
+        <div id="donload_file_cocorobo" class="modal modal_closes donload_file_cocorobo">
+            <div class="modal-content" style="padding: 0;">
+                <span class="modal_close" style="padding: 15px;">
+                    <i class="small material-icons" style="font-size: 1.5rem;">close</i>
+                </span>
+                <h4 class="cloudStorage translatable_localStorageTitle">Cloud Storage</h4>
+                <!-- <div id="cloud_askLogin"></div> -->
+                <div class="cloud_fileName">
+                    <div class="translatable_project_name"
+                        style="font-size: 16px;color: #3D3D3D;letter-spacing: 0;margin-top: 15px;margin-left: 25px;">作品名称
+                    </div>
+                    <div style="text-align: center;margin-top: 15px;">
+                        <input id="donload_file_cloud_input" type="text" placeholder="名称" />
+                    </div>
+                    <div style="margin-top: 20px;text-align: center;">
+                        <button id="donload_file_confirm_btn" type="button"
+                            style="cursor: pointer;background: #4A6AFF;border-radius: 3px;width: 90px;line-height: 36px;border: none;margin-right: 30px;">
+                            <span class="translatable_cofirm_btn"
+                                style="font-size: 14px;color: #FFFFFF;letter-spacing: 0;">确 定</span>
+                        </button>
+                        <button id="donload_file_cancel_btn" class="cancelBtn" type="button"
+                            style="cursor: pointer;border-radius: 3px;width: 90px;line-height: 36px;border: 1px solid #CCCCCC;">
+                            <span class="translatable_cancel_btn" style="font-size: 14px;color:#888888;letter-spacing: 0;">取
+                                消</span>
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>    
+
         <div id="firmware_upgrade_modal" class="modal modal_closes firmware_upgrade_modal">
             <div class="modal-content">
                 <span class="modal_close" style="padding: 15px;">

python/index.js

@@ -332,6 +332,16 @@ window.onload = function () {
   //   document.getElementById('ipAddress').value = 'ws://' + url;
   // }
 
+  if (window.location.search.indexOf("en") > -1) {
+    $("#donload_file_cloud_input").attr("placeholder", "name");
+  }
+  else if (window.location.search.indexOf("zh-hans") > -1) {
+    $("#donload_file_cloud_input").attr("placeholder", "名称");
+  }
+  else {
+    $("#donload_file_cloud_input").attr("placeholder", "名稱");
+  }
+
   $('.dropdown-trigger').dropdown();
   setTimeout(() => $('.modal').modal(), 0);
 
@@ -475,6 +485,16 @@ window.onload = function () {
   $("#python_full_screen").click(() => {
     window.location.href = "../python/?" + window.location.href.split("?")[1];
   })
+
+  $("#donload_file_confirm_btn").click(() => {
+    var title = $("#donload_file_cloud_input").val() != '' ? $("#donload_file_cloud_input").val() : '未命名';
+    downloadXml(title);
+    $("#donload_file_cocorobo").modal("close");
+  });
+
+  $("#donload_file_cancel_btn").click(() => {
+    $("#donload_file_cocorobo").modal("close");
+  });
 }
 
 function styled() {

python/msg/en.js

@@ -52,6 +52,10 @@ Ardublockly.LOCALISED_TEXT = {
     ExportFileContent: "Will export as an *xml file.<br>for you to continuing code nextime",
     ExportSnapContent: "Will export to a *png picture.<br>for your reference",
     cloudStorageTitle: "Cloud Storage",
+    localStorageTitle: "Save to local",
+    project_name: "the title of works",
+    cofirm_btn: "confirm",
+    cancel_btn: "cancel",
     cloudFileOpen: "Open",
     cloudFileSave: "Save",
     cloudFileConfirm: "OK",

python/msg/zh-hans.js

@@ -61,6 +61,10 @@ Ardublockly.LOCALISED_TEXT = {
     ExportFileContent: "导出成XML文件,便于下次继续编程",
     ExportSnapContent: "导出成PNG图片,便于参考",
     cloudStorageTitle: "云端存储",
+    localStorageTitle: "保存到本地",
+    project_name: "作品名称",
+    cofirm_btn: "确 定",
+    cancel_btn: "取 消",
     help_board: "帮助",
     learn_board: "学习",
     files: "文件",

python/msg/zh-hant.js

@@ -62,6 +62,10 @@ Ardublockly.LOCALISED_TEXT = {
     ExportFileContent: "導出成XML檔案,便於你的下次繼續編程",
     ExportSnapContent: "導出成PNG圖片,便於參考",
     cloudStorageTitle: "雲端存儲",
+    localStorageTitle: "保存到本地",
+    project_name: "作品名稱",
+    cofirm_btn: "確 定",
+    cancel_btn: "取 消",
     help_board: "幫助",
     files: "檔案",
     button_text: "下載固件升級包",

python/src/blockly/ardublockly.js

@@ -669,11 +669,11 @@ Blockly.asyncSvgResize = function (a) {
  * Save blocks as XML file. Note that MSIE 11 does not support
  * @param {String} filename 
 */
-function downloadXml() {
+function downloadXml(name) {
     var _xml = blockpy.components.editor.getBlocksFromXml();
     _xml.setAttribute("type", $("#mode")[0].selectedIndex == 1 ? "AI" : "IoT")
     var data = Blockly.Xml.domToPrettyText(_xml);
-    let filename = $('#sketch_name').val();
+    let filename = name || $('#sketch_name').val();
     // Make safe
     filename = filename.replace(/[^a-z0-9]/gi, '_').toLowerCase();
     filename = filename + '.xml'

python/src/toolbar.js

@@ -211,7 +211,7 @@ BlockPyToolbar.prototype.activateToolbar = function () {
     var downloadButton = this.tag.find('.blockpy-toolbar-download');
     downloadButton.click(downloadCode);
 
-    $('#button_save').click(downloadXml);
+    // $('#button_save').click(downloadXml);
     $('#side_button_save').click(downloadXml);
 
     this.tag.find('.blockpy-toolbar-filename-picker label').click(function () {