FHEM/fhem-mirror
2
0
Fork 0
mirror of https://github.com/fhem/fhem-mirror.git synced 2025-04-20 07:16:03 +00:00
Code Issues Releases Wiki Activity

Massive smallscreen optimiztions.

Browse Source 
git-svn-id: https://svn.fhem.de/fhem/trunk@1021 2b470e98-0d58-463d-a4d8-8e2adae1ed80
This commit is contained in:
rudolfkoenig 2011-09-24 13:20:14 +00:00
parent 55e2c81519
commit ad9909ced9
6 changed files with 368 additions and 415 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
fhem/docs/commandref.html
View File

@ -2000,7 +2000,6 @@ A line ending with \ will be concatenated with the next one, so long lines
The fhem module will emulate a CUL device, so the <a href="#CUL_HM">CUL_HM</a> The fhem module will emulate a CUL device, so the <a href="#CUL_HM">CUL_HM</a>
module can be used to define HomeMatic devices.<br><br> module can be used to define HomeMatic devices.<br><br>
In order to use it with fhem you <b>must</b> disable the encryption first In order to use it with fhem you <b>must</b> disable the encryption first
with the "HomeMatic Lan Interface Configurator" (which is part of the with the "HomeMatic Lan Interface Configurator" (which is part of the
supplied Windows software), by selecting the device, "Change IP Settings", supplied Windows software), by selecting the device, "Change IP Settings",
@ -2693,8 +2692,10 @@ A line ending with \ will be concatenated with the next one, so long lines
humidity $h<br> humidity $h<br>
actuator $vp %<br> actuator $vp %<br>
desired-temp: $t<br> desired-temp: $t<br>
tempList$wd: hh:mm $t hh:mm $t ...<br>
ValveErrorPosition $dname: $vep %<br> ValveErrorPosition $dname: $vep %<br>
ValveOffset $dname: $of %<br> ValveOffset $dname: $of %<br>
windowopentemp-$tchan: $t (sensor:$tdev)<br>
<li>HM-CC-VD:<br> <li>HM-CC-VD:<br>
actuator $vp %<br> actuator $vp %<br>
actuator:movement_open<br> actuator:movement_open<br>
@ -2744,6 +2745,11 @@ A line ending with \ will be concatenated with the next one, so long lines
T: $t H: $h<br> T: $t H: $h<br>
temperature $t<br> temperature $t<br>
humidity $h<br> humidity $h<br>
<li>WDC7000<br>
T: $t H: $h AP: $ap<br>
temperature $t<br>
humidity $h<br>
airpress $ap<br>
<li>winMatic<br> <li>winMatic<br>
contact closed<br> contact closed<br>
contact open<br> contact open<br>
@ -5936,9 +5942,6 @@ href="http://www.elv.de/output/controller.aspx?cid=74&detail=10&detail2=29870">U
module implements 2 drivers in one. It is the "physical" part for the <a module implements 2 drivers in one. It is the "physical" part for the <a
href="#EnOcean">EnOcean</a> module.<br><br> href="#EnOcean">EnOcean</a> module.<br><br>
Note: this module requires the Device::SerialPort or Win32::SerialPort module.
<br><br>
<a name="TCMdefine"></a> <a name="TCMdefine"></a>
<b>Define</b> <b>Define</b>
<ul> <ul>
@ -5946,22 +5949,16 @@ href="http://www.elv.de/output/controller.aspx?cid=74&detail=10&detail2=29870">U
<br> <br>
First you have to specify the type of the EnOcean Transceiver Chip , i.e First you have to specify the type of the EnOcean Transceiver Chip , i.e
either 120 for the TCM120 or 310 for the TCM310.<br><br> either 120 for the TCM120 or 310 for the TCM310.<br><br>
USB-connected device:<br><ul> <code>device</code> can take the same parameters (@baudrate, @directio,
&lt;device&gt; specifies the serial port to communicate with the TCM. TCP/IP, none) like the <a href="#CULdefine">CUL</a>, but you probably have
The name of the serial-device depends on your distribution, under linux to specify the baudrate: the TCM120 should be opened with 9600 Baud, the
it is commonly /dev/ttyACM0. TCM310 with 57600 baud.
You can also specify a baudrate if the device name contains the @ Example:
character, e.g.: /dev/ttyACM0@9600. The default for the TCM120 is 9600 <ul><code>
Baud, and for the TCM310 it is 57600 baud. define BscBor TCM 120 /dev/ttyACM0@9600<br>
<br><br> define TCM310 TCM 310 /dev/ttyACM0@57600<br>
</ul> </code></ul>
Network-connected device (untested):<br><ul>
&lt;device&gt; specifies the host:port of the device. E.g.
192.168.0.244:2323
</ul>
<br>
If the device is called none, then no device will be opened, so you
can experiment without hardware attached.<br>
</ul> </ul>
<br> <br>
@ -6364,7 +6361,11 @@ href="http://www.elv.de/output/controller.aspx?cid=74&detail=10&detail2=29870">U
<a name="hiddenroom"></a> <a name="hiddenroom"></a>
<li>hiddenroom<br> <li>hiddenroom<br>
Komma separated list of rooms to "hide", i.e. not to show. Komma separated list of rooms to "hide", i.e. not to show. Special
values are input and detail, in which case no input areas or link to
the detailed views are shown (although they still can be addressed
through url manipulation). The list can also contain values from the
additional "Howto/Wiki/FAQ" block.
<br><br> <br><br>
</li> </li>

631
fhem/webfrontend/pgm2/01_FHEMWEB.pm
View File

