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 3// found in the LICENSE file. 4 5'use strict'; 6 7/** 8 * The root of the file manager's view managing the DOM of Files.app. 9 * 10 * @param {HTMLElement} element Top level element of Files.app. 11 * @param {DialogType} dialogType Dialog type. 12 * @constructor. 13 */ 14var FileManagerUI = function(element, dialogType) { 15 /** 16 * Top level element of Files.app. 17 * @type {HTMLElement} 18 * @private 19 */ 20 this.element_ = element; 21 22 /** 23 * Dialog type. 24 * @type {DialogType} 25 * @private 26 */ 27 this.dialogType_ = dialogType; 28 29 /** 30 * Error dialog. 31 * @type {ErrorDialog} 32 */ 33 this.errorDialog = null; 34 35 /** 36 * Alert dialog. 37 * @type {cr.ui.dialogs.AlertDialog} 38 */ 39 this.alertDialog = null; 40 41 /** 42 * Confirm dialog. 43 * @type {cr.ui.dialogs.ConfirmDialog} 44 */ 45 this.confirmDialog = null; 46 47 /** 48 * Prompt dialog. 49 * @type {cr.ui.dialogs.PromptDialog} 50 */ 51 this.promptDialog = null; 52 53 /** 54 * Share dialog. 55 * @type {ShareDialog} 56 */ 57 this.shareDialog = null; 58 59 /** 60 * Default task picker. 61 * @type {DefaultActionDialog} 62 */ 63 this.defaultTaskPicker = null; 64 65 /** 66 * Suggest apps dialog. 67 * @type {SuggestAppsDialog} 68 */ 69 this.suggestAppsDialog = null; 70 71 /** 72 * Conflict dialog. 73 * @type {ConflictDialog} 74 */ 75 this.conflictDialog = null; 76 77 /** 78 * Search box. 79 * @type {SearchBox} 80 */ 81 this.searchBox = null; 82 83 /** 84 * File type selector in the footer. 85 * @type {HTMLElement} 86 */ 87 this.fileTypeSelector = null; 88 89 /** 90 * OK button in the footer. 91 * @type {HTMLElement} 92 */ 93 this.okButton = null; 94 95 /** 96 * Cancel button in the footer. 97 * @type {HTMLElement} 98 */ 99 this.cancelButton = null; 100 101 Object.seal(this); 102 103 // Initialize the header. 104 this.element_.querySelector('#app-name').innerText = 105 chrome.runtime.getManifest().name; 106 107 // Initialize dialog type. 108 this.initDialogType_(); 109 110 // Pre-populate the static localized strings. 111 i18nTemplate.process(this.element_.ownerDocument, loadTimeData); 112}; 113 114/** 115 * Tweak the UI to become a particular kind of dialog, as determined by the 116 * dialog type parameter passed to the constructor. 117 * 118 * @private 119 */ 120FileManagerUI.prototype.initDialogType_ = function() { 121 // Obtain elements. 122 var hasFooterPanel = 123 this.dialogType_ == DialogType.SELECT_SAVEAS_FILE || 124 DialogType.isFolderDialog(this.dialogType_); 125 126 // If the footer panel exists, the buttons are placed there. Otherwise, 127 // the buttons are on the preview panel. 128 var parentPanelOfButtons = this.element_.ownerDocument.querySelector( 129 !hasFooterPanel ? '.preview-panel' : '.dialog-footer'); 130 parentPanelOfButtons.classList.add('button-panel'); 131 this.fileTypeSelector = parentPanelOfButtons.querySelector('.file-type'); 132 this.okButton = parentPanelOfButtons.querySelector('.ok'); 133 this.cancelButton = parentPanelOfButtons.querySelector('.cancel'); 134 135 // Set attributes. 136 var okLabel = str('OPEN_LABEL'); 137 138 switch (this.dialogType_) { 139 case DialogType.SELECT_UPLOAD_FOLDER: 140 okLabel = str('UPLOAD_LABEL'); 141 break; 142 143 case DialogType.SELECT_SAVEAS_FILE: 144 okLabel = str('SAVE_LABEL'); 145 break; 146 147 case DialogType.SELECT_FOLDER: 148 case DialogType.SELECT_OPEN_FILE: 149 case DialogType.SELECT_OPEN_MULTI_FILE: 150 case DialogType.FULL_PAGE: 151 break; 152 153 default: 154 throw new Error('Unknown dialog type: ' + this.dialogType); 155 } 156 157 this.okButton.textContent = okLabel; 158 this.element_.setAttribute('type', this.dialogType_); 159}; 160 161/** 162 * Initialize the dialogs. 163 */ 164FileManagerUI.prototype.initDialogs = function() { 165 // Initialize the dialog label. 166 var dialogs = cr.ui.dialogs; 167 dialogs.BaseDialog.OK_LABEL = str('OK_LABEL'); 168 dialogs.BaseDialog.CANCEL_LABEL = str('CANCEL_LABEL'); 169 var appState = window.appState || {}; 170 171 // Create the dialog instances. 172 this.errorDialog = new ErrorDialog(this.element_); 173 this.alertDialog = new dialogs.AlertDialog(this.element_); 174 this.confirmDialog = new dialogs.ConfirmDialog(this.element_); 175 this.promptDialog = new dialogs.PromptDialog(this.element_); 176 this.shareDialog = new ShareDialog(this.element_); 177 this.defaultTaskPicker = 178 new cr.filebrowser.DefaultActionDialog(this.element_); 179 this.suggestAppsDialog = new SuggestAppsDialog( 180 this.element_, appState.suggestAppsDialogState || {}); 181 this.conflictDialog = new ConflictDialog(this.element_); 182}; 183 184/** 185 * Initialize here elements, which are expensive 186 * or hidden in the beginning. 187 */ 188FileManagerUI.prototype.initAdditionalUI = function() { 189 this.searchBox = new SearchBox(this.element_.querySelector('#search-box')); 190}; 191