test/monitoring/monitor.html

   1 <html>
   2 <head>
   3 <!--
   4  * Copyright (C) 2017-2019 "IoT.bzh"
   5  * Author: José Bollo <jose.bollo@iot.bzh>
   6  *
   7  * Licensed under the Apache License, Version 2.0 (the "License");
   8  * you may not use this file except in compliance with the License.
   9  * You may obtain a copy of the License at
  10  *
  11  *   http://www.apache.org/licenses/LICENSE-2.0
  12  *
  13  * Unless required by applicable law or agreed to in writing, software
  14  * distributed under the License is distributed on an "AS IS" BASIS,
  15  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16  * See the License for the specific language governing permissions and
  17  * limitations under the License.
  18 -->
  19     <title>Monitoring</title>
  20     <link href="monitor-base.css" rel="stylesheet">
  21     <link href="monitor-iot.css" rel="stylesheet" title="iot">
  22     <link href="monitor-demo.css" rel="alternate stylesheet" title="demo">
  23     <link href="monitor-pastel.css" rel="alternate stylesheet" title="pastel">
  24     <script type="text/javascript" src="underscore-min.js"></script>
  25     <script type="text/javascript" src="AFB.js"></script>
  26     <script type="text/javascript" src="monitor.js"></script>
  27
  28 <body id="root" class="-flex-v off" onload="init();">
  29   <div id="head" class="clearfix">
  30     <div id="connected">Not Connected</div>
  31     <div id="logo"></div>
  32     <div id="title">Monitoring</div>
  33   </div>
  34   <div id="work" class="-flex-fill -flex-h">
  35     <div id="controls" class="-box-out">
  36       <div class="-box-in">
  37         <div id="all" class="api opened" data-apiname="*">
  38           <div class="opclo"></div>
  39           <div class="name">{ALL}</div>
  40           <div class="desc">Settings for all</div>
  41           <hr>
  42           <div class="verbosity">placeholder</div>
  43           <hr class="closedoff">
  44           <div class="closedon">traces...</div>
  45           <div class="trace closedoff"></div>
  46         </div>
  47         <div id="common" class="api" data-apiname="">
  48           <div class="name">{COMMON}</div>
  49           <div class="desc">Settings without apis</div>
  50           <hr>
  51           <div class="verbosity">placeholder</div>
  52         </div>
  53         <div id="apis">
  54         </div>
  55       </div>
  56     </div>
  57     <div id="middle" class="-flex-v">
  58       <div id="params" class="clearfix">
  59         <div>host: <input type="text" id="param-host" size="50" value="localhost"></input></div>
  60         <div>port: <input type="text" id="param-port" size="10" value="1234"></input></div>
  61         <div>token: <input type="text" id="param-token" size="33" value="HELLO"></input></div>
  62       </div>
  63       <div class="-flex-fill -box-out">
  64         <div id="trace-events" class="-box-in">
  65         </div>
  66       </div>
  67     </div>
  68
  69       <div id="menu" class="-flex-v">
  70         <div id="connect" class="x-button">Connect</div>
  71         <div id="disconnect" class="x-button">Disconnect</div>
  72         <div id="style" class="x-button">style</div>
  73         <div id="autoscroll" class="x-button">Stop scroll</div>
  74         <div id="addsep" class="x-button">Add separator</div>
  75         <div id="droptracevts" class="x-button">Clear traces</div>
  76         <div id="experts" class="x-button closed">
  77           <div class="opclo"></div>
  78           {EXPERTS}
  79         </div>
  80         <div id="expert-pane" class="-flex-fill -flex-v">
  81           <div id="stopmsgs" class="x-button">Stop logs</div>
  82           <div id="dropmsgs" class="x-button">Clear logs</div>
  83           <div class="-flex-fill -box-out">
  84               <div id="logmsgs" class="-box-in"></div>
  85           </div>
  86         </div>
  87       </div>
  88   </div>
  89
  90 <!-- template for APIS -->
  91   <template id="t-api">
  92     <div class="api closed" data-apiname="">
  93       <div class="opclo"></div>
  94       <div class="name"></div>
  95       <div class="desc"></div>
  96       <div class="closedoff">
  97         <hr>
  98         <div class="verbosity">placeholder</div>
  99         <hr>
 100         <div class="closed">
 101           <div class="opclo"></div>
 102           <div class="closedon">verbs...</div>
 103           <div class="verbs closedoff"></div>
 104         </div>
 105         <div class="closed">
 106           <div class="opclo"></div>
 107           <div class="closedon">traces...</div>
 108           <div class="trace closedoff"></div>
 109         </div>
 110       </div>
 111     </div>
 112   </template>
 113
 114 <!-- template for VERBS of APIS -->
 115   <template id="t-verb">
 116     <div class="verb" data-verb="">
 117       <div class="vdsc">
 118         <span class="name"></span>
 119         <span class="colon">:</span>
 120         <span class="desc"></span>
 121       </div>
 122       <div class="perm"></div>
 123     </div>
 124   </template>
 125
 126 <!-- template for ERRORS -->
 127   <template id="t-logmsg">
 128     <div class="logmsg">
 129       <div class="close"></div>
 130       <div class="tag"></div>
 131       <div class="content"></div>
 132     </div>
 133   </template>
 134
 135 <!-- template for VERBOSITY -->
 136   <template id="t-verbosity">
 137     <div class="verbosity">
 138       <span>Verbosity:</span>
 139       <select class="select">
 140         <option value="error">error</option>
 141         <option value="warning">warning</option>
 142         <option value="notice">notice</option>
 143         <option value="info">info</option>
 144         <option value="debug">debug</option>
 145       </select>
 146     </div>
 147   </template>
 148
 149 <!-- template for TRACE -->
 150   <template id="t-trace">
 151     <div class="trace closedoff">
 152       <div class="trace-box request" data-trace="request">
 153         <div class="trace-title">trace requests: <a target="_blank" href="http://docs.automotivelinux.org/docs/apis_services/en/dev/reference/af-binder/afb-binding-references.html#functions-of-class-afbreq">(doc)</a></div>
 154         <div class="trace-item"><input type="radio" value="no" checked>no</input></div>
 155         <div class="trace-item"><input type="radio" value="common">common</input></div>
 156         <div class="trace-item"><input type="radio" value="extra">extra</input></div>
 157         <div class="trace-item"><input type="radio" value="all">all</input></div>
 158       </div>
 159       <div class="trace-box service" data-trace="service">
 160         <div class="trace-title">trace service call: <a target="_blank" href="http://docs.automotivelinux.org/docs/apis_services/en/dev/reference/af-binder/afb-binding-references.html#functions-of-class-afbservice">(doc)</a></div>
 161         <div class="trace-item"><input type="radio" value="no" checked>no</input></div>
 162         <div class="trace-item"><input type="radio" value="all">all</input></div>
 163       </div>
 164       <div class="trace-box daemon" data-trace="daemon">
 165         <div class="trace-title">trace daemon: <a target="_blank" href="http://docs.automotivelinux.org/docs/apis_services/en/dev/reference/af-binder/afb-binding-references.html#functions-of-class-afbdaemon">(doc)</a></div>
 166         <div class="trace-item"><input type="radio" value="no" checked>no</input></div>
 167         <div class="trace-item"><input type="radio" value="common">common</input></div>
 168         <div class="trace-item"><input type="radio" value="extra">extra</input></div>
 169         <div class="trace-item"><input type="radio" value="all">all</input></div>
 170       </div>
 171       <div class="trace-box event" data-trace="event">
 172         <div class="trace-title">trace events: <a target="_blank" href="http://docs.automotivelinux.org/docs/apis_services/en/dev/reference/af-binder/afb-binding-references.html#functions-of-class-afbevent">(doc)</a></div>
 173         <div class="trace-item"><input type="radio" value="no" checked>no</input></div>
 174         <div class="trace-item"><input type="radio" value="common">common</input></div>
 175         <div class="trace-item"><input type="radio" value="extra">extra</input></div>
 176         <div class="trace-item"><input type="radio" value="all">all</input></div>
 177       </div>
 178       <div class="trace-box global" data-trace="global">
 179         <div class="trace-title">trace globals:</div>
 180         <div class="trace-item"><input type="radio" value="no" checked>no</input></div>
 181         <div class="trace-item"><input type="radio" value="all">all</input></div>
 182       </div>
 183     </div>
 184   </template>
 185
 186 <!-- template for EVENTS -->
 187   <template id="t-traceevent">
 188     <div class="traceevent closed">
 189       <div class="close"></div>
 190       <div class="time"></div>
 191       <div class="tag"></div>
 192       <div class="content"></div>
 193     </div>
 194   </template>
 195
 196 <!-- template for SEPARATOR -->
 197   <template id="t-separator">
 198     <div class="separator"></div>
 199   </template>
 200
 201