diff options
Diffstat (limited to 'js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.js')
-rw-r--r-- | js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.js | 153 |
1 files changed, 103 insertions, 50 deletions
diff --git a/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.js b/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.js index 299d44f5..411386f9 100644 --- a/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.js +++ b/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.js | |||
@@ -7,7 +7,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
7 | var Montage = require("montage/core/core").Montage, | 7 | var Montage = require("montage/core/core").Montage, |
8 | Component = require("montage/ui/component").Component, | 8 | Component = require("montage/ui/component").Component, |
9 | iconsListModule = require("js/components/ui/icon-list-basic/iconsList.reel"), | 9 | iconsListModule = require("js/components/ui/icon-list-basic/iconsList.reel"), |
10 | filePickerControllerModule = require("js/components/ui/FilePicker/file-picker-controller"), | ||
11 | treeModule = require("js/components/ui/tree-basic/tree.reel"); | 10 | treeModule = require("js/components/ui/tree-basic/tree.reel"); |
12 | 11 | ||
13 | var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { | 12 | var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { |
@@ -150,6 +149,12 @@ var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { | |||
150 | leftNav.appendChild(newDiv); | 149 | leftNav.appendChild(newDiv); |
151 | if(dirObj.uri === this.pickerModel.currentRoot){ | 150 | if(dirObj.uri === this.pickerModel.currentRoot){ |
152 | newDiv.classList.add("highlighted"); | 151 | newDiv.classList.add("highlighted"); |
152 | //enable ok for logical drive selections, when in directory selection mode | ||
153 | if(this.pickerModel.inFileMode === false){ | ||
154 | this.okButton.removeAttribute("disabled"); | ||
155 | //put into selectedItems..currently single selection is supported | ||
156 | this.selectedItems = [dirObj.uri]; | ||
157 | } | ||
153 | } | 158 | } |
154 | 159 | ||
155 | newDiv.addEventListener("click", function(evt){that.handleTopLevelDirectoryClicks(evt, dirObj);}, false); | 160 | newDiv.addEventListener("click", function(evt){that.handleTopLevelDirectoryClicks(evt, dirObj);}, false); |
@@ -198,6 +203,13 @@ var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { | |||
198 | this.pickerModel.storeHistory(this.pickerModel.currentRoot);//populate history | 203 | this.pickerModel.storeHistory(this.pickerModel.currentRoot);//populate history |
199 | 204 | ||
200 | this.updateMetadata(this.currentURI); | 205 | this.updateMetadata(this.currentURI); |
206 | |||
207 | //for directory selection, selected url is the folder entered | ||
208 | if(!this.pickerModel.inFileMode ){ | ||
209 | this.okButton.removeAttribute("disabled"); | ||
210 | //put into selectedItems..currently single selection is supported | ||
211 | this.selectedItems = [this.pickerModel.currentRoot]; | ||
212 | } | ||
201 | } | 213 | } |
202 | 214 | ||
203 | this.element.addEventListener("openFolder", function(evt){that.handlePickerNavOpenFolder(evt);}, false);//add icon double click event listener to reload iconList with new set of data | 215 | this.element.addEventListener("openFolder", function(evt){that.handlePickerNavOpenFolder(evt);}, false);//add icon double click event listener to reload iconList with new set of data |
@@ -206,29 +218,31 @@ var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { | |||
206 | this.element.addEventListener("updateMetadata", function(evt){that.handlePickerNavUpdateMetadata(evt);}, false);//show metadata on click of icon | 218 | this.element.addEventListener("updateMetadata", function(evt){that.handlePickerNavUpdateMetadata(evt);}, false);//show metadata on click of icon |
207 | //this.addressGo.addEventListener("click", this, false); | 219 | //this.addressGo.addEventListener("click", this, false); |
208 | this.addressBarUri.addEventListener("keydown", this, false); | 220 | this.addressBarUri.addEventListener("keydown", this, false); |
221 | this.addressBarUri.addEventListener("keyup", this, false); | ||
209 | this.refreshButton.addEventListener("click", this, false);//refresh - gets from file system directly | 222 | this.refreshButton.addEventListener("click", this, false);//refresh - gets from file system directly |
210 | this.backArrow.addEventListener("click", this, false); | 223 | this.backArrow.addEventListener("click", this, false); |
211 | this.forwardArrow.addEventListener("click", this, false); | 224 | this.forwardArrow.addEventListener("click", this, false); |
212 | this.okButton.addEventListener("click", this, false); | ||
213 | this.cancelButton.addEventListener("click", this, false); | ||
214 | |||
215 | //populate filters | ||
216 | var filtersDD = this.element.querySelector(".filters .dropdown"); | ||
217 | if(!!this.pickerModel.fileFilters | ||
218 | && (typeof this.pickerModel.fileFilters === "object") | ||
219 | && ('splice' in this.pickerModel.fileFilters) | ||
220 | && ('join' in this.pickerModel.fileFilters)){ | ||
221 | this.pickerModel.fileFilters.forEach(function(aFilter){ | ||
222 | var newDiv = document.createElement("div"); | ||
223 | newDiv.innerHTML = aFilter; | ||
224 | filtersDD.appendChild(newDiv); | ||
225 | newDiv.addEventListener("click", function(evt){that.handleFilterClick(evt, aFilter, filtersDD)}, false); | ||
226 | }, this); | ||
227 | } | ||
228 | 225 | ||
229 | var renderedWidth = this.getComputedWidth(filtersDD); | 226 | //populate filters if in file selection mode |
230 | this.filters.style.width = "" + (parseInt((renderedWidth.substring(0, (renderedWidth.length - 2)))) + 20) + "px"; | 227 | if(this.pickerModel.inFileMode === true){ |
228 | var filtersDD = this.element.querySelector(".filters .dropdown"); | ||
229 | if(!!this.pickerModel.fileFilters | ||
230 | && (typeof this.pickerModel.fileFilters === "object") | ||
231 | && ('splice' in this.pickerModel.fileFilters) | ||
232 | && ('join' in this.pickerModel.fileFilters)){ | ||
233 | this.pickerModel.fileFilters.forEach(function(aFilter){ | ||
234 | var newDiv = document.createElement("div"); | ||
235 | newDiv.innerHTML = aFilter; | ||
236 | filtersDD.appendChild(newDiv); | ||
237 | newDiv.addEventListener("click", function(evt){that.handleFilterClick(evt, aFilter, filtersDD)}, false); | ||
238 | }, this); | ||
239 | } | ||
231 | 240 | ||
241 | var renderedWidth = this.getComputedWidth(filtersDD); | ||
242 | this.filters.style.width = "" + (parseInt((renderedWidth.substring(0, (renderedWidth.length - 2)))) + 20) + "px"; | ||
243 | }else{ | ||
244 | this.filters.style.display = "none"; | ||
245 | } | ||
232 | /** | 246 | /** |
233 | * attach click event listeners to the addressbar dropdown arrows | 247 | * attach click event listeners to the addressbar dropdown arrows |
234 | */ | 248 | */ |
@@ -244,6 +258,9 @@ var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { | |||
244 | this.resultsArea.addEventListener("click", function(evt){that.handleResultsAreaClick(evt);}, false); | 258 | this.resultsArea.addEventListener("click", function(evt){that.handleResultsAreaClick(evt);}, false); |
245 | this.element.addEventListener("click", function(evt){that.handlePickerNavClick(evt);}, false); | 259 | this.element.addEventListener("click", function(evt){that.handlePickerNavClick(evt);}, false); |
246 | 260 | ||
261 | this.okButton.addEventListener("click", function(evt){that.handleOkButtonAction(evt);}, false); | ||
262 | this.cancelButton.addEventListener("click", function(evt){that.handleCancelButtonAction(evt);}, false); | ||
263 | |||
247 | //ready to show picker now | 264 | //ready to show picker now |
248 | this.element.style.visibility = "visible"; | 265 | this.element.style.visibility = "visible"; |
249 | } | 266 | } |
@@ -263,11 +280,11 @@ var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { | |||
263 | } | 280 | } |
264 | }, | 281 | }, |
265 | 282 | ||
266 | //TODO: add uri pattern validation | 283 | cleanupUri:{ |
267 | validateUri:{ | ||
268 | writable: false, | 284 | writable: false, |
269 | enumerable:true, | 285 | enumerable:true, |
270 | value: function(folderUri){ | 286 | value: function(folderUri){ |
287 | folderUri = folderUri.replace(/^\s+|\s+$/g,""); // strip any leading or trailing spaces | ||
271 | //remove unnecessary / from end - for Win and Mac .... don't trim for the root | 288 | //remove unnecessary / from end - for Win and Mac .... don't trim for the root |
272 | if(((folderUri.charAt(folderUri.length - 1) === "/") || (folderUri.charAt(folderUri.length - 1) === "\\")) && (folderUri !== "/")){ | 289 | if(((folderUri.charAt(folderUri.length - 1) === "/") || (folderUri.charAt(folderUri.length - 1) === "\\")) && (folderUri !== "/")){ |
273 | folderUri = folderUri.substring(0, (folderUri.length - 1)); | 290 | folderUri = folderUri.substring(0, (folderUri.length - 1)); |
@@ -324,14 +341,14 @@ var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { | |||
324 | writable:false, | 341 | writable:false, |
325 | enumerable:true, | 342 | enumerable:true, |
326 | value:function(uri){ | 343 | value:function(uri){ |
327 | uri = this.validateUri(uri); | 344 | uri = this.cleanupUri(uri); |
328 | var arr = []; | 345 | var arr = []; |
329 | var temp = new String(uri); | 346 | var temp = new String(uri); |
330 | while(temp.indexOf("/") != -1){ | 347 | while(temp.indexOf("/") != -1){ |
331 | temp = temp.substring(0, temp.lastIndexOf("/")); | 348 | temp = temp.substring(0, temp.lastIndexOf("/")); |
332 | 349 | ||
333 | //populate dropdown irrespective of validity | 350 | //populate dropdown irrespective of validity |
334 | // if(!!filePickerControllerModule.FilePickerController._directoryContentCache[temp]){//check if it is a valid location | 351 | // if(!!this.application.ninja.filePickerController._directoryContentCache[temp]){//check if it is a valid location |
335 | // arr.push(temp); | 352 | // arr.push(temp); |
336 | // }else{ | 353 | // }else{ |
337 | // break; | 354 | // break; |
@@ -354,7 +371,7 @@ var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { | |||
354 | value:function(element, uri){ | 371 | value:function(element, uri){ |
355 | if(!!element){ | 372 | if(!!element){ |
356 | var tree = treeModule.Tree.create(); | 373 | var tree = treeModule.Tree.create(); |
357 | tree.treeViewDataObject = filePickerControllerModule.FilePickerController.prepareContentList(uri, this.pickerModel); | 374 | tree.treeViewDataObject = this.application.ninja.filePickerController.prepareContentList(uri, this.pickerModel); |
358 | //console.log("renderTree() for "+ uri); | 375 | //console.log("renderTree() for "+ uri); |
359 | //console.log(tree.treeViewDataObject); | 376 | //console.log(tree.treeViewDataObject); |
360 | tree.element = element; | 377 | tree.element = element; |
@@ -370,10 +387,10 @@ var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { | |||
370 | var status = true; | 387 | var status = true; |
371 | var iconViewContainer = this.element.querySelector(".iconViewContainer"); | 388 | var iconViewContainer = this.element.querySelector(".iconViewContainer"); |
372 | if((typeof fromCache === 'undefined') || (fromCache === true)){ | 389 | if((typeof fromCache === 'undefined') || (fromCache === true)){ |
373 | this.newContent = filePickerControllerModule.FilePickerController.prepareContentList(uri, this.pickerModel); | 390 | this.newContent = this.application.ninja.filePickerController.prepareContentList(uri, this.pickerModel); |
374 | } | 391 | } |
375 | else{ | 392 | else{ |
376 | this.newContent = filePickerControllerModule.FilePickerController.prepareContentList(uri, this.pickerModel, false); | 393 | this.newContent = this.application.ninja.filePickerController.prepareContentList(uri, this.pickerModel, false); |
377 | } | 394 | } |
378 | if(!!this.newContent && this.newContent.length > 0){ | 395 | if(!!this.newContent && this.newContent.length > 0){ |
379 | //clear selection | 396 | //clear selection |
@@ -419,10 +436,10 @@ var PickerNavigator = exports.PickerNavigator = Montage.create(Component, { | |||
419 | if(!!treeViewContainer){ | 436 | if(!!treeViewContainer){ |
420 | var data = []; | 437 | var data = []; |
421 | if((typeof fromCache === 'undefined') || (fromCache === true)){ |