How to change a blocklyIcon to an image field?
167 views
Skip to first unread message
fu6...@gmail.com
Aug 14, 2022, 12:19:30 AM8/14/22
to Blockly
Hi, group,
My project
https://fustyles.github.io/webduino/SpBlocklyJS/index.html?lang=en
blocks.procedures_callnoreturn
https://github.com/fustyles/webduino/blob/bc033dcdaca10466fe5c72c2af7a6b40905f91d3/SpBlocklyJS/js/blocks_compressed.js#L136
myMutator
https://github.com/fustyles/webduino/blob/bc033dcdaca10466fe5c72c2af7a6b40905f91d3/SpBlocklyJS/js/blockly_compressed.js#L2489
I made a custom mutator to preview the procedure blocks. I want to change the blocklyIcon to an image field. How should I do it?
Any help would be much appreciated.
My project
https://fustyles.github.io/webduino/SpBlocklyJS/index.html?lang=en
blocks.procedures_callnoreturn
https://github.com/fustyles/webduino/blob/bc033dcdaca10466fe5c72c2af7a6b40905f91d3/SpBlocklyJS/js/blocks_compressed.js#L136
myMutator
https://github.com/fustyles/webduino/blob/bc033dcdaca10466fe5c72c2af7a6b40905f91d3/SpBlocklyJS/js/blockly_compressed.js#L2489
fu6...
fu6...@gmail.com
Aug 14, 2022, 5:35:05 AM8/14/22
to Blockly
Hi, I did it.
module$exports$Blockly$libraryBlocks$procedures.blocks.procedures_callreturn=Object.assign({},
module$contents$Blockly$libraryBlocks$procedures_PROCEDURE_CALL_COMMON,{
init:function(){
this.appendDummyInput("TOPROW").appendField("","NAME");
this.setInputsInline(true);
this.setOutput(!0);
this.setStyle("procedure_blocks");
this.setHelpUrl($.module$exports$Blockly$Msg.Msg.PROCEDURES_CALLRETURN_HELPURL);
this.arguments_=[];
this.argumentVarModels_=[];
this.quarkConnections_={};
this.setMutator(new Blockly.myMutator([]));
this.quarkIds_=null;this.previousEnabledState_=!0
},defType_:"procedures_defreturn"
,myWorkspaceInitial: function(myWorkspace) {
var xml = Blockly.Xml.workspaceToDom(Blockly.getMainWorkspace());
xml = new XMLSerializer().serializeToString(xml);
xml = new DOMParser().parseFromString(xml,"text/xml").firstChild.childNodes;
for (var i=0;i<xml.length;i++) {
if (xml[i].getAttribute("type")=="procedures_defreturn") {
for (var j=0;j<xml[i].childNodes.length;j++) {
if (xml[i].childNodes[j].textContent==this.getFieldValue("NAME")) {
if (xml[i]) {
xml = Blockly.Xml.domToPrettyText(xml[i]);
xml = Blockly.Xml.textToDom('<xml xmlns="https://developers.google.com/blockly/xml">'+xml.replace("x=","xx=").replace("y=","yy=")+'</xml>');
myWorkspace.clear();
Blockly.Xml.domToWorkspace(xml, myWorkspace);
break;
}
}
}
}
}
},myWorkspaceChanged: function(myWorkspace) {
}
});
Blockly.Generator.prototype.myMutatorWorkspaceToCode=function(a){var b=[];Blockly.Arduino.init(a);a=a.getTopBlocks(!0);for(var c=0,d;d=a[c];c++){var e=Blockly.Arduino.blockToCode(d);Array.isArray(e)&&(e=e[0]);e&&(d.outputConnection&&(e=Blockly.Arduino.scrubNakedValue(e),Blockly.Arduino.STATEMENT_PREFIX&&!d.suppressPrefixSuffix&&(e=Blockly.Arduino.injectId(Blockly.Arduino.STATEMENT_PREFIX,d)+e),Blockly.Arduino.STATEMENT_SUFFIX&&!d.suppressPrefixSuffix&&(e+=Blockly.Arduino.injectId(Blockly.Arduino.STATEMENT_SUFFIX,d))),b.push(e))}b=b.join("\n");b=Blockly.Arduino.finish(b);b=b.replace(/^\s+\n/,"");b=b.replace(/\n\s+$/,"\n");return b=b.replace(/[ \t]+\n/g,"\n")};
Blockly.myMutator=function(a){Blockly.myMutator.superClass_.constructor.call(this,null);this.quarkNames_=a};
Blockly.utils.object.inherits(Blockly.myMutator,Blockly.Icon);
Blockly.myMutator.prototype.workspace_=null;
Blockly.myMutator.prototype.workspaceWidth_=0;
Blockly.myMutator.prototype.workspaceHeight_=0;
Blockly.myMutator.prototype.setBlock=function(a){this.block_=a};
Blockly.myMutator.prototype.getWorkspace=function(){return this.workspace_};
Blockly.myMutator.prototype.drawIcon_=function(a){
a.innerHTML = '<image height="20px" width="20px" alt="[object Object]" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAABmJLR0QA/wD/AP+gvaeTAAADyUlEQVRIieXVS0xcVRzH8e85l3nAUBCsaZHUqrDQAsWZdGekj8RXVzR10qUwJERXLtTEREPARle6Nl3AMEljGmnorlZjBNpoWzVAQoFKIRFqB9raymNGZu7ce/8uhiG8hOFRY+JvdW/yP+dz/+feew7836KyKQoGg7k+n++w1vopx3GKtNZ/ish4LBa73NHRMb/jcENDQ7lt281KqRNA3holfwGdjuM0RyKRsR2BQ6HQ+yLyCeDClYvaW4EqfBI8+ZCMITNRZOoGpBIAJvBhOBz+bFtwfX39GaCRHA/6wHEoq0EZ7lV1YpvIaDcyfAmsJMCZcDj8VjawsVanwAfkFaFr3kGVVqN0ukwr8OQoHAEBlDZQu8vQJZXI5ABYiUOBQCDW19d3dVMdh0KhZ0VkmByPWx99L720wO5cRcUTBnvyFEql0btxYfC+zR/zkh48cwe763OwkqbWuqK1tXV0PVgvvXEc52PArQ8cX0TLizTH9ueQsISe2xYXx1L0TFgkLOHY/hzKixamKCxFP/8agFtEmjbqeBEOBoO5SqlaXLlQVrNYUJqvuBa1uR61uRsX5sx0t9ejNteiNvsKljx7+RFweRGRk42NjWv9Bavh/Pz8GsCnSiqXfUg9t20mZp01B0/MOnSNW4v3ynCj91YC5Jmm+WJWMPA0AAtLvNVIQUl6Yq2fyRYuBlBu37Zg5d2VfgCRx7OClVIPAEjGtgWTnMtc3c8KFpFxAJmJbsvNjM/MtyEci8UuA3GZuoHY5tZU20SmhgBiwJWs4IVT5gKpBDLavSVXbn0PqXmAzvb29kRWMIBhGE1AUoYvwcydzaHTv+Pc/BbAXNiI1s2yvbq3t3fa7/cncOxXZHIAvec58BZkhcoPX4AZR0TaI5FIZFMwQH9//49+v78EK3FIJn5CKQVF+xYPimWxTWTkO5xfzmZQWylV5ff7B/r7+39dD17vPH5XRD4F3Li86R2psAQ8uyA5t3AeD2XeqQmEgTcBbyJlpaYTqdNfnz93OuuOM+nr67saCAS+VEoVY1vlMht1y70RZHIAuTcCs5PgWHHgnGEYb7S1tZ0NBAI/z5vWqYmHc+75ZOrowepqbg0p9myq46Wpq6vzAi+R3laLgYfAb8CVlV/vyyeCLXPzZpNIevJin6f5YudXLVuCN5tXTwRbZjbA/3Gpt5Oxm0PdFZVVRtJ2DguQSNlHVi77I4EX8K6KqoOupGXXZPCqF6qjo8ODvbBiA9npfHOh46PCPE+TUgqvy3igE/Hzj9JblddPnnq7trb2sX8V/c/lbwo9q8gJVNowAAAAAElFTkSuQmCC" style="cursor: pointer;"></image>';
};
Blockly.myMutator.prototype.iconClick_=function(a){this.block_.isEditable()&&Blockly.Icon.prototype.iconClick_.call(this,a)};
Blockly.myMutator.prototype.createEditor_=function(){
this.svgDialog_=Blockly.utils.dom.createSvgElement(Blockly.utils.Svg.SVG,{x:Blockly.Bubble.BORDER_WIDTH,y:Blockly.Bubble.BORDER_WIDTH},null);
if(this.quarkNames_.length)
for(var a=Blockly.utils.xml.createElement("xml"),b=0,c;c=this.quarkNames_[b];b++){
var d=Blockly.utils.xml.createElement("block");
d.setAttribute("type",c);
a.appendChild(d)
}
else
a=null;
b=new Blockly.Options(
{
disable:!1
,parentWorkspace:this.block_.workspace
,media:this.block_.workspace.options.pathToMedia
,rtl:this.block_.RTL
,horizontalLayout:!1
,renderer:this.block_.workspace.options.renderer
,rendererOverrides:this.block_.workspace.options.rendererOverrides
}
);
b.toolboxPosition=this.block_.RTL?Blockly.utils.toolbox.Position.RIGHT:Blockly.utils.toolbox.Position.LEFT;
if(c=!!a)
b.languageTree=Blockly.utils.toolbox.convertToolboxDefToJson(a);
this.workspace_=new Blockly.WorkspaceSvg(b);
this.workspace_.isMutator=!0;
a=c?this.workspace_.addFlyout(Blockly.utils.Svg.G):null;
b=this.workspace_.createDom("blocklyMutatorBackground");
a&&b.insertBefore(a,this.workspace_.svgBlockCanvas_);
this.svgDialog_.appendChild(b);
return this.svgDialog_
};
Blockly.myMutator.prototype.updateEditable=function(){
Blockly.myMutator.superClass_.updateEditable.call(this);
this.block_.isInFlyout||(this.block_.isEditable()?this.iconGroup_&&Blockly.utils.dom.removeClass(this.iconGroup_,"blocklyIconGroupReadonly"):(this.setVisible(!1),this.iconGroup_&&Blockly.utils.dom.addClass(this.iconGroup_,"blocklyIconGroupReadonly")))
};
Blockly.myMutator.prototype.resizeBubble_=function(){
var a=2*Blockly.Bubble.BORDER_WIDTH,b=this.workspace_.getCanvas().getBBox(),c=b.width+b.x,d=b.height+3*a,e=this.workspace_.getFlyout();
if(e){var f=e.getWorkspace().getMetricsManager().getScrollMetrics();d=Math.max(d,f.height+20);c+=e.getWidth()}
this.block_.RTL&&(c=-b.x);c+=3*a;if(Math.abs(this.workspaceWidth_-c)>a||Math.abs(this.workspaceHeight_-d)>a)this.workspaceWidth_=c,this.workspaceHeight_=d,this.bubble_.setBubbleSize(c+a,d+a),this.svgDialog_.setAttribute("width",this.workspaceWidth_),this.svgDialog_.setAttribute("height",this.workspaceHeight_),this.workspace_.setCachedParentSvgSize(this.workspaceWidth_,this.workspaceHeight_);this.block_.RTL&&(a="translate("+this.workspaceWidth_+",0)",this.workspace_.getCanvas().setAttribute("transform",a));this.workspace_.resize()
};
Blockly.myMutator.prototype.onBubbleMove_=function(){this.workspace_&&this.workspace_.recordDragTargets()};
Blockly.myMutator.prototype.setVisible=function(a){
if(a!=this.isVisible())
if(Blockly.Events.fire(new (Blockly.Events.get(Blockly.Events.BUBBLE_OPEN))(this.block_,a,"mutator")),a){
this.bubble_=new Blockly.Bubble(this.block_.workspace,this.createEditor_(),this.block_.pathObject.svgPath,this.iconXY_,null,null);
this.bubble_.setSvgId(this.block_.id);
this.bubble_.registerMoveEvent(this.onBubbleMove_.bind(this));
var b=this.workspace_.options.languageTree;
a=this.workspace_.getFlyout();
b&&(a.init(this.workspace_),a.show(b));
this.resizeBubble_();
this.workspace_.addChangeListener(this.workspaceChanged_.bind(this));
this.applyColour()
this.workspace_.render();
this.block_.myWorkspaceInitial(this.workspace_);
}
else
this.svgDialog_=null,this.workspace_.dispose(),this.rootBlock_=this.workspace_=null,this.bubble_.dispose(),this.bubble_=null,this.workspaceHeight_=this.workspaceWidth_=0,this.sourceListener_&&(this.block_.workspace.removeChangeListener(this.sourceListener_),this.sourceListener_=null)
};
Blockly.myMutator.prototype.workspaceChanged_=function(a){if(!(a.isUiEvent||a.type==Blockly.Events.CHANGE&&"disabled"==a.element)){
if(!this.workspace_.isDragging()){a=this.workspace_.getTopBlocks(!1);for(var b=0,c;c=a[b];b++){var d=c.getRelativeToSurfaceXY();20>d.y&&c.moveBy(0,20-d.y);if(c.RTL){var e=-20,f=this.workspace_.getFlyout();f&&(e-=f.getWidth());d.x>e&&c.moveBy(e-d.x,0)}else 20>d.x&&c.moveBy(20-d.x,0)}}
Blockly.Events.setGroup(!0);
c=this.block_;
c.rendered=!1;
c.rendered=b;
c.initSvg();
c.rendered&&c.render();
this.workspace_.isDragging()||this.resizeBubble_();
Blockly.Events.setGroup(!1)
this.block_.myWorkspaceChanged(this.workspace_);
}
};
Blockly.myMutator.prototype.dispose=function(){this.block_.mutator=null;Blockly.Icon.prototype.dispose.call(this)};
Blockly.myMutator.prototype.updateBlockStyle=function(){var a=this.workspace_;if(a&&a.getAllBlocks(!1)){for(var b=a.getAllBlocks(!1),c=0,d;d=b[c];c++)d.setStyle(d.getStyleName());if(c=a.getFlyout())for(a=c.workspace_.getAllBlocks(!1),c=0;d=a[c];c++)d.setStyle(d.getStyleName())}};
module$exports$Blockly$libraryBlocks$procedures.blocks.procedures_callnoreturn=Object.assign({},
module$contents$Blockly$libraryBlocks$procedures_PROCEDURE_CALL_COMMON,{
init:function(){
this.appendDummyInput("TOPROW").appendField("","NAME");
this.setInputsInline(true);
this.setPreviousStatement(!0);
this.setNextStatement(!0);
this.setStyle("procedure_blocks");
this.setHelpUrl($.module$exports$Blockly$Msg.Msg.PROCEDURES_CALLNORETURN_HELPURL);
this.arguments_=[];
this.argumentVarModels_=[];
this.quarkConnections_={};
this.quarkIds_=null;
this.setMutator(new Blockly.myMutator([]));
this.previousEnabledState_=!0
},defType_:"procedures_defnoreturn"
,myWorkspaceInitial: function(myWorkspace) {
var xml = Blockly.Xml.workspaceToDom(Blockly.getMainWorkspace());
xml = new XMLSerializer().serializeToString(xml);
xml = new DOMParser().parseFromString(xml,"text/xml").firstChild.childNodes;
for (var i=0;i<xml.length;i++) {
if (xml[i].getAttribute("type")=="procedures_defnoreturn") {
for (var j=0;j<xml[i].childNodes.length;j++) {
if (xml[i].childNodes[j].textContent==this.getFieldValue("NAME")) {
if (xml[i]) {
xml = Blockly.Xml.domToPrettyText(xml[i]);
xml = Blockly.Xml.textToDom('<xml xmlns="https://developers.google.com/blockly/xml">'+xml.replace("x=","xx=").replace("y=","yy=")+'</xml>');
myWorkspace.clear();
Blockly.Xml.domToWorkspace(xml, myWorkspace);
break;
}
}
}
}
}
},myWorkspaceChanged: function(myWorkspace) {
}
});
module$contents$Blockly$libraryBlocks$procedures_PROCEDURE_CALL_COMMON,{
init:function(){
this.appendDummyInput("TOPROW").appendField("","NAME");
this.setInputsInline(true);
this.setPreviousStatement(!0);
this.setNextStatement(!0);
this.setStyle("procedure_blocks");
this.setHelpUrl($.module$exports$Blockly$Msg.Msg.PROCEDURES_CALLNORETURN_HELPURL);
this.arguments_=[];
this.argumentVarModels_=[];
this.quarkConnections_={};
this.quarkIds_=null;
this.setMutator(new Blockly.myMutator([]));
this.previousEnabledState_=!0
},defType_:"procedures_defnoreturn"
,myWorkspaceInitial: function(myWorkspace) {
var xml = Blockly.Xml.workspaceToDom(Blockly.getMainWorkspace());
xml = new XMLSerializer().serializeToString(xml);
xml = new DOMParser().parseFromString(xml,"text/xml").firstChild.childNodes;
for (var i=0;i<xml.length;i++) {
if (xml[i].getAttribute("type")=="procedures_defnoreturn") {
for (var j=0;j<xml[i].childNodes.length;j++) {
if (xml[i].childNodes[j].textContent==this.getFieldValue("NAME")) {
if (xml[i]) {
xml = Blockly.Xml.domToPrettyText(xml[i]);
xml = Blockly.Xml.textToDom('<xml xmlns="https://developers.google.com/blockly/xml">'+xml.replace("x=","xx=").replace("y=","yy=")+'</xml>');
myWorkspace.clear();
Blockly.Xml.domToWorkspace(xml, myWorkspace);
break;
}
}
}
}
}
},myWorkspaceChanged: function(myWorkspace) {
}
});
module$exports$Blockly$libraryBlocks$procedures.blocks.procedures_callreturn=Object.assign({},
module$contents$Blockly$libraryBlocks$procedures_PROCEDURE_CALL_COMMON,{
init:function(){
this.appendDummyInput("TOPROW").appendField("","NAME");
this.setInputsInline(true);
this.setOutput(!0);
this.setStyle("procedure_blocks");
this.setHelpUrl($.module$exports$Blockly$Msg.Msg.PROCEDURES_CALLRETURN_HELPURL);
this.arguments_=[];
this.argumentVarModels_=[];
this.quarkConnections_={};
this.setMutator(new Blockly.myMutator([]));
this.quarkIds_=null;this.previousEnabledState_=!0
},defType_:"procedures_defreturn"
,myWorkspaceInitial: function(myWorkspace) {
var xml = Blockly.Xml.workspaceToDom(Blockly.getMainWorkspace());
xml = new XMLSerializer().serializeToString(xml);
xml = new DOMParser().parseFromString(xml,"text/xml").firstChild.childNodes;
for (var i=0;i<xml.length;i++) {
if (xml[i].getAttribute("type")=="procedures_defreturn") {
for (var j=0;j<xml[i].childNodes.length;j++) {
if (xml[i].childNodes[j].textContent==this.getFieldValue("NAME")) {
if (xml[i]) {
xml = Blockly.Xml.domToPrettyText(xml[i]);
xml = Blockly.Xml.textToDom('<xml xmlns="https://developers.google.com/blockly/xml">'+xml.replace("x=","xx=").replace("y=","yy=")+'</xml>');
myWorkspace.clear();
Blockly.Xml.domToWorkspace(xml, myWorkspace);
break;
}
}
}
}
}
},myWorkspaceChanged: function(myWorkspace) {
}
});
//myMutator
Blockly.Generator.prototype.myMutatorWorkspaceToCode=function(a){var b=[];Blockly.Arduino.init(a);a=a.getTopBlocks(!0);for(var c=0,d;d=a[c];c++){var e=Blockly.Arduino.blockToCode(d);Array.isArray(e)&&(e=e[0]);e&&(d.outputConnection&&(e=Blockly.Arduino.scrubNakedValue(e),Blockly.Arduino.STATEMENT_PREFIX&&!d.suppressPrefixSuffix&&(e=Blockly.Arduino.injectId(Blockly.Arduino.STATEMENT_PREFIX,d)+e),Blockly.Arduino.STATEMENT_SUFFIX&&!d.suppressPrefixSuffix&&(e+=Blockly.Arduino.injectId(Blockly.Arduino.STATEMENT_SUFFIX,d))),b.push(e))}b=b.join("\n");b=Blockly.Arduino.finish(b);b=b.replace(/^\s+\n/,"");b=b.replace(/\n\s+$/,"\n");return b=b.replace(/[ \t]+\n/g,"\n")};
Blockly.myMutator=function(a){Blockly.myMutator.superClass_.constructor.call(this,null);this.quarkNames_=a};
Blockly.utils.object.inherits(Blockly.myMutator,Blockly.Icon);
Blockly.myMutator.prototype.workspace_=null;
Blockly.myMutator.prototype.workspaceWidth_=0;
Blockly.myMutator.prototype.workspaceHeight_=0;
Blockly.myMutator.prototype.setBlock=function(a){this.block_=a};
Blockly.myMutator.prototype.getWorkspace=function(){return this.workspace_};
Blockly.myMutator.prototype.drawIcon_=function(a){
a.innerHTML = '<image height="20px" width="20px" alt="[object Object]" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAABmJLR0QA/wD/AP+gvaeTAAADyUlEQVRIieXVS0xcVRzH8e85l3nAUBCsaZHUqrDQAsWZdGekj8RXVzR10qUwJERXLtTEREPARle6Nl3AMEljGmnorlZjBNpoWzVAQoFKIRFqB9raymNGZu7ce/8uhiG8hOFRY+JvdW/yP+dz/+feew7836KyKQoGg7k+n++w1vopx3GKtNZ/ish4LBa73NHRMb/jcENDQ7lt281KqRNA3holfwGdjuM0RyKRsR2BQ6HQ+yLyCeDClYvaW4EqfBI8+ZCMITNRZOoGpBIAJvBhOBz+bFtwfX39GaCRHA/6wHEoq0EZ7lV1YpvIaDcyfAmsJMCZcDj8VjawsVanwAfkFaFr3kGVVqN0ukwr8OQoHAEBlDZQu8vQJZXI5ABYiUOBQCDW19d3dVMdh0KhZ0VkmByPWx99L720wO5cRcUTBnvyFEql0btxYfC+zR/zkh48cwe763OwkqbWuqK1tXV0PVgvvXEc52PArQ8cX0TLizTH9ueQsISe2xYXx1L0TFgkLOHY/hzKixamKCxFP/8agFtEmjbqeBEOBoO5SqlaXLlQVrNYUJqvuBa1uR61uRsX5sx0t9ejNteiNvsKljx7+RFweRGRk42NjWv9Bavh/Pz8GsCnSiqXfUg9t20mZp01B0/MOnSNW4v3ynCj91YC5Jmm+WJWMPA0AAtLvNVIQUl6Yq2fyRYuBlBu37Zg5d2VfgCRx7OClVIPAEjGtgWTnMtc3c8KFpFxAJmJbsvNjM/MtyEci8UuA3GZuoHY5tZU20SmhgBiwJWs4IVT5gKpBDLavSVXbn0PqXmAzvb29kRWMIBhGE1AUoYvwcydzaHTv+Pc/BbAXNiI1s2yvbq3t3fa7/cncOxXZHIAvec58BZkhcoPX4AZR0TaI5FIZFMwQH9//49+v78EK3FIJn5CKQVF+xYPimWxTWTkO5xfzmZQWylV5ff7B/r7+39dD17vPH5XRD4F3Li86R2psAQ8uyA5t3AeD2XeqQmEgTcBbyJlpaYTqdNfnz93OuuOM+nr67saCAS+VEoVY1vlMht1y70RZHIAuTcCs5PgWHHgnGEYb7S1tZ0NBAI/z5vWqYmHc+75ZOrowepqbg0p9myq46Wpq6vzAi+R3laLgYfAb8CVlV/vyyeCLXPzZpNIevJin6f5YudXLVuCN5tXTwRbZjbA/3Gpt5Oxm0PdFZVVRtJ2DguQSNlHVi77I4EX8K6KqoOupGXXZPCqF6qjo8ODvbBiA9npfHOh46PCPE+TUgqvy3igE/Hzj9JblddPnnq7trb2sX8V/c/lbwo9q8gJVNowAAAAAElFTkSuQmCC" style="cursor: pointer;"></image>';
};
Blockly.myMutator.prototype.iconClick_=function(a){this.block_.isEditable()&&Blockly.Icon.prototype.iconClick_.call(this,a)};
Blockly.myMutator.prototype.createEditor_=function(){
this.svgDialog_=Blockly.utils.dom.createSvgElement(Blockly.utils.Svg.SVG,{x:Blockly.Bubble.BORDER_WIDTH,y:Blockly.Bubble.BORDER_WIDTH},null);
if(this.quarkNames_.length)
for(var a=Blockly.utils.xml.createElement("xml"),b=0,c;c=this.quarkNames_[b];b++){
var d=Blockly.utils.xml.createElement("block");
d.setAttribute("type",c);
a.appendChild(d)
}
else
a=null;
b=new Blockly.Options(
{
disable:!1
,parentWorkspace:this.block_.workspace
,media:this.block_.workspace.options.pathToMedia
,rtl:this.block_.RTL
,horizontalLayout:!1
,renderer:this.block_.workspace.options.renderer
,rendererOverrides:this.block_.workspace.options.rendererOverrides
}
);
b.toolboxPosition=this.block_.RTL?Blockly.utils.toolbox.Position.RIGHT:Blockly.utils.toolbox.Position.LEFT;
if(c=!!a)
b.languageTree=Blockly.utils.toolbox.convertToolboxDefToJson(a);
this.workspace_=new Blockly.WorkspaceSvg(b);
this.workspace_.isMutator=!0;
a=c?this.workspace_.addFlyout(Blockly.utils.Svg.G):null;
b=this.workspace_.createDom("blocklyMutatorBackground");
a&&b.insertBefore(a,this.workspace_.svgBlockCanvas_);
this.svgDialog_.appendChild(b);
return this.svgDialog_
};
Blockly.myMutator.prototype.updateEditable=function(){
Blockly.myMutator.superClass_.updateEditable.call(this);
this.block_.isInFlyout||(this.block_.isEditable()?this.iconGroup_&&Blockly.utils.dom.removeClass(this.iconGroup_,"blocklyIconGroupReadonly"):(this.setVisible(!1),this.iconGroup_&&Blockly.utils.dom.addClass(this.iconGroup_,"blocklyIconGroupReadonly")))
};
Blockly.myMutator.prototype.resizeBubble_=function(){
var a=2*Blockly.Bubble.BORDER_WIDTH,b=this.workspace_.getCanvas().getBBox(),c=b.width+b.x,d=b.height+3*a,e=this.workspace_.getFlyout();
if(e){var f=e.getWorkspace().getMetricsManager().getScrollMetrics();d=Math.max(d,f.height+20);c+=e.getWidth()}
this.block_.RTL&&(c=-b.x);c+=3*a;if(Math.abs(this.workspaceWidth_-c)>a||Math.abs(this.workspaceHeight_-d)>a)this.workspaceWidth_=c,this.workspaceHeight_=d,this.bubble_.setBubbleSize(c+a,d+a),this.svgDialog_.setAttribute("width",this.workspaceWidth_),this.svgDialog_.setAttribute("height",this.workspaceHeight_),this.workspace_.setCachedParentSvgSize(this.workspaceWidth_,this.workspaceHeight_);this.block_.RTL&&(a="translate("+this.workspaceWidth_+",0)",this.workspace_.getCanvas().setAttribute("transform",a));this.workspace_.resize()
};
Blockly.myMutator.prototype.onBubbleMove_=function(){this.workspace_&&this.workspace_.recordDragTargets()};
Blockly.myMutator.prototype.setVisible=function(a){
if(a!=this.isVisible())
if(Blockly.Events.fire(new (Blockly.Events.get(Blockly.Events.BUBBLE_OPEN))(this.block_,a,"mutator")),a){
this.bubble_=new Blockly.Bubble(this.block_.workspace,this.createEditor_(),this.block_.pathObject.svgPath,this.iconXY_,null,null);
this.bubble_.setSvgId(this.block_.id);
this.bubble_.registerMoveEvent(this.onBubbleMove_.bind(this));
var b=this.workspace_.options.languageTree;
a=this.workspace_.getFlyout();
b&&(a.init(this.workspace_),a.show(b));
this.resizeBubble_();
this.workspace_.addChangeListener(this.workspaceChanged_.bind(this));
this.applyColour()
this.workspace_.render();
this.block_.myWorkspaceInitial(this.workspace_);
}
else
this.svgDialog_=null,this.workspace_.dispose(),this.rootBlock_=this.workspace_=null,this.bubble_.dispose(),this.bubble_=null,this.workspaceHeight_=this.workspaceWidth_=0,this.sourceListener_&&(this.block_.workspace.removeChangeListener(this.sourceListener_),this.sourceListener_=null)
};
Blockly.myMutator.prototype.workspaceChanged_=function(a){if(!(a.isUiEvent||a.type==Blockly.Events.CHANGE&&"disabled"==a.element)){
if(!this.workspace_.isDragging()){a=this.workspace_.getTopBlocks(!1);for(var b=0,c;c=a[b];b++){var d=c.getRelativeToSurfaceXY();20>d.y&&c.moveBy(0,20-d.y);if(c.RTL){var e=-20,f=this.workspace_.getFlyout();f&&(e-=f.getWidth());d.x>e&&c.moveBy(e-d.x,0)}else 20>d.x&&c.moveBy(20-d.x,0)}}
Blockly.Events.setGroup(!0);
c=this.block_;
c.rendered=!1;
c.rendered=b;
c.initSvg();
c.rendered&&c.render();
this.workspace_.isDragging()||this.resizeBubble_();
Blockly.Events.setGroup(!1)
this.block_.myWorkspaceChanged(this.workspace_);
}
};
Blockly.myMutator.prototype.dispose=function(){this.block_.mutator=null;Blockly.Icon.prototype.dispose.call(this)};
Blockly.myMutator.prototype.updateBlockStyle=function(){var a=this.workspace_;if(a&&a.getAllBlocks(!1)){for(var b=a.getAllBlocks(!1),c=0,d;d=b[c];c++)d.setStyle(d.getStyleName());if(c=a.getFlyout())for(a=c.workspace_.getAllBlocks(!1),c=0;d=a[c];c++)d.setStyle(d.getStyleName())}};
fu6...
Beka Westberg
Aug 15, 2022, 1:36:07 PM8/15/22
to Blockly
Thanks for posting your solution code! Always great to see people sharing code, and saving future people time =)
Best wishes,
--Beka
fu6...@gmail.com
Aug 16, 2022, 8:53:53 AM8/16/22
to Blockly
Hi, Beka. I like to share my code, but I I'm not good at JavasScript. I have a new invention.
Blockly.Blocks['test'] = {
init: function() {
this.appendDummyInput()
.appendField('test');
this.appendStatementInput("do");
this.setMutator(new Blockly.myMutator([]));
this.setPreviousStatement(!0);
this.setNextStatement(!0);
this.setColour(110);
}
init: function() {
this.appendDummyInput()
.appendField('test');
this.appendStatementInput("do");
this.setMutator(new Blockly.myMutator([]));
this.setPreviousStatement(!0);
this.setNextStatement(!0);
this.setColour(110);
}
,myWorkspaceInitial: function(myWorkspace) {
var xml = '<block type="controls_if" x="30" y="0"><value name="IF0"><block type="logic_operation"><field name="OP">AND</field></block></value></block><block type="logic_compare" disabled="true" x="250" y="0"><field name="OP">EQ</field></block><block type="controls_repeat_ext" x="400" y="0"><value name="TIMES"><block type="math_number"><field name="NUM">10</field></block></value></block>';
xml = Blockly.Xml.textToDom('<xml xmlns="https://developers.google.com/blockly/xml">'+xml+'</xml>');
myWorkspace.clear();
Blockly.Xml.domToWorkspace(xml, myWorkspace);
function onMyMutatorBlocksChange(event) {
if (event.type=="click") {
var block = myWorkspace.getBlockById(event.blockId);
block = Blockly.Xml.blockToDom(block, true);
block = Blockly.Xml.textToDom('<xml>' + Blockly.Xml.domToText(block).replace(/(?:\r\n|\r|\n|\t)/g, "") + '</xml>');
Blockly.Xml.appendDomToWorkspace(block, myWorkspace.options.parentWorkspace);
}
}
myWorkspace.addChangeListener(onMyMutatorBlocksChange);
}
,myWorkspaceChanged: function(myWorkspace) {
}
};
var xml = '<block type="controls_if" x="30" y="0"><value name="IF0"><block type="logic_operation"><field name="OP">AND</field></block></value></block><block type="logic_compare" disabled="true" x="250" y="0"><field name="OP">EQ</field></block><block type="controls_repeat_ext" x="400" y="0"><value name="TIMES"><block type="math_number"><field name="NUM">10</field></block></value></block>';
xml = Blockly.Xml.textToDom('<xml xmlns="https://developers.google.com/blockly/xml">'+xml+'</xml>');
myWorkspace.clear();
Blockly.Xml.domToWorkspace(xml, myWorkspace);
function onMyMutatorBlocksChange(event) {
if (event.type=="click") {
var block = myWorkspace.getBlockById(event.blockId);
block = Blockly.Xml.blockToDom(block, true);
block = Blockly.Xml.textToDom('<xml>' + Blockly.Xml.domToText(block).replace(/(?:\r\n|\r|\n|\t)/g, "") + '</xml>');
Blockly.Xml.appendDomToWorkspace(block, myWorkspace.options.parentWorkspace);
}
}
myWorkspace.addChangeListener(onMyMutatorBlocksChange);
}
,myWorkspaceChanged: function(myWorkspace) {
}
};
fu6...
Reply all
Reply to author
Forward
0 new messages