OLD | NEW |
(Empty) | |
| 1 <html> |
| 2 <head> |
| 3 <script src="jstemplate_compiled.js" type="text/javascript"></script> |
| 4 <script> |
| 5 |
| 6 tabs = {}; |
| 7 tabIds = []; |
| 8 |
| 9 function loadWindowList() { |
| 10 chromium.tabs.getWindows(undefined, function(windowList) { |
| 11 tabs = {}; |
| 12 tabIds = []; |
| 13 for (var i = 0; i < windowList.length; i++) { |
| 14 for (var j = 0; j < windowList[i].tabs.length; j++) { |
| 15 tabIds[tabIds.length] = windowList[i].tabs[j].id; |
| 16 tabs[windowList[i].tabs[j].id] = windowList[i].tabs[j]; |
| 17 } |
| 18 } |
| 19 |
| 20 var input = new JsExprContext(windowList); |
| 21 var output = document.getElementById('windowList'); |
| 22 jstProcess(input, output); |
| 23 }); |
| 24 } |
| 25 |
| 26 function updateTabData(id) { |
| 27 var retval = { |
| 28 id: id, |
| 29 url: document.getElementById('url_' + id).value, |
| 30 windowId: parseInt(document.getElementById('windowId_' + id).value), |
| 31 selected: document.getElementById('selected_' + id).value ? true : false |
| 32 } |
| 33 |
| 34 return retval; |
| 35 } |
| 36 |
| 37 function updateTab(id){ |
| 38 chromium.tabs.updateTab(updateTabData(id)); |
| 39 } |
| 40 |
| 41 function moveTabData(id) { |
| 42 return { |
| 43 'id': id, |
| 44 'index': parseInt(document.getElementById('index_' + id).value), |
| 45 'windowId': parseInt(document.getElementById('windowId_' + id).value) |
| 46 } |
| 47 } |
| 48 function moveTab(id) { |
| 49 chromium.tabs.moveTab(moveTabData(id)); |
| 50 } |
| 51 |
| 52 function createTabData(id) { |
| 53 return { |
| 54 'windowId': parseInt(document.getElementById('windowId_' + id).value), |
| 55 'url': document.getElementById('url_' + id).value, |
| 56 'selected': document.getElementById('selected_' + id).value ? true : false |
| 57 } |
| 58 } |
| 59 |
| 60 function createTab() { |
| 61 chromium.tabs.createTab(createTabData('new')); |
| 62 } |
| 63 |
| 64 function updateAll() { |
| 65 |
| 66 for (var i = 0; i < tabIds.length; i++) { |
| 67 chromium.tabs.updateTab(updateTabData(tabIds[i])); |
| 68 } |
| 69 } |
| 70 |
| 71 function moveAll() { |
| 72 appendToLog('moving all'); |
| 73 for (var i = 0; i < tabIds.length; i++) { |
| 74 chromium.tabs.moveTab(moveTabData(tabIds[i])); |
| 75 } |
| 76 } |
| 77 |
| 78 function appendToLog(logLine) { |
| 79 var log = document.getElementById('log'); |
| 80 log.innerHTML = '<div> > ' + logLine + '</div>' + log.innerHTML; |
| 81 } |
| 82 |
| 83 function clearLog() { |
| 84 document.getElementById('log').innerHTML = ''; |
| 85 } |
| 86 |
| 87 chromium.tabs.onTabCreated.addListener(function(data) { |
| 88 appendToLog('onTabCreated -- window: ' + data.windowId + ' tab: ' + data.tabId
+ ' index ' + data.index); |
| 89 loadWindowList(); |
| 90 }); |
| 91 |
| 92 chromium.tabs.onTabAttached.addListener(function(data) { |
| 93 appendToLog('onTabAttached -- window: ' + data.windowId + ' tab: ' + data.tabI
d + ' index ' + data.index); |
| 94 loadWindowList(); |
| 95 }); |
| 96 |
| 97 chromium.tabs.onTabMoved.addListener(function(data) { |
| 98 appendToLog('onTabMoved -- window: ' + data.windowId + ' tab: ' + data.tabId +
' from ' + data.fromIndex + ' to ' + data.toIndex); |
| 99 loadWindowList(); |
| 100 }); |
| 101 |
| 102 chromium.tabs.onTabDetached.addListener(function(data) { |
| 103 appendToLog('onTabDetached -- window: ' + data.windowId + ' tab: ' + data.tabI
d + ' index ' + data.index); |
| 104 loadWindowList(); |
| 105 }); |
| 106 |
| 107 chromium.tabs.onTabSelectionChanged.addListener(function(data) { |
| 108 appendToLog('onTabSelectionChanged -- window: ' + data.windowId + ' tab: ' + d
ata.tabId + ' index ' + data.index); |
| 109 loadWindowList(); |
| 110 }); |
| 111 |
| 112 chromium.tabs.onTabRemoved.addListener(function(data) { |
| 113 appendToLog('onTabRemoved -- window: ' + data.windowId + ' tab: ' + data.tabId
+ ' index ' + data.index); |
| 114 loadWindowList(); |
| 115 }); |
| 116 |
| 117 function isInt(i) { |
| 118 return (typeof i == "number") && !(i % 1) && !isNaN(i); |
| 119 } |
| 120 |
| 121 function createWindow() { |
| 122 var args = { |
| 123 'left': parseInt(document.getElementById('new_window_left').value), |
| 124 'top': parseInt(document.getElementById('new_window_top').value), |
| 125 'width': parseInt(document.getElementById('new_window_width').value), |
| 126 'height': parseInt(document.getElementById('new_window_height').value), |
| 127 'url': document.getElementById('new_window_url').value |
| 128 } |
| 129 |
| 130 if (!isInt(args.left)) |
| 131 delete args.left; |
| 132 if (!isInt(args.top)) |
| 133 delete args.top; |
| 134 if (!isInt(args.width)) |
| 135 delete args.width; |
| 136 if (!isInt(args.height)) |
| 137 delete args.height; |
| 138 if (!args.url) |
| 139 delete args.url; |
| 140 |
| 141 chromium.tabs.createWindow(args); |
| 142 } |
| 143 |
| 144 </script> |
| 145 </head> |
| 146 <body onload="loadWindowList();"> |
| 147 <div id="windowList"> |
| 148 <div style="background-color: #AAEEEE; margin: 4px; padding: 8px; margin:
20px" jsselect="$this"> |
| 149 <div style="font-style: italic; width: 80px; display: inline-block"> |
| 150 Window: <span jscontent="id"></span> |
| 151 </div> |
| 152 <div style="display: inline-block"> |
| 153 left: <input style="width: 60px" type="text" jsvalues="value:$this.lef
t;id:'left_' + id" /> |
| 154 top: <input style="width: 60px" type="text" jsvalues="value:$this.top;
id:'top_' + id" /> |
| 155 width: <input style="width: 60px" type="text" jsvalues="value:$this.wi
dth;id:'width_' + id" /> |
| 156 height: <input style="width: 60px" type="text" jsvalues="value:$this.h
eight;id:'height_' + id" /> |
| 157 <input type="checkbox" jsvalues="checked:focused; id:'focused_' + id"
/> Focused |
| 158 </div> |
| 159 <div id="tabList"> |
| 160 <div style="background-color: #EEEEEE; margin: 8px; padding: 4px" jsse
lect="tabs"> |
| 161 <div style="margin: 8px"> |
| 162 <div style="font-style: italic; width: 80px; display: inline-block
" jscontent="'TabId: ' + id"></div> |
| 163 <div style="width: 300px; display: inline-block"> |
| 164 index: <input style="width: 20px" type="text" jsvalues="value:$t
his.index;id:'index_' + id" /> |
| 165 windowId: <input style="width: 20px" type="text" jsvalues="value
:windowId;id:'windowId_' + id" /> |
| 166 <button onclick="moveTab(this.jstdata);" jsvalues=".jstdata:id">
Move</button> |
| 167 </div> |
| 168 </div> |
| 169 <div style="margin: 8px"> |
| 170 <div> |
| 171 <div style="width: 40px; display:inline-block">title:</div> |
| 172 <input style="width: 90%" type="text" jsvalues="value:title;id:'
title_' + id" /> |
| 173 </div> |
| 174 <div> |
| 175 <div style="width: 40px; display:inline-block">url:</div> |
| 176 <input style="width: 90%" type="text" jsvalues="value:url;id:'ur
l_' + id" /> |
| 177 </div> |
| 178 <div><input type="checkbox" jsvalues="checked:selected; id:'select
ed_' + id" /> Selected</div> |
| 179 </div> |
| 180 <button onclick="updateTab(this.jstdata)" jsvalues=".jstdata:id">Upd
ate Tab</button> |
| 181 <button onclick="chromium.tabs.removeTab(this.jstdata);" jsvalues=".
jstdata:id">Close Tab</button> |
| 182 </div> |
| 183 </div> |
| 184 </div> |
| 185 </div> |
| 186 <div style="background-color: #EEEEBB; margin: 20px; padding: 8px"> |
| 187 <h3 style="text-align: center; margin: 8px"> Create Window</h3> |
| 188 <div style="margin: 8px"> |
| 189 <div style="width: 300px; display: inline-block"> |
| 190 left: <input style="width: 20px" type="text" id="new_window_left" /> |
| 191 top: <input style="width: 20px" type="text" id="new_window_top" /> |
| 192 width: <input style="width: 20px" type="text" id="new_window_width" /> |
| 193 height: <input style="width: 20px" type="text" id="new_window_height"
/> |
| 194 </div> |
| 195 </div> |
| 196 <div style="margin: 8px"> |
| 197 <div> |
| 198 <div style="width: 40px; display:inline-block">url:</div> |
| 199 <input style="width: 90%" type="text" id="new_window_url" /> |
| 200 </div> |
| 201 </div> |
| 202 <button onclick="createWindow();">Create</button> |
| 203 </div> |
| 204 <div style="background-color: #EEEEAA; margin: 20px; padding: 8px"> |
| 205 <h3 style="text-align: center; margin: 8px"> Create Tab</h3> |
| 206 <div style="margin: 8px"> |
| 207 <div style="width: 300px; display: inline-block"> |
| 208 index: <input style="width: 20px" type="text" id="index_new" /> |
| 209 windowId: <input style="width: 20px" type="text" id="windowId_new" /> |
| 210 <button onclick="moveTab(this.jstdata);" jsvalues=".jstdata:id">Move</
button> |
| 211 </div> |
| 212 </div> |
| 213 <div style="margin: 8px"> |
| 214 <div> |
| 215 <div style="width: 40px; display:inline-block">title:</div> |
| 216 <input style="width: 90%" type="text" id="title_new" /> |
| 217 </div> |
| 218 <div> |
| 219 <div style="width: 40px; display:inline-block">url:</div> |
| 220 <input style="width: 90%" type="text" id="url_new" /> |
| 221 </div> |
| 222 <div><input type="checkbox" id="selected_new" /> Selected</div> |
| 223 </div> |
| 224 <button onclick="createTab();">Create</button> |
| 225 </div> |
| 226 <div style="margin: 20px;"> |
| 227 <button onclick="loadWindowList();">Refresh</button> |
| 228 <button onclick="updateAll();">Update All</button> |
| 229 <button onclick="moveAll();">Move All</button> |
| 230 <button onclick="clearLog();">-->Clear Log</button> |
| 231 <button onclick="chromium.tabs.createWindow();">New Window</button> |
| 232 </div> |
| 233 <div id="log" style="background-color: #EEAAEE; margin: 20px; padding: 8px"> |
| 234 </div> |
| 235 </body> |
| 236 </html> |
| 237 |
OLD | NEW |