@ -15,11 +15,11 @@ sub FW_doDetail($);
sub FW_fatal($); sub FW_fatal($);
sub FW_fileList($); sub FW_fileList($);
sub FW_logWrapper($); sub FW_logWrapper($);
sub FW_makeTable($$$$$$$$); sub FW_makeEdit($$$);
sub FW_makeTable($$);
sub FW_ReadIcons(); sub FW_ReadIcons();
sub FW_roomOverview($); sub FW_roomOverview($);
sub FW_select($$$); sub FW_select($$$);
sub FW_showArchive($);
sub FW_showLog($); sub FW_showLog($);
sub FW_showRoom(); sub FW_showRoom();
sub FW_showWeblink($$$); sub FW_showWeblink($$$);
@ -31,7 +31,6 @@ sub FW_updateHashes();
sub FW_zoomLink($$$); sub FW_zoomLink($$$);
sub pF($@); sub pF($@);
sub pH(@); sub pH(@);
sub pHJava(@);
sub pHPlain(@); sub pHPlain(@);
sub pO(@); sub pO(@);
@ -39,7 +38,7 @@ use vars qw($FW_dir); # moddir (./FHEM), needed by SVG
use vars qw($FW_ME); # webname (default is fhem), needed by 97_GROUP use vars qw($FW_ME); # webname (default is fhem), needed by 97_GROUP
use vars qw($FW_ss); # is smallscreen, needed by 97_GROUP/95_VIEW use vars qw($FW_ss); # is smallscreen, needed by 97_GROUP/95_VIEW
use vars qw($FW_tp); # is touchpad (iPad / etc) use vars qw($FW_tp); # is touchpad (iPad / etc)
use vars qw(%FW_types);# device types, for sorting, for 97_GROUP/95_VIEW use vars qw(%FW_types);# device types, for 97_GROUP/95_VIEW
my $zlib_loaded; my $zlib_loaded;
my $try_zlib = 1; my $try_zlib = 1;
@ -65,6 +64,7 @@ my %FW_types; # device types, for sorting
my $FW_wname; # Web instance name my $FW_wname; # Web instance name
my @FW_zoom; # "qday", "day","week","month","year" my @FW_zoom; # "qday", "day","week","month","year"
my %FW_zoom; # the same as @FW_zoom my %FW_zoom; # the same as @FW_zoom
my %FW_hiddenroom; # hash of hidden rooms
##################################### #####################################
@ -380,7 +380,6 @@ FW_AnswerCall($)
$cmd !~ /^showlog/ && $cmd !~ /^showlog/ &&
$cmd !~ /^logwrapper/ && $cmd !~ /^logwrapper/ &&
$cmd !~ /^toweblink/ && $cmd !~ /^toweblink/ &&
$cmd !~ /^showarchive/ &&
$cmd !~ /^style / && $cmd !~ /^style / &&
$cmd !~ /^edit/); $cmd !~ /^edit/);
@ -445,7 +444,12 @@ FW_AnswerCall($)
$FW_cmdret =~ s/</&lt;/g; $FW_cmdret =~ s/</&lt;/g;
$FW_cmdret =~ s/>/&gt;/g; $FW_cmdret =~ s/>/&gt;/g;
pO "<div id=\"content\">"; pO "<div id=\"content\">";
pO "<pre>$FW_cmdret</pre>"; $FW_cmdret = "<pre>$FW_cmdret</pre>" if($FW_cmdret =~ m/\n/);
if($FW_ss) {
pO "<div class=\"tiny\">$FW_cmdret</div>";
} else {
pO $FW_cmdret;
}
pO "</div>"; pO "</div>";
} }
@ -454,7 +458,6 @@ FW_AnswerCall($)
FW_doDetail($FW_detail) if($FW_detail); FW_doDetail($FW_detail) if($FW_detail);
FW_showRoom() if($FW_room && !$FW_detail); FW_showRoom() if($FW_room && !$FW_detail);
FW_logWrapper($cmd) if($cmd =~ /^logwrapper/); FW_logWrapper($cmd) if($cmd =~ /^logwrapper/);
FW_showArchive($cmd) if($cmd =~ m/^showarchive/);
pO "</body></html>"; pO "</body></html>";
return 0; return 0;
} }
@ -493,9 +496,9 @@ FW_digestCgi($)
if($p eq "data") { $FW_data = $v; } if($p eq "data") { $FW_data = $v; }
} }
$cmd.=" $dev{$c}" if($dev{$c}); $cmd.=" $dev{$c}" if(defined($dev{$c}));
$cmd.=" $arg{$c}" if($arg{$c}); $cmd.=" $arg{$c}" if(defined($arg{$c}));
$cmd.=" $val{$c}" if($val{$c}); $cmd.=" $val{$c}" if(defined($val{$c}));
return $cmd; return $cmd;
} }
@ -528,60 +531,46 @@ FW_updateHashes()
############################## ##############################
sub sub
FW_makeTable($$$$$$$$) FW_makeTable($$)
{ {
my($d,$t,$header,$hash,$clist,$ccmd,$makelink,$cmd) = (@_); my($name, $hash) = (@_);
return if(!$hash && !$clist); return if(!$hash || !int(keys %{$hash}));
pO " <table class=\"block wide\">";
$t = "EM" if($t =~ m/^EM.*$/); # EMWZ,EMEM,etc.
$t = "KS300" if($t eq "HMS");
pO " <table class=\"block\" id=\"$t\">";
# Header
pO " <tr>";
foreach my $h (split(",", $header)) {
pO "<th>$h</th>";
}
pO "</tr>";
if($clist) {
pO "<tr>";
my @al = map { s/[:;].*//;$_ } split(" ", $clist);
pO "<td>" . FW_select("arg.$ccmd$d",\@al,undef) . "</td>";
pO "<td>" . FW_textfield("val.$ccmd$d", 20) . "</td>";
pO "<td>" .
FW_submit("cmd.$ccmd$d", $ccmd) .
FW_hidden("dev.$ccmd$d", $d) .
"</td>";
pO "</tr>";
}
my $row = 1; my $row = 1;
foreach my $v (sort keys %{$hash}) { foreach my $n (sort keys %{$hash}) {
my $r = ref($hash->{$v}); my $r = ref($hash->{$n});
next if($r && ($r ne "HASH" || !defined($hash->{$v}{VAL}))); next if($r && ($r ne "HASH" || !defined($hash->{$n}{VAL})));
pF " <tr class=\"%s\">", $row?"odd":"even"; pF " <tr class=\"%s\">", ($row&1)?"odd":"even";
$row = ($row+1)%2; $row++;
if($makelink && $FW_reldoc) {
# no pH, want to open extra browser my $val = $hash->{$n};
pO "<td><a href=\"$FW_reldoc#$v\">$v</a></td>";
} else { if($n eq "DEF" && !$FW_hiddenroom{"input"}) {
pO "<td>$v</td>"; FW_makeEdit($name, $n, $val);
}
if(ref($hash->{$v})) {
pO "<td id=\"show\">$hash->{$v}{VAL}</td>";
pO "<td>$hash->{$v}{TIME}</td>" if($hash->{$v}{TIME});
} else { } else {
if($v eq "DEF") {
FW_makeEdit($d, $t, "modify", $hash->{$v}); pO "<td><div class=\"dname\">$n</div></td>";
if(ref($val)) {
my ($v, $t) = ($val->{VAL}, $val->{TIME});
if($FW_ss) {
$t = ($t ? "<br><div class=\"tiny\">$t</div>" : "");
pO "<td><div class=\"dval\">$v$t</div></td>";
} else {
$t = "" if(!$t);
pO "<td>$v</td><td>$t</td>";
}
} else { } else {
pO "<td id=\"show\">$hash->{$v}</td>"; pO "<td><div class=\"dval\">$val</div></td>";
}
}
pH "cmd.$d=$cmd $d $v&amp;detail=$d", $cmd, 1 }
if($cmd);
}
pO "</tr>"; pO "</tr>";
} }
@ -592,42 +581,16 @@ FW_makeTable($$$$$$$$)
############################## ##############################
sub sub
FW_showArchive($) FW_makeSelect($$$)
{ {
my ($arg) = @_; my ($d, $cmd, $list) = @_;
my (undef, $d) = split(" ", $arg); return if(!$list || $FW_hiddenroom{input});
my @al = map { s/[:;].*//;$_ } split(" ", $list);
my $fn = $defs{$d}{logfile}; pO FW_submit("cmd.$cmd$d", $cmd) .
if($fn =~ m,^(.+)/([^/]+)$,) { "&nbsp;$d" .
$fn = $2; FW_hidden("dev.$cmd$d", $d);
} pO FW_select("arg.$cmd$d",\@al,undef);
$fn = AttrVal($d, "archivedir", "") . "/" . $fn; pO FW_textfield("val.$cmd$d", 30);
my $t = $defs{$d}{TYPE};
pO "<div id=\"content\">";
pO "<table><tr><td>";
pO "<table class=\"block\" id=\"$t\"><tr><td>";
my $row = 0;
my $l = AttrVal($d, "logtype", undef);
foreach my $f (FW_fileList($fn)) {
pF " <tr class=\"%s\"><td>$f</td>", $row?"odd":"even";
$row = ($row+1)%2;
if(!defined($l)) {
pH "cmd=logwrapper $d text $f", "text", 1;
} else {
foreach my $ln (split(",", $l)) {
my ($lt, $name) = split(":", $ln);
$name = $lt if(!$name);
pH "cmd=logwrapper $d $lt $f", $name, 1;
}
}
pO "</tr>";
}
pO "</td></tr></table>";
pO "</td></tr></table>";
pO "</div>";
} }
@ -640,83 +603,96 @@ FW_doDetail($)
pO "<form method=\"get\" action=\"$FW_ME\">"; pO "<form method=\"get\" action=\"$FW_ME\">";
pO FW_hidden("detail", $d); pO FW_hidden("detail", $d);
$FW_room = AttrVal($d, "room", undef);
$FW_room = $1 if($FW_room && $FW_room =~ m/^([^,]*),/); # Get first of a Multi-Room
my $t = $defs{$d}{TYPE}; my $t = $defs{$d}{TYPE};
pO "<div id=\"content\">"; pO "<div id=\"content\">";
pO "<table><tr><td>"; pO "<table><tr><td>";
pH "cmd=delete $d", "Delete $d"; FW_makeSelect($d, "set", getAllSets($d));
FW_makeTable($d, $defs{$d});
pO "Readings" if($defs{$d}{READINGS});
FW_makeTable($d, $defs{$d}{READINGS});
FW_makeSelect($d, "attr", getAllAttr($d));
FW_makeTable($d, $attr{$d});
my $pgm = "Javascript:" . if($t eq "FileLog" ) {
"s=document.getElementById('edit').style;". pO " <table class=\"block wide\">";
"s.display = s.display=='none' ? 'block' : 'none';". my $row = 1;
"s=document.getElementById('disp').style;". foreach my $f (FW_fileList($defs{$d}{logfile})) {
"s.display = s.display=='none' ? 'block' : 'none';"; my $nr;
pHJava $pgm, "Modify $d"; foreach my $ln (split(",", AttrVal($d, "logtype", "text"))) {
pH "room=$FW_room", "Back:$FW_room" if($FW_ss); my ($lt, $name) = split(":", $ln);
$name = $lt if(!$name);
pF " <tr class=\"%s\">", ($row&1)?"odd":"even";
pF "<td><div class=\"dname\">%s</div></td>", ($nr ? "" : $f);
pH "cmd=logwrapper $d $lt $f",
"<div class=\"dval\">$name</div>", 1, "dval";
pO "</tr>";
$nr++; $row++;
}
}
pO " </table>";
}
pO "</td></tr><tr><td>";
FW_makeTable($d, $t,
"<a href=\"$FW_reldoc#${t}set\">State</a>,Value,Measured",
$defs{$d}{READINGS}, getAllSets($d), "set", 0, undef);
FW_makeTable($d, $t, "Internal,Value",
$defs{$d}, "", undef, 0, undef);
FW_makeTable($d, $t,
"<a href=\"$FW_reldoc#${t}attr\">Attribute</a>,Value,Action",
$attr{$d}, getAllAttr($d), "attr", 1,
$d eq "global" ? "" : "deleteattr");
pO "</td></tr></table>"; pO "</td></tr></table>";
FW_showWeblink($d, $defs{$d}{LINK}, $defs{$d}{WLTYPE}) if($t eq "weblink"); FW_showWeblink($d, $defs{$d}{LINK}, $defs{$d}{WLTYPE}) if($t eq "weblink");
pO "<br>";
pH "$FW_reldoc#${t}", "Device specific help";
pO "<br><br>";
pO "</div>"; pO "</div>";
pO "</form>"; pO "</form>";
} }
############## ##############
# Room overview # Header, Zoom-Icons & list of rooms at the left.
sub sub
FW_roomOverview($) FW_roomOverview($)
{ {
my ($cmd) = @_; my ($cmd) = @_;
foreach my $r (split(",",AttrVal($FW_wname, "hiddenroom", ""))) {
$FW_hiddenroom{$r} = 1;
}
##############
# LOGO
if($FW_detail && $FW_ss) {
$FW_room = AttrVal($FW_detail, "room", undef);
$FW_room = $1 if($FW_room && $FW_room =~ m/^([^,]*),/);
$FW_room = "" if(!$FW_room);
pHPlain "room=$FW_room",
"<div id=\"back\"><img src=\"$FW_ME/back.png\"></div>";
pO "<div id=\"menu\">$FW_detail details</div>";
return;
} else {
my $logo = $FW_ss ? "fhem_smallscreen.png" : "fhem.png";
pO "<div id=\"logo\"><img src=\"$FW_ME/$logo\"></div>";
}
############## ##############
# HEADER # HEADER
pO "<form method=\"get\" action=\"$FW_ME\">"; pO "<form method=\"get\" action=\"$FW_ME\">";
pO "<div id=\"hdr\">"; pO "<div id=\"hdr\">";
pO '<table border="0"><tr><td style="padding:0">'; pO '<table border="0"><tr><td style="padding:0">';
my $tf_done; pO FW_hidden("room", "$FW_room") if($FW_room);
if($FW_room) { pO FW_textfield("cmd", $FW_ss ? 25 : 40);
pO FW_hidden("room", "$FW_room");
# plots navigation buttons
if(!$FW_detail || $defs{$FW_detail}{TYPE} eq "weblink") {
if(FW_calcWeblink(undef,undef)) {
pO FW_textfield("cmd", $FW_ss ? 15 : 40);
$tf_done = 1;
pO "</td><td>&nbsp;&nbsp;</td>";
FW_zoomLink("zoom=-1", "Zoom-in.png", "zoom in");
FW_zoomLink("zoom=1", "Zoom-out.png","zoom out");
FW_zoomLink("off=-1", "Prev.png", "prev");
FW_zoomLink("off=1", "Next.png", "next");
}
}
}
pO FW_textfield("cmd", $FW_ss ? 15 : 40) if(!$tf_done);
pO "</td></tr></table>"; pO "</td></tr></table>";
pO "</div>"; pO "</div>";
pO "</form>"; pO "</form>";
##############
# LOGO
my $logo = $FW_ss ? "fhem_smallscreen.png" : "fhem.png";
pO "<div id=\"logo\"><img src=\"$FW_ME/$logo\"></div>";
############## ##############
# MENU # MENU
my (@list1, @list2); my (@list1, @list2);
push(@list1, ""); push(@list2, ""); push(@list1, ""); push(@list2, "");
########################
# FW Extensions
if(defined($data{FWEXT})) { if(defined($data{FWEXT})) {
foreach my $k (sort keys %{$data{FWEXT}}) { foreach my $k (sort keys %{$data{FWEXT}}) {
my $h = $data{FWEXT}{$k}; my $h = $data{FWEXT}{$k};
@ -728,41 +704,43 @@ FW_roomOverview($)
} }
$FW_room = "" if(!$FW_room); $FW_room = "" if(!$FW_room);
my %hiddenroom; ##########################
foreach my $r (split(",",AttrVal($FW_wname, "hiddenroom", ""))) { # Rooms and other links
$hiddenroom{$r} = 1;
}
foreach my $r (sort keys %FW_rooms) { foreach my $r (sort keys %FW_rooms) {
next if($r eq "hidden" || $hiddenroom{$r}); next if($r eq "hidden" || $FW_hiddenroom{$r});
push @list1, $r; push @list1, $r;
push @list2, "$FW_ME?room=$r"; push @list2, "$FW_ME?room=$r";
} }
push(@list1, "Everything"); push(@list2, "$FW_ME?room=all"); my @list = (
push(@list1, ""); push(@list2, ""); "Everything", "$FW_ME?room=all",
push(@list1, "Howto"); push(@list2, "$FW_ME/HOWTO.html"); "", "",
push(@list1, "Wiki"); push(@list2, "http://fhemwiki.de"); "Howto", "$FW_ME/HOWTO.html",
push(@list1, "FAQ"); push(@list2, "$FW_ME/faq.html"); "Wiki", "http://fhemwiki.de",
push(@list1, "Details"); push(@list2, "$FW_ME/commandref.html"); "FAQ", "$FW_ME/faq.html",
push(@list1, "Examples"); push(@list2, "$FW_ME/cmd=style%20examples"); "Details", "$FW_ME/commandref.html",
push(@list1, "Edit files"); push(@list2, "$FW_ME/cmd=style%20list"); "Examples", "$FW_ME/cmd=style%20examples",
push(@list1, ""); push(@list2, ""); "Edit files", "$FW_ME/cmd=style%20list",
"", "");
my $lastname = ","; # Avoid double "".
for(my $idx = 0; $idx < @list; $idx+= 2) {
next if($FW_hiddenroom{$list[$idx]} || $list[$idx] eq $lastname);
push @list1, $list[$idx];
push @list2, $list[$idx+1];
$lastname = $list[$idx];
}
pO "<div id=\"menu\">"; pO "<div id=\"menu\">";
pO "<table>"; pO "<table>";
if($FW_ss) { # Make a selection sensitive dropdown list if($FW_ss) { # Make a selection sensitive dropdown list
pO " <tr><td>"; pO " <tr><td><select OnChange=\"location.href=" .
"this.options[this.selectedIndex].value\">";
foreach(my $idx = 0; $idx < @list1; $idx++) { foreach(my $idx = 0; $idx < @list1; $idx++) {
if(!$list1[$idx]) { next if(!$list1[$idx]);
pO "</select></td><td>" if($idx); my $sel = ($list1[$idx] eq $FW_room ? " selected=\"selected\"" : "");
pO "<select OnChange=\"location.href=" . pO " <option value=$list2[$idx]$sel>$list1[$idx]</option>";
"this.options[this.selectedIndex].value\">"
if($idx<int(@list1)-1);
} else {
my $sel = ($list1[$idx] eq $FW_room ? " selected=\"selected\"" : "");
pO " <option value=$list2[$idx]$sel>$list1[$idx]</option>";
}
} }
pO " </td></tr>"; pO " </select></td></tr>";
} else { } else {
@ -770,7 +748,7 @@ FW_roomOverview($)
my ($l1, $l2) = ($list1[$idx], $list2[$idx]); my ($l1, $l2) = ($list1[$idx], $list2[$idx]);
if(!$l1) { if(!$l1) {
pO " </table></td></tr>" if($idx); pO " </table></td></tr>" if($idx);
pO " <tr><td><table class=\"block\" id=\"room\">" pO " <tr><td><table id=\"room\">"
if($idx<int(@list1)-1); if($idx<int(@list1)-1);
} else { } else {
pF " <tr%s>", $l1 eq $FW_room ? " class=\"sel\"" : ""; pF " <tr%s>", $l1 eq $FW_room ? " class=\"sel\"" : "";
@ -790,143 +768,128 @@ FW_roomOverview($)
######################## ########################
# Generate the html output: i.e present the data # Show the overview of devices in one room
sub sub
FW_showRoom() FW_showRoom()
{ {
return if(!$FW_room);
# (re-) list the icons # (re-) list the icons
FW_ReadIcons(); FW_ReadIcons();
pO "<form method=\"get\" action=\"$FW_ME\">"; pO "<form method=\"get\" action=\"$FW_ME\">";
pO "<div id=\"content\">"; pO "<div id=\"content\">";
pO " <table><tr><td>"; # Need for equal width of subtables pO " <table class=\"block\">";
foreach my $type (sort keys %FW_types) { my @list = ($FW_room eq "all" ? keys %defs : keys %{$FW_rooms{$FW_room}});
my $rf = ($FW_room ? "&amp;room=$FW_room" : ""); # stay in the room
################# my $row=1;
# Check if there is a device of this type in the room foreach my $d (sort @list) {
if($FW_room && $FW_room ne "all") { next if(IsIgnored($d));
next if(!grep { $FW_rooms{$FW_room}{$_} } keys %{$FW_types{$type}} ); my $type = $defs{$d}{TYPE};
} next if(!$type || $type eq "weblink");
my $rf = ($FW_room ? "&amp;room=$FW_room" : ""); # stay in the room my $allSets = " " . getAllSets($d) . " ";
############################
# Print the table headers
my @roomDevs = grep { $FW_room && ($FW_room eq "all" ||
$FW_rooms{$FW_room}{$_}) }
sort keys %{$FW_types{$type}};
my $allSets = " " . getAllSets($roomDevs[0]) . " ";
my $hasOnOff = ($allSets =~ m/ on / && $allSets =~ m/ off /); my $hasOnOff = ($allSets =~ m/ on / && $allSets =~ m/ off /);
if(!$hasOnOff) { # Check the eventMap if(!$hasOnOff) { # Check the eventMap
my $em = AttrVal($roomDevs[0], "eventMap", "") . " "; my $em = AttrVal($d, "eventMap", "") . " ";
$hasOnOff = ($em =~ m/:on / && $em =~ m/:off /); $hasOnOff = ($em =~ m/:on / && $em =~ m/:off /);
} }
pF " <tr class=\"%s\">", ($row&1)?"odd":"even";
if($FW_hiddenroom{detail}) {
pO "<td><div class=\"col1\">$d</div></td>";
my $th;
my $id = "class=\"block\"";
if($hasOnOff) {
$th = "$type</th><th>State</th><th colspan=\"2\">Set to";
} elsif($allSets =~ m/ desired-temp /) {
$th = "Device</th><th>Measured</th><th>Set to";
} elsif($type eq "at") { $th = "Scheduled commands (at)";
} elsif($type eq "weblink") { $th = ""; $id = "";
} else { } else {
$th = $type; pH "detail=$d", $d, 1, "col1";
} }
pO " <table $id id=\"$type\" summary=\"List of $type devices\">";
pO " <tr><th>$th</th></tr>" if($th && !$FW_ss);
my $row=1; $row++;
foreach my $d (@roomDevs) {
next if($FW_room && $FW_room ne "all" &&
!$FW_rooms{$FW_room}{$d});
pF " <tr class=\"%s\">", $row?"odd":"even"; my $state = $defs{$d}{STATE};
$row = ($row+1)%2; $state = "" if(!defined($state));
my $v = $defs{$d}{STATE}; my $txt = $state;
if(defined(AttrVal($d, "showtime", undef))) {
$txt = $defs{$d}{READINGS}{state}{TIME};
} elsif($allSets =~ m/ desired-temp /) {
$txt = ReadingsVal($d, "measured-temp", "");
$txt =~ s/ .*//;
$txt .= "&deg;"
} else {
my $icon;
$icon = FW_dev2image($d);
$txt = "<img src=\"$FW_ME/icons/$icon\" alt=\"$txt\"/>" if($icon);
}
pO "<td>";
pO "<table border=\"0\"><tr><td>" if(!$FW_ss);
# align needed for FireFox
$txt = "<div align=\"center\" class=\"col2\">$txt</div>" if($FW_ss);
if($hasOnOff) {
pHPlain "cmd.$d=set $d ".($state eq "on" ? "off":"on").$rf, $txt, 0;
} else {
pO $txt;
}
if(!$FW_ss) {
pO "</td>";
if($hasOnOff) { if($hasOnOff) {
my $iv = $v; # icon value pH "cmd.$d=set $d on$rf", ReplaceEventMap($d, "on", 1), 1, "col2";
my $iname = ""; pH "cmd.$d=set $d off$rf", ReplaceEventMap($d, "off", 1), 1, "col2";
if(defined(AttrVal($d, "showtime", undef))) {
$v = $defs{$d}{READINGS}{state}{TIME};
} elsif($iv) {
$iname = FW_dev2image($d);
}
$v = "" if(!defined($v));
pH "detail=$d", $d, 1;
if($iname) {
pO "<td align=\"center\"><img src=\"$FW_ME/icons/$iname\" ".
"alt=\"$v\"/></td>";
} else {
pO "<td align=\"center\">$v</td>";
}
if($allSets) {
pH "cmd.$d=set $d on$rf", ReplaceEventMap($d, "on", 1), 1;
pH "cmd.$d=set $d off$rf", ReplaceEventMap($d, "off", 1), 1;
}
} elsif($allSets =~ m/ desired-temp /) { } elsif($allSets =~ m/ desired-temp /) {
$v = ReadingsVal($d, "measured-temp", ""); $txt = ReadingsVal($d, "measured-temp", "");
$txt =~ s/ .*//;
$v =~ s/ .*//; $txt = sprintf("%2.1f", int(2*$txt)/2) if($txt =~ m/[0-9.-]/);
pH "detail=$d", $d, 1;
pO "<td align=\"center\">$v&deg;</td>";
$v = sprintf("%2.1f", int(2*$v)/2) if($v =~ m/[0-9.-]/);
my @tv = map { ($_.".0", $_+0.5) } (5..30); my @tv = map { ($_.".0", $_+0.5) } (5..30);
shift(@tv); # 5.0 is not valid shift(@tv); # 5.0 is not valid
$v = int($v*20)/$v if($v =~ m/^[0-9].$/); $txt = int($txt*20)/$txt if($txt =~ m/^[0-9].$/);
pO "<td>" .
FW_hidden("arg.$d", "desired-temp") .
FW_hidden("dev.$d", $d) .
FW_select("val.$d", \@tv, ReadingsVal($d, "desired-temp", $v)) .
FW_submit("cmd.$d", "set") .
"</td>";
} elsif($type eq "FileLog") {
pH "detail=$d", $d, 1;
pO "<td>$v</td>";
if(defined(AttrVal($d, "archivedir", undef))) {
pH "cmd=showarchive $d", "archive", 1;
}
foreach my $f (FW_fileList($defs{$d}{logfile})) {
pF " </tr>";
pF " <tr class=\"%s\"><td>$f</td>", $row?"odd":"even";
$row = ($row+1)%2;
foreach my $ln (split(",", AttrVal($d, "logtype", "text"))) {
my ($lt, $name) = split(":", $ln);
$name = $lt if(!$name);
pH "cmd=logwrapper $d $lt $f", $name, 1;
}
}
} elsif($type eq "weblink") {
pO "<td>";
FW_showWeblink($d, $defs{$d}{LINK}, $defs{$d}{WLTYPE});
pO "</td>";
} else {
pH "detail=$d", $d, 1;
pO "<td>$v</td>";
pO "<td>".
FW_hidden("arg.$d", "desired-temp") .
FW_hidden("dev.$d", $d) .
FW_select("val.$d", \@tv, ReadingsVal($d, "desired-temp", $txt)) .
"</td><td>".
FW_submit("cmd.$d", "set").
"</td>";
} }
pO " </tr>"; pO "</tr></table>";
} }
pO " </table>"; pO "</td>";
}
pO " </table><br>";
# Now the weblinks
my $buttonsDisplayed;
foreach my $d (sort @list) {
next if(IsIgnored($d));
my $type = $defs{$d}{TYPE};
next if(!$type || $type ne "weblink");
# plots navigation buttons
if(!$buttonsDisplayed &&
$defs{$d}{WLTYPE} eq "fileplot" &&
!AttrVal($d, "fixedrange", undef)) {
pO "<br>";
$buttonsDisplayed = 1;
FW_zoomLink("zoom=-1", "Zoom-in.png", "zoom in");
FW_zoomLink("zoom=1", "Zoom-out.png","zoom out");
FW_zoomLink("off=-1", "Prev.png", "prev");
FW_zoomLink("off=1", "Next.png", "next");
pO "<br>";
}
FW_showWeblink($d, $defs{$d}{LINK}, $defs{$d}{WLTYPE});
pO " <br>"; # Empty line pO " <br>"; # Empty line
} }
pO " </td></tr>\n</table>";
pO "</div>"; pO "</div>";
pO "</form>"; pO "</form>";
} }
@ -976,7 +939,9 @@ FW_logWrapper($)
$cnt =~ s/>/&gt;/g; $cnt =~ s/>/&gt;/g;
pO "<div id=\"content\">"; pO "<div id=\"content\">";
pO "<div class=\"tiny\">" if($FW_ss);
pO "<pre>$cnt</pre>"; pO "<pre>$cnt</pre>";
pO "</div>" if($FW_ss);
pO "</div>"; pO "</div>";
} else { } else {
@ -995,6 +960,7 @@ FW_logWrapper($)
pO "<img src=\"$arg\"/>"; pO "<img src=\"$arg\"/>";
} }
pO "<br>";
pH "cmd=toweblink $d:$type:$file", "Convert to weblink"; pH "cmd=toweblink $d:$type:$file", "Convert to weblink";
pO "</td>"; pO "</td>";
pO "</td></tr></table>"; pO "</td></tr></table>";
@ -1230,9 +1196,9 @@ FW_select($$$)
foreach my $v (@{$va}) { foreach my $v (@{$va}) {
if($def && $v eq $def) { if($def && $v eq $def) {
$s .= "<option selected=\"selected\" value=\"$v\">$v</option>"; $s .= "<option selected=\"selected\" value=\"$v\">$v</option>\n";
} else { } else {
$s .= "<option value=\"$v\">$v</option>"; $s .= "<option value=\"$v\">$v</option>\n";
} }
} }
$s .= "</select>"; $s .= "</select>";
@ -1244,31 +1210,11 @@ sub
FW_textfield($$) FW_textfield($$)
{ {
my ($n, $z) = @_; my ($n, $z) = @_;
return if($FW_hiddenroom{input});
my $s = "<input type=\"text\" name=\"$n\" size=\"$z\"/>"; my $s = "<input type=\"text\" name=\"$n\" size=\"$z\"/>";
return $s; return $s;
} }
##################
# Multiline (for some types of widgets) editor with submit
sub
FW_makeEdit($$$$)
{
my ($name, $type, $cmd, $val) = @_;
pO "<td>";
pO "<div id=\"edit\" style=\"display:none\"><form>";
my $eval = $val;
$eval =~ s,\\\n,\n,g;
my $ncols = $FW_ss ? 40 : 60;
pO "<textarea name=\"val.${cmd}$name\" cols=\"$ncols\" rows=\"10\">".
"$eval</textarea>";
pO "<br>" . FW_submit("cmd.${cmd}$name", "$cmd $name");
pO "</form></div>";
$eval = "<pre>$eval</pre>" if($eval =~ m/\n/);
pO "<div id=\"disp\">$eval</div>";
pO "</td>";
}
################## ##################
sub sub
FW_submit($$) FW_submit($$)
@ -1324,11 +1270,9 @@ FW_zoomLink($$$)
} }
pO "&nbsp;&nbsp;";
pO "<td>";
pHPlain "$cmd", "<img style=\"border-color:transparent\" alt=\"$alt\" ". pHPlain "$cmd", "<img style=\"border-color:transparent\" alt=\"$alt\" ".
"src=\"$FW_ME/icons/$img\"/>"; "src=\"$FW_ME/icons/$img\"/>";
pO "</td>";
} }
################## ##################
@ -1341,21 +1285,6 @@ FW_calcWeblink($$)
my $pm = AttrVal($d,"plotmode",$FW_plotmode); my $pm = AttrVal($d,"plotmode",$FW_plotmode);
return if($pm eq "gnuplot"); return if($pm eq "gnuplot");
if(!$d) {
my $cnt = 0;
foreach my $d (sort keys %defs ) {
next if($defs{$d}{TYPE} ne "weblink");
next if($defs{$d}{WLTYPE} ne "fileplot");
next if(!$FW_room || ($FW_room ne "all" && !$FW_rooms{$FW_room}{$d}));
next if(AttrVal($d, "fixedrange", undef));
next if($pm eq "gnuplot");
$cnt++;
}
return $cnt;
}
return if(!$defs{$wl}); return if(!$defs{$wl});
my $fr = AttrVal($wl, "fixedrange", undef); my $fr = AttrVal($wl, "fixedrange", undef);
@ -1542,7 +1471,9 @@ FW_style($$)
sub sub
pO(@) pO(@)
{ {
$FW_RET .= shift; my $arg = shift;
return if(!defined($arg));
$FW_RET .= $arg;
$FW_RET .= "\n"; $FW_RET .= "\n";
} }
@ -1551,32 +1482,25 @@ pO(@)
sub sub
pH(@) pH(@)
{ {
my ($link, $txt, $td) = @_; my ($link, $txt, $td, $class) = @_;
pO "<td>" if($td); pO "<td>" if($td);
$link = ($link =~ m,^/,) ? $link : "$FW_ME?$link"; $link = ($link =~ m,^/,) ? $link : "$FW_ME?$link";
if($FW_ss || $FW_tp) { $class = " class=\"$class\"" if($class);
my $sp = "&nbsp;&nbsp;"; $class = "" if(!defined($class));
pO "<a onClick=\"location.href='$link'\"><div class=\"href\">$sp$txt$sp</div></a>";
if($FW_ss) { # No pointer change if using onClick
pO "<a onClick=\"location.href='$link'\"><div $class>$txt</div></a>";
} elsif($FW_tp) {
pO "<a onClick=\"location.href='$link'\"><div $class>$txt</div></a>";
} else { } else {
pO "<a href=\"$link\">$txt</a>"; pO "<a href=\"$link\">$txt</a>";
} }
pO "</td>" if($td); pO "</td>" if($td);
} }
sub
pHJava(@)
{
my ($link, $txt) = @_;
if($FW_ss || $FW_tp) {
my $sp = "&nbsp;&nbsp;";
pO "<a onClick=\"$link\"><div class=\"href\">$sp$txt$sp</div></a>";
} else {
pO "<a onClick=\"$link\">$txt</a>";
}
}
sub sub
pHPlain(@) pHPlain(@)
{ {
@ -1607,7 +1531,7 @@ sub
fC($) fC($)
{ {
my ($cmd) = @_; my ($cmd) = @_;
#Log 0, "Calling $cmd"; Log 0, "Calling $cmd";
my $ret = AnalyzeCommand(undef, $cmd); my $ret = AnalyzeCommand(undef, $cmd);
return $ret; return $ret;
} }
@ -1706,20 +1630,53 @@ FW_ReadIcons()
sub sub
FW_dev2image($) FW_dev2image($)
{ {
my ($d) = @_; my ($name) = @_;
my $iname = ""; my $icon = "";
return $iname if(!$d || !$defs{$d}); return $icon if(!$name || !$defs{$name});
my ($type, $iv) = ($defs{$d}{TYPE}, $defs{$d}{STATE}); my ($type, $state) = ($defs{$name}{TYPE}, $defs{$name}{STATE});
return $iname if(!$type || !$iv); return $icon if(!$type || !$state);
$iv =~ s/ .*//; # Want to be able to have icons for "on-for-timer xxx" $state =~ s/ .*//; # Want to be able to have icons for "on-for-timer xxx"
$iname = $FW_icons{$iv} if($FW_icons{$iv}); # on.png $icon = $FW_icons{$state} if($FW_icons{$state}); # on.png
$iname = $FW_icons{$type} if($FW_icons{$type}); # FS20.png $icon = $FW_icons{$type} if($FW_icons{$type}); # FS20.png
$iname = $FW_icons{"$type.$iv"} if($FW_icons{"$type.$iv"}); # FS20.on.png $icon = $FW_icons{"$type.$state"} if($FW_icons{"$type.$state"}); # FS20.on.png
$iname = $FW_icons{$d} if($FW_icons{$d}); # lamp.png $icon = $FW_icons{$name} if($FW_icons{$name}); # lamp.png
$iname = $FW_icons{"$d.$iv"} if($FW_icons{"$d.$iv"}); # lamp.on.png $icon = $FW_icons{"$name.$state"} if($FW_icons{"$name.$state"}); # lamp.on.png
return $iname; return $icon;
}
sub
FW_makeEdit($$$)
{
my ($name, $n, $val) = @_;
# Toggle Edit-Window visibility script.
my $pgm = "Javascript:" .
"s=document.getElementById('edit').style;".
"s.display = s.display=='none' ? 'block' : 'none';".
"s=document.getElementById('disp').style;".
"s.display = s.display=='none' ? 'block' : 'none';";
pO "<td>";
pO "<a onClick=\"$pgm\">$n</a>";
pO "</td>";
$val =~ s,\\\n,\n,g;
my $eval = $val;
$eval = "<pre>$eval</pre>" if($eval =~ m/\n/);
pO "<td>";
pO "<div class=\"dval\" id=\"disp\">$eval</div>";
pO "</td>";
pO "</tr><tr><td colspan=\"2\">";
pO "<div id=\"edit\" style=\"display:none\"><form>";
my $cmd = "modify";
my $ncols = $FW_ss ? 30 : 60;
pO "<textarea name=\"val.${cmd}$name\" cols=\"$ncols\" rows=\"10\">".
"$val</textarea>";
pO "<br>" . FW_submit("cmd.${cmd}$name", "$cmd $name");
pO "</form></div>";
pO "</td>";
} }
1; 1;

BIN
fhem/webfrontend/pgm2/back.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

17
fhem/webfrontend/pgm2/style.css
View File

@ -1,21 +1,20 @@
body { background-color: #FFFFE7;} body { background-color: #FFFFE7; font-family:Arial, sans-serif; font-size:16px;}
input { font-family:Arial, sans-serif; font-size:16px; }
select { font-family:Arial, sans-serif; font-size:16px; }
#logo { position:absolute; top:10px; left:20px; width:140px; } #logo { position:absolute; top:10px; left:20px; width:140px; }
#menu { position:absolute; top:120px;left:20px; width:140px; } #menu { position:absolute; top:120px;left:20px; width:140px; }
#hdr { position:absolute; top:10px; left:180px; } #hdr { position:absolute; top:10px; left:180px; }
#content { position:absolute; top:50px; left:180px; bottom:20px; right:10px; } #content { position:absolute; top:50px; left:180px; bottom:20px; right:10px; }
a { color: #278727; } a { color: #278727; }
img { border-style: none; }
table.block { border:1px solid gray; width: 100%; background: #F8F8E0; } .wide { width:100%; }
table.block { border:1px solid gray; background: #F8F8E0; }
table.block tr.odd { background: #F0F0D8; } table.block tr.odd { background: #F0F0D8; }
table.block tr.sel { background: #F0F0D8; } table.block tr.sel { background: #F0F0D8; }
table { -moz-border-radius:8px; border-radius:8px; } table { -moz-border-radius:8px; border-radius:8px; }
table#room { background: #D7FFFF; } table#room { border:1px solid gray; width: 100%; background: #D7FFFF; }
table#room tr.sel { background: #A0FFFF; } table#room tr.sel { background: #A0FFFF; }
/* Customize specific devices */
/*
table#FS20 { background: #FF8080; }
table#FS20 tr.odd { background: #E08080; }
*/

52
fhem/webfrontend/pgm2/style_smallscreen.css
View File

@ -1,39 +1,51 @@
body { background-color: #FFFFE7; } body { background-color: #FFFFE7;
font-family:Arial, sans-serif; font-size:24px;
}
textarea { font-family:Arial, sans-serif; font-size:16px}
input { font-family:Arial, sans-serif; font-size:16px}
select { font-family:Arial, sans-serif; font-size:16px}
#back { position:absolute; top: 2px; left:18px; }
#logo { position:absolute; top: 2px; left: 2px; } #logo { position:absolute; top: 2px; left: 2px; }
#menu { position:absolute; top: 2px; left:65px; } #menu { position:absolute; top: 2px; left:65px; }
#hdr { position:absolute; top:40px; left:65px; } #hdr { position:absolute; top:40px; left:65px; }
#content { position:absolute; top:85px; left: 5px; } #content { position:absolute; top:85px; left: 0px; right: 0px;}
a { color: #278727; } a { color: #278727; }
img { border-style: none; }
div.href { /* Push buttons */ div.col1 { width: 188px; height: 30px; white-space: nowrap; }
padding:0; border:1px solid gray; height:1.5em; div.col2 { width: 108px; height: 30px;
-webkit-box-pack: center; -moz-box-pack: center; box-pack: center;
-moz-border-radius:0.5em; border-radius:0.5em; white-space: wrap;
font-size:16px;
}
div.col1, div.col2 {
overflow: hidden; text-overflow: ellipsis;
padding-top: 10px; padding-bottom: 10px;
padding-left: 5px; padding-right: 5px;
display: -webkit-box; -webkit-box-align: center; display: -webkit-box; -webkit-box-align: center;
display: -moz-box; -moz-box-align: center; display: -moz-box; -moz-box-align: center;
background-image:-webkit-gradient(linear, right top, right bottom, background-image:-webkit-gradient(linear, right top, right bottom,
color-stop(0%,#fffff7), color-stop(49%,#ffffc7)); color-stop(0%,#fffff7), color-stop(100%,#ffffb7));
background-image:-moz-linear-gradient(top, #fffff7, #ffffc7); background-image:-moz-linear-gradient(top, #fffff7, #ffffb7);
background-image:-o-linear-gradient(top, #fffff7, #ffffc7); background-image:-o-linear-gradient(top, #fffff7, #ffffb7);
-webkit-box-shadow: 0 0.15em 0.15em rgba(0,0,0, .5);
-moz-box-shadow: 0 0.15em 0.15em rgba(0,0,0, .5);
box-shadow: 0 0.15em 0.15em rgba(0,0,0, .5);
} }
table.block { border:1px solid gray; width: 100%; background: #F8F8E0; } div.dname, div.dval {
width: 152px;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
font-size:16px;
}
div.tiny { font-size:10px; }
table.block { width: 320px; background: #F8F8E0; border-spacing:0px; }
table.block tr { border:1px solid gray; border-spacing:0px; }
table.block tr.odd { background: #F0F0D8; } table.block tr.odd { background: #F0F0D8; }
table.block tr.sel { background: #F0F0D8; } table.block tr.sel { background: #F0F0D8; }
table.block td { width: 150px; };
table { -moz-border-radius:8px; border-radius:8px; } table { -moz-border-radius:8px; border-radius:8px; }
table#room { background: #D7FFFF; } table#room { background: #D7FFFF; }
table#room tr.sel { background: #A0FFFF; } table#room tr.sel { background: #A0FFFF; }
/* Customize specific devices */
/*
table#FS20 { background: #FF8080; }
table#FS20 tr.odd { background: #E08080; }
*/

40
fhem/webfrontend/pgm2/style_touchpad.css
View File

@ -1,39 +1,23 @@
body { background-color: #FFFFE7;} body { background-color: #FFFFE7;
font-family:Arial, sans-serif; font-size:16px;
}
textarea { font-family:Arial, sans-serif; font-size:16px}
input { font-family:Arial, sans-serif; font-size:16px}
select { font-family:Arial, sans-serif; font-size:16px}
#logo { position:absolute; top:10px; left:10px; width:100px; } #logo { position:absolute; top:10px; left:10px; width:100px; }
#menu { position:absolute; top:120px;left:10px; width:100px; } #menu { position:absolute; top:120px;left:10px; width:100px; }
#hdr { position:absolute; top:10px; left:120px; } #hdr { position:absolute; top:10px; left:140px; }
#content { position:absolute; top:50px; left:120px; bottom:20px; right:10px; } #content { position:absolute; top:50px; left:140px; bottom:20px; right:10px; }
a { color: #278727; } a { color: #278727; }
div.href { /* Push buttons */
padding:0; border:1px solid gray; height:1.5em;
-moz-border-radius:0.5em; border-radius:0.5em;
display: -webkit-box; -webkit-box-align: center;
display: -moz-box; -moz-box-align: center;
background-image:-webkit-gradient(linear, right top, right bottom,
color-stop(0%,#fffff7), color-stop(49%,#ffffc7));
background-image:-moz-linear-gradient(top, #fffff7, #ffffc7);
background-image:-o-linear-gradient(top, #fffff7, #ffffc7);
-webkit-box-shadow: 0 0.15em 0.15em rgba(0,0,0, .5);
-moz-box-shadow: 0 0.15em 0.15em rgba(0,0,0, .5);
box-shadow: 0 0.15em 0.15em rgba(0,0,0, .5);
}
table.block { border:1px solid gray; width: 100%; background: #F8F8E0; } table.block { border:1px solid gray; width: 100%; background: #F8F8E0; }
table.block tr.odd { background: #F0F0D8; } table.block tr.odd { background: #F0F0D8; }
table.block tr.sel { background: #F0F0D8; } table.block tr.sel { background: #F0F0D8; }
table { -moz-border-radius:8px; border-radius:8px; } table { -moz-border-radius:8px; border-radius:8px; }
table#room { background: #D7FFFF; } .col1, .col2 { padding: 8px; }
table#room tr.sel { background: #A0FFFF; } .dname, .dval { padding: 0px; font-size: 14px; }
/* Customize specific devices */ table#room { border:1px solid gray; width: 100%; background: #D7FFFF; }
/* table#room tr.sel { background: #A0FFFF; }
table#FS20 { background: #FF8080; }
table#FS20 tr.odd { background: #E08080; }
*/