Update copyright dates
[src/app-framework-binder.git] / test / monitoring / monitor.html
index 1a1d49c..a3ae653 100644 (file)
@@ -1,28 +1,39 @@
 <html>
 <head>
+<!--
+ * Copyright (C) 2015-2020 "IoT.bzh"
+ * Author: José Bollo <jose.bollo@iot.bzh>
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+-->
     <title>Monitoring</title>
-    <link href="monitor.css" rel="stylesheet">
+    <link href="monitor-base.css" rel="stylesheet">
+    <link href="monitor-demo.css" rel="stylesheet" title="demo">
+    <link href="monitor-pastel.css" rel="alternate stylesheet" title="pastel">
     <script type="text/javascript" src="underscore-min.js"></script>
     <script type="text/javascript" src="AFB.js"></script>
     <script type="text/javascript" src="monitor.js"></script>
 
-<body id="root" class="on" onload="init();">
+<body id="root" class="-flex-v off" onload="init();">
   <div id="head" class="clearfix">
     <div id="logo"></div>
     <div id="connected">Not Connected</div>
     <div id="title">Monitoring</div>
   </div>
-  <div id="work">
-    <div id="params" class="clearfix">
-      <div id="connect" class="x-button">connect</div>
-      <div>host: <input type="text" id="param-host" size="50" value="localhost"></input></div>
-      <div>port: <input type="text" id="param-port" size="10" value="1234"></input></div>
-      <div>token: <input type="text" id="param-token" size="33" value="hello"></input></div>
-    </div>
-    <div id="main">
-      <div class="fillfix"></div>
-      <div id="controls">
-        <div id="all" class="api opened" data-api="*">
+  <div id="work" class="-flex-fill -flex-h">
+    <div id="controls" class="-box-out">
+      <div class="-box-in">
+        <div id="all" class="api opened" data-apiname="*">
           <div class="opclo"></div>
           <div class="name">{ALL}</div>
           <div class="desc">Settings for all</div>
@@ -32,7 +43,7 @@
           <div class="closedon">traces...</div>
           <div class="trace closedoff"></div>
         </div>
-        <div id="common" class="api" data-api="">
+        <div id="common" class="api" data-apiname="">
           <div class="name">{COMMON}</div>
           <div class="desc">Settings without apis</div>
           <hr>
         <div id="apis">
         </div>
       </div>
-      <div id="logmsg-box">
+    </div>
+    <div id="middle" class="-flex-v">
+      <div id="params" class="clearfix">
+        <div>host: <input type="text" id="param-host" size="50" value="localhost"></input></div>
+        <div>port: <input type="text" id="param-port" size="10" value="1234"></input></div>
+        <div>token: <input type="text" id="param-token" size="33" value="HELLO"></input></div>
+      </div>
+      <div class="-flex-fill -box-out">
+        <div id="trace-events" class="-box-in">
+        </div>
+      </div>
+    </div>
+
+      <div id="menu" class="-flex-v">
+        <div id="connect" class="x-button">Connect</div>
         <div id="disconnect" class="x-button">Disconnect</div>
+        <div id="style" class="x-button">style</div>
+        <div id="autoscroll" class="x-button">Stop scroll</div>
+        <div id="addsep" class="x-button">Add separator</div>
         <div id="droptracevts" class="x-button">Clear traces</div>
-        <div id="expert-pane" class="closed">
+        <div id="experts" class="x-button closed">
           <div class="opclo"></div>
-          <div class="expert">{EXPERT}</div>
-          <div class="closedoff">
-            <div id="stopmsgs" class="x-button">Stop logs</div>
-            <div id="dropmsgs" class="x-button">Clear logs</div>
-            <div id="logmsgs"></div>
+          {EXPERTS}
+        </div>
+        <div id="expert-pane" class="-flex-fill -flex-v">
+          <div id="stopmsgs" class="x-button">Stop logs</div>
+          <div id="dropmsgs" class="x-button">Clear logs</div>
+          <div class="-flex-fill -box-out">
+              <div id="logmsgs" class="-box-in"></div>
           </div>
         </div>
       </div>
-      <div id="trace-events">
-      </div>
-    </div>
   </div>
 
 <!-- template for APIS -->
   <template id="t-api">
-    <div class="api closed" data-api="">
+    <div class="api closed" data-apiname="">
       <div class="opclo"></div>
       <div class="name"></div>
       <div class="desc"></div>
       <span>Verbosity:</span>
       <select class="select">
         <option value="error">error</option>
+        <option value="warning">warning</option>
         <option value="notice">notice</option>
         <option value="info">info</option>
         <option value="debug">debug</option>
         <div class="trace-item"><input type="radio" value="extra">extra</input></div>
         <div class="trace-item"><input type="radio" value="all">all</input></div>
       </div>
+      <div class="trace-box global" data-trace="global">
+        <div class="trace-title">trace globals:</div>
+        <div class="trace-item"><input type="radio" value="no" checked>no</input></div>
+        <div class="trace-item"><input type="radio" value="all">all</input></div>
+      </div>
     </div>
   </template>
 
     </div>
   </template>
 
+<!-- template for SEPARATOR -->
+  <template id="t-separator">
+    <div class="separator"></div>
+  </template>
+