svghmi/widget_animate.ysl2
author usveticic
Thu, 01 Oct 2020 14:23:27 +0200
branchsvghmi
changeset 3062 9ec338a99a18
parent 3059 e0db3f6a5f39
child 3064 4b44d09c48a7
permissions -rw-r--r--
Button fix if no active or inactive state,
Widget animate changed to use anitmateTransform and added option to change rotation
Widget circular slider fixed so it is working on got and reprogramed so it similar to normal slider
Widget slider added support for changing size still need some changes to work properly
Added slider to svghmi test project
Changed svg in svhgmi_v2 project
// widget_animate.ysl2

template "widget[@type='Animate']", mode="widget_class"{
    ||
    class AnimateWidget extends Widget{
        frequency = 5;
        speed = 0;
        widget_center = undefined;

        dispatch(value) {
            this.speed = value / 5;

            //reconfigure animation
            this.request_animate();
        }

        animate(){
           // change animation properties
           for(let child of this.element.children){
                if(child.nodeName == "animateTransform"){
                    if(this.speed > 0){
                        child.setAttribute("dur", this.speed+"s");
                        child.setAttribute("from", "0 "+this.widget_center[0]+" "+this.widget_center[1]);
                        child.setAttribute("to", "360 "+this.widget_center[0]+" "+this.widget_center[1]);
                    }
                    else if(this.speed < 0){
                        child.setAttribute("dur", (-1)*this.speed+"s");
                        child.setAttribute("from", "360 "+this.widget_center[0]+" "+this.widget_center[1]);
                        child.setAttribute("to", "0 "+this.widget_center[0]+" "+this.widget_center[1]);
                    }
                    else{
                        child.setAttribute("from", "0 "+this.widget_center[0]+" "+this.widget_center[1]);
                        child.setAttribute("to", "0 "+this.widget_center[0]+" "+this.widget_center[1]);
                    }
                }
           }
        }

        init() {
            let widget_pos = this.element.getBBox();
            this.widget_center = [(widget_pos.x+widget_pos.width/2), (widget_pos.y+widget_pos.height/2)];
        }
    }
    ||
}


template "widget[@type='Animate']", mode="widget_defs" {
    param "hmi_element";
    |,
}