Skip to content

Commit

Permalink
Merge pull request #103 from bartbutenaers/maybe-later-maybe-never
Browse files Browse the repository at this point in the history 
Upgrade blockly 6.x to 10.x
  • Loading branch information
@bartbutenaers
bartbutenaers authored Oct 17, 2023
2 parents 0f9a727 + 55fcd8e commit d6b9303
Show file tree
Hide file tree
Showing 4 changed files with 56 additions and 17 deletions.
42 changes: 35 additions & 7 deletions blockly.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,8 @@
"blockly-contrib/npm/@blockly___SEPARATOR___plugin-workspace-search/dist/index.js",
"blockly-contrib/npm/@blockly___SEPARATOR___zoom-to-fit/dist/index.js",
"blockly-contrib/npm/@blockly___SEPARATOR___workspace-backpack/dist/index.js",
"blockly-contrib/npm/@blockly___SEPARATOR___workspace-backpack/dist/index.js"
"blockly-contrib/npm/@blockly___SEPARATOR___toolbox-search/dist/index.js",
"blockly-contrib/npm/@blockly___SEPARATOR___workspace-minimap/dist/index.js"
]
});

Expand Down Expand Up @@ -209,7 +210,17 @@
}
});
});


// Add a 'Search' category at the end, which is linked automatically by Blockly to the toolbox-search plugin.
const searchElement = document.createElementNS("http://www.w3.org/1999/xhtml", "category");
searchElement.setAttribute("name", "Search");
searchElement.setAttribute("kind", "search");
// When the search input field is clicked, a blue background appears.
// I tried to apply as color the same color as the background color (grey), but it doesn't help.
// The same happens in the official plugin demo (https://google.github.io/blockly-samples/plugins/toolbox-search/test/index.html)
searchElement.setAttribute("colour", "#B2B2B"); // Same color as the background
node.toolboxXmlDocument.documentElement.appendChild(searchElement);

// Create the workspace as soon as the last script has been loaded.
// This is possible because the scripts are loaded sequentially (via async = false)
if (node.workspace) {
Expand All @@ -231,6 +242,7 @@
var showTrashcan = true;
var allowComments = true;
var showZoomControl = true;
var showMiniMap = true;
var horizontalLayout = false;
var enableBackPack = false;
var toolboxPosition = "start";
Expand All @@ -246,6 +258,7 @@
showTrashcan = configNode.showTrashcan;
allowComments = configNode.allowComments;
showZoomControl = configNode.showZoomControl;
showMiniMap = configNode.showMiniMap;
renderer = configNode.renderer;
enableBackPack = configNode.enableBackPack;
configNodeId = configNode.id;
Expand Down Expand Up @@ -354,7 +367,14 @@
node.zoomToFit = new ZoomToFitControl(node.workspace);
node.zoomToFit.init();
}


// Only show the minimap when the (fullscreen) tray is open, because the minimap is too big to fit into the node's config screen.
if (showMiniMap && node.isTrayOpen) {
// Enable the mini map on the workspace (via the workspace-minimap plugin)
node.minimap = new PositionedMinimap(node.workspace);
node.minimap.init();
}

