| OLD | NEW |
| 1 // Copyright 2013 The Chromium Authors. All rights reserved. | 1 // Copyright 2013 The Chromium Authors. All rights reserved. |
| 2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
| 4 | 4 |
| 5 cr.define('mobile', function() { | 5 cr.define('mobile', function() { |
| 6 | 6 |
| 7 // TODO(tbarzic): Share code with mobile_setup.js. | 7 // TODO(tbarzic): Share code with mobile_setup.js. |
| 8 var EXTENSION_BASE_URL = | 8 var EXTENSION_BASE_URL = |
| 9 'chrome-extension://iadeocfgjdjdmpenejdbfeaocpbikmab/'; | 9 'chrome-extension://iadeocfgjdjdmpenejdbfeaocpbikmab/'; |
| 10 var REDIRECT_POST_PAGE_URL = EXTENSION_BASE_URL + 'redirect.html?autoPost=1'; | 10 var REDIRECT_POST_PAGE_URL = EXTENSION_BASE_URL + 'redirect.html?autoPost=1'; |
| 11 var PORTAL_OFFLINE_PAGE_URL = EXTENSION_BASE_URL + 'portal_offline.html'; | 11 var PORTAL_OFFLINE_PAGE_URL = EXTENSION_BASE_URL + 'portal_offline.html'; |
| 12 var INVALID_DEVICE_INFO_PAGE_URL = | 12 var INVALID_DEVICE_INFO_PAGE_URL = |
| 13 EXTENSION_BASE_URL + 'invalid_device_info.html'; | 13 EXTENSION_BASE_URL + 'invalid_device_info.html'; |
| 14 | 14 |
| 15 var NetworkState = { | 15 var NetworkState = {UNKNOWN: 0, PORTAL_REACHABLE: 1, PORTAL_UNREACHABLE: 2}; |
| 16 UNKNOWN: 0, | |
| 17 PORTAL_REACHABLE: 1, | |
| 18 PORTAL_UNREACHABLE: 2 | |
| 19 }; | |
| 20 | 16 |
| 21 var CarrierPageType = { | 17 var CarrierPageType = {NOT_SET: 0, PORTAL_OFFLINE: 1, INVALID_DEVICE_INFO: 2}; |
| 22 NOT_SET: 0, | |
| 23 PORTAL_OFFLINE: 1, | |
| 24 INVALID_DEVICE_INFO: 2 | |
| 25 }; | |
| 26 | 18 |
| 27 function PortalImpl() { | 19 function PortalImpl() { |
| 28 // Mobile device information. | 20 // Mobile device information. |
| 29 this.deviceInfo_ = null; | 21 this.deviceInfo_ = null; |
| 30 this.spinnerInt_ = -1; | 22 this.spinnerInt_ = -1; |
| 31 this.networkState_ = NetworkState.UNKNOWN; | 23 this.networkState_ = NetworkState.UNKNOWN; |
| 32 this.portalFrameSet_ = false; | 24 this.portalFrameSet_ = false; |
| 33 this.carrierPageType_ = CarrierPageType.NOT_SET; | 25 this.carrierPageType_ = CarrierPageType.NOT_SET; |
| 34 } | 26 } |
| 35 | 27 |
| (...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 69 // status displaying 'invalid device info' page. | 61 // status displaying 'invalid device info' page. |
| 70 this.setCarrierPage_(CarrierPageType.INVALID_DEVICE_INFO); | 62 this.setCarrierPage_(CarrierPageType.INVALID_DEVICE_INFO); |
| 71 $('portalFrame').hidden = true; | 63 $('portalFrame').hidden = true; |
| 72 $('systemStatus').hidden = false; | 64 $('systemStatus').hidden = false; |
| 73 } else if (this.networkState_ != NetworkState.PORTAL_REACHABLE) { | 65 } else if (this.networkState_ != NetworkState.PORTAL_REACHABLE) { |
| 74 // If the portal is not reachable, hide portalFrame and show system | 66 // If the portal is not reachable, hide portalFrame and show system |
| 75 // status displaying 'offline portal' page. | 67 // status displaying 'offline portal' page. |
| 76 this.setCarrierPage_(CarrierPageType.PORTAL_OFFLINE); | 68 this.setCarrierPage_(CarrierPageType.PORTAL_OFFLINE); |
| 77 $('portalFrame').hidden = true; | 69 $('portalFrame').hidden = true; |
| 78 $('systemStatus').hidden = false; | 70 $('systemStatus').hidden = false; |
| 79 } else { | 71 } else { |
| 80 // If the portal is reachable and device info is valid, set and show | 72 // If the portal is reachable and device info is valid, set and show |
| 81 // portalFrame; and hide system status displaying 'offline portal' page. | 73 // portalFrame; and hide system status displaying 'offline portal' page. |
| 82 this.setPortalFrameIfNeeded_(this.deviceInfo_); | 74 this.setPortalFrameIfNeeded_(this.deviceInfo_); |
| 83 $('portalFrame').hidden = false; | 75 $('portalFrame').hidden = false; |
| 84 $('systemStatus').hidden = true; | 76 $('systemStatus').hidden = true; |
| 85 this.stopSpinner_(); | 77 this.stopSpinner_(); |
| 86 } | 78 } |
| 87 }, | 79 }, |
| 88 | 80 |
| 89 setCarrierPage_: function(type) { | 81 setCarrierPage_: function(type) { |
| (...skipping 61 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 151 } | 143 } |
| 152 // Clear the spinner canvas. | 144 // Clear the spinner canvas. |
| 153 var ctx = canvas.getContext('2d'); | 145 var ctx = canvas.getContext('2d'); |
| 154 ctx.clearRect(0, 0, canvas.width, canvas.height); | 146 ctx.clearRect(0, 0, canvas.width, canvas.height); |
| 155 }, | 147 }, |
| 156 | 148 |
| 157 drawProgress_: function() { | 149 drawProgress_: function() { |
| 158 var ctx = canvas.getContext('2d'); | 150 var ctx = canvas.getContext('2d'); |
| 159 ctx.clearRect(0, 0, canvas.width, canvas.height); | 151 ctx.clearRect(0, 0, canvas.width, canvas.height); |
| 160 | 152 |
| 161 var segmentCount = Math.min(12, canvas.width / 1.6); // Number of segments | 153 var segmentCount = |
| 162 var rotation = 0.75; // Counterclockwise rotation | 154 Math.min(12, canvas.width / 1.6); // Number of segments |
| 155 var rotation = 0.75; // Counterclockwise rotation |
| 163 | 156 |
| 164 // Rotate canvas over time | 157 // Rotate canvas over time |
| 165 ctx.translate(canvas.width / 2, canvas.height / 2); | 158 ctx.translate(canvas.width / 2, canvas.height / 2); |
| 166 ctx.rotate(Math.PI * 2 / (segmentCount + rotation)); | 159 ctx.rotate(Math.PI * 2 / (segmentCount + rotation)); |
| 167 ctx.translate(-canvas.width / 2, -canvas.height / 2); | 160 ctx.translate(-canvas.width / 2, -canvas.height / 2); |
| 168 | 161 |
| 169 var gap = canvas.width / 24; // Gap between segments | 162 var gap = canvas.width / 24; // Gap between segments |
| 170 var oRadius = canvas.width / 2; // Outer radius | 163 var oRadius = canvas.width / 2; // Outer radius |
| 171 var iRadius = oRadius * 0.618; // Inner radius | 164 var iRadius = oRadius * 0.618; // Inner radius |
| 172 var oCircumference = Math.PI * 2 * oRadius; // Outer circumference | 165 var oCircumference = Math.PI * 2 * oRadius; // Outer circumference |
| 173 var iCircumference = Math.PI * 2 * iRadius; // Inner circumference | 166 var iCircumference = Math.PI * 2 * iRadius; // Inner circumference |
| 174 var oGap = gap / oCircumference; // Gap size as fraction of outer ring | 167 var oGap = gap / oCircumference; // Gap size as fraction of outer ring |
| 175 var iGap = gap / iCircumference; // Gap size as fraction of inner ring | 168 var iGap = gap / iCircumference; // Gap size as fraction of inner ring |
| 176 var oArc = Math.PI * 2 * (1 / segmentCount - oGap); // Angle of outer arcs | 169 var oArc = |
| 177 var iArc = Math.PI * 2 * (1 / segmentCount - iGap); // Angle of inner arcs | 170 Math.PI * 2 * (1 / segmentCount - oGap); // Angle of outer arcs |
| 171 var iArc = |
| 172 Math.PI * 2 * (1 / segmentCount - iGap); // Angle of inner arcs |
| 178 | 173 |
| 179 for (i = 0; i < segmentCount; i++) { // Draw each segment | 174 for (i = 0; i < segmentCount; i++) { // Draw each segment |
| 180 var opacity = Math.pow(1.0 - i / segmentCount, 3.0); | 175 var opacity = Math.pow(1.0 - i / segmentCount, 3.0); |
| 181 opacity = (0.15 + opacity * 0.8); // Vary from 0.15 to 0.95 | 176 opacity = (0.15 + opacity * 0.8); // Vary from 0.15 to 0.95 |
| 182 var angle = - Math.PI * 2 * i / segmentCount; | 177 var angle = -Math.PI * 2 * i / segmentCount; |
| 183 | 178 |
| 184 ctx.beginPath(); | 179 ctx.beginPath(); |
| 185 ctx.arc(canvas.width / 2, canvas.height / 2, oRadius, | 180 ctx.arc( |
| 186 angle - oArc / 2, angle + oArc / 2, false); | 181 canvas.width / 2, canvas.height / 2, oRadius, angle - oArc / 2, |
| 187 ctx.arc(canvas.width / 2, canvas.height / 2, iRadius, | 182 angle + oArc / 2, false); |
| 188 angle + iArc / 2, angle - iArc / 2, true); | 183 ctx.arc( |
| 184 canvas.width / 2, canvas.height / 2, iRadius, angle + iArc / 2, |
| 185 angle - iArc / 2, true); |
| 189 ctx.closePath(); | 186 ctx.closePath(); |
| 190 ctx.fillStyle = 'rgba(240, 30, 29, ' + opacity + ')'; | 187 ctx.fillStyle = 'rgba(240, 30, 29, ' + opacity + ')'; |
| 191 ctx.fill(); | 188 ctx.fill(); |
| 192 } | 189 } |
| 193 } | 190 } |
| 194 }; | 191 }; |
| 195 | 192 |
| 196 function MobileSetupPortal() {} | 193 function MobileSetupPortal() {} |
| 197 | 194 |
| 198 MobileSetupPortal.loadPage = function() { | 195 MobileSetupPortal.loadPage = function() { |
| 199 PortalImpl.getInstance().initialize(); | 196 PortalImpl.getInstance().initialize(); |
| 200 }; | 197 }; |
| 201 | 198 |
| 202 MobileSetupPortal.onGotDeviceInfo = function(deviceInfo) { | 199 MobileSetupPortal.onGotDeviceInfo = function(deviceInfo) { |
| 203 PortalImpl.getInstance().updateDeviceInfo(deviceInfo); | 200 PortalImpl.getInstance().updateDeviceInfo(deviceInfo); |
| 204 }; | 201 }; |
| 205 | 202 |
| 206 MobileSetupPortal.onConnectivityChanged = function(portalReachable) { | 203 MobileSetupPortal.onConnectivityChanged = function(portalReachable) { |
| 207 PortalImpl.getInstance().updateNetworkState( | 204 PortalImpl.getInstance().updateNetworkState( |
| 208 portalReachable ? NetworkState.PORTAL_REACHABLE : | 205 portalReachable ? NetworkState.PORTAL_REACHABLE : |
| 209 NetworkState.PORTAL_UNREACHABLE); | 206 NetworkState.PORTAL_UNREACHABLE); |
| 210 }; | 207 }; |
| 211 | 208 |
| 212 // Export | 209 // Export |
| 213 return { | 210 return {MobileSetupPortal: MobileSetupPortal}; |
| 214 MobileSetupPortal: MobileSetupPortal | |
| 215 }; | |
| 216 }); | 211 }); |
| 217 | 212 |
| 218 document.addEventListener('DOMContentLoaded', | 213 document.addEventListener( |
| 219 mobile.MobileSetupPortal.loadPage); | 214 'DOMContentLoaded', mobile.MobileSetupPortal.loadPage); |
| OLD | NEW |