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

Side by Side Diff: chrome/browser/resources/file_manager/js/file_selection.js

Issue 23464030: Files.app: Let the PreviewPanel class control the visibility of the preview panel. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Created 7 years, 3 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 | Annotate | Revision Log
OLDNEW
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. 1 // Copyright (c) 2012 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 'use strict'; 5 'use strict';
6 6
7 /** 7 /**
8 * The current selection object. 8 * The current selection object.
9 * 9 *
10 * @param {FileManager} fileManager FileManager instance. 10 * @param {FileManager} fileManager FileManager instance.
(...skipping 35 matching lines...) Expand 10 before | Expand all | Expand 10 after
46 46
47 if (entry.isFile) { 47 if (entry.isFile) {
48 this.fileCount += 1; 48 this.fileCount += 1;
49 } else { 49 } else {
50 this.directoryCount += 1; 50 this.directoryCount += 1;
51 } 51 }
52 this.totalCount++; 52 this.totalCount++;
53 } 53 }
54 54
55 this.tasks = new FileTasks(this.fileManager_); 55 this.tasks = new FileTasks(this.fileManager_);
56
57 Object.seal(this);
56 } 58 }
57 59
58 /** 60 /**
59 * Computes data required to get file tasks and requests the tasks. 61 * Computes data required to get file tasks and requests the tasks.
60 * 62 *
61 * @param {function} callback The callback. 63 * @param {function} callback The callback.
62 */ 64 */
63 FileSelection.prototype.createTasks = function(callback) { 65 FileSelection.prototype.createTasks = function(callback) {
64 if (!this.fileManager_.isOnDrive()) { 66 if (!this.fileManager_.isOnDrive()) {
65 this.tasks.init(this.urls); 67 this.tasks.init(this.urls);
(...skipping 83 matching lines...) Expand 10 before | Expand all | Expand 10 after
149 * 151 *
150 * @param {FileManager} fileManager File manager instance. 152 * @param {FileManager} fileManager File manager instance.
151 * @extends {cr.EventTarget} 153 * @extends {cr.EventTarget}
152 * @constructor 154 * @constructor
153 */ 155 */
154 function FileSelectionHandler(fileManager) { 156 function FileSelectionHandler(fileManager) {
155 this.fileManager_ = fileManager; 157 this.fileManager_ = fileManager;
156 // TODO(dgozman): create a shared object with most of UI elements. 158 // TODO(dgozman): create a shared object with most of UI elements.
157 this.okButton_ = fileManager.okButton_; 159 this.okButton_ = fileManager.okButton_;
158 this.filenameInput_ = fileManager.filenameInput_; 160 this.filenameInput_ = fileManager.filenameInput_;
159 161 this.previewPanel_ = fileManager.previewPanel_;
160 this.previewPanel_ = fileManager.dialogDom_.querySelector('.preview-panel'); 162 this.previewPanelElement_ =
161 this.previewThumbnails_ = this.previewPanel_. 163 fileManager.dialogDom_.querySelector('.preview-panel');
164 this.previewThumbnails_ = this.previewPanelElement_.
162 querySelector('.preview-thumbnails'); 165 querySelector('.preview-thumbnails');
163 this.previewSummary_ = this.previewPanel_.querySelector('.preview-summary'); 166 this.previewSummary_ =
167 this.previewPanelElement_.querySelector('.preview-summary');
164 this.previewText_ = this.previewSummary_.querySelector('.preview-text'); 168 this.previewText_ = this.previewSummary_.querySelector('.preview-text');
165 this.calculatingSize_ = this.previewSummary_. 169 this.calculatingSize_ = this.previewSummary_.
166 querySelector('.calculating-size'); 170 querySelector('.calculating-size');
167 this.calculatingSize_.textContent = str('CALCULATING_SIZE'); 171 this.calculatingSize_.textContent = str('CALCULATING_SIZE');
168 172
169 this.searchBreadcrumbs_ = fileManager.searchBreadcrumbs_; 173 this.searchBreadcrumbs_ = fileManager.searchBreadcrumbs_;
170 this.taskItems_ = fileManager.taskItems_; 174 this.taskItems_ = fileManager.taskItems_;
171 175
172 this.animationTimeout_ = null; 176 this.animationTimeout_ = null;
173 } 177 }
(...skipping 129 matching lines...) Expand 10 before | Expand all | Expand 10 after
303 * @return {boolean} True if all files in the current selection are 307 * @return {boolean} True if all files in the current selection are
304 * available. 308 * available.
305 */ 309 */
306 FileSelectionHandler.prototype.isFileSelectionAvailable = function() { 310 FileSelectionHandler.prototype.isFileSelectionAvailable = function() {
307 return !this.fileManager_.isOnDrive() || 311 return !this.fileManager_.isOnDrive() ||
308 !this.fileManager_.isDriveOffline() || 312 !this.fileManager_.isDriveOffline() ||
309 this.selection.allDriveFilesPresent; 313 this.selection.allDriveFilesPresent;
310 }; 314 };
311 315
312 /** 316 /**
313 * Sets the flag to force the preview panel hidden.
314 * @param {boolean} hidden True to force hidden.
315 */
316 FileSelectionHandler.prototype.setPreviewPanelMustBeHidden = function(hidden) {
317 this.previewPanelMustBeHidden_ = hidden;
318 this.updatePreviewPanelVisibility_();
319 };
320
321 /**
322 * Animates preview panel show/hide transitions.
323 *
324 * @private
325 */
326 FileSelectionHandler.prototype.updatePreviewPanelVisibility_ = function() {
327 var panel = this.previewPanel_;
328 var state = panel.getAttribute('visibility');
329 var mustBeVisible =
330 // If one or more files are selected, show the file info.
331 (this.selection.totalCount > 0 ||
332 // If the directory is not root dir, show the directory info.
333 !PathUtil.isRootPath(this.fileManager_.getCurrentDirectory()) ||
334 // On Open File dialog, the preview panel is always shown.
335 this.fileManager_.dialogType == DialogType.SELECT_OPEN_FILE ||
336 this.fileManager_.dialogType == DialogType.SELECT_OPEN_MULTI_FILE);
337
338 var stopHidingAndShow = function() {
339 clearTimeout(this.hidingTimeout_);
340 this.hidingTimeout_ = 0;
341 setVisibility('visible');
342 }.bind(this);
343
344 var startHiding = function() {
345 setVisibility('hiding');
346 this.hidingTimeout_ = setTimeout(function() {
347 this.hidingTimeout_ = 0;
348 setVisibility('hidden');
349 cr.dispatchSimpleEvent(this, 'hide-preview-panel');
350 }.bind(this), 250);
351 }.bind(this);
352
353 var show = function() {
354 setVisibility('visible');
355 this.previewThumbnails_.textContent = '';
356 cr.dispatchSimpleEvent(this, 'show-preview-panel');
357 }.bind(this);
358
359 var setVisibility = function(visibility) {
360 panel.setAttribute('visibility', visibility);
361 };
362
363 switch (state) {
364 case 'visible':
365 if (!mustBeVisible || this.previewPanelMustBeHidden_)
366 startHiding();
367 break;
368
369 case 'hiding':
370 if (mustBeVisible && !this.previewPanelMustBeHidden_)
371 stopHidingAndShow();
372 break;
373
374 case 'hidden':
375 if (mustBeVisible && !this.previewPanelMustBeHidden_)
376 show();
377 }
378 };
379
380 /**
381 * @return {boolean} True if space reserverd for the preview panel.
382 * @private
383 */
384 FileSelectionHandler.prototype.isPreviewPanelVisibile_ = function() {
385 return this.previewPanel_.getAttribute('visibility') == 'visible';
386 };
387
388 /**
389 * Update the selection summary in preview panel. 317 * Update the selection summary in preview panel.
390 * 318 *
391 * @private 319 * @private
392 */ 320 */
393 FileSelectionHandler.prototype.updatePreviewPanelText_ = function() { 321 FileSelectionHandler.prototype.updatePreviewPanelText_ = function() {
394 var selection = this.selection; 322 var selection = this.selection;
395 if (selection.totalCount <= 1) { 323 if (selection.totalCount <= 1) {
396 // Hides the preview text if zero or one file is selected. We shows a 324 // Hides the preview text if zero or one file is selected. We shows a
397 // breadcrumb list instead on the preview panel. 325 // breadcrumb list instead on the preview panel.
398 this.hideCalculating_(); 326 this.hideCalculating_();
(...skipping 87 matching lines...) Expand 10 before | Expand all | Expand 10 after
486 if (this.selection != selection) 414 if (this.selection != selection)
487 return; 415 return;
488 selection.tasks.display(this.taskItems_); 416 selection.tasks.display(this.taskItems_);
489 selection.tasks.updateMenuItem(); 417 selection.tasks.updateMenuItem();
490 }.bind(this)); 418 }.bind(this));
491 } else { 419 } else {
492 this.taskItems_.hidden = true; 420 this.taskItems_.hidden = true;
493 } 421 }
494 422
495 // Update preview panels. 423 // Update preview panels.
496 var wasVisible = this.isPreviewPanelVisibile_(); 424 var wasVisible = this.previewPanel_.visible;
497 var thumbnailEntries; 425 var thumbnailEntries;
498 if (selection.totalCount == 0) { 426 if (selection.totalCount == 0) {
499 thumbnailEntries = [ 427 thumbnailEntries = [
500 this.fileManager_.getCurrentDirectoryEntry() 428 this.fileManager_.getCurrentDirectoryEntry()
501 ]; 429 ];
502 } else { 430 } else {
503 thumbnailEntries = selection.entries; 431 thumbnailEntries = selection.entries;
504 if (selection.totalCount != 1) { 432 if (selection.totalCount != 1) {
505 selection.computeBytes(function() { 433 selection.computeBytes(function() {
506 if (this.selection != selection) 434 if (this.selection != selection)
507 return; 435 return;
508 this.updatePreviewPanelText_(); 436 this.updatePreviewPanelText_();
509 }.bind(this)); 437 }.bind(this));
510 } 438 }
511 } 439 }
512 this.updatePreviewPanelVisibility_(); 440 this.previewPanel_.entries = selection.entries;
513 this.updatePreviewPanelText_(); 441 this.updatePreviewPanelText_();
514 this.showPreviewThumbnails_(thumbnailEntries); 442 this.showPreviewThumbnails_(thumbnailEntries);
515 443
516 // Update breadcrums. 444 // Update breadcrums.
517 var updateTarget = null; 445 var updateTarget = null;
518 var path = this.fileManager_.getCurrentDirectory(); 446 var path = this.fileManager_.getCurrentDirectory();
519 if (selection.totalCount == 1) { 447 if (selection.totalCount == 1) {
520 // Shows the breadcrumb list when a file is selected. 448 // Shows the breadcrumb list when a file is selected.
521 updateTarget = selection.entries[0].fullPath; 449 updateTarget = selection.entries[0].fullPath;
522 } else if (selection.totalCount == 0 && 450 } else if (selection.totalCount == 0 &&
523 this.isPreviewPanelVisibile_()) { 451 this.previewPanel_.visible) {
524 // Shows the breadcrumb list when no file is selected and the preview 452 // Shows the breadcrumb list when no file is selected and the preview
525 // panel is visible. 453 // panel is visible.
526 updateTarget = path; 454 updateTarget = path;
527 } 455 }
528 this.updatePreviewPanelBreadcrumbs_(updateTarget); 456 this.updatePreviewPanelBreadcrumbs_(updateTarget);
529 457
530 // Scroll to item 458 // Scroll to item
531 if (!wasVisible && this.selection.totalCount == 1) { 459 if (!wasVisible && this.selection.totalCount == 1) {
532 var list = this.fileManager_.getCurrentList(); 460 var list = this.fileManager_.getCurrentList();
533 list.scrollIndexIntoView(list.selectionModel.selectedIndex); 461 list.scrollIndexIntoView(list.selectionModel.selectedIndex);
(...skipping 218 matching lines...) Expand 10 before | Expand all | Expand 10 after
752 style.left = (boxWidth - imageWidth) / 2 + 'px'; 680 style.left = (boxWidth - imageWidth) / 2 + 'px';
753 style.top = (boxHeight - imageHeight) / 2 + 'px'; 681 style.top = (boxHeight - imageHeight) / 2 + 'px';
754 style.position = 'relative'; 682 style.position = 'relative';
755 683
756 util.applyTransform(largeImage, transform); 684 util.applyTransform(largeImage, transform);
757 685
758 largeImageBox.appendChild(largeImage); 686 largeImageBox.appendChild(largeImage);
759 largeImageBox.style.zIndex = 1000; 687 largeImageBox.style.zIndex = 1000;
760 return true; 688 return true;
761 }; 689 };
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698