js/topology/cards.js

   1 // Copyright (c) 2018 Maen Artimy\r
   2 // \r
   3 // Licensed under the Apache License, Version 2.0 (the "License");\r
   4 // you may not use this file except in compliance with the License.\r
   5 // You may obtain a copy of the License at\r
   6 // \r
   7 //   http://www.apache.org/licenses/LICENSE-2.0\r
   8 //\r
   9 // Unless required by applicable law or agreed to in writing, software\r
  10 // distributed under the License is distributed on an "AS IS" BASIS,\r
  11 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
  12 // See the License for the specific language governing permissions and\r
  13 // limitations under the License.\r
  14 \r
  15 \r
  16 var BAR_IDX = 1;\r
  17 var CONTAINER_IDX = 2;\r
  18 \r
  19 var cardControl = ( function() {\r
  20         console.log("cardControl");\r
  21         var expand = function(e) {\r
  22                 var size = e.parentElement.parentElement.parentElement.style.width;\r
  23                 if(size==='96%') { // first value of size is ""\r
  24                         e.parentElement.parentElement.parentElement.style.width = '45%';\r
  25                 } else {\r
  26                         e.parentElement.parentElement.parentElement.style.width = '96%';\r
  27                 }\r
  28                 //e.classList.toggle("active");\r
  29         };\r
  30 \r
  31         var collapse = function(e) {\r
  32                 var c = e.parentElement.parentElement.parentElement.childNodes.item(CONTAINER_IDX);\r
  33                 var disp = c.style.display;\r
  34                 if(disp == "none") {\r
  35                         c.style.display = "block"\r
  36                 } else {\r
  37                         c.style.display = "none";\r
  38                 }\r
  39         };\r
  40 \r
  41         return {\r
  42                 expand: expand,\r
  43                 collapse: collapse\r
  44         }\r
  45 })();\r
  46 \r
  47 // Generate cards dynamicly based on the template given by local 'html' variable\r
  48 // and data from the 'views' list. Cards are added to the 'parent' element\r
  49 // passed as argument.\r
  50 var generateCards = ( function() {\r
  51         console.log("generateCards");\r
  52         var html =      "<div class=\"header\"><h1>{Title}</h1> \\r
  53                         <div class=\"topnav\"><a href=\"javascript:void(0)\" onclick=\"cardControl.collapse(this)\">&#8722;</a> \\r
  54                         <a href=\"javascript:void(0)\" onclick=\"cardControl.expand(this)\">&#8596;</a> \\r
  55                         </div></div><div class=\"bar\"></div><div class=\"container\"><p>No data to display...</p> \\r
  56                         </div><div class=\"footing\"></div>";\r
  57 \r
  58         // <a href=\"#refresh\">&#8634;</a>\r
  59 \r
  60         var run = function(views, parent) {\r
  61                 console.log("generateCards.run");\r
  62                 var doc = document.getElementById(parent);\r
  63                 doc.innerHTML = "";\r
  64                 for (var idx in views) {\r
  65                         var d = document.createElement("div");\r
  66                         d.id = views[idx].id;\r
  67                         d.classList.add("card");\r
  68                         var card = html.replace("{Title}", views[idx].dsc);\r
  69                         d.innerHTML = card;\r
  70                         doc.appendChild(d);\r
  71                 }\r
  72         };\r
  73 \r
  74         /*var loadModules = function(views) {\r
  75                 for (var idx in views) {\r
  76                         if(views[idx].call) {\r
  77                                 var card = document.getElementById(views[idx].id);\r
  78                                 var container = card.childNodes.item(CONTAINER_IDX)\r
  79 \r
  80                                 var myModule = new BaseModule(views[idx].cmd);\r
  81                                 myModule.callback = views[idx].call;\r
  82                                 myModule.run(container);\r
  83                         }\r
  84                 }\r
  85         };*/\r
  86 \r
  87         return {\r
  88                 run: run\r
  89         }\r
  90 })();\r
  91 \r
  92 var views = [\r
  93 {id:"mSwitch", cmd:"/listswitch", dsc:"Open V Switch ID(s)", call:dpList, ref:true},\r
  94 {id:"mTableStats", cmd:"/tablestatus?tablestat=<dpid>", dsc:"Table stats", call:dpTable, ref:true},\r
  95 {id:"mPortDesc", cmd:"/portsdesc?portdesc=<dpid>", dsc:"Port Desc", call:dpTable, ref:true},\r
  96 {id:"mPorts", cmd:"/portsstat?portstat=<dpid>", dsc:"Ports stats", call:dpTable, ref:true},\r
  97 //{id:"mTableFeature", cmd:"/data?tablefeature=<dpid>", dsc:"Table Features", call:dpTable, ref:true},\r
  98 //{id:"mQueueStats", cmd:"/data?queuestat=<dpid>", dsc:"Queue Stats", call:dpTable, ref:true},\r
  99 //{id:"mQueueConfig", cmd:"/data?queueconfig=<dpid>", dsc:"Queue Configuration", call:dpTable, ref:true},\r
 100 //{id:"mMeters", cmd:"/data?meterstat=<dpid>", dsc:"Meter stats", call:dpTable, ref:true}\r
 101 ];\r