if (enableBackPack) {
// Enable the backpack icon on the workspace (via the workspace-backpack plugin)
node.backpack = new Backpack(node.workspace);
Expand All @@ -379,7 +399,7 @@

try {
// Load the workspace content again from the specified XML string
var dom = Blockly.Xml.textToDom(workspaceXml);
var dom = Blockly.utils.xml.textToDom(workspaceXml);
Blockly.Xml.domToWorkspace(dom, node.workspace);
}
catch(err) {
Expand Down Expand Up @@ -439,7 +459,13 @@
node.zoomToFit.dispose();
node.zoomToFit = null;
}


// When previously a workspace-minimap plugin has been activated, then clean it up
if (node.minimap) {
node.minimap.dispose();
node.minimap = null;
}

// When previously a workspace-backpack plugin has been activated (for the previous workspace instance), then clean it up
if (node.backpack) {
node.backpack.dispose();
Expand Down Expand Up @@ -573,6 +599,7 @@

node.librariesLoaded = false;
node.previousEnableBackPack = "none";
node.isTrayOpen = false;

$( "#node-input-outputs" ).spinner({
min:1,
Expand Down Expand Up @@ -743,7 +770,7 @@
text: RED._("common.label.cancel"),
click: function() {
var loadedXml = node.loadedXml;

node.isTrayOpen = false;
//Jeff: re-create workspace after RED.tray.close finished
RED.tray.close(() => createWorkspace(node, loadedXml));
}
Expand All @@ -755,7 +782,7 @@
click: function() {
var dom = Blockly.Xml.workspaceToDom(node.workspace);
var loadedXml = Blockly.Xml.domToPrettyText(dom);

node.isTrayOpen = false;
RED.tray.close(() => createWorkspace(node, loadedXml));
}
}
Expand Down Expand Up @@ -797,6 +824,7 @@

}
}
node.isTrayOpen = true;
RED.tray.show(trayOptions);
}
}
Expand Down
12 changes: 10 additions & 2 deletions blockly_config.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@
// need to replace that separator by the string "___SEPARATOR___". Otherwise the NGinx webserver installed together
// with HomeAssistant will cause the Express.js routes to be messed up.
// See https://github.com/bartbutenaers/node-red-contrib-blockly/issues/101
"blockly-contrib/npm/@blockly___SEPARATOR___field-date/dist/date_compressed.js",
"blockly-contrib/npm/@blockly___SEPARATOR___field-date/dist/index.js",
"blockly-contrib/npm/node-red-contrib-blockly/lib/datetime/dateTimeBlocksCodeGen.js",
"blockly-contrib/npm/node-red-contrib-blockly/lib/datetime/dateTimeBlocksDefs.js",
"blockly-contrib/npm/node-red-contrib-blockly/lib/datetime/toolbox.xml",
Expand Down Expand Up @@ -103,6 +103,7 @@
showTrashcan: {value: true},
allowComments: {value: true},
showZoomControl: {value: true},
showMiniMap: {value: true},
enableBackPack: {value: false},
// The backpackContents will be set by the Blockly nodes, but need to be defined here (otherwise it won't be persisted by Node-RED)
backpackContents: {value: []},
Expand Down Expand Up @@ -261,6 +262,11 @@
<input type='checkbox' id='node-config-input-showZoomControl' style='width:auto ;border:none; vertical-align:baseline;' placeholder='0'>
<span for='node-config-input-showZoomControl'> Show zoom control icons in workspace</span>
</div>
<div class="form-row">
<label for='node-config-input-showMiniMap'><i class='fa fa-map'></i> MiniMap</label>
<input type='checkbox' id='node-config-input-showMiniMap' style='width:auto ;border:none; vertical-align:baseline;' placeholder='0'>
<span for='node-config-input-showMiniMap'> Show a mini map in (expanded) workspace</span>
</div>
<div class="form-row">
<label for='node-config-input-enableBackPack'><i class='fa fa-briefcase'></i> Backpack</label>
<input type='checkbox' id='node-config-input-enableBackPack' style='width:auto ;border:none; vertical-align:baseline;' placeholder='0'>
Expand Down Expand Up @@ -353,6 +359,8 @@
If activated, comments can be added to a block (via the right-click context menu).</p>
<p><strong>Show zoom control icons in workspace:</strong><br/>
If activated, zoom control icons will be displayed in the Blockly workspace.</p>
<p><strong>Show mini map in workspace:</strong><br/>
If activated, a mini map will be displayed in the Blockly workspace (when extended to fullscreen).</p>
<p><strong>Show backpack icon in workspace:</strong><br/>
If activated, a backpack icon will be displayed in the Blockly workspace. Via this way you can manage your favorite blocks.</p>
<p><strong>Categories:</strong><br/>
Expand All @@ -369,4 +377,4 @@
<li><i>Thrasos:</i></li>
<li><i>Zelos:</i> A Scratch-like look and feel.</li>
</ul></p>
</script>
</script>
4 changes: 2 additions & 2 deletions lib/nodered/nodeRedBlocksDefs.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -242,10 +242,10 @@ Blockly.Blocks['node_send'] = {

var insideLoop = false;
var block = this;

// Check whether this node_send block is (nested) inside a loop, by searching up the hierarchy to the root block
do {
if(Blockly.Constants.Loops.CONTROL_FLOW_IN_LOOP_CHECK_MIXIN.LOOP_TYPES.indexOf(block.type) != -1) {
if(Blockly.libraryBlocks.loops.loopTypes.has(block.type)) {
insideLoop = true;
break;
}
Expand Down
15 changes: 9 additions & 6 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,16 @@
{
"name" : "node-red-contrib-blockly",
"version" : "2.0.1",
"version" : "2.2.0",
"description" : "A Node Red node for visual programming a function using Blockly",
"dependencies": {
"blockly": "^6.20210701.0",
"@blockly/field-date": "^4.2.14",
"@blockly/plugin-workspace-search": "^4.0.2",
"@blockly/zoom-to-fit": "^2.0.2",
"@blockly/workspace-backpack": "^1.0.2"
"blockly": "^10.1.3",
"@blockly/field-date": "^8.0.3",
"@blockly/plugin-workspace-search": "^8.0.6",
"@blockly/zoom-to-fit": "^5.0.4",
"@blockly/workspace-backpack": "^5.2.0",
"@blockly/plugin-workspace-search": "^8.0.4",
"@blockly/toolbox-search": "^1.1.6",
"@blockly/workspace-minimap": "^0.1.0"
},
"author": {
"name": "Bart Butenaers"
Expand Down

0 comments on commit d6b9303

Please sign in to comment.