Lots of improvements to PathControl:
[armadillo.git] / web_frontend / path_control.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.PathControl');
11
12 goog.require('goog.array');
13 goog.require('goog.ui.Component');
14 goog.require('goog.ui.FilteredMenu');
15 goog.require('goog.ui.LabelInput');
16 goog.require('goog.ui.MenuButton');
17 goog.require('goog.ui.MenuItem');
18
19 /**
20 * Creates a new path editing control for a given path.
21 * @param {string} path The path to create an editor for
22 * @param {bool} editLastComponent Whether the last component should be shown as an edit box
23 * @param {DomHelper} opt_domHelper Optional DOM helper
24 * @constructor
25 */
26 armadillo.PathControl = function(path, editLastComponent, opt_domHelper) {
27 goog.ui.Component.call(this, opt_domHelper);
28
29 /**
30 * Full path of the control.
31 * @type {string}
32 */
33 this.path_ = path;
34
35 /**
36 * Whether or not the last component is editable.
37 * @type {bool}
38 */
39 this.editableLastComponent_ = editLastComponent;
40
41 /**
42 * List of path components
43 * @type {Array}
44 */
45 this.components_ = new Array();
46 };
47 goog.inherits(armadillo.PathControl, goog.ui.Component);
48
49 /**
50 * Disposer
51 * @protected
52 */
53 armadillo.PathControl.prototype.disposeInternal = function() {
54 armadillo.PathControl.superClass_.disposeInternal.call(this);
55 this.components_ = null;
56 };
57
58 /**
59 * Creates a new path control object.
60 */
61 armadillo.PathControl.prototype.createDom = function() {
62 this.decorateInternal(this.dom_.createElement('div'));
63 };
64
65 /**
66 * @inheritDoc
67 */
68 armadillo.PathControl.prototype.canDecorate = function() {
69 return true;
70 };
71
72 /**
73 * Decorates the given element into a path control.
74 * @param {Element} element
75 */
76 armadillo.PathControl.prototype.decorateInternal = function(element) {
77 this.element_ = element;
78 var components = this.path_.split('/');
79
80 if (components.length == 2) {
81 // If this is an item that lives at the root, generate a special node for
82 // moving between items at the top level.
83 components[0] = '/';
84 } else {
85 // Otherwise, just remove it as the first node will list all items at the
86 // root.
87 goog.array.removeAt(components, 0);
88 }
89
90 // If the last component is emtpy, do not use it because it means a directory
91 // is being moved.
92 if (components[components.length - 1] == '') {
93 goog.array.removeAt(components, components.length - 1);
94 }
95
96 var path = '';
97 goog.array.forEach(components, function (part, i) {
98 if (i != components.length - 1) {
99 this.addChild(this.createComponentNode_(path, part), true);
100 } else {
101 var input = new goog.ui.LabelInput(part, this.dom_);
102 this.addChild(input, true);
103 input.setEnabled(this.editableLastComponent_);
104 input.setValue(part);
105 }
106 path += part + '/';
107 }, this);
108 };
109
110 /**
111 * Creates a node for a single path component.
112 * @param {string} path The path up to this point.
113 * @param {string} name The current component after |path|.
114 */
115 armadillo.PathControl.prototype.createComponentNode_ = function(path, name) {
116 var menu = new goog.ui.FilteredMenu();
117 menu.setFilterLabel(name);
118 menu.setAllowMultiple(false);
119 menu.setOpenFollowsHighlight(true);
120 this.fetchMenuContents_(path, name, menu);
121
122 var button = new goog.ui.MenuButton(name, menu, null, this.dom_);
123 button.setFocusablePopupMenu(true);
124 button.setScrollOnOverflow(true);
125 button.setVisible(true);
126 return button;
127 };
128
129 /**
130 * Queries the back-end for all the items at a given path and attaches them to
131 * the given menu.
132 * @param {string} path The path to get a list of items in
133 * @param {string} name The name to select
134 * @param {goog.ui.Menu} The menu to attach items to
135 */
136 armadillo.PathControl.prototype.fetchMenuContents_ = function(path, name, menu) {
137 var callback = function(e) {
138 var data = e.target.getResponseJson();
139 if (data['error']) {
140 app.showError(data['message']);
141 return;
142 }
143 if (path == '') {
144 // If this is the root path element, make sure the root is accessible for
145 // moving items.
146 goog.array.insertAt(data, '/', 0);
147 }
148 goog.array.forEach(data, function (caption) {
149 // It only makes sense to be able to move into directories.
150 if (!app.isDirectory(caption)) {
151 return;
152 }
153 var item = new goog.ui.MenuItem(caption);
154 menu.addItem(item);
155 if (caption == name) {
156 menu.setHighlighted(item);
157 }
158 });
159 };
160 app.sendRequest('list', {'path':path}, callback);
161 };