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

Side by Side Diff: chrome/browser/resources/mobile_setup.js

Issue 8687012: Moved ChromeOS-specific resources from chrome/browser/resources to chrome/browser/resources/chrom... (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src/
Patch Set: Created 9 years 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 | Annotate | Revision Log
« no previous file with comments | « chrome/browser/resources/mobile_setup.html ('k') | chrome/browser/resources/network_menu.css » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 // Copyright (c) 2011 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file.
4
5
6 cr.define('mobile', function() {
7
8 function MobileSetup() {
9 }
10
11 cr.addSingletonGetter(MobileSetup);
12
13 MobileSetup.PLAN_ACTIVATION_PAGE_LOADING = -1;
14 MobileSetup.PLAN_ACTIVATION_START = 0;
15 MobileSetup.PLAN_ACTIVATION_TRYING_OTASP = 1;
16 MobileSetup.PLAN_ACTIVATION_RECONNECTING_OTASP_TRY = 2;
17 MobileSetup.PLAN_ACTIVATION_INITIATING_ACTIVATION = 3;
18 MobileSetup.PLAN_ACTIVATION_RECONNECTING = 4;
19 MobileSetup.PLAN_ACTIVATION_PAYMENT_PORTAL_LOADING = 5;
20 MobileSetup.PLAN_ACTIVATION_SHOWING_PAYMENT = 6;
21 MobileSetup.PLAN_ACTIVATION_RECONNECTING_PAYMENT = 7;
22 MobileSetup.PLAN_ACTIVATION_DELAY_OTASP = 8;
23 MobileSetup.PLAN_ACTIVATION_START_OTASP = 9;
24 MobileSetup.PLAN_ACTIVATION_OTASP = 10;
25 MobileSetup.PLAN_ACTIVATION_RECONNECTING_OTASP = 11;
26 MobileSetup.PLAN_ACTIVATION_DONE = 12;
27 MobileSetup.PLAN_ACTIVATION_ERROR = 0xFF;
28
29 MobileSetup.EXTENSION_PAGE_URL =
30 'chrome-extension://iadeocfgjdjdmpenejdbfeaocpbikmab';
31 MobileSetup.ACTIVATION_PAGE_URL = MobileSetup.EXTENSION_PAGE_URL +
32 '/activation.html';
33 MobileSetup.REDIRECT_POST_PAGE_URL = MobileSetup.EXTENSION_PAGE_URL +
34 '/redirect.html';
35
36 MobileSetup.localStrings_ = new LocalStrings();
37
38 MobileSetup.prototype = {
39 // Mobile device information.
40 deviceInfo_: null,
41 frameName_ : '',
42 initialized_ : false,
43 faked_transaction_ : false,
44 payment_shown_ : false,
45 frame_load_error_ : 0,
46 frame_load_ignored_ : true,
47 spinner_int_: -1,
48 // UI states.
49 state_ : -1,
50 STATE_UNKNOWN_: "unknown",
51 STATE_CONNECTING_: "connecting",
52 STATE_ERROR_: "error",
53 STATE_PAYMENT_: "payment",
54 STATE_ACTIVATING_: "activating",
55 STATE_CONNECTED_: "connected",
56
57 initialize: function(frame_name, carrierPage) {
58 if (this.initialized_) {
59 console.log('calling initialize() again?');
60 return;
61 }
62 this.initialized_ = true;
63 self = this;
64 this.frameName_ = frame_name;
65
66 cr.ui.dialogs.BaseDialog.OK_LABEL =
67 MobileSetup.localStrings_.getString('ok_button');
68 cr.ui.dialogs.BaseDialog.CANCEL_LABEL =
69 MobileSetup.localStrings_.getString('cancel_button');
70 this.confirm_ = new cr.ui.dialogs.ConfirmDialog(document.body);
71
72 window.addEventListener('message', function(e) {
73 self.onMessageReceived_(e);
74 });
75
76 $('closeButton').addEventListener('click', function(e) {
77 $('finalStatus').classList.add('hidden');
78 });
79
80 $('cancelButton').addEventListener('click', function(e) {
81 if (self.state_ == MobileSetup.PLAN_ACTIVATION_DONE ||
82 self.state_ == MobileSetup.PLAN_ACTIVATION_ERROR) {
83 window.close();
84 return;
85 }
86 self.confirm_.show(
87 MobileSetup.localStrings_.getString('cancel_question'), function() {
88 window.close();
89 });
90 });
91
92 this.changeState_({state: MobileSetup.PLAN_ACTIVATION_PAGE_LOADING});
93 // Kick off activation process.
94 chrome.send('startActivation', []);
95 },
96
97 startSpinner_:function() {
98 this.stopSpinner_();
99 this.spinner_int_ = setInterval(mobile.MobileSetup.drawProgress, 100);
100 },
101
102 stopSpinner_:function() {
103 if (this.spinner_int_ != -1) {
104 clearInterval(this.spinner_int_);
105 this.spinner_int_ = -1;
106 }
107 },
108
109 onFrameLoaded_: function(success) {
110 chrome.send('paymentPortalLoad', [success ? 'ok' : 'failed']);
111 },
112
113 loadPaymentFrame_: function(deviceInfo) {
114 if (deviceInfo) {
115 this.frame_load_error_ = 0;
116 this.deviceInfo_ = deviceInfo;
117 if (deviceInfo.post_data && deviceInfo.post_data.length) {
118 this.frame_load_ignored_ = true;
119 $(this.frameName_).contentWindow.location.href =
120 MobileSetup.REDIRECT_POST_PAGE_URL +
121 '?post_data=' + escape(deviceInfo.post_data) +
122 '&formUrl=' + escape(deviceInfo.payment_url);
123 } else {
124 this.frame_load_ignored_ = false;
125 $(this.frameName_).contentWindow.location.href =
126 deviceInfo.payment_url;
127 }
128 }
129 },
130
131 onMessageReceived_: function(e) {
132 if (e.origin !=
133 this.deviceInfo_.payment_url.substring(0, e.origin.length) &&
134 e.origin != MobileSetup.EXTENSION_PAGE_URL)
135 return;
136
137 if (e.data.type == 'requestDeviceInfoMsg') {
138 this.sendDeviceInfo_();
139 } else if (e.data.type == 'framePostReady') {
140 this.frame_load_ignored_ = false;
141 this.sendPostFrame_(e.origin);
142 } else if (e.data.type == 'reportTransactionStatusMsg') {
143 console.log('calling setTransactionStatus from onMessageReceived_');
144 $('paymentForm').classList.add('hidden');
145 chrome.send('setTransactionStatus', [e.data.status]);
146 }
147 },
148
149 changeState_: function(deviceInfo) {
150 var new_state = deviceInfo.state;
151 if (this.state_ == new_state)
152 return;
153 var main = $('mainbody');
154 // Map handler state to UX.
155 switch(new_state) {
156 case MobileSetup.PLAN_ACTIVATION_PAGE_LOADING:
157 case MobileSetup.PLAN_ACTIVATION_START:
158 case MobileSetup.PLAN_ACTIVATION_DELAY_OTASP:
159 case MobileSetup.PLAN_ACTIVATION_START_OTASP:
160 case MobileSetup.PLAN_ACTIVATION_RECONNECTING:
161 case MobileSetup.PLAN_ACTIVATION_RECONNECTING_PAYMENT:
162 case MobileSetup.PLAN_ACTIVATION_RECONNECTING_OTASP_TRY:
163 case MobileSetup.PLAN_ACTIVATION_RECONNECTING_OTASP:
164 $('statusHeader').textContent =
165 MobileSetup.localStrings_.getString('connecting_header');
166 $('auxHeader').textContent =
167 MobileSetup.localStrings_.getString('please_wait');
168 $('paymentForm').classList.add('hidden');
169 $('finalStatus').classList.add('hidden');
170 $('systemStatus').classList.remove('hidden');
171 $('carrierPage').classList.remove('hidden');
172 $('canvas').classList.remove('hidden');
173 this.startSpinner_();
174 break;
175 case MobileSetup.PLAN_ACTIVATION_TRYING_OTASP:
176 case MobileSetup.PLAN_ACTIVATION_INITIATING_ACTIVATION:
177 case MobileSetup.PLAN_ACTIVATION_OTASP:
178 $('statusHeader').textContent =
179 MobileSetup.localStrings_.getString('activating_header');
180 $('auxHeader').textContent =
181 MobileSetup.localStrings_.getString('please_wait');
182 $('paymentForm').classList.add('hidden');
183 $('finalStatus').classList.add('hidden');
184 $('systemStatus').classList.remove('hidden');
185 $('carrierPage').classList.remove('hidden');
186 $('canvas').classList.remove('hidden');
187 this.startSpinner_();
188 break;
189 case MobileSetup.PLAN_ACTIVATION_PAYMENT_PORTAL_LOADING:
190 $('statusHeader').textContent =
191 MobileSetup.localStrings_.getString('connecting_header');
192 $('auxHeader').textContent = '';
193 $('paymentForm').classList.add('hidden');
194 $('finalStatus').classList.add('hidden');
195 $('systemStatus').classList.remove('hidden');
196 $('canvas').classList.remove('hidden');
197 this.loadPaymentFrame_(deviceInfo);
198 break;
199 case MobileSetup.PLAN_ACTIVATION_SHOWING_PAYMENT:
200 $('statusHeader').textContent = '';
201 $('auxHeader').textContent = '';
202 $('finalStatus').classList.add('hidden');
203 $('systemStatus').classList.add('hidden');
204 $('carrierPage').classList.add('hidden');
205 $('paymentForm').classList.remove('hidden');
206 $('canvas').classList.add('hidden');
207 this.stopSpinner_();
208 this.payment_shown_ = true;
209 break;
210 case MobileSetup.PLAN_ACTIVATION_DONE:
211 $('statusHeader').textContent = '';
212 $('auxHeader').textContent = '';
213 $('finalHeader').textContent =
214 MobileSetup.localStrings_.getString('completed_header');
215 $('finalMessage').textContent =
216 MobileSetup.localStrings_.getString('completed_text');
217 $('systemStatus').classList.add('hidden');
218 $('carrierPage').classList.add('hidden');
219 $('paymentForm').classList.remove('hidden');
220 $('closeButton').classList.remove('hidden');
221 $('finalStatus').classList.remove('hidden');
222 $('canvas').classList.add('hidden');
223 this.stopSpinner_();
224 if (this.payment_shown_) {
225 $('closeButton').classList.remove('hidden');
226 } else {
227 $('closeButton').classList.add('hidden');
228 $('cancelButton').textContent =
229 MobileSetup.localStrings_.getString('close_button');
230 }
231 break;
232 case MobileSetup.PLAN_ACTIVATION_ERROR:
233 $('statusHeader').textContent = '';
234 $('auxHeader').textContent = '';
235 $('finalHeader').textContent =
236 MobileSetup.localStrings_.getString('error_header');
237 $('finalMessage').textContent = deviceInfo.error;
238 $('systemStatus').classList.add('hidden');
239 $('carrierPage').classList.add('hidden');
240 $('paymentForm').classList.remove('hidden');
241 $('canvas').classList.add('hidden');
242 this.stopSpinner_();
243 if (this.payment_shown_) {
244 $('closeButton').classList.remove('hidden');
245 } else {
246 $('closeButton').classList.add('hidden');
247 $('cancelButton').textContent =
248 MobileSetup.localStrings_.getString('close_button');
249 }
250 $('finalStatus').classList.remove('hidden');
251 break;
252 }
253 this.state_ = new_state;
254 },
255
256 updateDeviceStatus_: function(deviceInfo) {
257 this.changeState_(deviceInfo);
258 },
259
260 portalFrameLoadError_: function(errorCode) {
261 if (this.frame_load_ignored_)
262 return;
263 console.log("Portal frame load error detected: " + errorCode);
264 this.frame_load_error_ = errorCode;
265 },
266
267 portalFrameLoadCompleted_: function() {
268 if (this.frame_load_ignored_)
269 return;
270 console.log("Portal frame load completed!");
271 this.onFrameLoaded_(this.frame_load_error_ == 0);
272 },
273
274 sendPostFrame_ : function(frameUrl) {
275 var msg = { type: 'postFrame' };
276 $(this.frameName_).contentWindow.postMessage(msg, frameUrl);
277 },
278
279 sendDeviceInfo_ : function() {
280 var msg = {
281 type: 'deviceInfoMsg',
282 domain: document.location,
283 payload: {
284 'carrier': this.deviceInfo_.carrier,
285 'MEID': this.deviceInfo_.MEID,
286 'IMEI': this.deviceInfo_.IMEI,
287 'MDN': this.deviceInfo_.MDN
288 }
289 };
290 $(this.frameName_).contentWindow.postMessage(msg,
291 this.deviceInfo_.payment_url);
292 }
293
294 };
295
296 MobileSetup.drawProgress = function () {
297 var ctx = canvas.getContext('2d');
298 ctx.clearRect(0, 0, canvas.width, canvas.height);
299
300 var segmentCount = Math.min(12, canvas.width/1.6) // Number of segments
301 var rotation = 0.75; // Counterclockwise rotation
302
303 // Rotate canvas over time
304 ctx.translate(canvas.width/2, canvas.height/2);
305 ctx.rotate(Math.PI * 2 / (segmentCount + rotation));
306 ctx.translate(-canvas.width/2, -canvas.height/2);
307
308 var gap = canvas.width / 24; // Gap between segments
309 var oRadius = canvas.width/2; // Outer radius
310 var iRadius = oRadius * 0.618; // Inner radius
311 var oCircumference = Math.PI * 2 * oRadius; // Outer circumference
312 var iCircumference = Math.PI * 2 * iRadius; // Inner circumference
313 var oGap = gap / oCircumference; // Gap size as fraction of outer ring
314 var iGap = gap / iCircumference; // Gap size as fraction of inner ring
315 var oArc = Math.PI * 2 * ( 1 / segmentCount - oGap); // Angle of outer arcs
316 var iArc = Math.PI * 2 * ( 1 / segmentCount - iGap); // Angle of inner arcs
317
318 for (i = 0; i < segmentCount; i++){ // Draw each segment
319 var opacity = Math.pow(1.0 - i / segmentCount, 3.0);
320 opacity = (0.15 + opacity * 0.8) // Vary from 0.15 to 0.95
321 var angle = - Math.PI * 2 * i / segmentCount;
322
323 ctx.beginPath();
324 ctx.arc(canvas.width/2, canvas.height/2, oRadius,
325 angle - oArc/2, angle + oArc/2, false);
326 ctx.arc(canvas.width/2, canvas.height/2, iRadius,
327 angle + iArc/2, angle - iArc/2, true);
328 ctx.closePath();
329 ctx.fillStyle = "rgba(240, 30, 29, " + opacity + ")";
330 ctx.fill();
331 }
332 };
333
334 MobileSetup.deviceStateChanged = function(deviceInfo) {
335 MobileSetup.getInstance().updateDeviceStatus_(deviceInfo);
336 };
337
338 MobileSetup.portalFrameLoadError = function(errorCode) {
339 MobileSetup.getInstance().portalFrameLoadError_(errorCode);
340 };
341
342 MobileSetup.portalFrameLoadCompleted = function() {
343 MobileSetup.getInstance().portalFrameLoadCompleted_();
344 };
345
346 MobileSetup.loadPage = function() {
347 mobile.MobileSetup.getInstance().initialize('paymentForm',
348 mobile.MobileSetup.ACTIVATION_PAGE_URL);
349 };
350
351 // Export
352 return {
353 MobileSetup: MobileSetup
354 };
355
356 });
357
OLDNEW
« no previous file with comments | « chrome/browser/resources/mobile_setup.html ('k') | chrome/browser/resources/network_menu.css » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698