• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1<html>
2<head>
3<script src="jstemplate_compiled.js" type="text/javascript"></script>
4<script>
5
6tabs = {};
7tabIds = [];
8
9focusedWindowId = undefined;
10currentWindowId = undefined;
11
12function bootStrap() {
13  chrome.windows.getCurrent(function(currentWindow) {
14    currentWindowId = currentWindow.id;
15    chrome.windows.getLastFocused(function(focusedWindow) {
16      focusedWindowId = focusedWindow.id;
17      loadWindowList();
18    });
19  });
20}
21
22function isInt(i) {
23  return (typeof i == "number") && !(i % 1) && !isNaN(i);
24}
25
26function loadWindowList() {
27  chrome.windows.getAll({ populate: true }, function(windowList) {
28    tabs = {};
29    tabIds = [];
30    for (var i = 0; i < windowList.length; i++) {
31      windowList[i].current = (windowList[i].id == currentWindowId);
32      windowList[i].focused = (windowList[i].id == focusedWindowId);
33
34      for (var j = 0; j < windowList[i].tabs.length; j++) {
35        tabIds[tabIds.length] = windowList[i].tabs[j].id;
36        tabs[windowList[i].tabs[j].id] = windowList[i].tabs[j];
37      }
38    }
39
40    var input = new JsExprContext(windowList);
41    var output = document.getElementById('windowList');
42    jstProcess(input, output);
43  });
44}
45
46function updateTabData(id) {
47  var retval = {
48    url: document.getElementById('url_' + id).value,
49    selected: document.getElementById('selected_' + id).value ? true : false
50  }
51
52  return retval;
53}
54
55function updateTab(id){
56  try {
57    chrome.tabs.update(id, updateTabData(id));
58  } catch (e) {
59    alert(e);
60  }
61}
62
63function moveTabData(id) {
64  return {
65    'index': parseInt(document.getElementById('index_' + id).value),
66    'windowId': parseInt(document.getElementById('windowId_' + id).value)
67  }
68}
69function moveTab(id) {
70  try {
71    chrome.tabs.move(id, moveTabData(id));
72  } catch (e) {
73    alert(e);
74  }
75}
76
77function createTabData(id) {
78  return {
79    'index': parseInt(document.getElementById('index_' + id).value),
80    'windowId': parseInt(document.getElementById('windowId_' + id).value),
81    'index': parseInt(document.getElementById('index_' + id).value),
82    'url': document.getElementById('url_' + id).value,
83    'selected': document.getElementById('selected_' + id).value ? true : false
84  }
85}
86
87function createTab() {
88  var args = createTabData('new')
89
90  if (!isInt(args.windowId))
91    delete args.windowId;
92  if (!isInt(args.index))
93    delete args.index;
94
95  try {
96    chrome.tabs.create(args);
97  } catch (e) {
98    alert(e);
99  }
100}
101
102function updateAll() {
103  try {
104    for (var i = 0; i < tabIds.length; i++) {
105      chrome.tabs.update(tabIds[i], updateTabData(tabIds[i]));
106    }
107  } catch(e) {
108    alert(e);
109  }
110}
111
112function moveAll() {
113  appendToLog('moving all');
114  try {
115    for (var i = 0; i < tabIds.length; i++) {
116      chrome.tabs.move(tabIds[i], moveTabData(tabIds[i]));
117    }
118  } catch(e) {
119    alert(e);
120  }
121}
122
123function removeTab(tabId) {
124  try {
125    chrome.tabs.remove(tabId, function() {
126      appendToLog('tab: ' + tabId + ' removed.');
127    });
128  } catch (e) {
129    alert(e);
130  }
131}
132
133function appendToLog(logLine) {
134  document.getElementById('log')
135      .appendChild(document.createElement('div'))
136      .innerText = "> " + logLine;
137}
138
139function clearLog() {
140  document.getElementById('log').innerText = '';
141}
142
143chrome.windows.onCreated.addListener(function(createInfo) {
144  appendToLog('windows.onCreated -- window: ' + createInfo.id);
145  loadWindowList();
146});
147
148chrome.windows.onFocusChanged.addListener(function(windowId) {
149  focusedWindowId = windowId;
150  appendToLog('windows.onFocusChanged -- window: ' + windowId);
151  loadWindowList();
152});
153
154chrome.windows.onRemoved.addListener(function(windowId) {
155  appendToLog('windows.onRemoved -- window: ' + windowId);
156  loadWindowList();
157});
158
159chrome.tabs.onCreated.addListener(function(tab) {
160  appendToLog('tabs.onCreated -- window: ' + tab.windowId + ' tab: ' + tab.id + ' title: ' + tab.title + ' index ' + tab.index + ' url ' + tab.url);
161  loadWindowList();
162});
163
164chrome.tabs.onAttached.addListener(function(tabId, props) {
165  appendToLog('tabs.onAttached -- window: ' + props.newWindowId + ' tab: ' + tabId + ' index ' + props.newPosition);
166  loadWindowList();
167});
168
169chrome.tabs.onMoved.addListener(function(tabId, props) {
170  appendToLog('tabs.onMoved -- window: ' + props.windowId + ' tab: ' + tabId + ' from ' + props.fromIndex + ' to ' +  props.toIndex);
171  loadWindowList();
172});
173
174function refreshTab(tabId) {
175  chrome.tabs.get(tabId, function(tab) {
176    var input = new JsExprContext(tab);
177    var output = document.getElementById('tab_' + tab.id);
178    jstProcess(input, output);
179    appendToLog('tab refreshed -- tabId: ' + tab.id + ' url: ' + tab.url);
180  });
181}
182
183chrome.tabs.onUpdated.addListener(function(tabId, props) {
184  appendToLog('tabs.onUpdated -- tab: ' + tabId + ' status ' + props.status + ' url ' + props.url);
185  refreshTab(tabId);
186});
187
188chrome.tabs.onDetached.addListener(function(tabId, props) {
189  appendToLog('tabs.onDetached -- window: ' + props.oldWindowId + ' tab: ' + tabId + ' index ' + props.oldPosition);
190  loadWindowList();
191});
192
193chrome.tabs.onSelectionChanged.addListener(function(tabId, props) {
194  appendToLog('tabs.onSelectionChanged -- window: ' + props.windowId + ' tab: ' + tabId);
195  loadWindowList();
196});
197
198chrome.tabs.onRemoved.addListener(function(tabId) {
199  appendToLog('tabs.onRemoved -- tab: ' + tabId);
200  loadWindowList();
201});
202
203function createWindow() {
204  var args = {
205    'left': parseInt(document.getElementById('new_window_left').value),
206    'top': parseInt(document.getElementById('new_window_top').value),
207    'width': parseInt(document.getElementById('new_window_width').value),
208    'height': parseInt(document.getElementById('new_window_height').value),
209    'url': document.getElementById('new_window_url').value
210  }
211
212  if (!isInt(args.left))
213    delete args.left;
214  if (!isInt(args.top))
215    delete args.top;
216  if (!isInt(args.width))
217    delete args.width;
218  if (!isInt(args.height))
219    delete args.height;
220  if (!args.url)
221    delete args.url;
222
223  try {
224    chrome.windows.create(args);
225  } catch(e) {
226    alert(e);
227  }
228}
229
230function refreshWindow(windowId) {
231  chrome.windows.get(windowId, function(window) {
232    chrome.tabs.getAllInWindow(window.id, function(tabList) {
233      window.tabs = tabList;
234      var input = new JsExprContext(window);
235      var output = document.getElementById('window_' + window.id);
236      jstProcess(input, output);
237      appendToLog('window refreshed -- windowId: ' + window.id + ' tab count:' + window.tabs.length);
238    });
239  });
240}
241
242function updateWindowData(id) {
243  var retval = {
244    left: parseInt(document.getElementById('left_' + id).value),
245    top: parseInt(document.getElementById('top_' + id).value),
246    width: parseInt(document.getElementById('width_' + id).value),
247    height: parseInt(document.getElementById('height_' + id).value)
248  }
249  if (!isInt(retval.left))
250    delete retval.left;
251  if (!isInt(retval.top))
252    delete retval.top;
253  if (!isInt(retval.width))
254    delete retval.width;
255  if (!isInt(retval.height))
256    delete retval.height;
257
258  return retval;
259}
260
261function updateWindow(id){
262  try {
263    chrome.windows.update(id, updateWindowData(id));
264  } catch (e) {
265    alert(e);
266  }
267}
268
269function removeWindow(windowId) {
270  try {
271    chrome.windows.remove(windowId, function() {
272      appendToLog('window: ' + windowId + ' removed.');
273    });
274  } catch (e) {
275    alert(e);
276  }
277}
278
279function refreshSelectedTab(windowId) {
280  chrome.tabs.getSelected(windowId, function(tab) {
281    var input = new JsExprContext(tab);
282    var output = document.getElementById('tab_' + tab.id);
283    jstProcess(input, output);
284    appendToLog('selected tab refreshed -- tabId: ' + tab.id + ' url:' + tab.url);
285  });
286}
287
288</script>
289</head>
290  <body onload="bootStrap();">
291    <div id="windowList">
292      <div style="background-color: #AAEEEE; margin: 4px; padding: 8px; margin: 20px" jsselect="$this"
293          jsvalues="id:'window_' + id">
294        <div style="font-style: italic; width: 80px; display: inline-block">
295          Window: <span jscontent="id"></span>
296        </div>
297        <div style="display: inline-block">
298          left: <input style="width: 60px" type="text" jsvalues="value:$this.left;id:'left_' + id" />
299          top: <input style="width: 60px" type="text" jsvalues="value:$this.top;id:'top_' + id" />
300          width: <input style="width: 60px" type="text" jsvalues="value:$this.width;id:'width_' + id" />
301          height: <input style="width: 60px" type="text" jsvalues="value:$this.height;id:'height_' + id" />
302          <input type="checkbox" jsvalues="checked:focused; id:'focused_' + id" /> Focused
303          <input type="checkbox" jsvalues="checked:current; id:'current_' + id" /> Current
304          <button onclick="refreshWindow(this.jstdata);" jsvalues=".jstdata:id">Refresh</button>
305        </div>
306        <div id="tabList">
307          <div jsselect="tabs">
308            <div style="background-color: #EEEEEE; margin: 8px; padding: 4px"  jsvalues="id:'tab_' + id">
309              <div style="margin: 8px">
310                <div style="font-style: italic; width: 80px; display: inline-block" jscontent="'TabId: ' + id"></div>
311                <div style="width: 300px; display: inline-block">
312                  index: <input style="width: 20px" type="text" jsvalues="value:$this.index;id:'index_' + id" />
313                  windowId: <input style="width: 20px" type="text" jsvalues="value:windowId;id:'windowId_' + id" />
314                  <button onclick="moveTab(this.jstdata);" jsvalues=".jstdata:id">Move</button>
315                  <button onclick="refreshTab(this.jstdata);" jsvalues=".jstdata:id">Refresh</button>
316                </div>
317              </div>
318              <div style="margin: 8px">
319                <div>
320                  <div style="width: 40px; display:inline-block">title:</div>
321                  <input style="width: 90%" type="text" jsvalues="value:title;id:'title_' + id" />
322                </div>
323                <div>
324                  <div style="width: 40px; display:inline-block">url:</div>
325                  <input style="width: 90%" type="text" jsvalues="value:url;id:'url_' + id" />
326                </div>
327                <div><input type="checkbox" jsvalues="checked:selected; id:'selected_' + id" /> Selected</div>
328              </div>
329              <button onclick="updateTab(this.jstdata)" jsvalues=".jstdata:id">Update Tab</button>
330              <button onclick="removeTab(this.jstdata);" jsvalues=".jstdata:id">Close Tab</button>
331            </div>
332          </div>
333        </div>
334        <button onclick="updateWindow(this.jstdata);" jsvalues=".jstdata:id">Update Window</button>
335        <button onclick="removeWindow(this.jstdata);" jsvalues=".jstdata:id">Close Window</button>
336        <button onclick="refreshSelectedTab(this.jstdata);" jsvalues=".jstdata:id">Refresh Selected Tab</button>
337      </div>
338    </div>
339    <div style="background-color: #EEEEBB; margin: 20px; padding: 8px">
340      <h3 style="text-align: center; margin: 8px"> Create Window</h3>
341      <div style="margin: 8px">
342        <div style="width: 300px; display: inline-block">
343          left: <input style="width: 20px" type="text" id="new_window_left" />
344          top: <input style="width: 20px" type="text" id="new_window_top" />
345          width: <input style="width: 20px" type="text" id="new_window_width" />
346          height: <input style="width: 20px" type="text" id="new_window_height" />
347        </div>
348      </div>
349      <div style="margin: 8px">
350        <div>
351          <div style="width: 40px; display:inline-block">url:</div>
352          <input style="width: 90%" type="text" id="new_window_url" />
353        </div>
354      </div>
355      <button onclick="createWindow();">Create</button>
356    </div>
357    <div style="background-color: #EEEEAA; margin: 20px; padding: 8px">
358      <h3 style="text-align: center; margin: 8px"> Create Tab</h3>
359      <div style="margin: 8px">
360        <div style="width: 300px; display: inline-block">
361          index: <input style="width: 20px" type="text" id="index_new" />
362          windowId: <input style="width: 20px" type="text" id="windowId_new" />
363          <button onclick="moveTab(this.jstdata);" jsvalues=".jstdata:id">Move</button>
364        </div>
365      </div>
366      <div style="margin: 8px">
367        <div>
368          <div style="width: 40px; display:inline-block">title:</div>
369          <input style="width: 90%" type="text" id="title_new" />
370        </div>
371        <div>
372          <div style="width: 40px; display:inline-block">url:</div>
373          <input style="width: 90%" type="text" id="url_new" />
374        </div>
375        <div><input type="checkbox" id="selected_new" /> Selected</div>
376      </div>
377      <button onclick="createTab();">Create</button>
378    </div>
379    <div style="margin: 20px;">
380      <button onclick="loadWindowList();">Refresh</button>
381      <button onclick="updateAll();">Update All</button>
382      <button onclick="moveAll();">Move All</button>
383      <button onclick="clearLog();">-->Clear Log</button>
384      <button onclick="chrome.windows.create();">New Window</button>
385    </div>
386    <div id="log" style="background-color: #EEAAEE; margin: 20px; padding: 8px">
387    </div>
388  </body>
389</html>