• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1<html>
2<head>
3<title>Inspectable pages</title>
4<style>
5body {
6  background-color: rgb(245, 245, 245);
7  font-family: Helvetica, Arial, sans-serif;
8  text-shadow: rgba(255, 255, 255, 0.496094) 0px 1px 0px;
9}
10
11#caption {
12  text-align: left;
13  color: black;
14  font-size: 16px;
15  margin-top: 30px;
16  margin-bottom: 0px;
17  margin-left: 70px;
18  height: 20px;
19}
20
21#items {
22  display: -webkit-box;
23  -webkit-box-orient: horizontal;
24  -webkit-box-lines: multiple;
25  margin-left: 60px;
26  margin-right: 60px;
27}
28
29.frontend_ref {
30  color: black;
31  text-decoration: initial;
32}
33
34.thumbnail {
35  height: 132px;
36  width: 212px;
37  background-attachment: scroll;
38  background-origin: padding-box;
39  background-repeat: no-repeat;
40  border: 4px solid rgba(184, 184, 184, 1);
41  border-radius: 5px;
42  -webkit-transition-property: background-color, border-color;
43  -webkit-transition: background-color 0.15s, 0.15s;
44  -webkit-transition-delay: 0, 0;
45}
46
47.thumbnail:hover {
48  background-color: rgba(242, 242, 242, 1);
49  border-color: rgba(110, 116, 128, 1);
50  color: black;
51}
52
53.thumbnail.connected {
54  opacity: 0.5;
55}
56
57.thumbnail.connected:hover {
58  border-color: rgba(184, 184, 184, 1);
59  color: rgb(110, 116, 128);
60}
61
62.item {
63  display: inline-block;
64  margin: 5px;
65  margin-top: 15px;
66  height: 162px;
67  width: 222px;
68  vertical-align: top;
69}
70
71.text {
72  text-align: left;
73  font-size: 12px;
74  text-overflow: ellipsis;
75  white-space: nowrap;
76  overflow: hidden;
77  background: no-repeat 0;
78  background-size: 16px;
79  padding: 2px 0px 0px 20px;
80  margin: 4px 0px 0px 4px;
81}
82</style>
83
84<script>
85function onLoad() {
86  var tabsListRequest = new XMLHttpRequest();
87  tabsListRequest.open("GET", "/json", true);
88  tabsListRequest.onreadystatechange = onReady;
89  tabsListRequest.send();
90}
91
92function onReady() {
93  if(this.readyState == 4 && this.status == 200) {
94    if(this.response != null)
95      var responseJSON = JSON.parse(this.response);
96      for (var i = 0; i < responseJSON.length; ++i)
97        appendItem(responseJSON[i]);
98  }
99}
100
101function appendItem(item_object) {
102  var frontend_ref;
103  if (item_object.devtoolsFrontendUrl) {
104      frontend_ref = document.createElement("a");
105      frontend_ref.href = item_object.devtoolsFrontendUrl;
106      frontend_ref.title = item_object.title;
107  } else {
108      frontend_ref = document.createElement("div");
109      frontend_ref.title = "The tab already has an active debug session";
110  }
111  frontend_ref.className = "frontend_ref";
112
113  var thumbnail = document.createElement("div");
114  thumbnail.className = item_object.devtoolsFrontendUrl ?
115                        "thumbnail" : "thumbnail connected";
116  thumbnail.style.cssText = "background-image:url(" +
117                        item_object.thumbnailUrl +
118                        ")";
119  frontend_ref.appendChild(thumbnail);
120
121  var text = document.createElement("div");
122  text.className = "text";
123  text.innerText = item_object.description || item_object.title;
124  text.style.cssText = "background-image:url(" +
125                       item_object.faviconUrl + ")";
126  frontend_ref.appendChild(text);
127
128  var item = document.createElement("p");
129  item.className = "item";
130  item.appendChild(frontend_ref);
131
132  document.getElementById("items").appendChild(item);
133}
134</script>
135</head>
136<body onload='onLoad()'>
137  <div id='caption'>Inspectable pages</div>
138  <div id='items'>
139  </div>
140  <hr>
141</body>
142</html>
143