From 71b61b196085be29063112a04a6d68f2adeaed16 Mon Sep 17 00:00:00 2001
From: rudolfkoenig <>
Date: Sat, 23 Jan 2021 17:57:05 +0000
Subject: [PATCH] 98_weblink.pm: add associatedWith mode (Forum #114960)

git-svn-id: https://svn.fhem.de/fhem/trunk@23597 2b470e98-0d58-463d-a4d8-8e2adae1ed80
---
 fhem/FHEM/98_weblink.pm             | 113 ++++++++++++++++++++++++++--
 fhem/www/pgm2/zwave_neighborlist.js |  20 ++---
 2 files changed, 118 insertions(+), 15 deletions(-)

diff --git a/fhem/FHEM/98_weblink.pm b/fhem/FHEM/98_weblink.pm
index 3bf8a14b9..26927b7b7 100644
--- a/fhem/FHEM/98_weblink.pm
+++ b/fhem/FHEM/98_weblink.pm
@@ -30,9 +30,16 @@ weblink_Define($$)
 {
   my ($hash, $def) = @_;
   my ($name, $type, $wltype, $link) = split("[ \t]+", $def, 4);
-  my %thash = ( link=>1, image=>1, iframe=>1, htmlCode=>1, 
-                cmdList=>1,
-                fileplot=>1, dbplot=>1);
+  my %thash = ( 
+    associatedWith=>1,
+    cmdList=>1,
+    dbplot=>1,
+    fileplot=>1,
+    htmlCode=>1, 
+    iframe=>1,
+    image=>1,
+    link=>1,
+  );
   
   if(!$link || !$thash{$wltype}) {
     return "Usage: define <name> weblink [" .
@@ -131,11 +138,97 @@ weblink_FwFn($$$$)
     }
     $ret .= "</table></td></tr>";
     $ret .= "</table><br>";
+  
+  } elsif($wltype eq "associatedWith") {
+    my $js = "$FW_ME/pgm2/zwave_neighborlist.js";
+    return
+    "<div id='ZWDongleNr'><a id='zw_snm' href='#'>Show neighbor map</a></div>".
+    "<div id='ZWDongleNrSVG'></div>".
+    "<script type='text/javascript' src='$js'></script>".
+    '<script type="text/javascript">'.<<"JSEND"
+      \$(document).ready(function() {
+        \$("div#ZWDongleNr a#zw_snm")
+          .click(function(e){
+            e.preventDefault();
+            zw_nl('webdev_AWData("$d")');
+          });
+      });
+    </script>
+JSEND
   }
 
   return $ret;
 }
 
+sub
+webdev_AWData($)
+{
+  my ($me) = @_;
+
+  my (%h, @ds);
+  my ($fo, $foCount, $level) = ("", 0, 0);
+  my @l = split(" ", $defs{$me}{LINK});
+
+  @ds = devspec2array($l[0]);
+  for(;;) {
+    $level++;
+    my %new;
+    foreach my $d (@ds) {
+      next if($h{$d} || !$defs{$d} || $defs{$d}{TEMPORARY});
+      my @paw = getPawList($d);
+      map { $new{$_}=1 if(!$h{$_}) } @paw;
+      my $a = AttrVal($d,"alias","");
+      my $r = AttrVal($d,"room","");
+      $h{$d}{title} = 
+          ($a ? "Alias:$a ":"").
+          ($r ? "room:$r ":"").
+          ("type:".$defs{$d}{TYPE});
+      $h{$d}{neighbors} = \@paw;
+      $h{$d}{class} = ($level == 1 ? "zwDongle" : "zwBox");
+      $h{$d}{txt} = $d;
+      $h{$d}{neighbors} = \@paw;
+
+      $fo = $d if(!$fo);
+      if($level == 1 && $foCount < int(@paw)) {
+        $foCount = int(@paw);
+        $fo = $d;
+      }
+    }
+    last if($l[1] && $l[1] <= $level);
+    @ds = keys %new;
+    last if(!@ds);
+  }
+
+  my @ret;
+  my @dp = split(" ", AttrVal($me, "htmlattr", ""));
+  my %dp = @dp;
+  for my $k (keys %h) {
+    my $n = $h{$k}{neighbors};
+    push @ret, '"'.$k.'":{'.
+        '"class":"'.$h{$k}{class}.' col_link col_oddrow",'.
+        '"txt":"'.$h{$k}{txt}.'",'.
+        '"title":"'.$h{$k}{title}.'",'.
+        '"pos":['.($dp{$k} ? $dp{$k} : '').'],'.
+        '"neighbors":['. (@{$n} ? ('"'.join('","',@{$n}).'"'):'').']}';
+  }
+
+  my $r = '{"firstObj":"'.$fo.'",'.
+           '"el":{'.join(",",@ret).'},'.
+           '"skipArrow":true,'.
+           '"saveFn":"{webdev_AWaddPos(\''.$me.'\',\'{1}\',\'{2}\')}" }';
+  return $r;
+}
+
+sub
+webdev_AWaddPos($$$)
+{
+  my ($me, $d, $pos) = @_;
+  my @dp = split(" ", AttrVal($me, "htmlattr", ""));
+  my %dp = @dp;
+  $dp{$d} = $pos;
+  CommandAttr(undef,"$me htmlattr ".join(" ",map {"$_ $dp{$_}"} sort keys %dp));
+}
+
 1;
 
 =pod
