diff --git a/fhem/CHANGED b/fhem/CHANGED index 602f829ab..73b6647d4 100644 --- a/fhem/CHANGED +++ b/fhem/CHANGED @@ -1,6 +1,8 @@ # 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. - SVN + - feature: DASHBOARD: Dashboard get Tabs. Redesign saving of Group + positioning. - bugfix: SYSMON: Log Warnings, unnoetige Readings erkenen und entfernen - feature: Setting of controller parameter now possible for LUXTRONIK2 - feature: new module 71_YAMAHA_BD.pm to control Yamaha Blu-Ray diff --git a/fhem/FHEM/95_Dashboard.pm b/fhem/FHEM/95_Dashboard.pm index fb3ecc8ed..ae2b06114 100644 --- a/fhem/FHEM/95_Dashboard.pm +++ b/fhem/FHEM/95_Dashboard.pm @@ -4,31 +4,39 @@ # ######################################################################################## # Released : 20.12.2013 @svenson08 -# Version : 1.15 +# Version : 2.00 # Revisions: -# 0001: Released to testers -# 0002: Don't show link on Groups with WebLinks. Hide GroupToogle Button (new Attribut dashboard_showtooglebuttons). +# 1.00: Released to testers +# 1.02: Don't show link on Groups with WebLinks. Hide GroupToogle Button (new Attribut dashboard_showtooglebuttons). # Set the Columnheight (new Attribur dashboard_colheight). -# 0003: Dashboard Entry over the Room-List, set the Room "Dashboard" to hiddenroom. Build weblink independently. +# 1.03: Dashboard Entry over the Room-List, set the Room "Dashboard" to hiddenroom. Build weblink independently. # Dashboard Row on Top and Bottom (no separately columns). Detail Button # to jump into define Detailview. Don't show link on Groups with SVG and readingsGroup. -# 0004: Sort the Groupentrys (@gemx). Hide Room Dashboard. -# 0005: Fix dashboard_row center -# 0006: Released Version 1.10. Rename Module from 95_FWViews to 95_Dashboard. Rename view_* Attributes to +# 1.04: Sort the Groupentrys (@gemx). Hide Room Dashboard. +# 1.05: Fix dashboard_row center +# 1.10: Released Version 1.10. Rename Module from 95_FWViews to 95_Dashboard. Rename view_* Attributes to # dashboard_*. Rename fhemweb_FWViews.js to dashboard.js. Cleanup CSS. Reduce single png-Images to one File only. # Fix duplicated run of JS Script. Dashboard STAT show "Missing File" Information if installation is wrong. -# 0007: use jquery.min and jquery-ui.min. add dashboard_debug attribute. Check dashboard_sorting value plausibility. +# 1.11: use jquery.min and jquery-ui.min. add dashboard_debug attribute. Check dashboard_sorting value plausibility. # Change default Values. First Release to FHEM SVN. -# 0008: Add Germyn command_ref Text. Add Default Values to command_ref (@cotecmania). Fix identification of an existing +# 1.12: Add Germyn command_ref Text. Add Default Values to command_ref (@cotecmania). Fix identification of an existing # Dashboard-Weblink (Message *_weblink already defined, delete it first on rereadcfg). Remove white space from # both ends of a group in dashboard_groups. Fix dashboard_sorting check. Wrong added hiddenroom to FHEMWEB # Browsersession fixed. Buttonbar can now placed on top or bottom of the Dashboard (@cotecmania). # Dashboard is always edited out the Room Dashboard (@justme1968) # Fix Dashboard Entry over the Room-List after 01_FHEMWEB.pm changes +# 2.00: First Changes vor Dashboard Tabs. Change while saving positioning. Alterd max/min Group positioning. +# Many changes in Dasboard.js. Replaced the attributes dashboard_groups, dashboard_colheight and dashboard_sorting +# Many new Attributes vor Tabs, Dashboard sizing. Set of mimimal attributes (helpful for beginners). +# Provisionally the columns widths are dependent on the total width of the Dashboard. # # Known Bugs/Todos: -# Add/Write FHEM Wiki-Doku -# Nachträglich hinzufügen von gruppen +# TODO: demo.fhem.cfg +# TODO: sorting attribut with value 1 -> erase attribute? +# TODO: dashboard_colwidth -> <1.col, 2.col, 3.col ...> only <1.col>, first col = value, split rest on colcount. +# TODO: Tab top, bottom, hidden +# BUG: Longpoll dosen't work on Dashboard +# Log 1, "[DASHBOARD simple debug] '".$g."' "; ######################################################################################## # # This program is free software: you can redistribute it and/or modify @@ -51,6 +59,7 @@ # http://jsfiddle.net/adamboduch/e6zdX/1/ # http://www.innovativephp.com/jquery-resizable-practical-examples-and-demos/ # http://jsfiddle.net/raulfernandez/mAuxn/ +# http://jsfiddle.net/zeTP8/ package main; @@ -67,10 +76,12 @@ use vars qw(%FW_types); # device types # --------------------------- Global Variable ----------------------------------------------- my %group; +#my %dashboarddata; my $fwjquery = "jquery.min.js"; my $fwjqueryui = "jquery-ui.min.js"; my $dashboardname = "Dashboard"; # Link Text my $dashboardhiddenroom = "DashboardRoom"; # Hiddenroom +my $dashboardversion = "2.00"; # ------------------------------------------------------------------------------------------- sub Dashboard_Initialize ($) { @@ -79,20 +90,45 @@ sub Dashboard_Initialize ($) { $hash->{DefFn} = "Dashboard_define"; $hash->{UndefFn} = "Dashboard_Undef"; $hash->{FW_detailFn} = "Dashboard_detailFn"; + $hash->{AttrFn} = "Dashboard_Attr"; $hash->{AttrList} = "disable:0,1 ". - "dashboard_sorting ". - "dashboard_colwidth ". - "dashboard_colheight ". + "dashboard_colcount:1,2,3,4,5 ". + "dashboard_colwidth ". # obsolet -> always calculated to 100%. future uses for separate columns wide + "dashboard_debug:0,1 ". + "dashboard_lockstate:unlock,lock ". "dashboard_rowtopheight ". "dashboard_rowbottomheight ". - "dashboard_groups ". - "dashboard_lockstate:unlock,lock ". - "dashboard_colcount:1,2,3,4,5 ". + "dashboard_row:top,center,bottom,top-center,center-bottom,top-center-bottom ". "dashboard_showbuttonbar:top,bottom,hidden ". "dashboard_showhelper:0,1 ". - "dashboard_showtooglebuttons:0,1 ". - "dashboard_row:top,center,bottom,top-center,center-bottom,top-center-bottom ". - "dashboard_debug:0,1 ". + "dashboard_showtooglebuttons:0,1 ". + + #new attribute + "dashboard_tabcount:1,2,3,4,5 ". + "dashboard_activetab:1,2,3,4,5 ". + "dashboard_tab1name ". + "dashboard_tab2name ". + "dashboard_tab3name ". + "dashboard_tab4name ". + "dashboard_tab5name ". + "dashboard_tab1groups ". + "dashboard_tab2groups ". + "dashboard_tab3groups ". + "dashboard_tab4groups ". + "dashboard_tab5groups ". + "dashboard_tab1sorting ". + "dashboard_tab2sorting ". + "dashboard_tab3sorting ". + "dashboard_tab4sorting ". + "dashboard_tab5sorting ". + "dashboard_width ". + "dashboard_rowcenterheight ". + + #obsolete - erase in future releases + "dashboard_groups ". # obsolet -> erase in future releases + "dashboard_colheight ". # obsolet -> erase in future releases + "dashboard_sorting ". # obsolet -> komplett ersetzen + $readingFnAttributes; $data{FWEXT}{Dashboardx}{LINK} = "?room=".$dashboardhiddenroom; @@ -112,12 +148,11 @@ sub DashboardAsHtml($) my $name = $defs{$d}{NAME}; my $id = $defs{$d}{NR}; - ############# Read Dashboard Attributes and set Default-Values ############################## + ######################### Read Dashboard Attributes and set Default-Values #################################### my $disable = AttrVal($defs{$d}{NAME}, "disable", 0); - my $sorting = AttrVal($defs{$d}{NAME}, "dashboard_sorting", ","); my $colcount = AttrVal($defs{$d}{NAME}, "dashboard_colcount", 1); my $colwidth = AttrVal($defs{$d}{NAME}, "dashboard_colwidth", 320); - my $colheight = AttrVal($defs{$d}{NAME}, "dashboard_colheight", 400); + my $colheight = AttrVal($defs{$d}{NAME}, "dashboard_rowcenterheight", 400); my $rowtopheight = AttrVal($defs{$d}{NAME}, "dashboard_rowtopheight", 250); my $rowbottomheight = AttrVal($defs{$d}{NAME}, "dashboard_rowbottomheight", 250); my $showhelper = AttrVal($defs{$d}{NAME}, "dashboard_showhelper", 1); @@ -126,115 +161,188 @@ sub DashboardAsHtml($) my $showtooglebuttons = AttrVal($defs{$d}{NAME}, "dashboard_showtooglebuttons", 1); my $row = AttrVal($defs{$d}{NAME}, "dashboard_row", "center"); my $debug = AttrVal($defs{$d}{NAME}, "dashboard_debug", "0"); - my $dashboardgroups = AttrVal($defs{$d}{NAME}, "dashboard_groups", ""); + + my $activetab = AttrVal($defs{$d}{NAME}, "dashboard_activetab", 1); + my $tabcount = AttrVal($defs{$d}{NAME}, "dashboard_tabcount", 1); + my $dbwidth = AttrVal($defs{$d}{NAME}, "dashboard_width", "100%"); + my @tabnames = (AttrVal($defs{$d}{NAME}, "dashboard_tab1name", "Dashboard-Tab 1"), + AttrVal($defs{$d}{NAME}, "dashboard_tab2name", "Dashboard-Tab 2"), + AttrVal($defs{$d}{NAME}, "dashboard_tab3name", "Dashboard-Tab 3"), + AttrVal($defs{$d}{NAME}, "dashboard_tab4name", "Dashboard-Tab 4"), + AttrVal($defs{$d}{NAME}, "dashboard_tab5name", "Dashboard-Tab 5")); + my @tabgroups = (AttrVal($defs{$d}{NAME}, "dashboard_tab1groups", ""), + AttrVal($defs{$d}{NAME}, "dashboard_tab2groups", ""), + AttrVal($defs{$d}{NAME}, "dashboard_tab3groups", ""), + AttrVal($defs{$d}{NAME}, "dashboard_tab4groups", ""), + AttrVal($defs{$d}{NAME}, "dashboard_tab5groups", "")); + my @tabsortings = (AttrVal($defs{$d}{NAME}, "dashboard_tab1sorting", ""), + AttrVal($defs{$d}{NAME}, "dashboard_tab2sorting", ""), + AttrVal($defs{$d}{NAME}, "dashboard_tab3sorting", ""), + AttrVal($defs{$d}{NAME}, "dashboard_tab4sorting", ""), + AttrVal($defs{$d}{NAME}, "dashboard_tab5sorting", "")); + ############################################################################################# #---------------- Dashboard is always edited out the Room Dashboard ------------------------- - if ($FW_room ne $dashboardhiddenroom) { #Dashboard is always edited out the Room Dashboard - if ($showbuttonbar eq "hidden") {$showbuttonbar = "top" }; - $showhelper = 1; - $showtooglebuttons = 1; - $lockstate = "unlock"; + #if ($FW_room ne $dashboardhiddenroom) { #Dashboard is always edited out the Room Dashboard +# if ($showbuttonbar eq "hidden") {$showbuttonbar = "top" }; +# $showhelper = 1; +# $showtooglebuttons = 1; +# $lockstate = "unlock"; + #} + ################ temp. deaktiviert + #---------------------------------------------------------------------------- + + if ($disable == 1) { + $defs{$d}{STATE} = "disabled"; + return $ret; + } + unless (@tabgroups) { + $defs{$d}{STATE} = "No Groups set"; + return $ret; } - #---------------------------------------------------------------------------- - - if ($disable == 1) { $defs{$d}{STATE} = "disabled"; } - if ($dashboardgroups eq "") { $defs{$d}{STATE} = "No Groups set"; } - return $ret if (($dashboardgroups eq "") || ($disable == 1)); if ($debug == 1) { $debugfield = "edit" }; if ($showbuttonbar eq "hidden") { $lockstate = "lock" }; - if (not ($colwidth =~ /^\d+$/)) { $colwidth = 320 }; + if ($activetab > $tabcount) { $activetab = $tabcount; } + + #$colwidth =~ tr/,/:/; #future release + #if ($colwidth =~/[a-zA-Z]+$/) { Log 1, "[DASHBOARD simple debug] Nicht nur zahlen ".$colwidth; } #future release + if (not ($colwidth =~ /^\d+$/)) { $colwidth = 320 }; #current + if ( ($colwidth =~ /[a-zA-Z]/)) { $colwidth = 150 }; #current + if (not ($colheight =~ /^\d+$/)) { $colheight = 400 }; if (not ($rowtopheight =~ /^\d+$/)) { $rowtopheight = 50 }; if (not ($rowbottomheight =~ /^\d+$/)) { $rowbottomheight = 50 }; + #------------------- Check dashboard_sorting on false content ------------------------------------ - if (($sorting !~ /[0-9]/ || $sorting !~ /:/ || $sorting !~ /,/ ) && ($sorting ne ",")){ - Log3 $d, 3, "[".$name."] Value of attribut dashboard_sorting is wrong. Saved sorting can not be set. Fix Value or delete the Attribute."; - } else { Log3 $d, 5, "[".$name."] Sorting OK: ".$sorting; } + for (my $i=0;$i<@tabsortings;$i++){ + if (($tabsortings[$i-1] !~ /[0-9]/ || $tabsortings[$i-1] !~ /:/ || $tabsortings[$i-1] !~ /,/ ) && ($tabsortings[$i-1] ne "," && $tabsortings[$i-1] ne "")){ + Log3 $d, 3, "[".$name." V".$dashboardversion."] Value of attribut dashboard_tab".$i."sorting is wrong. Saved sorting can not be set. Fix Value or delete the Attribute. [".$tabsortings[$i-1]."]"; + } else { Log3 $d, 5, "[".$name." V".$dashboardversion."] Sorting OK or Empty: dashboard_tab".$i."sorting "; } + } #------------------------------------------------------------------------------------------------- - %group = BuildGroupList($dashboardgroups); - $ret .= ""; - ############################ Dashboard-Optionbar ############################################ - if ($showbuttonbar eq "top") { $ret .= BuildButtonBar($d); } - ############################################################################################# - $ret .= ""; + $ret .= ""; - ##################### Top Row (only one Column) ############################################# - if ($row eq "top-center-bottom" || $row eq "top-center" || $row eq "top"){ - $ret .= ""; - } - ############################################################################################# + $ret .= ""; + %group = BuildGroupList($tabgroups[$t]); + $ret .= "
"; + $ret .= "
"; - $ret .= ""; - $ret .= ""; - $ret .= ""; - $ret .= "
"; + $ret .= ""; + $ret .= ""; + $ret .= "
"; - $ret .= "
"; - $ret .= "
"; - $ret .= "
"; - $ret .= "
"; - $ret .= "
"; + ########################### Dashboard Tab-Liste ############################################## + $ret .= "
    "; + if ($showbuttonbar eq "top") { $ret .= BuildButtonBar($d,$showbuttonbar); } + for (my $i=0;$i<$tabcount;$i++){ $ret .= "
  • ".trim($tabnames[$i])."
    • "; } + $ret .= "
