• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1<!-- Copyright 2018 the V8 project authors. All rights reserved.
2Use of this source code is governed by a BSD-style license that can be
3found in the LICENSE file. -->
4<template id="details-selection-template">
5<style>
6#dataSelectionSection {
7  display: none;
8}
9
10.box {
11  border-left: dashed 1px #666666;
12  border-right: dashed 1px #666666;
13  border-bottom: dashed 1px #666666;
14  padding: 10px;
15  overflow: hidden;
16  position: relative;
17}
18
19.box:nth-of-type(1) {
20  border-top: dashed 1px #666666;
21  border-radius: 5px 5px 0px 0px;
22}
23
24.box:last-of-type {
25    border-radius: 0px 0px 5px 5px;
26}
27
28.box > ul {
29  margin: 0px;
30  padding: 0px;
31}
32
33.box > ul > li {
34  display: inline-block;
35}
36
37.box > ul > li:not(:first-child) {
38  margin-left: 10px;
39}
40
41.box > ul > li:first-child {
42  font-weight: bold;
43}
44
45.instanceTypeSelectBox {
46  position: relative;
47  overflow: hidden;
48  float: left;
49  padding: 0px 5px 2px 0px;
50  margin: 3px;
51  border-radius: 3px;
52}
53
54.instanceTypeSelectBox > label {
55  font-size: xx-small;
56}
57
58.instanceTypeSelectBox > input {
59  vertical-align: middle;
60}
61
62.percentBackground {
63  position: absolute;
64  width: 200%;
65  height: 100%;
66  left: 0%;
67  top: 0px;
68  margin-left: -100%;
69  transition: all 1s ease-in-out;
70}
71
72.instanceTypeSelectBox > .percentBackground  {
73  background: linear-gradient(90deg, #68b0f7 50%, #b3d9ff 50%);
74  z-index: -1;
75}
76.box > .percentBackground  {
77  background: linear-gradient(90deg, #e0edfe 50%, #fff 50%);
78  z-index: -2;
79}
80
81#categories {
82  margin-top: 10px;
83}
84
85#category-filter {
86  text-align: right;
87  width: 50px;
88}
89
90</style>
91<section id="dataSelectionSection">
92  <h2>Data selection</h2>
93  <ul>
94    <li>
95      <label for="isolate-select">
96        Isolate
97      </label>
98      <select id="isolate-select">
99        <option>No data</option>
100      </select>
101    </li>
102    <li>
103      <label for="data-view-select">
104        Data view
105      </label>
106      <select id="data-view-select">
107        <option>No data</option>
108      </select>
109    </li>
110    <li>
111      <label for="dataset-select">
112        Data set
113      </label>
114      <select id="dataset-select">
115        <option>No data</option>
116      </select>
117    </li>
118    <li>
119      <label for="gc-select">
120        Garbage collection (at a specific time in ms)
121      </label>
122      <select id="gc-select">
123        <option>No data</option>
124      </select>
125    </li>
126    <li>
127      <input id="category-filter" type="text" value="0" disabled="disabled" />KB
128      <button id="category-filter-btn" disabled="disabled">
129        Filter categories with less memory
130      </button>
131      <button id="category-auto-filter-btn" disabled="disabled">
132        Show top 20 categories only
133      </button>
134    </li>
135    <li>
136      <button id="csv-export-btn" disabled="disabled">Export selection as CSV</button>
137    </li>
138  </ul>
139
140  <div id="categories"></div>
141</section>
142</template>
143
144<script type="text/javascript" src="categories.js"></script>
145<script type="text/javascript" src="details-selection.js"></script>
146