From 75110f43f2a42a62cac1fb4861c0d9ef4b5ff0b5 Mon Sep 17 00:00:00 2001
From: betateilchen <>
Date: Fri, 6 Feb 2015 14:52:44 +0000
Subject: [PATCH] 55_InfoPanel: added
git-svn-id: https://svn.fhem.de/fhem/trunk@7892 2b470e98-0d58-463d-a4d8-8e2adae1ed80
---
fhem/CHANGED | 1 +
.../InfoPanel => FHEM}/55_InfoPanel.pm | 260 +++++++++++++++++-
fhem/contrib/InfoPanel/buttonPanel.layout | 84 ------
fhem/contrib/InfoPanel/demo.layout | 234 ----------------
4 files changed, 256 insertions(+), 323 deletions(-)
rename fhem/{contrib/InfoPanel => FHEM}/55_InfoPanel.pm (78%)
delete mode 100644 fhem/contrib/InfoPanel/buttonPanel.layout
delete mode 100644 fhem/contrib/InfoPanel/demo.layout
diff --git a/fhem/CHANGED b/fhem/CHANGED
index d9aa143bf..2ff045f2b 100644
--- a/fhem/CHANGED
+++ b/fhem/CHANGED
@@ -1,5 +1,6 @@
# Add changes at the top of the list. Keep it in ASCII, and 80-char wide.
# Do not insert empty lines here, update check depends on it.
+ - added: move 55_InfoPanel.pm from ./contrib to ./FHEM
- feature: YAMAHA_AVR: new commands play, pause, stop, skip, shuffle, repeat
- feature: 71_YAMAHA_NP: New command set and readings for menu navigation
- feature: 71_YAMAHA_NP: New command 'dimmer [1..3]'
diff --git a/fhem/contrib/InfoPanel/55_InfoPanel.pm b/fhem/FHEM/55_InfoPanel.pm
similarity index 78%
rename from fhem/contrib/InfoPanel/55_InfoPanel.pm
rename to fhem/FHEM/55_InfoPanel.pm
index c4d37924b..4db371bd4 100644
--- a/fhem/contrib/InfoPanel/55_InfoPanel.pm
+++ b/fhem/FHEM/55_InfoPanel.pm
@@ -798,10 +798,6 @@ sub btIP_evalLayout($$@) {
$svg .= btIP_itemEllipse($id,$x1,$y1,$r1,$r2,$format,%params);
}
- when("font") {
- $params{font} = $def;
- }
-
when("font") {
$params{font} = $def;
}
@@ -1237,6 +1233,260 @@ Please read
+ Layout definition
+
+ area <id> <x1> <y1> <x2> <y2> <link>
+
+ create a responsive area which will call a link when clicked.
+
+ id = element id
+ x1,y1 = upper left corner
+ x2,y2 = lower right corner
+ link = url to be called
+
+
+ boxcolor <rgba>
+
+ define an rgb color code to be used for filling button and textbox
+
+
+ button <id> <x1> <y1> <x2> <y2> <r1> <r2> <link> <text>
+
+ create a responsive colored button which will call a link when clicked.
+
+ id = element id
+ x1,y1 = upper left corner
+ x2,y2 = lower right corner
+ r1,r2 = radius for rounded corners
+ link = url to be called
+ text = text that will be written onto the button
+
+ button will be filled with color defined by "boxcolor"
+ text color will be read from "rgb" value
+
+
+ buttonpanel
+
+ needed once in your layout file if you intend to use buttons in the same layout.
+
+
+ circle <id> <x> <y> <r> [<fill>]
+
+ create a circle
+
+ id = element id
+ x,y = center coordinates of circle
+ r = radius
+ fill = circle will be filled with "rgb" color if set to 1
+
+
+ date <id> <x> <y>
+
+ print date
+
+ id = element id
+ x,y = position
+
+
+ ellipse <id> <x> <y> <r1> <r2> [<fill>]
+
+ create an ellipse
+
+ id = element id
+ x,y = center coordinates of circle
+ r1,r2 = radius
+ fill = ellipse will be filled with "rgb" color if set to 1
+
+
+ font <font-family>
+
+ define font family used for text elements (text, date, time, seconds ...)
+
+ Example: font arial
+
+
+ group <id> open <x> <y>
+ group - close (id will not be evaluated, just give any value)
+
+ group items
+
+ open|close = define start and end of group
+ x,y = upper left corner as reference for all grouped items, will be inherited to all elements.
+
+ Examples:
+
+ group - open 150 150
+ rect ...
+ img ...
+ group - close
+
+
+
+ img <id> <x> <y> <scale> <sourceType> <dataSource>
+
+ embed an image into InfoPanel
+
+ id = element id
+ x,y = upper left corner
+ scale = scale to be used for resizing; may be factor or defined by width or height
+ sourceType = file | url | data
+ dataSource = where to read data from, depends on sourceType
+
+
+ line <id> <x1> <y1> <x2> <y2> [<stroke>]
+
+ draw a line
+
+ id = element id
+ x1,y1 = coordinates (start)
+ x2,y2 = coordinates (end)
+ stroke = stroke width for line; if omitted, default = 0
+
+
+ moveby <x> <y>
+
+ move most recently x- and y-coordinates by given steps
+
+
+ moveto <x> <y>
+
+ move x- and y-coordinates to the given positon
+
+
+ plot <id> <x> <y> <scale> <inline> <plotName>
+
+ embed an SVG plot into InfoPanel
+
+ id = element id
+ x,y = upper left corner
+ scale = scale to be used for resizing; may be factor or defined by width or height
+ inline = embed plot as data (inline=1) or as link (inline=0)
+ plotName = name of desired SVG device from your fhem installation
+
+
+ pt <[+-]font-size>
+
+ define font size used for text elements (text, date, time, seconds ...)
+ can be given as absolute or relative value.
+
+ Examples:
+ pt 12
+ pt +3
+ pt -2
+
+
+ rect <id> <x1> <y1> <x2> <y2> <r1> <r2> [<fill>]
+
+ create a rectangle
+
+ id = element id
+ x1,y1 = upper left corner
+ x2,y2 = lower right corner
+ r1,r2 = radius for rounded corners
+ fill = rectangle will be filled with "rgb" color if set to 1
+
+
+ rgb <rgb[a]>
+
+ define rgba value (hex digits!) used for text, lines, circles, ellipses
+
+ r = red value
+ g = green value
+ b = blue value
+ a = alpha value used for opacity; optional
+
+
+ seconds <id> <x> <y> [<format>]
+
+ print seconds
+
+ id = element id
+ x,y = position
+ format = seconds will be preceeded by ':' if set to 'colon'; optional
+
+
+ text <id> <x> <y> <text>
+
+ print text
+
+ id = element id
+ x,y = position
+ text = text content to be printed
+
+
+ textbox <id> <x> <y> <boxWidth> <boxHeight> <text>
+
+ create a textbox to print text with auto wrapping
+
+ id = element id
+ x,y = upper left corner
+ boxWidth,boxHeight = dimensions of textbox
+ text = text to be printed in textbox
+
+ Important: textboxes can not be responsive!
+
+
+ textboxalign <align>
+
+ define horizontal alignment for text inside textboxes
+
+ valid values: left center right justify
+
+
+ textdesign <align>
+
+ define comma-separated list for text design and decoration
+
+ valid values: underline overline line-through bold italic oblique clear
+
+ Examples:
+
+ textdesign underline
+ textdesign bold,italic,underline
+
+
+ Important: "clear" resets all to default values!
+
+
+ thalign <align>
+
+ define horizontal alignment for text output
+
+ valid values: start middle end
+
+
+ time <id> <x> <y>
+
+ print time
+
+ id = element id
+ x,y = position
+
+
+
+ trash <id> <x> <y> <scale> <foregroundColor> <backgroundColor>
+
+ print a trashcan with selectable colors for foreground and background
+
+ id = element id
+ x,y = position
+ scale = scale to be used for resizing; may be factor or defined by width or height
+ foregroundColor = hex digits used for foreground
+ backgroundColor = hex digits used for background
+
+
+ tvalign <align>
+
+ define vertical alignment for text output
+
+ valid values: auto baseline middle center hanging
+
+
+
+
+
+
Author's notes
@@ -1251,7 +1501,7 @@ Please read [| ]
-# id = Name des Objekts
-# x1,y1 = obere linke Ecke des Rechtecks
-# x2 y2 = untere rechte Ecke des Rechtecks
-# th = Linienstärke (in Pixel), optional, default=1
-#
-line - 0 150 800 150 2
-line - 200 0 200 400 2
-
-line - 0 400 800 400
-line - 600 0 600 400
-
-rgb "00FF00FF" # Fadenkreuz in grün
-line - 400 100 400 400
-line - 100 300 700 300
-
-
-# pt Schriftgröße in Pixel
-# gültig bis zur nächsten Definition
-#
-pt 24
-
-rgb "FFFFFFFF" # Schriftfarbe weiß, voll deckend
-
-
-# Text zentriert ausgeben
-#
-thalign "middle"
-
-# Text ausgeben
-# Format: text {}
-#
-text - 400 25 "InfoPanel"
-
-
-# Text linksbündig ausgeben
-#
-thalign "start"
-
-
-# Datum ausgeben
-# Format: date
-#
-date - 50 25
-
-
-# Text rechtsbündig ausgeben
-#
-thalign "end"
-
-
-# Uhrzeit ausgeben
-# Format: time
-#
-time - 750 25
-
-
-# Rechteck zeichnen
-# Format: rect []
-# id = Name des Objekts
-# x1,y1 = obere linke Ecke des Rechtecks
-# x2 y2 = untere rechte Ecke des Rechtecks
-# rx,ry = Radien für abgerundete Ecken
-# filled = Rechteck füllen (0|1)
-#
-
-rgb FF00007F
-
-rect - 200 150 400 300 0 0 1 # rot gefüllt ohne Abrundung
-rect - 410 160 590 290 10 10 1 # rot gefüllt mit runden Ecken
-
-
-# Rechteck als Link festlegen
-# Format: area
-# id = Name des Objekts
-# x1,y1 = obere linke Ecke des Rechtecks
-# x2 y2 = untere rechte Ecke des Rechtecks
-# target = Ziel-URL
-#
-
-# wir verwenden das linke rote Rechteck
-# um zu fhem zu verlinken
-
-area - 200 150 400 300 http://www.fhem.de
-
-
-# condition funktioniert wie in 02_RSS.pm
-#
-# condition { ReadingsVal('HMinfo', 'ERR_battery', 0) }
-condition 1
-
-
-# Grafiken einbinden
-# Format: img
-# id = Name des Objekts
-# x,y = obere linke Ecke der Grafik
-#
-
-# wir legen ein rotes Quadrat 48x48 hinter das Bild
-rgb "FF0000FF"
-rect - 700 200 747 247 2 2 1
-
-# jetzt kommt das Bild in einer Skalierung
-# Breite = 46 Pixel
-#
-img - 701 201 w46 file "./www/images/fhemSVG/batterie.svg"
-
-
-# Kreis zeichnen
-# Format: circle []
-# id = Name des Objekts
-# x,y = Mittelpunkt des Kreises
-# r = Radius
-# filled = Rechteck füllen (0|1)
-#
-
-rgb "FFFF005F" # gelb
-
-circle - 700 350 50 1
-circle - 720 370 10 0
-
-
-# Kreis zeichnen
-# Format: ellipse []
-# id = Name des Objekts
-# x,y = Mittelpunkt des Kreises
-# rx,ry = Radien der Ellipse
-# r = Radius
-# filled = Rechteck füllen (0|1)
-#
-
-rgb "0000FF5F" # blau
-
-ellipse - 100 300 50 70 1
-ellipse - 100 300 30 20 0
-
-
-# Plots aus fhem einbinden
-# Format:
-# id = Name des Objekts
-# x,y = obere linke Ecke des Plots
-# scale = Skalierungsfaktor
-# inline = Plot als Link (0) oder als BASE64 (1) einfügen
-# Plotname = Name des SVG devices in fhem
-# zoom = Darstellungsbereich des Plots
-# offset = Offset des Plots
-#
-
-# bei Bedarf ein farbiges Rechteck hinter den Plot legen:
-#
-rgb "5858587F" # dunkelgrau
-rect - 0 420 800 580 5 5 1
-
-# jetzt den Plot einbinden
-plot - 0 420 1 1 "SVG_out_Balkon;day"
-
-
-rgb "FFFFFFFF"
-thalign "start"
-
-# Textausrichtung vertikal
-#
-tvalign "baseline"
-text - 10 150 "baseline"
-
-tvalign "middle"
-text - 110 150 "middle"
-
-tvalign "center"
-text - 610 150 "center"
-
-tvalign "hanging"
-text - 710 150 "hanging"
-
-tvalign "baseline"
-
-# Sekunden anzeigen:
-#
-
-seconds - 300 350 # Sekunden ohne Doppelpunkt
-
-seconds - 500 350 colon # Sekunden mit Doppelpunkt
-
-
-## Textbox anlegen
-
-font arial
-rgb "FFFFFFFF"
-pt 12
-
-# boxcolor: Hintergrundfarbe der Textbox
-# Format: identisch zu rgb
-#
-
-boxcolor "FF0000FF"
-
-
-# padding: äußere Rahmenbreite der Hintergrundfarbe
-# Format: padding (pixel)
-#
-
-padding "5"
-
-
-# textbox
-# Format: textbox
-#
-
-textbox - 210 50 180 50 "bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla"
-
-
-
-
-#
\ No newline at end of file
|