/**
 * by 'Draw2D Shape Designer'
 *
 * Custom JS code to tweak the standard behaviour of the generated
 * shape. add your custome code and event handler here.
 *
 *
 */
HiveMQ = HiveMQ.extend({

    init: function(attr, setter, getter){
         this._super(attr, setter, getter);

        this.attr({
            resizeable:false,
            "userData.elementId":this.id
        });
         this.installEditPolicy(new draw2d.policy.figure.AntSelectionFeedbackPolicy());
         
         this.value = 0;
         var _this = this;
         this.callback = function( msg){
             if(msg.elementId !== _this.attr("userData.elementId")){
                return;
             }
             _this.value = msg.value;
             _this.getOutputPort(0).setValue(_this.value);
            if(_this.value === 1){
                _this.layerAttr("circle",{fill:"#C21B7A"});
            }
            else{
                _this.layerAttr("circle",{fill:"#f0f0f0"});
            }
         }
    },
    
    calculate: function()
    {
    },
    
    onStart: function()
    {
        socket.on("mqtt:message", this.callback);
        this.callback({value:this.value})
    },

    onStop:function()
    {
        socket.off("mqtt:message", this.callback);
    },

    getParameterSettings: function()
    {
        return [
        {
            name:"elementId",
            label:"Element Id",
            property:{
                type: "string"
        }
        
        }];
    }
    
});