monitoring: improvements
[src/app-framework-binder.git] / test / monitoring / monitor.html
1 <html>
2 <head>
3 <!--
4  * Copyright (C) 2017 "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-demo.css" rel="stylesheet">
22     <script type="text/javascript" src="underscore-min.js"></script>
23     <script type="text/javascript" src="AFB.js"></script>
24     <script type="text/javascript" src="monitor.js"></script>
25
26 <body id="root" class="-flex-v on" onload="init();">
27   <div id="head" class="clearfix">
28     <div id="logo"></div>
29     <div id="connected">Not Connected</div>
30     <div id="title">Monitoring</div>
31   </div>
32   <div id="work" class="-flex-fill -flex-h">
33     <div id="controls" class="-box-out">
34       <div class="-box-in">
35         <div id="all" class="api opened" data-api="*">
36           <div class="opclo"></div>
37           <div class="name">{ALL}</div>
38           <div class="desc">Settings for all</div>
39           <hr>
40           <div class="verbosity">placeholder</div>
41           <hr class="closedoff">
42           <div class="closedon">traces...</div>
43           <div class="trace closedoff"></div>
44         </div>
45         <div id="common" class="api" data-api="">
46           <div class="name">{COMMON}</div>
47           <div class="desc">Settings without apis</div>
48           <hr>
49           <div class="verbosity">placeholder</div>
50         </div>
51         <div id="apis">
52         </div>
53       </div>
54     </div>
55     <div id="middle" class="-flex-v">
56       <div id="params" class="clearfix">
57         <div>host: <input type="text" id="param-host" size="50" value="localhost"></input></div>
58         <div>port: <input type="text" id="param-port" size="10" value="1234"></input></div>
59         <div>token: <input type="text" id="param-token" size="33" value="hello"></input></div>
60       </div>
61       <div class="-flex-fill -box-out">
62         <div id="trace-events" class="-box-in">
63         </div>
64       </div>
65     </div>
66
67       <div id="menu" class="-flex-v">
68         <div id="connect" class="x-button">Connect</div>
69         <div id="disconnect" class="x-button">Disconnect</div>
70         <div id="autoscroll" class="x-button">Stop scroll</div>
71         <div id="addsep" class="x-button">Add separator</div>
72         <div id="droptracevts" class="x-button">Clear traces</div>
73         <div id="experts" class="x-button closed">
74           <div class="opclo"></div>
75           {EXPERTS}
76         </div>
77         <div id="expert-pane" class="-flex-fill -flex-v">
78           <div id="stopmsgs" class="x-button">Stop logs</div>
79           <div id="dropmsgs" class="x-button">Clear logs</div>
80           <div class="-flex-fill -box-out">
81               <div id="logmsgs" class="-box-in"></div>
82           </div>
83         </div>
84       </div>
85   </div>
86
87 <!-- template for APIS -->
88   <template id="t-api">
89     <div class="api closed" data-api="">
90       <div class="opclo"></div>
91       <div class="name"></div>
92       <div class="desc"></div>
93       <div class="closedoff">
94         <hr>
95         <div class="verbosity">placeholder</div>
96         <hr>
97         <div class="closed">
98           <div class="opclo"></div>
99           <div class="closedon">verbs...</div>
100           <div class="verbs closedoff"></div>
101         </div>
102         <div class="closed">
103           <div class="opclo"></div>
104           <div class="closedon">traces...</div>
105           <div class="trace closedoff"></div>
106         </div>
107       </div>
108     </div>
109   </template>
110
111 <!-- template for VERBS of APIS -->
112   <template id="t-verb">
113     <div class="verb" data-verb="">
114       <div class="vdsc">
115         <span class="name"></span>
116         <span class="colon">:</span>
117         <span class="desc"></span>
118       </div>
119       <div class="perm"></div>
120     </div>
121   </template>
122
123 <!-- template for ERRORS -->
124   <template id="t-logmsg">
125     <div class="logmsg">
126       <div class="close"></div>
127       <div class="tag"></div>
128       <div class="content"></div>
129     </div>
130   </template>
131
132 <!-- template for VERBOSITY -->
133   <template id="t-verbosity">
134     <div class="verbosity">
135       <span>Verbosity:</span>
136       <select class="select">
137         <option value="error">error</option>
138         <option value="notice">notice</option>
139         <option value="info">info</option>
140         <option value="debug">debug</option>
141       </select>
142     </div>
143   </template>
144
145 <!-- template for TRACE -->
146   <template id="t-trace">
147     <div class="trace closedoff">
148       <div class="trace-box request" data-trace="request">
149         <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>
150         <div class="trace-item"><input type="radio" value="no" checked>no</input></div>
151         <div class="trace-item"><input type="radio" value="common">common</input></div>
152         <div class="trace-item"><input type="radio" value="extra">extra</input></div>
153         <div class="trace-item"><input type="radio" value="all">all</input></div>
154       </div>
155       <div class="trace-box service" data-trace="service">
156         <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>
157         <div class="trace-item"><input type="radio" value="no" checked>no</input></div>
158         <div class="trace-item"><input type="radio" value="all">all</input></div>
159       </div>
160       <div class="trace-box daemon" data-trace="daemon">
161         <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>
162         <div class="trace-item"><input type="radio" value="no" checked>no</input></div>
163         <div class="trace-item"><input type="radio" value="common">common</input></div>
164         <div class="trace-item"><input type="radio" value="extra">extra</input></div>
165         <div class="trace-item"><input type="radio" value="all">all</input></div>
166       </div>
167       <div class="trace-box event" data-trace="event">
168         <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>
169         <div class="trace-item"><input type="radio" value="no" checked>no</input></div>
170         <div class="trace-item"><input type="radio" value="common">common</input></div>
171         <div class="trace-item"><input type="radio" value="extra">extra</input></div>
172         <div class="trace-item"><input type="radio" value="all">all</input></div>
173       </div>
174     </div>
175   </template>
176
177 <!-- template for EVENTS -->
178   <template id="t-traceevent">
179     <div class="traceevent closed">
180       <div class="close"></div>
181       <div class="time"></div>
182       <div class="tag"></div>
183       <div class="content"></div>
184     </div>
185   </template>
186
187 <!-- template for SEPARATOR -->
188   <template id="t-separator">
189     <div class="separator"></div>
190   </template>
191
192