luci-app-bmx6/files/usr/lib/lua/luci/view/bmx6/nodes_j.htm

   1 <%#
   2    Copyright (C) 2011 Pau Escrich <pau@dabax.net>
   3    Contributors Lluis Esquerda <eskerda@gmail.com>
   4
   5    This program is free software; you can redistribute it and/or modify
   6    it under the terms of the GNU General Public License as published by
   7    the Free Software Foundation; either version 2 of the License, or
   8    (at your option) any later version.
   9
  10    This program is distributed in the hope that it will be useful,
  11    but WITHOUT ANY WARRANTY; without even the implied warranty of
  12    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  13    GNU General Public License for more details.
  14
  15    You should have received a copy of the GNU General Public License along
  16    with this program; if not, write to the Free Software Foundation, Inc.,
  17    51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
  18
  19    The full GNU General Public License is included in this distribution in
  20    the file called "COPYING".
  21 -%>
  22
  23 <%+header%>
  24 <script type="text/javascript" src="<%=resource%>/cbi.js"></script>
  25 <script type="text/javascript" src="<%=resource%>/bmx6/js/polling.js"></script>
  26
  27
  28 <style>
  29
  30         div.hideme{
  31                 display: none;
  32         }
  33
  34         div.info{
  35                 background: #FFF;
  36                 border: solid 0px;
  37                 height: 90px;
  38                 display: block;
  39                 overflow: auto;
  40         }
  41
  42         div.inforow{
  43                 text-align:left;
  44                 display:inline-block;
  45                 width:20%;
  46                 margin:5px;
  47                 vertical-align:top;
  48
  49         }
  50
  51 #extra-info ul { list-style: none outside none; margin-left: 0em; }
  52
  53 </style>
  54 <div class="cbi-map">
  55
  56 <h2>Node originators</h2>
  57 <div class="cbi-map-descr"></div>
  58 <div id="extra-info" class="info">
  59         <br />
  60         <center>
  61         Click icon <img src="<%=resource%>/bmx6/world.png" /> to see individual node information
  62         </center>
  63 </div>
  64 <fieldset class="cbi-section">
  65         <legend><%:Mesh nodes%></legend>
  66         <table class="cbi-section-table" id="descriptions_table">
  67                 <tr class="cbi-section-table-titles">
  68                         <th class="cbi-section-table-cell"></th>
  69                         <th class="cbi-section-table-cell"><%:Hostname%></th>
  70                         <th class="cbi-section-table-cell"><%:Primary IP%></th>
  71                         <th class="cbi-section-table-cell"><%:Via Device%></th>
  72                         <th class="cbi-section-table-cell"><%:Metric%></th>
  73                         <th class="cbi-section-table-cell"><%:Last Desc%></th>
  74                         <th class="cbi-section-table-cell"><%:Last Ref%></th>
  75                         <th class="cbi-section-table-cell"><%:Blocked%></th>
  76                 </tr>
  77                 <tr class="cbi-section-table-row">
  78                         <td colspan="8"><br /><center><em><%:Collecting data...%></em></center></td>
  79                 </tr>
  80         </table>
  81 </fieldset>
  82
  83 </div>
  84
  85 <a href="<%=link_non_js%>">Go to non JavaScript view</a>
  86
  87 <script type="text/javascript">//<![CDATA[
  88                 var displayExtraInfo = function ( id ) {
  89                   document.getElementById('extra-info').innerHTML = document.getElementById(id).innerHTML;
  90                 }
  91
  92                 new TablePooler(5,"/cgi-bin/bmx6-info", {'$neighbours':''}, "descriptions_table", function(st){
  93                   var infoicon = "<%=resource%>/bmx6/world_small.png";
  94                   var nodeicon = "<%=resource%>/bmx6/world.png";
  95                   var originators = st.neighbours[0].originators;
  96                   var descriptions = st.neighbours[1].descriptions;
  97                   var res = Array();
  98                   var error = "";
  99
 100                   if ( originators.length != descriptions.length )
 101                   {
 102                         error = '<em><br /><%:Some problem with JSON: lenght of originators and descriptions differs. %> \
 103                         <%: Please perform a cache flush from a console it this persists: bmx6 -c --flushAll %></em>';
 104                         res.push([[error,7]]);
 105                         return res;
 106                   }
 107
 108                   for ( var i = 0; i < descriptions.length; i++ ){
 109                         var nodename =  descriptions[i].DESC_ADV.globalId.replace(/\.[^\.]+$/,"");
 110                         var extensions = descriptions[i].DESC_ADV.extensions;
 111                         //var extrainfo = '<a onclick="displayExtraInfo(\'ip-' + i + '\')"><img src="' + infoicon + '" / ></a>';
 112                         var extrainfo_link = '<a onclick="displayExtraInfo(\'ip-' + i + '\')">' +  '<img src="' + infoicon + '" />' + '</a>';
 113                         // Looking for the extensions
 114                         var hna6 = [];
 115                         var tun4in6 = [];
 116                         var tun6 = [];
 117                         for( var e = 0; e < extensions.length; e++)
 118                                 {
 119                                 if( extensions[e].HNA6_EXTENSION )
 120                                 hna6 = extensions[e].HNA6_EXTENSION;
 121                                 if ( extensions[e].TUN4IN6_NET_EXTENSION )
 122                                 tun4in6 = extensions[e].TUN4IN6_NET_EXTENSION;
 123                                 tun6in6 = extensions[e].TUN6IN6_NET_EXTENSION;
 124                                 }
 125
 126                         // Gateways
 127                         var gateways = '<ul>';
 128                         for ( var t = 0; t < tun4in6.length; t++)
 129                                 {
 130                                 if ( tun4in6[t].networklen == "32" )
 131                                         gateways += '<li><a href="http://' + tun4in6[t].network + '">' + tun4in6[t].network + '</a></li>';
 132                                 else
 133                                         gateways += "<li>"+tun4in6[t].network+'/'+tun4in6[t].networklen + ' | ' + tun4in6[t].bandwidth+'</li>';
 134                                 }
 135
 136                         for ( var t = 0; t < tun6in6.length; t++)
 137                                 {
 138                                 if ( tun6in6[t].networklen == "128" )
 139                                         gateways += '<li><a href="http://' + tun6in6[t].network + '">' + tun6in6[t].network + '</a></li>';
 140                                 else
 141                                         gateways += "<li>"+tun6in6[t].network+'/'+tun6in6[t].networklen + ' | ' + tun6in6[t].bandwidth+'</li>';
 142                                 }
 143
 144                         gateways += '</ul>';
 145
 146                         //Adding HNAs with prefix=128 as main address
 147                         var ipstxt = '';
 148                         var address;
 149                         var first = 1;
 150                         var ipstxt_hidden = '<ul>';
 151                         var hna6list = '<ul>';
 152                         var extrainfo = "";
 153
 154                         for( var e = 0; e < hna6.length; e++ )
 155                         {
 156                                 address = hna6[e].address;
 157                                 prefix = hna6[e].prefixlen;
 158                                 if ( prefix == '128' )
 159                                         {
 160                                         if (first)
 161                                                 {
 162                                                 ipstxt += address;
 163                                                 ipstxt_hidden += '<li><a href="http://['+address+']" >'+address+"</a></li>";
 164                                                 first = 0;
 165                                                 }
 166                                         else    {
 167                                                 ipstxt_hidden += '<li><a href="http://['+address+']" >'+address+"</a></li>";
 168                                                 }
 169                                         }
 170                                 else    {
 171                                         hna6list += '<li>'+address+'/'+prefix+'</li>';
 172                                         }
 173                         }
 174                         hna6list += '</ul>';
 175                         ipstxt_hidden += '</ul>';
 176
 177                         extrainfo = '<div id="ip-'+ i +'" class="hideme">'
 178                         + "<div class='inforow'>"
 179                         + "<h4>" + nodename  + '</h4>\n' + '<img src="' + nodeicon + '" />'+ "</div>"
 180
 181                         + "<div class='inforow'>"
 182                         + "<h5>Available IPs</h5>\n"
 183                         + ipstxt_hidden + "</div>\n"
 184
 185                         + "<div class='inforow'>"
 186                         + "<h5>Gateways announced</h5>\n"
 187                         + gateways + "</div>\n"
 188
 189                         + "<div class='inforow'>"
 190                         + "<h5>Networks announced</h5>\n"
 191                         + hna6list +  "</div>\n"
 192                         + "\n</div>";
 193
 194                         res.push([extrainfo_link,nodename, ipstxt, originators[i].viaDev, originators[i].metric,
 195                         originators[i].lastDesc, originators[i].lastRef, originators[i].blocked, extrainfo]);
 196
 197                   }
 198                   return res;
 199                 });
 200 //]]></script>
 201
 202 <%+footer%>
 203