blockly mutator

[seyeong Park]

I want to make a blockly mutator.

I refer to the documentation but I do not know how to make it clearly.

Can you tell me how to make it?

Thanks.

[Erik Pasternak]

Mutators can be pretty complicated to figure out depending on what you're trying to do. You could start with a block that does something similar to what you want and try to modify its mutator. Take a look at the is_divisible_by mutator for a simple example without the editable popup or at the create_list_with mutator for a more complicated example with the editable popup.

[Andrew n marshall]

Hi Seyeong,

We have several examples of mutators in our included blocks that you could look to help give you some context.  I think the math_number_property block is a good place to start:

​

To support the extra input after "divisible by", we mutate the block. This also means there is another value to store when writing XML, so our mutator includes the domToMutation(..) and mutationToDom(..) methods.

You can find the source in blocks/math.js. Search for math_number_property to find the block definition. See that it references math_is_divisibleby_mutator. Search for that in the same file to find the mutator registration:

Blockly.Extensions.registerMutator('math_is_divisibleby_mutator',

  Blockly.Constants.Math.IS_DIVISIBLEBY_MUTATOR_MIXIN,

  Blockly.Constants.Math.IS_DIVISIBLE_MUTATOR_EXTENSION);

That should give you some grounding as you read the mutator documentation.

--
Andrew

--
You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Tinker]

Hi Andrew,

I defined my block as an ancient way like followed

`var RTC_TYPE = [['DS1302','DS1302'],['DS1307','DS1307']];

Blockly.Blocks.RTC_init = {

    init: function () {

        this.setColour(Blockly.Blocks.sensor.HUE);

        this.appendDummyInput("").appendField(Blockly.MIXLY_RTCINIT);

        this.appendDummyInput("").setAlign(Blockly.ALIGN_RIGHT).appendField(new Blockly.FieldDropdown(RTC_TYPE), 'RTC_TYPE');

        this.appendDummyInput("").setAlign(Blockly.ALIGN_RIGHT).appendField(new Blockly.FieldTextInput('myRTC'), 'RTCName');

        this.appendValueInput("SDA")

            .appendField("SDA#")

            .setCheck(Number);

        this.appendValueInput("SCL")

            .appendField("SCL#")

            .setCheck(Number);

        this.setPreviousStatement(true, null);

        this.setNextStatement(true, null);

        this.setInputsInline(true);

    },

    mutationToDom: function() {

    var container = document.createElement('mutation');

    var type = (this.getFieldValue('RTC_TYPE'));

    console.log('=====get WHAT?=====');

    console.log(type);

    container.setAttribute('rtc_type', type);

    return container;

},

    domToMutation: function(xmlElement) {

    var RTC_TYPE = xmlElement.getAttribute('rtc_type');

    this.updateShape_(RTC_TYPE);

},

  updateShape_: function(RTC_TYPE) {

        // Add or remove a Value Input.

    if (RTC_TYPE == 'DS1302') {

      this.appendValueInput("RST")

        .appendField('RST#')

          .setCheck(Number);

    } else if (RTC_TYPE == 'DS1307'){

      /*if (this.childBlocks_.length > 0) {

        for (var i = 0; i < this.childBlocks_.length; i++) {

          if (this.childBlocks_[i].type == 'Number') {

            this.childBlocks_[i].unplug();

            break;

          }

        }

      }*/

      this.removeInput('RST');

    }

  }

};`

but this block didn't changed when I selected different content in dropdown menu.

Can you help me?

thanks

在 2017年11月14日星期二 UTC+8上午1:02:34，Andrew n marshall写道：

--
Andrew

To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.

[Andrew n marshall]

To make the block respond to the drop down selection, you'll need to add a onchange handler. For example, add this to your init:

// Update shape when the drop down changes

this.setOnChange(function(changeEvent) {

  this.updateShape_(this.getFieldValue('RTC_TYPE'));

});

While this does change in response to the drop down menu, probably not in the way you want.  You'll need to check that the desired field or input hasn't already been added before appending it again.  That should be easy for you to figure out how to update updateShape_(..).

--
Andrew

To unsubscribe from this group and stop receiving emails from it, send an email to blockly+unsubscribe@googlegroups.com.