# HG changeset patch
# User usveticic
# Date 1603092551 -7200
# Node ID 4b44d09c48a7c532a8b0f5432c3b4741f23cbdb7
# Parent 9ec338a99a181126b13feb458e307b9c444da0b3
- New widget customHtml which allows to insert block of html code
- widget animate transfered to animaterotation
- widget animate, left to be more customizable
- changes to svghmi_v2/svghmi.svg
diff -r 9ec338a99a18 -r 4b44d09c48a7 svghmi/widget_animate.ysl2
--- a/svghmi/widget_animate.ysl2 Thu Oct 01 14:23:27 2020 +0200
+++ b/svghmi/widget_animate.ysl2 Mon Oct 19 09:29:11 2020 +0200
@@ -5,6 +5,7 @@
class AnimateWidget extends Widget{
frequency = 5;
speed = 0;
+ start = false;
widget_center = undefined;
dispatch(value) {
@@ -17,20 +18,21 @@
animate(){
// change animation properties
for(let child of this.element.children){
- if(child.nodeName == "animateTransform"){
+ if(child.nodeName.startsWith("animate")){
+ if(this.speed != 0 && !this.start){
+ this.start = true;
+ this.element.beginElement();
+ }
+
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]);
+ this.start = false;
+ this.element.endElement();
}
}
}
diff -r 9ec338a99a18 -r 4b44d09c48a7 svghmi/widget_animaterotation.ysl2
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/svghmi/widget_animaterotation.ysl2 Mon Oct 19 09:29:11 2020 +0200
@@ -0,0 +1,51 @@
+// widget_animaterotation.ysl2
+
+template "widget[@type='AnimateRotation']", mode="widget_class"{
+ ||
+ class AnimateRotationWidget 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='AnimateRotation']", mode="widget_defs" {
+ param "hmi_element";
+ |,
+}
diff -r 9ec338a99a18 -r 4b44d09c48a7 svghmi/widget_customhtml.ysl2
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/svghmi/widget_customhtml.ysl2 Mon Oct 19 09:29:11 2020 +0200
@@ -0,0 +1,33 @@
+// widget_customhtml.ysl2
+
+template "widget[@type='CustomHtml']", mode="widget_class"{
+ ||
+ class CustomHtmlWidget extends Widget{
+ frequency = 5;
+ widget_size = undefined;
+
+ dispatch(value) {
+ this.request_animate();
+ }
+
+ animate(){
+ }
+
+ init() {
+ this.widget_size = this.container_elt.getBBox();
+ this.element.innerHTML =' '+
+ this.code_elt.textContent+
+ ' ';
+ }
+ }
+ ||
+}
+
+
+template "widget[@type='CustomHtml']", mode="widget_defs" {
+ param "hmi_element";
+ labels("container code");
+ |,
+}
diff -r 9ec338a99a18 -r 4b44d09c48a7 tests/svghmi_v2/svghmi_0@svghmi/svghmi.svg
--- a/tests/svghmi_v2/svghmi_0@svghmi/svghmi.svg Thu Oct 01 14:23:27 2020 +0200
+++ b/tests/svghmi_v2/svghmi_0@svghmi/svghmi.svg Mon Oct 19 09:29:11 2020 +0200
@@ -16,7 +16,7 @@
version="1.1"
id="hmi0"
sodipodi:docname="svghmi.svg"
- inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
+ inkscape:version="0.92.5 (0.92.5+68)"
inkscape:label="Layer">
@@ -92,10 +92,10 @@
y2="4.0725975" />
@@ -130,7 +130,7 @@
sodipodi:insensitive="true" />
000
-
-
- UP
-
-
-
- DN
-
Test
+ transform="matrix(0.39840034,0,0,0.35920948,-97.955902,106.13488)">
+ transform="matrix(0.45707797,0,0,0.45707797,33.744118,80.994747)">
000
-
-
-
-
-
-
-
-
+ id="g1112"
+ inkscape:label="HMI:AnimateRotation@/SPEED">
+
+
+
+
+
-
+
+
-
-
-
+ inkscape:label="container"
+ y="12"
+ x="818"
+ height="323"
+ width="452"
+ id="rect1072"
+ style="opacity:0.29800002;fill:#0000ff;fill-opacity:1;stroke:none;stroke-width:1.11057007" />
+ <img xmlns="http://www.w3.org/1999/xhtml" id="img" src="https://thumbs.gfycat.com/ImpoliteSoupyKakapo-size_restricted.gif" width="100%" height="80%" /> <a xmlns="http://www.w3.org/1999/xhtml" href='www.gmail.com'>Gmail</a> <p xmlns="http://www.w3.org/1999/xhtml">Koj kurac to ne dela</p>