// Copyright (c) 2012 The Chromium Authors. All rights reserved. // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. var localStrings; var browserBridge; /** * Class that keeps track of current burn process state. * @param {Object} strings Localized state strings. * @constructor */ function State(strings) { this.setStrings(strings); this.changeState(State.StatesEnum.DEVICE_NONE); } /** * State Enum object. */ State.StatesEnum = { DEVICE_NONE: { cssState: 'device-detected-none', }, DEVICE_USB: { cssState: 'device-detected-usb warning', }, DEVICE_SD: { cssState: 'device-detected-sd warning', }, DEVICE_MUL: { cssState: 'device-detected-mul warning', }, ERROR_NO_NETWORK: { cssState: 'warning-no-conf', }, ERROR_DEVICE_TOO_SMALL: { cssState: 'warning-no-conf', }, PROGRESS_DOWNLOAD: { cssState: 'progress progress-canceble', }, PROGRESS_UNZIP: { cssState: 'progress progress-canceble', }, PROGRESS_BURN: { cssState: 'progress', }, FAIL: { cssState: 'error', }, SUCCESS: { cssState: 'success', }, }; State.prototype = { /** * Sets the state strings. * @param {Object} strings Localized state strings. */ setStrings: function(strings) { State.StatesEnum.DEVICE_NONE.statusText = strings.getString('statusDevicesNone'); State.StatesEnum.DEVICE_NONE.warningText = strings.getString('warningDevicesNone'); State.StatesEnum.DEVICE_USB.statusText = strings.getString('statusDeviceUSB'); State.StatesEnum.DEVICE_SD.statusText = strings.getString('statusDeviceSD'); State.StatesEnum.DEVICE_MUL.statusText = strings.getString('statusDevicesMultiple'); State.StatesEnum.ERROR_NO_NETWORK.statusText = strings.getString('statusNoConnection'); State.StatesEnum.ERROR_NO_NETWORK.warningText = strings.getString('warningNoConnection'); State.StatesEnum.ERROR_DEVICE_TOO_SMALL.statusText = strings.getString('statusNoSpace'); State.StatesEnum.PROGRESS_DOWNLOAD.statusText = strings.getString('statusDownloading'); State.StatesEnum.PROGRESS_UNZIP.statusText = strings.getString('statusUnzip'); State.StatesEnum.PROGRESS_BURN.statusText = strings.getString('statusBurn'); State.StatesEnum.FAIL.statusText = strings.getString('statusError'); State.StatesEnum.SUCCESS.statusText = strings.getString('statusSuccess'); State.StatesEnum.SUCCESS.warningText = strings.getString('warningSuccess'); }, /** * Changes the current state to new state. * @param {Object} newState Specifies the new state object. */ changeState: function(newState) { if (newState == this.state) return; this.state = newState; $('main-content').className = this.state.cssState; $('status-text').textContent = this.state.statusText; if (newState.warningText) $('warning-text').textContent = this.state.warningText; if (this.isInitialState() && this.state != State.StatesEnum.DEVICE_NONE) { $('warning-button').textContent = localStrings.getString('confirmButton'); } else if (this.state == State.StatesEnum.FAIL) { $('warning-button').textContent = localStrings.getString('retryButton'); } }, /** * Reset to initial state. * @param {number} deviceCount Device count information. */ gotoInitialState: function(deviceCount) { if (deviceCount == 0) this.changeState(State.StatesEnum.DEVICE_NONE); else if (deviceCount == 1) this.changeState(State.StatesEnum.DEVICE_USB); else this.changeState(State.StatesEnum.DEVICE_MUL); }, /** * Returns true if the device is in initial state. * @return {boolean} True if the device is in initial state else false. */ isInitialState: function() { return this.state == State.StatesEnum.DEVICE_NONE || this.state == State.StatesEnum.DEVICE_USB || this.state == State.StatesEnum.DEVICE_SD || this.state == State.StatesEnum.DEVICE_MUL; }, /** * Returns true if device state matches the given state name. * @param {string} stateName Given state name. * @return {boolean} True if the device state matches the given state name. */ equals: function(stateName) { return this.state == stateName; } }; /** * Class that keeps track of available devices. * @constructor */ function DeviceSelection() { this.deviceCount = 0; } DeviceSelection.prototype = { /** * Clears the given selection list. * @param {Array} list Device selection list. */ clearSelectList: function(list) { list.innerHtml = ''; }, /** * Shows the currently selected device. * @return {number} Selected device count. */ showDeviceSelection: function() { if (this.deviceCount == 0) { this.selectedDevice = undefined; } else { var devices = document.getElementsByClassName('selection-element'); this.selectDevice(devices[0].devicePath); } return this.deviceCount; }, /** * Handles device selected event. * @param {string} label Device label. * @param {string} filePath File path. * @param {string} devicePath Selected device path. */ onDeviceSelected: function(label, filePath, devicePath) { $('warning-button').onclick = browserBridge.sendBurnImageMessage.bind(browserBridge, filePath, devicePath); this.selectedDevice = devicePath; $('warning-text').textContent = localStrings.getStringF('warningDevices', label); }, /** * Selects the specified device based on the specified path. * @param {string} path Device path. */ selectDevice: function(path) { var element = $('radio ' + path); element.checked = true; element.onclick.apply(element); }, /** * Creates a new device element. * @param {Object} device Specifies new device information. * @return {HTMLLIElement} New device element. */ createNewDeviceElement: function(device) { var element = document.createElement('li'); var radioButton = document.createElement('input'); radioButton.type = 'radio'; radioButton.name = 'device'; radioButton.value = device.label; radioButton.id = 'radio ' + device.devicePath; radioButton.className = 'float-start'; var deviceLabelText = document.createElement('p'); deviceLabelText.textContent = device.label; deviceLabelText.className = 'select-option float-start'; var newLine = document.createElement('div'); newLine.className = 'new-line'; element.appendChild(radioButton); element.appendChild(deviceLabelText); element.appendChild(newLine); element.id = 'select ' + device.devicePath; element.devicePath = device.devicePath; element.className = 'selection-element'; radioButton.onclick = this.onDeviceSelected.bind(this, device.label, device.filePath, device.devicePath); return element; }, /** * Updates the list of selected devices. * @param {Array} devices List of devices. * @return {number} Device count. */ getDevicesCallback: function(devices) { var selectListDOM = $('device-selection'); this.clearSelectList(selectListDOM); this.deviceCount = devices.length; if (devices.length > 0) { for (var i = 0; i < devices.length; i++) { var element = this.createNewDeviceElement(devices[i]); selectListDOM.appendChild(element); } this.selectDevice(devices[0].devicePath); } else { this.selectedDevice = undefined; } return this.deviceCount; }, /** * Handles device added event. * @param {Object} device Device information. * @param {boolean} allowSelect True to update the selected device info. * @return {number} Device count. */ deviceAdded: function(device, allowSelect) { var selectListDOM = $('device-selection'); selectListDOM.appendChild(this.createNewDeviceElement(device)); this.deviceCount++; if (allowSelect && this.deviceCount == 1) this.selectDevice(device.devicePath); return this.deviceCount; }, /** * Handles device removed event. * @param {string} devicePath Selected device path. * @param {boolean} allowSelect True to update the selected device info. * @return {number} Device count. */ deviceRemoved: function(devicePath, allowSelect) { var deviceSelectElement = $('select ' + devicePath); deviceSelectElement.parentNode.removeChild(deviceSelectElement); this.deviceCount--; var devices = document.getElementsByClassName('selection-element'); if (allowSelect) { if (devices.length > 0) { if (this.selectedDevice == devicePath) this.selectDevice(devices[0].devicePath); } else { this.selectedDevice = undefined; } } return this.deviceCount; } }; /** * Class that handles communication with chrome. * @constructor */ function BrowserBridge() { this.currentState = new State(localStrings); this.devices = new DeviceSelection(); // We will use these often so it makes sence making them class members to // avoid frequent document.getElementById calls. this.progressElement = $('progress-div'); this.progressText = $('progress-text'); this.progressTimeLeftText = $('pending-time'); } BrowserBridge.prototype = { sendCancelMessage: function() { chrome.send('cancelBurnImage'); }, sendGetDevicesMessage: function() { chrome.send('getDevices'); }, sendWebuiInitializedMessage: function() { chrome.send('webuiInitialized'); }, /** * Sends the burn image message to c++ code. * @param {string} filePath Specifies the file path. * @param {string} devicePath Specifies the device path. */ sendBurnImageMessage: function(filePath, devicePath) { chrome.send('burnImage', [devicePath, filePath]); }, reportSuccess: function() { this.currentState.changeState(State.StatesEnum.SUCCESS); }, /** * Update the device state to report a failure and display an error message to * the user. * @param {string} errorMessage Specifies the warning text message. */ reportFail: function(errorMessage) { this.currentState.changeState(State.StatesEnum.FAIL); $('warning-text').textContent = errorMessage; $('warning-button').onclick = this.onBurnRetry.bind(this); }, /** * Handles device added event. * @param {Object} device Device information. */ deviceAdded: function(device) { var inInitialState = this.currentState.isInitialState(); var deviceCount = this.devices.deviceAdded(device, inInitialState); if (inInitialState) this.currentState.gotoInitialState(deviceCount); }, /** * Handles device removed event. * @param {Object} device Device information. */ deviceRemoved: function(device) { var inInitialState = this.currentState.isInitialState(); var deviceCount = this.devices.deviceRemoved(device, inInitialState); if (inInitialState) this.currentState.gotoInitialState(deviceCount); }, /** * Gets device callbacks and update the current state. * @param {Array} devices List of devices. */ getDevicesCallback: function(devices) { var deviceCount = this.devices.getDevicesCallback(devices); this.currentState.gotoInitialState(deviceCount); this.sendWebuiInitializedMessage(); }, /** * Updates the progress information based on the signal received. * @param {Object} updateSignal Specifies the signal information. */ updateProgress: function(updateSignal) { if (updateSignal.progressType == 'download' && !this.currentState.equals(State.StatesEnum.PROGRESS_DOWNLOAD)) { this.currentState.changeState(State.StatesEnum.PROGRESS_DOWNLOAD); } else if (updateSignal.progressType == 'unzip' && !this.currentState.equals(State.StatesEnum.PROGRESS_UNZIP)) { this.currentState.changeState(State.StatesEnum.PROGRESS_UNZIP); } else if (updateSignal.progressType == 'burn' && !this.currentState.equals(State.StatesEnum.PROGRESS_BURN)) { this.currentState.changeState(State.StatesEnum.PROGRESS_BURN); } if (!(updateSignal.amountTotal > 0)) { this.progressElement.removeAttribute('value'); } else { this.progressElement.value = updateSignal.amountFinished; this.progressElement.max = updateSignal.amountTotal; } this.progressText.textContent = updateSignal.progressText; this.progressTimeLeftText.textContent = updateSignal.timeLeftText; }, reportNoNetwork: function() { this.currentState.changeState(State.StatesEnum.ERROR_NO_NETWORK); }, reportNetworkDetected: function() { if (this.currentState.equals(State.StatesEnum.ERROR_NO_NETWORK)) { var deviceCount = this.devices.showDeviceSelection(); this.currentState.gotoInitialState(deviceCount); } }, /** * Updates the current state to report device too small error. * @param {number} deviceSize Received device size. */ reportDeviceTooSmall: function(deviceSize) { this.currentState.changeState(State.StatesEnum.ERROR_DEVICE_TOO_SMALL); $('warning-text').textContent = localStrings.getStringF('warningNoSpace', deviceSize); }, /** * Processes click on 'Retry' button in FAIL state. */ onBurnRetry: function() { var deviceCount = this.devices.showDeviceSelection(); this.currentState.gotoInitialState(deviceCount); } }; document.addEventListener('DOMContentLoaded', function() { localStrings = new LocalStrings(); browserBridge = new BrowserBridge(); jstProcess(new JsEvalContext(templateData), $('more-info-link')); $('cancel-button').onclick = browserBridge.sendCancelMessage.bind(browserBridge); browserBridge.sendGetDevicesMessage(); });