]> src.bluestatic.org Git - armadillo.git/blob - web_frontend/actor.js
Improve actor appearance. Initial work on row highlighting.
[armadillo.git] / web_frontend / actor.js
1 //
2 // Armadillo File Manager
3 // Copyright (c) 2010, Robert Sesek <http://www.bluestatic.org>
4 //
5 // This program is free software: you can redistribute it and/or modify it under
6 // the terms of the GNU General Public License as published by the Free Software
7 // Foundation, either version 3 of the License, or any later version.
8 //
9
10 goog.provide('armadillo.Actor');
11 goog.provide('armadillo.Actor.TileControlRenderer_');
12
13 goog.require('armadillo.PathControl');
14 goog.require('goog.array');
15 goog.require('goog.dom');
16 goog.require('goog.events');
17 goog.require('goog.events.EventHandler');
18 goog.require('goog.positioning.ClientPosition');
19 goog.require('goog.positioning.Corner');
20 goog.require('goog.style');
21 goog.require('goog.ui.Container');
22 goog.require('goog.ui.Dialog');
23 goog.require('goog.ui.Popup');
24
25 /**
26 * The Actor is a popup that displays the various actions that can be performed
27 * on a given File.
28 * @param {armadillo.File} file The file to act on.
29 * @param {goog.dom.DomHelper} opt_domHelper
30 * @constructor
31 */
32 armadillo.Actor = function(file, opt_domHelper) {
33 goog.ui.Container.call(this, null, null, opt_domHelper);
34
35 /**
36 * The file object on which this acts.
37 * @type {armadillo.File}
38 */
39 this.file_ = file;
40
41 /**
42 * Registrar for all the Actor's events.
43 * @type {goog.events.EventHandler}
44 */
45 this.eh_ = new goog.events.EventHandler();
46
47 /**
48 * The Container that holds the display element.
49 * @type {goog.ui.Popup}
50 */
51 this.popup_ = new goog.ui.Popup(this.element_);
52 this.eh_.listenOnce(this.popup_, goog.ui.PopupBase.EventType.HIDE,
53 this.onPopupClosed_, false, this);
54
55 /**
56 * The UI element used for a specific action.
57 * @type {goog.Disposable}
58 */
59 this.actionObject_ = null;
60
61 armadillo.Actor.actors_.push(this);
62 }
63 goog.inherits(armadillo.Actor, goog.ui.Container);
64
65 /**
66 * An array of all the Actors that have been created.
67 */
68 armadillo.Actor.actors_ = new Array();
69
70 /**
71 * The different options that the Actor can perform.
72 */
73 armadillo.Actor.options_ = {
74 OPEN : 'open',
75 MOVE : 'move',
76 RENAME : 'rename',
77 DELETE : 'delete'
78 };
79
80 /**
81 * String values for the options.
82 */
83 armadillo.Actor.optionStrings_ = {
84 'open' : 'Open',
85 'move' : 'Move',
86 'rename' : 'Rename',
87 'delete' : 'Delete'
88 };
89
90 /**
91 * A global property that should be checked to see if an actor is present,
92 * creating a modal session.
93 */
94 armadillo.Actor.isModal = function() {
95 var isVisible = false;
96 goog.array.forEach(armadillo.Actor.actors_, function (e) {
97 isVisible |= e.popup_.isVisible();
98 });
99 return isVisible;
100 };
101
102 /**
103 * Disposer
104 * @protected
105 */
106 armadillo.Actor.prototype.disposeInternal = function() {
107 armadillo.Actor.superClass_.disposeInternal.call(this);
108
109 this.eh_.dispose();
110
111 // Remove the actor display element.
112 goog.dom.removeNode(this.element_);
113 this.element_ = null;
114
115 // Kill the popup.
116 this.popup_.dispose();
117 this.popup_ = null;
118
119 if (this.actionObject_) {
120 this.actionObject_.dispose();
121 this.actionObject_ = null;
122 }
123
124 // Remove the actor from the list.
125 goog.array.remove(armadillo.Actor.actors_, this);
126
127 this.file_ = null;
128 };
129
130 /**
131 * Shows the popup.
132 * @param {int} x The X position to show at
133 * @param {int} y The Y position to show at
134 */
135 armadillo.Actor.prototype.show = function(x, y) {
136 if (armadillo.Actor.isModal())
137 return;
138 this.popup_.setPinnedCorner(goog.positioning.Corner.TOP_LEFT);
139 this.popup_.setPosition(new goog.positioning.ClientPosition(x, y));
140 this.popup_.setHideOnEscape(true);
141 this.render();
142 this.popup_.setVisible(true);
143 this.file_.setHighlight(armadillo.File.Highlight.ACTIVE);
144 };
145
146 /**
147 * Hides the popup.
148 */
149 armadillo.Actor.prototype.hide = function() {
150 this.popup_.setVisible(false);
151 };
152
153
154 /**
155 * Creates a new path control object.
156 */
157 armadillo.Actor.prototype.createDom = function() {
158 this.decorateInternal(this.dom_.createDom('div', 'actor'));
159 this.popup_.setElement(this.element_);
160 };
161
162 /**
163 * @inheritDoc
164 */
165 armadillo.Actor.prototype.canDecorate = function() {
166 return false;
167 };
168
169 /**
170 * Decorates the given element into a path control.
171 * @param {Element} element
172 */
173 armadillo.Actor.prototype.decorateInternal = function(element) {
174 this.element_ = element;
175 this.dom_.removeChildren(this.element_);
176 for (var option in armadillo.Actor.options_) {
177 var tile = this.createTile_(option);
178 if (tile) {
179 this.addChild(tile, true);
180 }
181 }
182 };
183
184 /**
185 * Creates the DOM Element that is inserted into the popup.
186 * @param {armadillo.Actor.options_} Key of the option to create
187 * @returns {goog.ui.Control}
188 */
189 armadillo.Actor.prototype.createTile_ = function(option) {
190 var value = armadillo.Actor.options_[option];
191
192 // Create the title element.
193 var title = this.dom_.createDom('span', 'title',
194 armadillo.Actor.optionStrings_[value]);
195
196 var tile = new goog.ui.Control(title, new armadillo.Actor.TileControlRenderer_());
197 tile.actorOption = value;
198
199 // Cannot open non-directory files.
200 if (value == armadillo.Actor.options_.OPEN && !this.file_.isDirectory()) {
201 return null;
202 }
203
204 this.eh_.listen(tile, goog.ui.Component.EventType.ACTION,
205 this.tileClickHandler_, false, this);
206 return tile;
207 };
208
209 /**
210 * Click handler for individual tiles.
211 * @param {Event} e
212 */
213 armadillo.Actor.prototype.tileClickHandler_ = function(e) {
214 var option = e.target.actorOption;
215 if (option == armadillo.Actor.options_.OPEN) {
216 // TODO: assert that this.file_.isDirectory().
217 app.navigate(this.file_.getName());
218 } else if (option == armadillo.Actor.options_.MOVE ||
219 option == armadillo.Actor.options_.RENAME) {
220 this.performMove_();
221 } else if (option == armadillo.Actor.options_.DELETE) {
222 this.performDelete_();
223 }
224 this.hide();
225 };
226
227 /**
228 * Subroutine to handle bringing up the move confirmation UI.
229 * @private
230 */
231 armadillo.Actor.prototype.performMove_ = function() {
232 this.actionObject_ = this.createActionDialog_();
233 this.actionObject_.setTitle('Move File');
234
235 var editor = new armadillo.PathControl(this.file_.getFullPath(), true);
236 this.actionObject_.addChild(editor, true);
237
238 var closeCallback = function(e) {
239 if (e.key != goog.ui.Dialog.DefaultButtonKeys.CANCEL) {
240 var newPath = editor.getPath();
241 this.file_.move(newPath);
242 }
243 this.dispose();
244 };
245 // Will be removed when the event source closes.
246 this.eh_.listen(this.actionObject_, goog.ui.Dialog.SELECT_EVENT,
247 closeCallback, false, this);
248
249 this.actionObject_.setVisible(true);
250 var position = goog.style.getPosition(this.actionObject_.getElement());
251 goog.style.setPosition(this.actionObject_.getElement(), position.x, '10%');
252 };
253
254 /**
255 * Subroutine to handle bringing up the delete confirmation UI.
256 * @private
257 */
258 armadillo.Actor.prototype.performDelete_ = function() {
259 this.actionObject_ = this.createActionDialog_();
260 this.actionObject_.setTitle('Confirm Delete');
261
262 var container = this.actionObject_.getContentElement();
263 var content = goog.dom.createDom('span', null,
264 'Are you sure you want to delete:',
265 goog.dom.createElement('br'),
266 goog.dom.createDom('strong', null, this.file_.getName()));
267 goog.dom.appendChild(container, content);
268
269 var closeCallback = function(e) {
270 if (e.key != goog.ui.Dialog.DefaultButtonKeys.CANCEL) {
271 this.file_.remove();
272 }
273 this.dispose();
274 };
275 // Will be removed when the event source closes.
276 this.eh_.listen(this.actionObject_, goog.ui.Dialog.SELECT_EVENT,
277 closeCallback, false, this);
278
279 this.actionObject_.setVisible(true);
280 };
281
282 /**
283 * Creates a new instance of a Dialog that has some basic properties set that
284 * are common to performing actions.
285 * @private
286 */
287 armadillo.Actor.prototype.createActionDialog_ = function() {
288 var confirm = new goog.ui.Dialog();
289 confirm.setDisposeOnHide(true);
290 confirm.setEscapeToCancel(true);
291 confirm.setModal(true);
292 confirm.setDraggable(false);
293 confirm.setHasTitleCloseButton(false);
294 return confirm;
295 };
296
297 /**
298 * Event handler for when this.popup_ closes.
299 * @param {Event} e
300 */
301 armadillo.Actor.prototype.onPopupClosed_ = function(e) {
302 // If an action is not being performed, then dispose the Actor. Otherwise,
303 // this will get cleaned up after the actionObject_ closes.
304 if (!this.actionObject_) {
305 this.file_.setHighlight(armadillo.File.Highlight.SELECTED);
306 this.dispose();
307 }
308 };
309
310 /**
311 * Tile Control Renderer
312 * @constructor
313 */
314 armadillo.Actor.TileControlRenderer_ = function() {
315 goog.ui.ControlRenderer.call(this);
316 };
317 goog.inherits(armadillo.Actor.TileControlRenderer_, goog.ui.ControlRenderer);
318
319 /**
320 * Returns the control's contents wrapped in a DIV, with the renderer's own
321 * CSS class and additional state-specific classes applied to it.
322 * @param {goog.ui.Control} control Control to render.
323 * @return {Element} Root element for the control.
324 */
325 goog.ui.ControlRenderer.prototype.createDom = function(control) {
326 // Create and return DIV wrapping contents.
327 return control.getDomHelper().createDom('div', 'tile', control.getContent());
328 };