diff -r 6dc33dae4074 -r 9ec338a99a18 svghmi/widget_animate.ysl2 --- a/svghmi/widget_animate.ysl2 Wed Sep 30 12:31:59 2020 +0200 +++ b/svghmi/widget_animate.ysl2 Thu Oct 01 14:23:27 2020 +0200 @@ -5,9 +5,10 @@ class AnimateWidget extends Widget{ frequency = 5; speed = 0; + widget_center = undefined; dispatch(value) { - this.speed = value; + this.speed = value / 5; //reconfigure animation this.request_animate(); @@ -15,14 +16,29 @@ animate(){ // change animation properties - this.element.children[0].setAttribute("dur", String(this.speed)+"s") + 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 width = this.element.getAttribute("width"); - let height = this.element.getAttribute("height"); - this.element.setAttribute("x",width/-2); - this.element.setAttribute("y",height/-2); + let widget_pos = this.element.getBBox(); + this.widget_center = [(widget_pos.x+widget_pos.width/2), (widget_pos.y+widget_pos.height/2)]; } } ||