"; + ############################################################################################## - ##################### Center Row (max. 5 Column) ############################################ - if ($row eq "top-center-bottom" || $row eq "top-center" || $row eq "center-bottom" || $row eq "center"){ - $ret .= "
"; - $ret .= "
"; - $ret .= "
"; - my @dashboardgroups = split(",", $dashboardgroups); - for (my $i=0;$i<@dashboardgroups;$i++){ - $dashboardgroups[$i] = trim($dashboardgroups[$i]); #remove white space from both ends of a string - $dashboardgroups[$i] =~ tr/<+>/ /; #Fix Groupname if use wrong Groupnames from Bestpractice beginner configuration - $ret .= "
"; - $ret .= "
"; - $ret .= "
".$dashboardgroups[$i]."
"; - $ret .= "
"; - $ret .= BuildGroup($dashboardgroups[$i]); - $ret .= "
"; - $ret .= "
"; - $ret .= "
"; + for (my $t=0;$t<$tabcount;$t++){ + my @tabgroup = split(",", $tabgroups[$t]); #Set temp. position for groups without an stored position + for (my $i=0;$i<@tabgroup;$i++){ + if (index($tabsortings[$t],trim($tabgroup[$i])) < 0) { $tabsortings[$t] = $tabsortings[$t]."t".$t."c".GetMaxColumnId($row,$colcount).",".trim($tabgroup[$i]).",true,0,0:"; } } - $ret .= "
"; - $ret .= BuildEmptyColumn($colcount); - $ret .= "
"; - $ret .= "
"; # dashboard\">"; + ##################### Top Row (only one Column) ############################################# + if ($row eq "top-center-bottom" || $row eq "top-center" || $row eq "top"){ $ret .= BuildDashboardTopRow($t,$id,$tabgroups[$t],$tabsortings[$t]); } + ##################### Center Row (max. 5 Column) ############################################ + if ($row eq "top-center-bottom" || $row eq "top-center" || $row eq "center-bottom" || $row eq "center"){ $ret .= BuildDashboardCenterRow($t,$id,$tabgroups[$t],$tabsortings[$t],$colcount);} + ############################# Bottom Row (only one Column) ############################################ + if ($row eq "top-center-bottom" || $row eq "center-bottom" || $row eq "bottom"){ $ret .= BuildDashboardBottomRow($t,$id,$tabgroups[$t],$tabsortings[$t]); } + ############################################################################################# + $ret .= "
"; + $ret .= " "; + $ret .= " "; } - ############################################################################################# - - ##################### Bottom Row (only one Column) ########################################## - if ($row eq "top-center-bottom" || $row eq "center-bottom" || $row eq "bottom"){ - $ret .= ""; - $ret .= "
"; - $ret .= "
"; - $ret .= "
"; - $ret .= "
"; - $ret .= ""; - } - ############################################################################################# - - ############################ Dashboard-Optionbar ############################################ - if ($showbuttonbar eq "bottom") { $ret .= BuildButtonBar($d); } - ############################################################################################# - + if ($showbuttonbar eq "bottom") { $ret .= BuildButtonBar($d,$showbuttonbar); } + $ret .= ""; $ret .= ""; - + return $ret; } -sub BuildButtonBar($){ - my ($d) = @_; +sub BuildDashboardTopRow($$$$){ + my ($t,$id, $dbgroups, $dbsorting) = @_; + my $ret; + $ret .= ""; + $ret .= "
"; + $ret .= "
"; + $ret .= BuildGroupWidgets($t,"100",$id,$dbgroups,$dbsorting); + $ret .= "
"; + $ret .= "
"; + $ret .= ""; + return $ret; +} + +sub BuildDashboardCenterRow($$$$$){ + my ($t,$id, $dbgroups, $dbsorting, $colcount) = @_; + my $ret; + $ret .= ""; + $ret .= "
"; + + for (my $i=0;$i<$colcount;$i++){ + $ret .= "
"; + $ret .= BuildGroupWidgets($t,$i,$id,$dbgroups,$dbsorting); + $ret .= "
"; + } + $ret .= "
"; + $ret .= ""; + return $ret; +} + +sub BuildDashboardBottomRow($$$$){ + my ($t,$id, $dbgroups, $dbsorting) = @_; + my $ret; + $ret .= ""; + $ret .= "
"; + $ret .= "
"; + $ret .= BuildGroupWidgets($t,"200",$id,$dbgroups,$dbsorting); + $ret .= "
"; + $ret .= "
"; + $ret .= ""; + return $ret; +} + +sub BuildButtonBar($$){ + my ($d,$pos) = @_; my $ret; - $ret .= "
"; + $ret .= "
"; $ret .= "
Set
"; $ret .= "
Lock
"; $ret .= "
Detail
"; - $ret .= "
"; + $ret .= "
"; + return $ret; +} + +sub BuildGroupWidgets($$$$$) { + my ($tab,$column,$id,$dbgroups, $dbsorting) = @_; + my $ret = ""; + + my $counter = 0; + my @storedsorting = split(":", $dbsorting); + foreach my $singlesorting (@storedsorting) { + my @groupdata = split(",", $singlesorting); + if (index($dbsorting, "t".$tab."c".$column.",".$groupdata[1]) >= 0 && index($dbgroups, $groupdata[1]) >= 0 && $groupdata[1] ne "" ) { #gruppe auch für tab hinterlegt + $ret .= "
"; + $ret .= "
"; + $ret .= "
".$groupdata[1]."
"; + $ret .= "
"; + $ret .= BuildGroup($groupdata[1]); + $ret .= "
"; + $ret .= "
"; + $ret .= "
"; + $counter++; + } + } + + return $ret; } sub BuildGroupList($) { -#---------------------------------------------------------------------------------------------------------- my @dashboardgroups = split(",", $_[0]); #array for all groups to build an widget my %group = (); @@ -247,7 +355,6 @@ sub BuildGroupList($) { } } } -#---------------------------------------------------------------------------------------------------------- return %group; } @@ -318,38 +425,33 @@ sub BuildGroup($) return $ret; } -sub BuildEmptyColumn($) { - my ($colcount) = @_; - my $ret = ""; - my $id = 1; - - if ($colcount == 1) { return $ret } else { $colcount = $colcount -1}; - for (my $i=0;$i<$colcount;$i++){ - ########### Empty Column ################## - $id = $id+$i; - $ret .= "
"; - ########################################### - } - return $ret; +sub GetMaxColumnId($$) { + my ($row, $colcount) = @_; + my $maxcolid = "0"; + + if (index($row,"bottom") > 0) { $maxcolid = "200"; } + elsif (index($row,"center") > 0) { $maxcolid = $colcount-1; } + elsif (index($row,"top") > 0) { $maxcolid = "100"; } + return $maxcolid; } sub CheckInstallation($) { my ($hash) = @_; unless (-e $FW_dir."/pgm2/".$fwjquery) { - Log3 $hash, 3, "[".$hash->{NAME}. "] Missing File ".$FW_dir."/pgm2/".$fwjquery; + Log3 $hash, 3, "[".$hash->{NAME}. " V".$dashboardversion."] Missing File ".$FW_dir."/pgm2/".$fwjquery; $hash->{STATE} = 'Missing File, see LogFile for Details'; } unless (-e $FW_dir."/pgm2/".$fwjqueryui) { - Log3 $hash, 3, "[".$hash->{NAME}. "] Missing File ".$FW_dir."/pgm2/".$fwjqueryui; + Log3 $hash, 3, "[".$hash->{NAME}. " V".$dashboardversion."] Missing File ".$FW_dir."/pgm2/".$fwjqueryui; $hash->{STATE} = 'Missing File, see LogFile for Details'; } unless (-e $FW_dir."/pgm2/dashboard.js") { - Log3 $hash, 3, "[".$hash->{NAME}. "] Missing File ".$FW_dir."/pgm2/dashboard.js"; + Log3 $hash, 3, "[".$hash->{NAME}. " V".$dashboardversion."] Missing File ".$FW_dir."/pgm2/dashboard.js"; $hash->{STATE} = 'Missing File, see LogFile for Details'; } unless (-e $FW_icondir."/default/dashboardicons.png") { - Log3 $hash, 3, "[".$hash->{NAME}. "] Missing File ".$FW_icondir."/default/dashboardicons.png"; + Log3 $hash, 3, "[".$hash->{NAME}. " V".$dashboardversion."] Missing File ".$FW_icondir."/default/dashboardicons.png"; $hash->{STATE} = 'Missing File, see LogFile for Details'; } } @@ -364,18 +466,75 @@ sub CheckDashboardEntry($) { InternalTimer ($timeToExec, 'CheckDashboardAttributUssage', $hash, 0); } -sub CheckDashboardAttributUssage($) { # replaces old disused attributes and their values +sub CheckDashboardAttributUssage($) { # replaces old disused attributes and their values | set minimal attributes my ($hash) = @_; my $d = $hash->{NAME}; + my $detailnote = ""; - # Replae older dashboard_showbuttonbar value (outdated 01.2014) + # --------- Set minimal Attributes in the hope to make it easier for beginners -------------------- + my $tabcount = AttrVal($defs{$d}{NAME}, "dashboard_tabcount", "0"); + if ($tabcount eq "0") { FW_fC("attr ".$d." dashboard_tabcount 1"); } + my $tab1groups = AttrVal($defs{$d}{NAME}, "dashboard_tab1groups", ""); + if ($tab1groups eq "") { FW_fC("attr ".$d." dashboard_tab1groups Set Your Groups - See Attribute dashboard_tab1groups-"); } + # ------------------------------------------------------------------------------------------------- + + # -------------- Replace older dashboard_showbuttonbar value (outdated 01.2014) ------------------------------ my $showbuttonbarvalue = AttrVal($defs{$d}{NAME}, "dashboard_showbuttonbar", "top"); if ($showbuttonbarvalue eq "0") { FW_fC("attr ".$d." dashboard_showbuttonbar hidden"); } if ($showbuttonbarvalue eq "1") { FW_fC("attr ".$d." dashboard_showbuttonbar top"); } + # ------------------------------------------------------------------------------------------------------------------------ + + # ---- detached / transferred from the old attribute to the tab extension (outdated 02.2014) ------ + my $colheight = AttrVal($defs{$d}{NAME}, "dashboard_colheight", ""); + if ($colheight ne "") { + { FW_fC("attr ".$d." dashboard_rowcenterheight ".$colheight); } + { FW_fC("deleteattr ".$d." dashboard_colheight"); } + $detailnote = $detailnote." [dashboard_colheight -> dashboard_rowcenterheight]"; + } + my $groups = AttrVal($defs{$d}{NAME}, "dashboard_groups", ""); + if ($groups ne "") { + { FW_fC("attr ".$d." dashboard_tab1groups ".$groups); } + { FW_fC("deleteattr ".$d." dashboard_groups"); } + $detailnote = $detailnote." [dashboard_groups -> dashboard_tab1groups]"; + } + + my $sorting = AttrVal($defs{$d}{NAME}, "dashboard_sorting", ""); + if ($sorting ne "") { #convert old sorting in new + my @sortings = split(":", $sorting); + my $newsorting = ""; + my $groupcounter = 0; + for (my $s=0;$s<@sortings;$s++){ #0,590w3,true,246,826, 590w0,true,183,258: + my @groups = split(",", $sortings[$s]); + for (my $g=1;$g<@groups;$g+=4){ + my $row = AttrVal($defs{$d}{NAME}, "dashboard_row", "center"); + my $colcount = AttrVal($defs{$d}{NAME}, "dashboard_colcount", "1"); + my @dbgroups = split(",", AttrVal($defs{$d}{NAME}, "dashboard_tab1groups", ",")); #1. gruppeneintrag = 1. gespeicherte gruppe + my @dbgroup = split("w",$groups[$g]); + my $column = ""; + #Map old Column Count to new Count + if ($row eq "top" && $groups[0] == 0) { $column = "t0c100"; } + if ($row eq "center") { $column = "t0c".$groups[0]; } + if ($row eq "bottom" && $groups[0] == 0) { $column = "200"; } + if ($row eq "top-center" && $groups[0] == 0) { $column = "t0c100"; } + if ($row eq "top-center" && $groups[0] != 0) { $column = "t0c".($groups[0]-1); } + if ($row eq "center-bottom" && $groups[0] <= $colcount-1) { $column = "t0c".$groups[0]; } + if ($row eq "center-bottom" && $groups[0] > $colcount-1) { $column = "t0c200"; } + if ($row eq "top-center-bottom" && $groups[0] == "0") { $column = "t0c100"; } + if ($row eq "top-center-bottom" && $groups[0] != 0 && $groups[0] <= $colcount) { $column = "t0c".($groups[0]-1); } + if ($row eq "top-center-bottom" && $groups[0] > $colcount) { $column = "t0c200"; } + $newsorting = $newsorting.$column.",".$dbgroups[$dbgroup[1]].",".$groups[$g+1].",".$groups[$g+3].",".$groups[$g+2].":"; + $groupcounter = $groupcounter +1; + } + } + { FW_fC("attr ".$d." dashboard_tab1sorting ".$newsorting); } + { FW_fC("deleteattr ".$d." dashboard_sorting"); } + $detailnote = $detailnote." [dashboard_sorting -> dashboard_tab1sorting]"; + } + # ------------------------------------------------------------------------------------------------------------------------ # Get out any change to the Logfile - if ($showbuttonbarvalue eq "0" || $showbuttonbarvalue eq "1") { - Log3 $hash, 3, "[".$hash->{NAME}. "]"." Using an outdated no longer used Attribute or Value. This has been corrected. Don't forget to save config."; + if ($showbuttonbarvalue eq "0" || $showbuttonbarvalue eq "1" || $groups ne "" || $sorting ne "") { + Log3 $hash, 3, "[".$hash->{NAME}. " V".$dashboardversion."]"." Using an outdated no longer used Attribute or Value. This has been corrected. Don't forget to save config. ".$detailnote; } } @@ -385,7 +544,7 @@ sub CreateDashboardEntry($) { my $h = $hash->{NAME}; if (!defined $defs{$h."_weblink"}) { FW_fC("define ".$h."_weblink weblink htmlCode {DashboardAsHtml(\"".$h."\")}"); - Log3 $hash, 3, "[".$hash->{NAME}. "]"." Weblink dosen't exists. Created weblink ".$h."_weblink. Don't forget to save config."; + Log3 $hash, 3, "[".$hash->{NAME}. " V".$dashboardversion."]"." Weblink dosen't exists. Created weblink ".$h."_weblink. Don't forget to save config."; } FW_fC("attr ".$h."_weblink room ".$dashboardhiddenroom); @@ -397,14 +556,14 @@ sub CreateDashboardEntry($) { if (index($hr,$dashboardname) != -1 && index($hr,$dashboardhiddenroom) == -1) { $hr =~ s/$dashboardname/$dashboardhiddenroom/g; FW_fC("attr ".$defs{$dn}{NAME}." hiddenroom ".$hr); - Log3 $hash, 3, "[".$hash->{NAME}. "]"." Corrected hiddenroom '".$dashboardname."' -> '".$dashboardhiddenroom."' in ".$defs{$dn}{NAME}.". Don't forget to save config."; + Log3 $hash, 3, "[".$hash->{NAME}. " V".$dashboardversion."]"." Corrected hiddenroom '".$dashboardname."' -> '".$dashboardhiddenroom."' in ".$defs{$dn}{NAME}.". Don't forget to save config."; } #------------------------------------------------------------------------------------------------- if (index($hr,$dashboardhiddenroom) == -1){ if ($hr eq "") {FW_fC("attr ".$defs{$dn}{NAME}." hiddenroom ".$dashboardhiddenroom);} else {FW_fC("attr ".$defs{$dn}{NAME}." hiddenroom ".$hr.",".$dashboardhiddenroom);} - Log3 $hash, 3, "[".$hash->{NAME}. "]"." Added hiddenroom '".$dashboardhiddenroom."' to ".$defs{$dn}{NAME}.". Don't forget to save config."; + Log3 $hash, 3, "[".$hash->{NAME}. " V".$dashboardversion."]"." Added hiddenroom '".$dashboardhiddenroom."' to ".$defs{$dn}{NAME}.". Don't forget to save config."; } } } @@ -420,8 +579,10 @@ sub Dashboard_define ($$) { $data{FWEXT}{testjs}{SCRIPT} = "/pgm2/dashboard.js"; $hash->{STATE} = 'Initialized'; + CheckInstallation($hash); CheckDashboardEntry($hash); + return; } @@ -436,7 +597,18 @@ sub Dashboard_Undef ($$) { sub Dashboard_detailFn() { my ($name, $d, $room, $pageHash) = @_; my $hash = $defs{$name}; - return DashboardAsHtml($d); + #return DashboardAsHtml($d); #creates confusion and leads to incorrect storage of items + return; +} + +sub Dashboard_Attr($$$) { + my ($cmd, $name, $attrName, $attrVal) = @_; + +#if ($cmd eq "set") { +# $dashboarddata{$attrName} = $attrVal; +# Log 1, "[DASHBOARD simple debug] ".$attrName." - ".$attrVal; +# } + return; } 1; @@ -467,7 +639,7 @@ sub Dashboard_detailFn() { define anyViews Dashboard
attr anyViews dashboard_colcount 2
attr anyViews dashboard_colwidth 400
- attr anyViews dashboard_groups <Group1>,<Group2>,<Group3>
+ attr anyViews dashboard_tab1groups <Group1>,<Group2>,<Group3>
attr anyViews dashboard_lockstate unlock
attr anyViews dashboard_showhelper 1
@@ -486,15 +658,76 @@ sub Dashboard_detailFn() {

Attributes

+ +
  • dashboard_tabcount
    + Returns the number of displayed tabs. + Default: 1 +

    • + +
  • dashboard_activetab
    + Specifies which tab is activated. Can be set manually, but is also set by the switch "Set" to the currently active tab. + Default: 1 +

    • + +
  • dashboard_tab1name
    + Title of Tab 1. + Default: Dashboard-Tab 1 +

    • + +
  • dashboard_tab2name
    + Title of Tab 2. + Default: Dashboard-Tab 2 +

    • + +
  • dashboard_tab3name
    + Title of Tab 3. + Default: Dashboard-Tab 3 +

    • + +
  • dashboard_tab4name
    + Title of Tab 4. + Default: Dashboard-Tab 4 +

    • + +
  • dashboard_tab5name
    + Title of Tab 5. + Default: Dashboard-Tab 5 +

  • dashboard_sorting
    - Contains the position of each group. Value is written by the "Set" button. It is not recommended to take manual changes. + This attribute is no longer used and will be removed at a later date. It was replaced with
    + dashboard_tab1sorting, dashboard_tab2sorting, dashboard_tab3sorting, dashboard_tab4sorting, dashboard_tab5sorting

    • + +
  • dashboard_tab1sorting
    + Contains the position of each group in Tab 1. Value is written by the "Set" button. It is not recommended to take manual changes. +

    • + +
  • dashboard_tab2sorting
    + Contains the position of each group in Tab 2. Value is written by the "Set" button. It is not recommended to take manual changes. +

    • + +
  • dashboard_tab3sorting
    + Contains the position of each group in Tab 3. Value is written by the "Set" button. It is not recommended to take manual changes. +

    • + +
  • dashboard_tab4sorting
    + Contains the position of each group in Tab 4. Value is written by the "Set" button. It is not recommended to take manual changes. +

    • + +
  • dashboard_tab5sorting
    + Contains the position of each group in Tab 5. Value is written by the "Set" button. It is not recommended to take manual changes. +

  • dashboard_row
    To select which rows are displayed. top only; center only; bottom only; top and center; center and bottom; top,center and bottom.
    Default: center -

    • +
    + +
  • dashboard_width
    + To determine the Dashboardwidth. The value can be specified, or an absolute width value (eg 1200) in pixels in% (eg 80%).
    + Default: 100% +

  • dashboard_colwidth
    Width of each column in which the groups may be positioned.
    @@ -502,23 +735,49 @@ sub Dashboard_detailFn() {

  • dashboard_colheight
    - Height of each column in which the groups may be positioned.
    - Default: 400 + This attribute is no longer used and will be removed at a later date. It was replaced with
    + dashboard_rowcenterheight +

    • + +
  • dashboard_rowcenterheight
    + Height of the center row in which the groups may be positioned.
    + Default: 400

  • dashboard_rowtopheight
    Height of the top row in which the groups may be positioned.
    Default: 250

    • - +
  • "dashboard_rowbottomheight
    Height of the bottom row in which the groups may be positioned.
    Default: 250

  • dashboard_groups
    - Comma-separated list of the names of the groups to be displayed. + This attribute is no longer used and will be removed at a later date. It was replaced with
    + dashboard_tab1groups, dashboard_tab2groups, dashboard_tab3groups, dashboard_tab4groups, dashboard_tab5groups +

    • + +
  • dashboard_tab1groups
    + Comma-separated list of the names of the groups to be displayed in Tab 1.

    • + +
  • dashboard_tab1groups
    + Comma-separated list of the names of the groups to be displayed in Tab 2. +

    • + +
  • dashboard_tab1groups
    + Comma-separated list of the names of the groups to be displayed in Tab 3. +

    • + +
  • dashboard_tab1groups
    + Comma-separated list of the names of the groups to be displayed in Tab 4. +

    • + +
  • dashboard_tab1groups
    + Comma-separated list of the names of the groups to be displayed in Tab 5. +

  • dashboard_lockstate
    When set to "unlock" you can edit the Dashboard. When set to "lock" no change can be made.
    @@ -580,7 +839,7 @@ sub Dashboard_detailFn() { define anyViews Dashboard
    attr anyViews dashboard_colcount 2
    attr anyViews dashboard_colwidth 400
    - attr anyViews dashboard_groups <Group1>,<Group2>,<Group3>
    + attr anyViews dashboard_tab1groups <Group1>,<Group2>,<Group3>
    attr anyViews dashboard_lockstate unlock
    attr anyViews dashboard_showhelper 1
    @@ -599,15 +858,76 @@ sub Dashboard_detailFn() {

    Attributes

    + +
  • dashboard_tabcount
    + Gibt die Anzahl der angezeigten Tabs an. + Default: 1 +

    • + +
  • dashboard_activetab
    + Gibt an welches Tab aktiviert ist. Kann manuell gesetzt werden, wird aber auch durch den Schalter "Set" auf das gerade aktive Tab gesetzt. + Default: 1 +

    • + +
  • dashboard_tab1name
    + Titel des 1. Tab. + Default: Dashboard-Tab 1 +

    • + +
  • dashboard_tab2name
    + Titel des 2. Tab. + Default: Dashboard-Tab 2 +

    • + +
  • dashboard_tab3name
    + Titel des 3. Tab. + Default: Dashboard-Tab 3 +

    • + +
  • dashboard_tab4name
    + Titel des 4. Tab. + Default: Dashboard-Tab 4 +

    • + +
  • dashboard_tab5name
    + Titel des 5. Tab. + Default: Dashboard-Tab 5 +

  • dashboard_sorting
    - Enthält die Poistionierung jeder Gruppe. Der Wert wird mit der Schaltfläche "Set" geschrieben. Es wird nicht empfohlen dieses Attribut manuelle zu ändern + Dieses Attribut ist nicht mehr zu verwenden und wird zu einem späteren Zeitpunkt entfernt. Es wurde ersetzt durch
    + dashboard_tab1sorting, dashboard_tab2sorting, dashboard_tab3sorting, dashboard_tab4sorting, dashboard_tab5sorting

    • + +
  • dashboard_tab1sorting
    + Enthält die Poistionierung jeder Gruppe im Tab 1. Der Wert wird mit der Schaltfläche "Set" geschrieben. Es wird nicht empfohlen dieses Attribut manuelle zu ändern +

    • + +
  • dashboard_tab2sorting
    + Enthält die Poistionierung jeder Gruppe im Tab 2. Der Wert wird mit der Schaltfläche "Set" geschrieben. Es wird nicht empfohlen dieses Attribut manuelle zu ändern +

    • + +
  • dashboard_tab3sorting
    + Enthält die Poistionierung jeder Gruppe im Tab 3. Der Wert wird mit der Schaltfläche "Set" geschrieben. Es wird nicht empfohlen dieses Attribut manuelle zu ändern +

    • + +
  • dashboard_tab4sorting
    + Enthält die Poistionierung jeder Gruppe im Tab 4. Der Wert wird mit der Schaltfläche "Set" geschrieben. Es wird nicht empfohlen dieses Attribut manuelle zu ändern +

    • + +
  • dashboard_tab5sorting
    + Enthält die Poistionierung jeder Gruppe im Tab 5. Der Wert wird mit der Schaltfläche "Set" geschrieben. Es wird nicht empfohlen dieses Attribut manuelle zu ändern +

  • dashboard_row
    Auswahl welche Zeilen angezeigt werden sollen. top (nur Oben), center (nur Mitte), bottom (nur Unten) und den Kombinationen daraus.
    Standard: center -

    • +
    + +
  • dashboard_width
    + Zum bestimmen der Dashboardbreite. Der Wert kann in % (z.B. 80%) angegeben werden oder als absolute Breite (z.B. 1200) in Pixel.
    + Standard: 100% +

  • dashboard_colwidth
    Breite der Spalte, in der die Gruppen angeordnet werden. Gilt für "dashboard_row center, top-center-bottom, center-bottom".
    @@ -616,7 +936,12 @@ sub Dashboard_detailFn() {

  • dashboard_colheight
    - Höhe der Spalten, in der die Gruppen angeordnet werden. Gilt nur für "dashboard_row center, top-center-bottom, center-bottom".
    + Dieses Attribut ist nicht mehr zu verwenden und wird zu einem späteren Zeitpunkt entfernt. Es wurde ersetzt durch
    + dashboard_rowcenterheight +

    • + +
  • dashboard_rowcenterheight
    + Höhe der mittleren Zeile, in der die Gruppen angeordnet werden.
    Standard: 400

    • @@ -624,14 +949,35 @@ sub Dashboard_detailFn() { Höhe der oberen Zeile, in der die Gruppen angeordnet werden.
    Standard: 250
    - +
  • "dashboard_rowbottomheight
    Höhe der unteren Zeile, in der die Gruppen angeordnet werden.
    Standard: 250

  • dashboard_groups
    - Durch Komma getrennte Liste mit den Namen der Gruppen, die angezeigt werden. Falsche Gruppennamen werden hervorgehoben. + Dieses Attribut ist nicht mehr zu verwenden und wird zu einem späteren Zeitpunkt entfernt. Es wurde ersetzt durch
    + dashboard_tab1groups, dashboard_tab2groups, dashboard_tab3groups, dashboard_tab4groups, dashboard_tab5groups. +

    • + +
  • dashboard_tab1groups
    + Durch Komma getrennte Liste mit den Namen der Gruppen, die im Tab 1 angezeigt werden. Falsche Gruppennamen werden hervorgehoben. +

    • + +
  • dashboard_tab2groups
    + Durch Komma getrennte Liste mit den Namen der Gruppen, die im Tab 2 angezeigt werden. Falsche Gruppennamen werden hervorgehoben. +

    • + +
  • dashboard_tab3groups
    + Durch Komma getrennte Liste mit den Namen der Gruppen, die im Tab 3 angezeigt werden. Falsche Gruppennamen werden hervorgehoben. +

    • + +
  • dashboard_tab4groups
    + Durch Komma getrennte Liste mit den Namen der Gruppen, die im Tab 4 angezeigt werden. Falsche Gruppennamen werden hervorgehoben. +

    • + +
  • dashboard_tab5groups
    + Durch Komma getrennte Liste mit den Namen der Gruppen, die im Tab 5 angezeigt werden. Falsche Gruppennamen werden hervorgehoben.

  • dashboard_lockstate
    diff --git a/fhem/www/pgm2/dashboard.js b/fhem/www/pgm2/dashboard.js index e039a5bab..339b08f96 100644 --- a/fhem/www/pgm2/dashboard.js +++ b/fhem/www/pgm2/dashboard.js @@ -4,111 +4,137 @@ // Released : 14.11.2013 @svenson08 // Version : 1.00 // Revisions: -// 0001: Released to testers -// 0002: Add DebugMsg. Fix independent Groupsize adjustment after set & siterefresh. Fix -// wrong set of +Toogle Icon on Siderefresh -// +// 1.01: Released to testers +// 1.02: Add DebugMsg. Fix independent Groupsize adjustment after set & siterefresh. Fix +// wrong set of +Toogle Icon on Siderefresh +// 2.00: First Changes vor Dashboard Tabs. Change method store Positiondata. optimization restore Positiondata. Clear poor routines. +// Change max/min Values for Groupresize. Top- and Bottom-Row always 100% // Known Bugs/Todo's // See 95_Dashboard.pm //######################################################################################## //######################################################################################## function saveOrder() { - var SaveResult = ""; - //------------- Build new Position string --------------- + var EndSaveResult = ""; + var ActiveTab = $("#tabs .ui-tabs-panel:visible").attr("id").substring(14,13); + //------------------- Build new Position string ---------------------- $(".dashboard_column").each(function(index, value){ var colid = value.id; - var order = $('#' + colid).sortable("toArray"); - for ( var i = 0, n = order.length; i < n; i++ ) { - var v = $('#' + order[i]).find('.dashboard_content').is(':visible'); - var w = $('#' + order[i]).outerWidth(); - if ( $('#' + order[i]).find(".dashboard_content").data("userheight") == null ) { - var h = $('#' + order[i]).outerHeight(); - } else { - var h = $('#' + order[i]).find(".dashboard_content").data("userheight"); - if (h.length == 0) { var h = $('#' + order[i]).outerHeight(); } + var SaveResult = ""; + var neworder = $('#' + colid).sortable("toArray"); + for ( var i = 0, n = neworder.length; i < n; i++ ) { + var tab = $('#' + neworder[i]).parent().attr("id").substring(14,13); + var column = $('#' + neworder[i]).parent().attr("id").substring(20); + if (ActiveTab == tab) { + var groupdata = ($('#' + neworder[i]).data("groupwidget").split(",")); //get curren Group-Configuration + if (groupdata[1] != ''){ + groupdata[0] = "t"+tab+"c"+$('#' + neworder[i]).parent().attr("id").substring(20); + groupdata[2] = $('#' + neworder[i]).find('.dashboard_content').is(':visible'); + groupdata[3] = $('#' + neworder[i]).outerWidth(); + + if (groupdata[4] == 0) {groupdata[4] = $('#' + neworder[i]).outerHeight();} + if (groupdata[2] == true) { + groupdata[4] = $('#' + neworder[i]).outerHeight(); + $('#' + neworder[i]).find(".dashboard_content").data("userheight", $('#' + neworder[i]).outerHeight()); + } + $(neworder[i]).data("groupwidget",groupdata); //store in current Widget + SaveResult = SaveResult+groupdata+":"; + } } - order[i] = order[i]+","+v+","+h+","+w; - } - SaveResult = SaveResult + index+','+order+':'; - //Result: ,,,,,,,,:,,,,,,,,: widgetmaxwidth) {width = widgetmaxwidth}; //width is =< columnwith + $(this).outerWidth(width); + //--------------------------------------------------------------------------------------------------------------- + //-------------------------------- Height of an Group. | Min. Height if need --------------------------- + if (height == 0) { height = $(this).outerHeight();} + if ($(this).outerHeight() > height) {$(this).outerHeight(height); } //set heigh only if > group min. height + //--------------------------------------------------------------------------------------------------------------- - //alert("Load Event (1) \nColumn="+index+"\nSaveResult="+coldata+"\nColumndata=("+i+"/"+coldata.length+") "+portletsdata); - for (var j = 1, m = portletsdata.length; j < m; j += 4 ) { - //alert("Load Event (2) \nColumn="+index+"\nSaveResult="+coldata+"\nColumndata=("+i+"/"+coldata.length+"|"+j+"/"+portletsdata.length+") "+portletsdata+ - //"\n\nPortletdata (ID)="+portletsdata[j]+"\nPortletdata (Visible)="+portletsdata[j+1]+"\nPortletheight (Height)="+portletsdata[j+2]+"\nPortletwidth (Width)="+portletsdata[j+3]); - if (portletsdata[0] == index && portletsdata[0] != '' && portletsdata[j] != '' && portletsdata[j+1] != '') { - var portletID = portletsdata[j]; - var visible = portletsdata[j+1]; - var height = portletsdata[j+2]-5; //( limited -5 by CSS) - var width = portletsdata[j+3]-5; //( limited -5 by CSS) - - if (width > widgetmaxwidth) {width = widgetmaxwidth}; //Fix with ist widget width > current column width. - var portlet = $(".dashboard_column").find('#' + portletID); - portlet.appendTo($('#' + value.id)); - portlet.outerHeight(height); - portlet.outerWidth(width); - if (params[2] == 1) { portlet.addClass("dashboard_widgethelper"); } else { portlet.removeClass("dashboard_widgethelper"); }//Show Widget-Helper Frame - if (visible === 'false') { - - if (portlet.find(".dashboard_widgetheader").find(".dashboard_button_icon").hasClass("dashboard_button_iconminus")) { - portlet.find(".dashboard_widgetheader").find(".dashboard_button_icon").removeClass( "dashboard_button_iconminus" ); - portlet.find(".dashboard_widgetheader").find(".dashboard_button_icon").addClass( "dashboard_button_iconplus" ); - } - - var currHeigth = Math.round(portlet.height()); - portlet.find(".dashboard_content").data("userheight", currHeigth); - portlet.find(".dashboard_content").hide(); - var newHeigth = portlet.find(".dashboard_widgetinner").height()+5; - portlet.height(newHeigth); - } - } - } - } - }); + $(this).find(".dashboard_content").data("userheight", height-5); + if (params[2] == 1) { $(this).addClass("dashboard_widgethelper"); } else { $(this).removeClass("dashboard_widgethelper"); }//Show Widget-Helper Frame + + if (visible === 'false') { + if ($(this).find("span").hasClass("dashboard_button_iconminus")){ + $(this).find("span") + .removeClass( "dashboard_button_iconminus" ) + .addClass( "dashboard_button_iconplus" ); + } + $(this).find(".dashboard_content").hide(); + $(this).height($(this).find(".dashboard_widgetinner").height()+5); + } + } + }); } +function GetColWidth(ColCount, ColWidth){ + var aColWidth = ColWidth.replace(/%/g, "").split(":"); + if (aColWidth.length > ColCount) { aColWidth.length = ColCount; } + if (aColWidth.length < ColCount) { for (var i = aColWidth.length; i < ColCount; i++) { aColWidth[i] = "20"; } } //fill missin width parts with 20% + var ColWidthCount = aColWidth.length; + var ColWidthSum = 0; + for (var i = 0; i < ColWidthCount; i++) { ColWidthSum = parseInt(aColWidth[i]) + ColWidthSum; } + + if (ColWidthSum > 100) { //reduce width down to 100% + while (ColWidthSum > 100){ + ColWidthSum = 0; + for (var i = 0; i < ColWidthCount; i++) { + if (parseInt(aColWidth[i]) > 10) { aColWidth[i] = parseInt(aColWidth[i])-1; } + ColWidthSum = parseInt(aColWidth[i]) + ColWidthSum; + } + } + } + if (ColWidthSum < 100) { aColWidth[ColWidthCount-1] = parseInt(aColWidth[ColWidthCount-1]) + (100 - ColWidthSum); } //fill up to 100% width + + aColWidth[0] = parseInt(aColWidth[0])-(0.2 * ColCount); + return aColWidth; +} + //Only use for debugging function showdebugMessage(msg){ - document.getElementById("dashboard_jsdebug").value = document.getElementById("dashboard_jsdebug").value+" "+msg; + document.getElementById("dashboard_jsdebug").value = msg; } function dashboard_tooglelock(){ @@ -144,66 +170,69 @@ function dashboard_unsetlock(){ $( ".dashboard_column" ).sortable( "option", "disabled", false ); if (params[2] == 1) { $( ".dashboard_widget" ).addClass("dashboard_widgethelper"); } else { $( ".dashboard_widget" ).removeClass("dashboard_widgethelper"); }//Show Widget-Helper Frame if (params[2] == 1) { $( ".dashboard_column" ).addClass("dashboard_columnhelper"); } else { $( ".dashboard_column" ).removeClass("dashboard_columnhelper"); }//Show Widget-Helper Frame + dashboard_modifyWidget(); //############################################################ } -function dashboard_setposition(){ - var params = (document.getElementById("dashboard_attr").value).split(","); //get current Configuration - var sorting = document.getElementById("dashboard_currentsorting").value; - FW_cmd(document.location.pathname+'?XHR=1&cmd.'+params[0]+'=attr '+params[0]+' dashboard_sorting '+sorting); - document.getElementById("dashboard_button_set").classList.remove('dashboard_button_changed'); +function dashboard_setposition(){ + var params = (document.getElementById("dashboard_attr").value).split(","); //get current Configuration + //------------------- store group position ---------------------------- + for (var i = 0, n = params[10]; i < n; i++ ) { + if ($("#dashboard_tab"+i).data("tabwidgets") != null) { + var j = i+1; + FW_cmd(document.location.pathname+'?XHR=1&cmd.'+params[0]+'=attr '+params[0]+' dashboard_tab'+j+'sorting '+$("#dashboard_tab"+i).data("tabwidgets")); + } + } + document.getElementById("dashboard_button_set").classList.remove('dashboard_button_changed'); + //--------------------------------------------------------------------- + //--------------------- store active Tab ------------------------------ + var activeTab = ($( "#tabs" ).tabs( "option", "active" ))+1; + if (params[11] != activeTab){ + FW_cmd(document.location.pathname+'?XHR=1&cmd.'+params[0]+'=attr '+params[0]+' dashboard_activetab '+activeTab); + } + //--------------------------------------------------------------------- } function dashboard_modifyWidget(){ $( ".dashboard_widget" ).resizable({ - 'grid': 1, - 'minWidth': 150, + 'grid': 5, start: function(e, ui) { var params = (document.getElementById("dashboard_attr").value).split(","); //get current Configuration - //-------- Widgetbegrenzung festlegen ------------------- - var rowid = $(this).parent().attr("id"); - if (rowid == "sortablecolumn100") { - var widgetmaxwidth = (params[7] * params[1]) - 5; - var widgetmaxheight = params[8] - 5; - } - else { if (rowid == "sortablecolumn200") { - var widgetmaxwidth = (params[7] * params[1]) - 5; - var widgetmaxheight = params[9] -5 ; - } - else { - var widgetmaxwidth = params[1] - 5; - var widgetmaxheight = params[5] -5; - } - } - //------------------------------------------------------- + var groupdata = $(this).data("groupwidget").split(","); //get the position string from the data + var TabId = $(this).parent().attr("id").substring(14,13); + var ColumnId = $(this).parent().attr("id").substring(20); + var widgetmaxwidth = $(this).parent().width(); + + if (ColumnId == "100") { var widgetmaxheight = params[8]; } + if ((ColumnId != "100") && (ColumnId != "200")) { var widgetmaxheight = params[5]; } + if (ColumnId == "200") { var widgetmaxheight = params[9]; } maxWidthOffset = widgetmaxwidth; - $(this).resizable("option","maxWidth",widgetmaxwidth); + $(this).resizable("option","maxWidth",widgetmaxwidth-5); $(this).resizable("option","maxHeight",widgetmaxheight); }, resize: function(e, ui) { - minHeightOffset = $(this).find(".dashboard_widgetinner").height()+5; - ui.size.width = Math.round(ui.size.width); - if (ui.size.width > (maxWidthOffset)) { $(this).resizable("option","maxWidth",maxWidthOffset); } - if (ui.size.height < (minHeightOffset)) { $(this).resizable("option","minHeight",minHeightOffset); } + if ($(this).find(".dashboard_widgetheader").outerWidth() < $(this).find(".dashboard_content").children().outerWidth()) {$(this).resizable("option","minWidth", $(this).find(".dashboard_content").children().outerWidth()+5 ); } + if ($(this).find(".dashboard_widget").outerHeight() < $(this).find(".dashboard_widgetinner").outerHeight()) { $(this).resizable("option","minHeight", $(this).find(".dashboard_widgetinner").outerHeight()); } }, stop: function() { - minHeightOffset = $(this).find(".dashboard_widgetinner").height()+5; - $(this).resizable("option","minHeight",minHeightOffset); saveOrder(); } }); } $(document).ready( function () { + //--------------------------------- Attribute des Dashboards ------------------------------------------------------------------ var params = (document.getElementById("dashboard_attr").value).split(","); //get current Configuration - + //------------------------------------------------------------------------------------------------------------------------------------- + $(".dashboard_column").sortable({ connectWith: ['.dashboard_column', '.ui-row'], + cursor: 'move', stop: function() { saveOrder(); } }); - + if (params[4] == 0){ //set if buttonbar not show dashboard_modifyWidget(); dashboard_setlock(); @@ -211,7 +240,7 @@ $(document).ready( function () { if (params[6] == 1){ //ToogleButton show/hide $(".dashboard_widget") - .addClass( "dashboard_widget dashboard_content ui-corner-all" ) + .addClass( "dashboard_widget ui-corner-all" ) .find(".dashboard_widgetheader") .addClass( "dashboard_widgetheader ui-corner-all" ) .prepend('') @@ -222,16 +251,21 @@ $(document).ready( function () { $(this).removeClass( "dashboard_button_iconplus" ); $(this).addClass( "dashboard_button_iconminus" ); $(this).parents(".dashboard_widget:first").find(".dashboard_content").show(); - var newHeigth = $(this).parents(".dashboard_widget:first").find(".dashboard_content").data("userheight"); + var newHeigth = $(this).parents(".dashboard_widget:first").find(".dashboard_content").data("userheight"); + //-------- set heigh only if > group min. height ------------- + if ($(this).parents(".dashboard_widgetinner").outerHeight() > newHeigth) { + $(this).parents(".dashboard_widget:first").outerHeight($(this).parents(".dashboard_widgetinner").outerHeight()+10); + } else { $(this).parents(".dashboard_widget:first").outerHeight(newHeigth);} + //------------------------------------------------------------ } else { $(this).removeClass( "dashboard_button_iconminus" ); $(this).addClass( "dashboard_button_iconplus" ); var currHeigth = Math.round($(this).parents(".dashboard_widget:first").height()); $(this).parents(".dashboard_widget:first").find(".dashboard_content").data("userheight", currHeigth); $(this).parents(".dashboard_widget:first").find(".dashboard_content").hide(); - var newHeigth = $(this).parents(".dashboard_widget:first").find(".dashboard_widgetinner").height()+5; + var newHeigth = $(this).parents(".dashboard_widget:first").find(".dashboard_widgetinner").height()+5; + $(this).parents(".dashboard_widget:first").height(newHeigth); } - $(this).parents(".dashboard_widget:first").height(newHeigth); saveOrder(); event.stopImmediatePropagation(); }); @@ -254,17 +288,26 @@ $(document).ready( function () { dashboard_modifyWidget(); if (params[3] == "lock") { $(this).button( "option", "label", "Unlock" ); - dashboard_setlock(); + dashboard_setlock(); } else { $(this).button( "option", "label", "Lock" ); - dashboard_unsetlock(); + dashboard_unsetlock(); } } }); - restoreOrder(); + //--------------------------------- Dashboard Tabs ------------------------------------------------------------------------------ + $("#tabs").tabs({ + active: 0, + create: function(event, ui) { + $( "#tabs" ).tabs( "option", "active", params[11]-1 ); //set active Tab + restoreOrder(); + }, + activate: function (event, ui) { + restoreOrder(); + } + }); + //------------------------------------------------------------------------------------------------------------------------------------- }); - - diff --git a/fhem/www/pgm2/dashboard_darkstyle.css b/fhem/www/pgm2/dashboard_darkstyle.css index 2eeda73c1..c7e678721 100644 --- a/fhem/www/pgm2/dashboard_darkstyle.css +++ b/fhem/www/pgm2/dashboard_darkstyle.css @@ -1,25 +1,27 @@ /* Author: svenson08*/ -.dashboard_buttonbar { background: none repeat scroll 0 0 #333333; border: 1px solid #FFFFFF; - box-shadow: 5px 5px 5px #000000; padding: 4px; border-radius: 8px 8px 8px 8px; float: left;} +.dashboard_buttonbar { background: none repeat scroll 0 0 #111111; border: 1px solid #FFFFFF; padding: 4px; margin: 0 .5em 0 0.4em; float: left; } +.dashboard_buttonbar_top { border-bottom-width: 0; border-top-left-radius: 8px; border-top-right-radius: 8px; } +.dashboard_buttonbar_bottom { border-top-width: 0; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; box-shadow: 5px 5px 5px #000000; } + .dashboard_button { border-radius: 8px; float: left; color: #1c94c4; font-weight: bold; font-size: 0.8em; background-repeat:no-repeat; - background-position: 4px 2px; border: 1px solid #cccccc; padding: 0.2em 0.7em 0.2em 0.4em; } + background-position: 4px 2px; border: 1px solid #cccccc; padding: 0.2em 0.7em 0.2em 0.4em; } .dashboard_button_changed { color: red; font-weight:bold; } .dashboard_column { float: left; } .dashboard_columnhelper { border: 1px dotted #CCCCCC; } -.dashboard_widget { border-radius: 8px; float: left; } +.dashboard_widget { border-radius: 8px; float: left; padding: 0.2em;} .dashboard_widgethelper { background-color: #111111; } .dashboard_widgetheader { background: none repeat scroll 0 0 #333333; border: 1px solid #FFFFFF; - box-shadow: 5px 5px 5px #000000; border-radius: 8px; margin: 0.2em; - padding-bottom: 4px; padding-top: 3px; padding-left: 0.7em; } + box-shadow: 5px 5px 5px #000000; border-radius: 8px; margin: 0.2em; + padding-bottom: 4px; padding-top: 3px; padding-left: 0.7em; } .dashboard_content { padding: 0.2em; } .dashboard_button_icon { width: 13px; height: 14px; background-repeat: no-repeat; - float: left; background-image: url(../images/default/dashboardicons.png); } + float: left; background-image: url(../images/default/dashboardicons.png); } .dashboard_button_iconplus { margin: 0.1em 0.4em; float: right; background-position: -65px 0px; } .dashboard_button_iconminus { margin: 0.1em 0.4em; float: right; background-position: -52px 0px; } -.dashboard_button_iconset { background-position: -26px 0px; } +.dashboard_button_iconset { background-position: -26px 0px; } .dashboard_button_iconlock { background-position: 0px 0px; } .dashboard_button_iconunlock { background-position: -13px 0px; } .dashboard_button_icondetail { background-position: -39px 0px; } @@ -27,7 +29,29 @@ .ui-resizable { position: relative; } .ui-resizable-handle { position: absolute; font-size: 0.1px; } .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; - bottom: 1px; background-image: url(../images/default/dashboardicons.png); - background-position: -78px 0px; background-repeat: no-repeat; } + bottom: 1px; background-image: url(../images/default/dashboardicons.png); + background-position: -78px 0px; background-repeat: no-repeat; } .ui-sortable-placeholder { border: 1px dotted #FFFFFF; visibility: visible !important; - height: 25px !important; width: 150px; } + height: 25px !important; width: 150px; } + + +/* Neue CSS Einträge für Dashboard-Tabs */ +.dashboard { padding: 0; margin: 0; } +.dashboard_tabnav { list-style: none; margin: 0; padding: 0 .5em 0; } +.dashboard_tabnav:before, +.dashboard_tabnav:after { content: ""; display: table; border-collapse: collapse; clear: both; } +.dashboard_tabpanel { border: 1px solid #cccccc; background-color: #333333; border: 1px solid #dddddd; + border-radius: 8px 8px 8px 8px; box-shadow: 5px 5px 5px #000000; } +.dashboard_tab { border: 1px solid #cccccc; border-bottom-width: 0; border-top-left-radius: 8px; + border-top-right-radius: 8px; margin: 0 .5em -1px 0; float: left; padding: .5em 1em; } +.dashboard_tab.ui-tabs-active { background-color: #333333; font-weight: bold; } +.dashboard_tabcontent { width: 100%; padding: 0; margin: 0; } + +.dashboard_row { width: 100%; height: inherit; } +.dashboard_columncenter { height: inherit;} + + + + + + diff --git a/fhem/www/pgm2/dashboard_ios7.css b/fhem/www/pgm2/dashboard_ios7.css index c5888ad62..a66779db5 100644 --- a/fhem/www/pgm2/dashboard_ios7.css +++ b/fhem/www/pgm2/dashboard_ios7.css @@ -1,25 +1,27 @@ /* Author: svenson08*/ -.dashboard_buttonbar { background: none repeat scroll 0 0 #cbcbcb; border: 1px solid #d9d9d9; - padding: 4px; float: left;} +.dashboard_buttonbar { background: none repeat scroll 0 0 #a6a6a6; border: 1px solid #d9d9d9; padding: 6px; margin: 0 .5em 0 0.4em; float: left;} +.dashboard_buttonbar_top, .dashboard_buttonbar_bottom { border-bottom-width: 0; } + + .dashboard_button { float: left; background-color: #fff; font-weight: bold; font-size: 0.8em; background-repeat:no-repeat; - background-position: 4px 2px; border: 1px solid #808080; padding: 0.2em 0.7em 0.2em 0.4em; } -.dashboard_button_changed { color: blue; font-weight:bold; } + background-position: 4px 2px; border: 1px solid #808080; padding: 0.2em 0.7em 0.2em 0.4em; } +.dashboard_button_changed { color: black; font-weight:bold; } .dashboard_column { float: left; } .dashboard_columnhelper { border: 1px dotted #808080; } .dashboard_widget { float: left; } -.dashboard_widgethelper { background-color: #cbcbcb; } -.dashboard_widgetheader { background: none repeat scroll 0 0 #fff; border: 1px solid #d9d9d9; - margin: 0.2em; - padding-bottom: 2px; padding-top: 3px; padding-left: 0.2em; } +.dashboard_widgethelper { background-color: #a6a6a6; } +.dashboard_widgetheader { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #d9d9d9; + margin: 0.2em; + padding-bottom: 2px; padding-top: 3px; padding-left: 0.2em; } .dashboard_content { padding: 0.2em; } .dashboard_button_icon { width: 13px; height: 14px; background-repeat: no-repeat; - float: left; background-image: url(../images/default/dashboardicons.png); } + float: left; background-image: url(../images/default/dashboardicons.png); } .dashboard_button_iconplus { margin: 0.1em 0.4em; float: right; background-position: -154px 0px; } .dashboard_button_iconminus { margin: 0.1em 0.4em; float: right; background-position: -140px 0px; } -.dashboard_button_iconset { background-position: -116px 0px; } +.dashboard_button_iconset { background-position: -116px 0px; } .dashboard_button_iconlock { background-position: -103px 0px; } .dashboard_button_iconunlock { background-position: -91px 0px; } .dashboard_button_icondetail { background-position: -128px 0px; } @@ -27,9 +29,21 @@ .ui-resizable { position: relative; } .ui-resizable-handle { position: absolute; font-size: 0.1px; } .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; - bottom: 1px; background-image: url(../images/default/dashboardicons.png); - background-position: -170px 0px; background-repeat: no-repeat; } + bottom: 1px; background-image: url(../images/default/dashboardicons.png); + background-position: -170px 0px; background-repeat: no-repeat; } .ui-sortable-placeholder { border: 1px dotted #d9d9d9; visibility: visible !important; - height: 25px !important; width: 150px; } + height: 25px !important; width: 150px; } + +/* Neue CSS Einträge für Dashboard-Tabs */ +.dashboard { padding: 0; margin: 0; } +.dashboard_tabnav { list-style: none; margin: 0; padding: 0 .5em 0; } +.dashboard_tabnav:before, +.dashboard_tabnav:after { content: ""; display: table; border-collapse: collapse; clear: both; } +.dashboard_tabpanel { border: 1px solid #cccccc; background-color: #cbcbcb; } +.dashboard_tab { border: 1px solid #cccccc; border-bottom-width: 0; margin: 0 .5em -1px 0; float: left; padding: .5em 1em; } +.dashboard_tab.ui-tabs-active { background-color: #cbcbcb; font-weight: bold; } +.dashboard_tabcontent { width: 100%; padding: 0; margin: 0; } +.dashboard_row { width: 100%; height: inherit; } +.dashboard_columncenter { height: inherit;} \ No newline at end of file diff --git a/fhem/www/pgm2/dashboard_style.css b/fhem/www/pgm2/dashboard_style.css index 0eab2178a..21a7977d4 100644 --- a/fhem/www/pgm2/dashboard_style.css +++ b/fhem/www/pgm2/dashboard_style.css @@ -1,25 +1,27 @@ /* Author: svenson08*/ -.dashboard_buttonbar { background: none repeat scroll 0 0 #F0F0D8; border: 1px solid #808080; - padding: 4px; border-radius: 8px 8px 8px 8px; float: left;} -.dashboard_button { border-radius: 8px; float: left; background-color: #FFFFE7; font-weight: bold; font-size: 0.8em; background-repeat:no-repeat; - background-position: 4px 2px; border: 1px solid #808080; padding: 0.2em 0.7em 0.2em 0.4em; } +.dashboard_buttonbar { background: none repeat scroll 0 0 #d3d3ad; border: 1px solid #808080;padding: 6px; margin: 0 .5em 0 0.4em;float: left; } +.dashboard_buttonbar_top { border-bottom-width: 0; border-top-left-radius: 8px; border-top-right-radius: 8px; } +.dashboard_buttonbar_bottom { border-top-width: 0; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; } + +.dashboard_button { border-radius: 8px; float: left; color: #1c94c4; font-weight: bold; font-size: 0.8em; background-repeat:no-repeat; + background-position: 4px 2px; border: 1px solid #808080; padding: 0.2em 0.7em 0.2em 0.4em; } .dashboard_button_changed { color: blue; font-weight:bold; } .dashboard_column { float: left; } .dashboard_columnhelper { border: 1px dotted #808080; } -.dashboard_widget { border-radius: 8px; float: left; } +.dashboard_widget { border-radius: 8px; float: left; padding: 0.2em;} .dashboard_widgethelper { background-color: #A0FFFF; } .dashboard_widgetheader { background: none repeat scroll 0 0 #F0F0D8; border: 1px solid #808080; - border-radius: 8px; margin: 0.2em; - padding-bottom: 2px; padding-top: 3px; padding-left: 0.2em; } + border-radius: 8px; margin: 0.2em; + padding-bottom: 4px; padding-top: 3px; padding-left: 0.7em; } .dashboard_content { padding: 0.2em; } .dashboard_button_icon { width: 13px; height: 14px; background-repeat: no-repeat; - float: left; background-image: url(../images/default/dashboardicons.png); } + float: left; background-image: url(../images/default/dashboardicons.png); } .dashboard_button_iconplus { margin: 0.1em 0.4em; float: right; background-position: -154px 0px; } .dashboard_button_iconminus { margin: 0.1em 0.4em; float: right; background-position: -140px 0px; } -.dashboard_button_iconset { background-position: -116px 0px; } +.dashboard_button_iconset { background-position: -116px 0px; } .dashboard_button_iconlock { background-position: -103px 0px; } .dashboard_button_iconunlock { background-position: -91px 0px; } .dashboard_button_icondetail { background-position: -128px 0px; } @@ -27,7 +29,23 @@ .ui-resizable { position: relative; } .ui-resizable-handle { position: absolute; font-size: 0.1px; } .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; - bottom: 1px; background-image: url(../images/default/dashboardicons.png); - background-position: -170px 0px; background-repeat: no-repeat; } + bottom: 1px; background-image: url(../images/default/dashboardicons.png); + background-position: -170px 0px; background-repeat: no-repeat; } .ui-sortable-placeholder { border: 1px dotted #808080; visibility: visible !important; - height: 25px !important; width: 150px; } + height: 25px !important; width: 150px; } + + +/* Neue CSS Einträge für Dashboard-Tabs */ +.dashboard { padding: 0; margin: 0; } +.dashboard_tabnav { list-style: none; margin: 0; padding: 0 .5em 0; } +.dashboard_tabnav:before, +.dashboard_tabnav:after { content: ""; display: table; border-collapse: collapse; clear: both; } +.dashboard_tabpanel { border: 1px solid #cccccc; background-color: #F0F0D8; border: 1px solid #dddddd; + border-radius: 8px 8px 8px 8px; } +.dashboard_tab { border: 1px solid #cccccc; border-bottom-width: 0; border-top-left-radius: 8px; + border-top-right-radius: 8px; margin: 0 .5em -1px 0; float: left; padding: .5em 1em; } +.dashboard_tab.ui-tabs-active { background-color: #F0F0D8; font-weight: bold; } +.dashboard_tabcontent { width: 100%; padding: 0; margin: 0; } + +.dashboard_row { width: 100%; height: inherit; } +.dashboard_columncenter { height: inherit;}