• 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  color: black;
13  font-size: 16px;
14  margin-top: 30px;
15  margin-bottom: 0px;
16  margin-left: 70px;
17  height: 20px;
18  text-align: left;
19}
20
21#items {
22  display: -webkit-box;
23  margin-left: 60px;
24  margin-right: 60px;
25  -webkit-box-orient: horizontal;
26  -webkit-box-lines: multiple;
27}
28
29.frontend_ref {
30  color: black;
31  text-decoration: initial;
32}
33
34.thumbnail {
35  background-attachment: scroll;
36  background-origin: padding-box;
37  background-repeat: no-repeat;
38  border: 4px solid rgba(184, 184, 184, 1);
39  border-radius: 5px;
40  height: 132px;
41  width: 212px;
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  vertical-align: top;
68  width: 222px;
69}
70
71.text {
72  background: no-repeat 0;
73  background-size: 16px;
74  font-size: 12px;
75  margin: 4px 0px 0px 4px;
76  overflow: hidden;
77  padding: 2px 0px 0px 20px;
78  text-align: left;
79  text-overflow: ellipsis;
80  white-space: nowrap;
81}
82</style>
83
84<script>
85
86function onLoad() {
87  var tabsListRequest = new XMLHttpRequest();
88  tabsListRequest.open('GET', '/json/list', true);
89  tabsListRequest.onreadystatechange = onReady;
90  tabsListRequest.send();
91}
92
93function onReady() {
94  if(this.readyState == 4 && this.status == 200) {
95    if(this.response != null)
96      var responseJSON = JSON.parse(this.response);
97      for (var i = 0; i < responseJSON.length; ++i)
98        appendItem(responseJSON[i]);
99  }
100}
101
102function overrideFrontendUrl(item) {
103  if (window.location.hash) {
104    var overridden_url = window.location.hash.substr(1);
105    var ws_suffix = item.webSocketDebuggerUrl.replace('ws://', 'ws=');
106    if (overridden_url.indexOf('?') == -1)
107      return overridden_url + '?' + ws_suffix;
108    else
109      return overridden_url + '&' + ws_suffix;
110  }
111  return item.devtoolsFrontendUrl;
112}
113
114function appendItem(item_object) {
115  var frontend_ref;
116  if (item_object.devtoolsFrontendUrl) {
117    frontend_ref = document.createElement('a');
118    frontend_ref.href = overrideFrontendUrl(item_object);
119    frontend_ref.title = item_object.title;
120  } else {
121    frontend_ref = document.createElement('div');
122    frontend_ref.title = 'The tab already has an active debug session';
123  }
124  frontend_ref.className = 'frontend_ref';
125
126  var thumbnail = document.createElement('div');
127  thumbnail.className = item_object.devtoolsFrontendUrl ?
128                        'thumbnail' : 'thumbnail connected';
129  thumbnail.style.cssText = 'background-image:url(' +
130                        item_object.thumbnailUrl +
131                        ')';
132  frontend_ref.appendChild(thumbnail);
133
134  var text = document.createElement('div');
135  text.className = 'text';
136  text.innerText = item_object.description || item_object.title;
137  text.style.cssText = 'background-image:url(' +
138                       item_object.faviconUrl + ')';
139  frontend_ref.appendChild(text);
140
141  var item = document.createElement('p');
142  item.className = 'item';
143  item.appendChild(frontend_ref);
144
145  document.getElementById('items').appendChild(item);
146}
147</script>
148</head>
149<body onload='onLoad()'>
150  <div id='caption'>Inspectable pages</div>
151  <div id='items'>
152  </div>
153  <hr>
154</body>
155</html>
156