@@ -150,7 +243,8 @@ weblink_FwFn($$$$)
   <a name="weblinkdefine"></a>
   <b>Define</b>
   <ul>
-    <code>define &lt;name&gt; weblink [link|image|iframe|htmlCode|cmdList]
+    <code>define &lt;name&gt; weblink
+          [link|image|iframe|htmlCode|cmdList|associatedWidth]
                 &lt;argument&gt;</code>
     <br><br>
     This is a placeholder device used with FHEMWEB to be able to add user
@@ -167,14 +261,21 @@ weblink_FwFn($$$$)
              pair:Pair:set+cul2+hmPairForSec+60
              restart:Restart:shutdown+restart
              update:UpdateCheck:update+check
+      define aw weblink associatedWith rgr_Residents 3
       </code>
     </ul>
     <br>
 
     Notes:
     <ul>
-      <li>For cmdList &lt;argument&gt; consists of a list of space
-          separated icon:label:cmd triples.</li>
+      <li>For cmdList &lt;argument&gt; consists of a list of space separated
+      icon:label:cmd triples.</li>
+
+      <li>the associatedWidth mode takes a devspec and an optional depth as
+      arguments, and follows the devices along the "probably associated with"
+      links seen on the detail page for depth iterations. The so collected data
+      can be displayed as an SVG graph.</li>
+
     </ul>
   </ul>
 
diff --git a/fhem/www/pgm2/zwave_neighborlist.js b/fhem/www/pgm2/zwave_neighborlist.js
index f96d3edbd..2eadf11cf 100644
--- a/fhem/www/pgm2/zwave_neighborlist.js
+++ b/fhem/www/pgm2/zwave_neighborlist.js
@@ -11,7 +11,8 @@ zw_nl(fhemFn)
   zw_visible = !zw_visible;
   var txt = (zw_visible ? 'Hide' : 'Show');
 
-  var width=960,height=480;
+  var width=$("#content").width()-20, 
+      height=$("#content").height()-20;
   $('#ZWDongleNr a#zw_snm').html(txt+' neighbor map');
 
   if(!zw_visible) {
@@ -51,8 +52,7 @@ zw_nl(fhemFn)
       el.x = el.pos[0]; el.y = el.pos[1]; 
       cnt++;
     }
-    if(height < cnt*35)
-      height = cnt*35;
+
     zw_draw(fnRet, width, height);
     $('#ZWDongleNr a#zw_al').click(function(){ zw_al(fnRet, width, height); });
 
@@ -96,7 +96,7 @@ zw_draw(fnRet, width, height)
   for(var o in h) {
     if(h[o].txt && h[o].neighbors)
       for(var i1=0; i1<h[o].neighbors.length; i1++)
-        svg += zw_drawline(ld, h, o, i1);
+        svg += zw_drawline(fnRet, ld, h, o, i1);
   }
   for(var o in h)
     if(h[o].txt)
@@ -179,16 +179,18 @@ zw_calcPos(o, n)
 }
 
 function
-zw_drawline(ld, h, o, i1)
+zw_drawline(fnRet, ld, h, o, i1)
 {
   var n = h[o].neighbors[i1];
   var ns = (h[o].neighborstyles ? h[o].neighborstyles[i1] : "")
   if(!h[o] || !h[n])
     return "";
   var bidi = false;
-  for(var i1=0; i1<h[n].neighbors.length; i1++)
-    if(h[n].neighbors[i1] == o)
-      bidi = true;
+  if(!fnRet.skipArrow) {
+    for(var i1=0; i1<h[n].neighbors.length; i1++)
+      if(h[n].neighbors[i1] == o)
+        bidi = true;
+  }
 
   if(n < o) {
     var t = n; n = o; o = t;
@@ -204,7 +206,7 @@ zw_drawline(ld, h, o, i1)
   return '<line class="zwLine col_link '+ns+'" data-name="'+cl+
                '" x1="'+fr.x+'" y1="'+fr.y+
                '" x2="'+to.x+'" y2="'+to.y+'"'+
-                 ' marker-end="url(#endarrow)"'+
+                 (!fnRet.skipArrow ? ' marker-end="url(#endarrow)"':'')+
                  (bidi?' marker-start="url(#startarrow)"':'')+
                '/>';
 }