Index: chrome/test/data/extensions/samples/tabs/tabs_api.html |
diff --git a/chrome/test/data/extensions/samples/tabs/tabs_api.html b/chrome/test/data/extensions/samples/tabs/tabs_api.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..a506fd28f559543d928c470800fd3c2fa8c34c70 |
--- /dev/null |
+++ b/chrome/test/data/extensions/samples/tabs/tabs_api.html |
@@ -0,0 +1,237 @@ |
+<html> |
+<head> |
+<script src="jstemplate_compiled.js" type="text/javascript"></script> |
+<script> |
+ |
+tabs = {}; |
+tabIds = []; |
+ |
+function loadWindowList() { |
+ chromium.tabs.getWindows(undefined, function(windowList) { |
+ tabs = {}; |
+ tabIds = []; |
+ for (var i = 0; i < windowList.length; i++) { |
+ for (var j = 0; j < windowList[i].tabs.length; j++) { |
+ tabIds[tabIds.length] = windowList[i].tabs[j].id; |
+ tabs[windowList[i].tabs[j].id] = windowList[i].tabs[j]; |
+ } |
+ } |
+ |
+ var input = new JsExprContext(windowList); |
+ var output = document.getElementById('windowList'); |
+ jstProcess(input, output); |
+ }); |
+} |
+ |
+function updateTabData(id) { |
+ var retval = { |
+ id: id, |
+ url: document.getElementById('url_' + id).value, |
+ windowId: parseInt(document.getElementById('windowId_' + id).value), |
+ selected: document.getElementById('selected_' + id).value ? true : false |
+ } |
+ |
+ return retval; |
+} |
+ |
+function updateTab(id){ |
+ chromium.tabs.updateTab(updateTabData(id)); |
+} |
+ |
+function moveTabData(id) { |
+ return { |
+ 'id': id, |
+ 'index': parseInt(document.getElementById('index_' + id).value), |
+ 'windowId': parseInt(document.getElementById('windowId_' + id).value) |
+ } |
+} |
+function moveTab(id) { |
+ chromium.tabs.moveTab(moveTabData(id)); |
+} |
+ |
+function createTabData(id) { |
+ return { |
+ 'windowId': parseInt(document.getElementById('windowId_' + id).value), |
+ 'url': document.getElementById('url_' + id).value, |
+ 'selected': document.getElementById('selected_' + id).value ? true : false |
+ } |
+} |
+ |
+function createTab() { |
+ chromium.tabs.createTab(createTabData('new')); |
+} |
+ |
+function updateAll() { |
+ |
+ for (var i = 0; i < tabIds.length; i++) { |
+ chromium.tabs.updateTab(updateTabData(tabIds[i])); |
+ } |
+} |
+ |
+function moveAll() { |
+ appendToLog('moving all'); |
+ for (var i = 0; i < tabIds.length; i++) { |
+ chromium.tabs.moveTab(moveTabData(tabIds[i])); |
+ } |
+} |
+ |
+function appendToLog(logLine) { |
+ var log = document.getElementById('log'); |
+ log.innerHTML = '<div> > ' + logLine + '</div>' + log.innerHTML; |
+} |
+ |
+function clearLog() { |
+ document.getElementById('log').innerHTML = ''; |
+} |
+ |
+chromium.tabs.onTabCreated.addListener(function(data) { |
+ appendToLog('onTabCreated -- window: ' + data.windowId + ' tab: ' + data.tabId + ' index ' + data.index); |
+ loadWindowList(); |
+}); |
+ |
+chromium.tabs.onTabAttached.addListener(function(data) { |
+ appendToLog('onTabAttached -- window: ' + data.windowId + ' tab: ' + data.tabId + ' index ' + data.index); |
+ loadWindowList(); |
+}); |
+ |
+chromium.tabs.onTabMoved.addListener(function(data) { |
+ appendToLog('onTabMoved -- window: ' + data.windowId + ' tab: ' + data.tabId + ' from ' + data.fromIndex + ' to ' + data.toIndex); |
+ loadWindowList(); |
+}); |
+ |
+chromium.tabs.onTabDetached.addListener(function(data) { |
+ appendToLog('onTabDetached -- window: ' + data.windowId + ' tab: ' + data.tabId + ' index ' + data.index); |
+ loadWindowList(); |
+}); |
+ |
+chromium.tabs.onTabSelectionChanged.addListener(function(data) { |
+ appendToLog('onTabSelectionChanged -- window: ' + data.windowId + ' tab: ' + data.tabId + ' index ' + data.index); |
+ loadWindowList(); |
+}); |
+ |
+chromium.tabs.onTabRemoved.addListener(function(data) { |
+ appendToLog('onTabRemoved -- window: ' + data.windowId + ' tab: ' + data.tabId + ' index ' + data.index); |
+ loadWindowList(); |
+}); |
+ |
+function isInt(i) { |
+ return (typeof i == "number") && !(i % 1) && !isNaN(i); |
+} |
+ |
+function createWindow() { |
+ var args = { |
+ 'left': parseInt(document.getElementById('new_window_left').value), |
+ 'top': parseInt(document.getElementById('new_window_top').value), |
+ 'width': parseInt(document.getElementById('new_window_width').value), |
+ 'height': parseInt(document.getElementById('new_window_height').value), |
+ 'url': document.getElementById('new_window_url').value |
+ } |
+ |
+ if (!isInt(args.left)) |
+ delete args.left; |
+ if (!isInt(args.top)) |
+ delete args.top; |
+ if (!isInt(args.width)) |
+ delete args.width; |
+ if (!isInt(args.height)) |
+ delete args.height; |
+ if (!args.url) |
+ delete args.url; |
+ |
+ chromium.tabs.createWindow(args); |
+} |
+ |
+</script> |
+</head> |
+ <body onload="loadWindowList();"> |
+ <div id="windowList"> |
+ <div style="background-color: #AAEEEE; margin: 4px; padding: 8px; margin: 20px" jsselect="$this"> |
+ <div style="font-style: italic; width: 80px; display: inline-block"> |
+ Window: <span jscontent="id"></span> |
+ </div> |
+ <div style="display: inline-block"> |
+ left: <input style="width: 60px" type="text" jsvalues="value:$this.left;id:'left_' + id" /> |
+ top: <input style="width: 60px" type="text" jsvalues="value:$this.top;id:'top_' + id" /> |
+ width: <input style="width: 60px" type="text" jsvalues="value:$this.width;id:'width_' + id" /> |
+ height: <input style="width: 60px" type="text" jsvalues="value:$this.height;id:'height_' + id" /> |
+ <input type="checkbox" jsvalues="checked:focused; id:'focused_' + id" /> Focused |
+ </div> |
+ <div id="tabList"> |
+ <div style="background-color: #EEEEEE; margin: 8px; padding: 4px" jsselect="tabs"> |
+ <div style="margin: 8px"> |
+ <div style="font-style: italic; width: 80px; display: inline-block" jscontent="'TabId: ' + id"></div> |
+ <div style="width: 300px; display: inline-block"> |
+ index: <input style="width: 20px" type="text" jsvalues="value:$this.index;id:'index_' + id" /> |
+ windowId: <input style="width: 20px" type="text" jsvalues="value:windowId;id:'windowId_' + id" /> |
+ <button onclick="moveTab(this.jstdata);" jsvalues=".jstdata:id">Move</button> |
+ </div> |
+ </div> |
+ <div style="margin: 8px"> |
+ <div> |
+ <div style="width: 40px; display:inline-block">title:</div> |
+ <input style="width: 90%" type="text" jsvalues="value:title;id:'title_' + id" /> |
+ </div> |
+ <div> |
+ <div style="width: 40px; display:inline-block">url:</div> |
+ <input style="width: 90%" type="text" jsvalues="value:url;id:'url_' + id" /> |
+ </div> |
+ <div><input type="checkbox" jsvalues="checked:selected; id:'selected_' + id" /> Selected</div> |
+ </div> |
+ <button onclick="updateTab(this.jstdata)" jsvalues=".jstdata:id">Update Tab</button> |
+ <button onclick="chromium.tabs.removeTab(this.jstdata);" jsvalues=".jstdata:id">Close Tab</button> |
+ </div> |
+ </div> |
+ </div> |
+ </div> |
+ <div style="background-color: #EEEEBB; margin: 20px; padding: 8px"> |
+ <h3 style="text-align: center; margin: 8px"> Create Window</h3> |
+ <div style="margin: 8px"> |
+ <div style="width: 300px; display: inline-block"> |
+ left: <input style="width: 20px" type="text" id="new_window_left" /> |
+ top: <input style="width: 20px" type="text" id="new_window_top" /> |
+ width: <input style="width: 20px" type="text" id="new_window_width" /> |
+ height: <input style="width: 20px" type="text" id="new_window_height" /> |
+ </div> |
+ </div> |
+ <div style="margin: 8px"> |
+ <div> |
+ <div style="width: 40px; display:inline-block">url:</div> |
+ <input style="width: 90%" type="text" id="new_window_url" /> |
+ </div> |
+ </div> |
+ <button onclick="createWindow();">Create</button> |
+ </div> |
+ <div style="background-color: #EEEEAA; margin: 20px; padding: 8px"> |
+ <h3 style="text-align: center; margin: 8px"> Create Tab</h3> |
+ <div style="margin: 8px"> |
+ <div style="width: 300px; display: inline-block"> |
+ index: <input style="width: 20px" type="text" id="index_new" /> |
+ windowId: <input style="width: 20px" type="text" id="windowId_new" /> |
+ <button onclick="moveTab(this.jstdata);" jsvalues=".jstdata:id">Move</button> |
+ </div> |
+ </div> |
+ <div style="margin: 8px"> |
+ <div> |
+ <div style="width: 40px; display:inline-block">title:</div> |
+ <input style="width: 90%" type="text" id="title_new" /> |
+ </div> |
+ <div> |
+ <div style="width: 40px; display:inline-block">url:</div> |
+ <input style="width: 90%" type="text" id="url_new" /> |
+ </div> |
+ <div><input type="checkbox" id="selected_new" /> Selected</div> |
+ </div> |
+ <button onclick="createTab();">Create</button> |
+ </div> |
+ <div style="margin: 20px;"> |
+ <button onclick="loadWindowList();">Refresh</button> |
+ <button onclick="updateAll();">Update All</button> |
+ <button onclick="moveAll();">Move All</button> |
+ <button onclick="clearLog();">-->Clear Log</button> |
+ <button onclick="chromium.tabs.createWindow();">New Window</button> |
+ </div> |
+ <div id="log" style="background-color: #EEAAEE; margin: 20px; padding: 8px"> |
+ </div> |
+ </body> |
+</html> |
+ |