chrome/browser/resources/file_manager/js/default_action_dialog.js

   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
   3 // found in the LICENSE file.
   4
   5
   6 /**
   7  * DefaultActionDialog contains a message, a list box, an ok button, and a
   8  * cancel button.
   9  * This dialog should be used as action picker for file operations.
  10  */
  11 cr.define('cr.filebrowser', function() {
  12
  13   /**
  14    * Creates dialog in DOM tree.
  15    *
  16    * @param {HTMLElement} parentNode Node to be parent for this dialog.
  17    */
  18   function DefaultActionDialog(parentNode) {
  19     cr.ui.dialogs.BaseDialog.call(this, parentNode);
  20
  21     this.frame_.id = 'default-action-dialog';
  22
  23     this.list_ = new cr.ui.List();
  24     this.list_.id = 'default-actions-list';
  25     this.frame_.insertBefore(this.list_, this.text_.nextSibling);
  26
  27     this.selectionModel_ = this.list_.selectionModel =
  28         new cr.ui.ListSingleSelectionModel();
  29     this.dataModel_ = this.list_.dataModel = new cr.ui.ArrayDataModel([]);
  30
  31     // List has max-height defined at css, so that list grows automatically,
  32     // but doesn't exceed predefined size.
  33     this.list_.autoExpands = true;
  34     this.list_.activateItemAtIndex = this.activateItemAtIndex_.bind(this);
  35
  36     this.initialFocusElement_ = this.list_;
  37
  38     var self = this;
  39
  40     // Binding stuff doesn't work with constructors, so we have to create
  41     // closure here.
  42     this.list_.itemConstructor = function(item) {
  43       return self.renderItem(item);
  44     }
  45   }
  46
  47   DefaultActionDialog.prototype = {
  48     __proto__: cr.ui.dialogs.BaseDialog.prototype
  49   };
  50
  51   /**
  52    * Overrides BaseDialog::onInputFocus
  53    */
  54   DefaultActionDialog.prototype.onInputFocus = function() {
  55     this.list_.select();
  56   };
  57
  58   /**
  59    * Renders item for list.
  60    * @param {Object} item Item to render.
  61    */
  62   DefaultActionDialog.prototype.renderItem = function(item) {
  63     var result = this.document_.createElement('li');
  64
  65     var div = this.document_.createElement('div');
  66     div.textContent = item.label;
  67
  68     if (item.iconType)
  69       div.setAttribute('file-type-icon', item.iconType);
  70     else
  71       div.style.backgroundImage = 'url(' + item.iconUrl + ')';
  72
  73     result.appendChild(div);
  74
  75     cr.defineProperty(result, 'lead', cr.PropertyKind.BOOL_ATTR);
  76     cr.defineProperty(result, 'selected', cr.PropertyKind.BOOL_ATTR);
  77
  78     return result;
  79   };
  80
  81   /**
  82    * Shows dialog.
  83    *
  84    * @param {string} title Title in dialog caption.
  85    * @param {string} message Message in dialog caption.
  86    * @param {Array} items Items to render in list
  87    * @param {int} defaultIndex Item to select by default.
  88    * @param {Function} onOk Callback function.
  89    * @param {Function} onCancel Callback function.
  90    * @param {Function} onShow Callback function.
  91    */
  92   DefaultActionDialog.prototype.show = function(title, message, items,
  93       defaultIndex, onOk, onCancel, onShow) {
  94
  95     cr.ui.dialogs.BaseDialog.prototype.showWithTitle.apply(this,
  96         [title, message, onOk, onCancel, onShow]);
  97
  98     if (!message) {
  99       this.text_.setAttribute('hidden', 'hidden');
 100     } else {
 101       this.text_.removeAttribute('hidden');
 102     }
 103
 104     this.list_.startBatchUpdates();
 105
 106     this.dataModel_.splice(0, this.dataModel_.length);
 107
 108     for (var i = 0; i < items.length; i++) {
 109       this.dataModel_.push(items[i]);
 110     }
 111
 112     this.selectionModel_.selectedIndex = defaultIndex;
 113
 114     this.list_.endBatchUpdates();
 115   };
 116
 117   /**
 118    * List activation handler. Closes dialog and calls 'ok' callback.
 119    *
 120    * @param {int} index Activated index.
 121    */
 122   DefaultActionDialog.prototype.activateItemAtIndex_ = function(index) {
 123     this.hide();
 124     if (this.onOk_)
 125       this.onOk_(this.dataModel_.item(index).task);
 126   }
 127
 128   /**
 129    * Closes dialog and invokes callback with currently-selected item.
 130    */
 131   DefaultActionDialog.prototype.onOkClick_ = function() {
 132     this.activateItemAtIndex_(this.selectionModel_.selectedIndex);
 133   };
 134
 135   // Overrides BaseDialog::onContainerKeyDown_;
 136   DefaultActionDialog.prototype.onContainerKeyDown_ = function(event) {
 137     // Handle Escape.
 138     if (event.keyCode == 27) {
 139       this.onCancelClick_(event);
 140       event.preventDefault();
 141     } else if (event.keyCode == 32 || event.keyCode == 13) {
 142       this.onOkClick_();
 143       event.preventDefault();
 144     }
 145   };
 146
 147   return {DefaultActionDialog: DefaultActionDialog};
 148 });