Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(355)

Side by Side Diff: chrome/test/data/extensions/samples/tabs/tabs_api.html

Issue 99201: Sample sprucing part 2 (Closed)
Patch Set: Merge to HEAD Created 11 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(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> &gt;&nbsp;' + 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
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698