From 0e595c4e11ce9b44eff157de8616ed15fcd5d6fc Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Thu, 2 Feb 2012 12:37:29 -0800 Subject: refactoring some file names and locations, change made to maintain only one codemirror div. Signed-off-by: Ananya Sen --- .../new-file-location.reel/new-file-location.css | 59 ++++ .../new-file-location.reel/new-file-location.html | 90 +++++ .../new-file-location.reel/new-file-location.js | 56 +++ .../new-file-options-navigator.css | 156 +++++++++ .../new-file-options-navigator.html | 92 +++++ .../new-file-options-navigator.js | 378 +++++++++++++++++++++ .../new-file-workflow-controller.js | 116 +++++++ .../ui/new-file-dialog/new-file-workflow-model.js | 146 ++++++++ 8 files changed, 1093 insertions(+) create mode 100755 js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css create mode 100755 js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html create mode 100755 js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.js create mode 100755 js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css create mode 100755 js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html create mode 100644 js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js create mode 100755 js/io/ui/new-file-dialog/new-file-workflow-controller.js create mode 100755 js/io/ui/new-file-dialog/new-file-workflow-model.js (limited to 'js/io/ui/new-file-dialog') diff --git a/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css new file mode 100755 index 00000000..7f11c225 --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css @@ -0,0 +1,59 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +.newfileLocation .newFileName{ + width:70%; + margin-left:5px; +} + +.newfileLocation .newFileDirectory{ + width:70%; + margin-left:5px; +} + +.newfileLocation .templateSelection{ + float:left; + width:20%; + height:90%; + padding-right: 10px; +} + +.newfileLocation .templateSelection .template{ + width:80%; + height:60%; + background-color: #e1e1e1; + border:1px solid #000000; + box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8); +} + +.newfileLocation .locationSelection{ + float:left; + width:75%; +} + +.newfileLocation .locationSelection div{ + padding-bottom: 5px; +} + +.newfileLocation .locationSelection input{ + margin-left: 5px; + white-space: nowrap; +} + +.newfileLocation .templatePx{ + padding-left: 5px; + white-space: nowrap; +} + +.newfileLocation .nameText{ + margin-right:31px; +} + +.newfileLocation .hottextunit{ + float: none; + display: inline; +} + diff --git a/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html new file mode 100755 index 00000000..d7fbc235 --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html @@ -0,0 +1,90 @@ + + + + + + + + + +
+
+
+
+
+
NAME:
+
+ DIRECTORY: +
+
+
+
WIDTH:
+
HEIGHT:
+
+
+ + \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.js b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.js new file mode 100755 index 00000000..7da13dfc --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.js @@ -0,0 +1,56 @@ +/* +This file contains proprietary software owned by Motorola Mobility, Inc.
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +var Montage = require("montage/core/core").Montage; +var Component = require("montage/ui/component").Component; +var newFileWorkflowControllerModule = require("js/io/ui/new-file-dialog/new-file-workflow-controller"); + +var NewFileLocation = exports.NewFileLocation = Montage.create(Component, { + + templateHeight:{ + enumerable: true, + value:"25 px" + }, + + templateWidth:{ + enumerable: true, + value:"25 px" + }, + + willDraw: { + enumerable: false, + value: function() {} + }, + + draw: { + enumerable: false, + value: function() {} + }, + + didDraw: { + enumerable: false, + value: function() { + var that=this; + + this.fileInputField.selectDirectory = true; + + this.newFileName.addEventListener("blur", function(evt){that.handleNewFileNameOnblur(evt);}, false); + } + + }, + + handleNewFileNameOnblur:{ + value:function(evt){ + if(this.newFileName.value !== ""){ + var newFileNameSetEvent = document.createEvent("Events"); + newFileNameSetEvent.initEvent("newFileNameSet", false, false); + newFileNameSetEvent.newFileName = this.newFileName.value; + this.eventManager.dispatchEvent(newFileNameSetEvent); + } + } + } + +}); \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css new file mode 100755 index 00000000..7ef6d2ce --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css @@ -0,0 +1,156 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +.newfile{ + font-size:12px; + width:650px; + height:350px; + padding-left: 15px; + padding-bottom:25px; + background-color:#313131; + color:#ffffff; +} + +.newfile .title{ + font-size:14px; + height:15px; + padding:5px; + text-align: center; + font-weight: bold; + color: #C1C1C1; +} + +.newfile .container{ + border: 1px groove #000000; + overflow: auto; + background-color:#5f5f5f; +} + +.newfile .left-nav{ + float:left; + width:27%; + height:90%; + overflow-x:auto; + overflow-y:auto +} + +.newfile .right-nav{ + float:left; + width:70%; + height:90%; + overflow: hidden; +} + +.newfile .right-top{ + border: 1px groove #000000; + overflow: auto; + min-height:150px; + height:58%; + width:auto; + padding:5px; +} + +.newfile .right-bottom{ + border: 1px groove #000000; + overflow: auto; + height:42%; + padding: 15px; +} + +.newfile .projectTypeHeader{ + border-bottom:1px solid #000000; + padding:5px; + text-align: center; + font-weight: bold; +} + +.newfile .buttons{ + float:right; + margin-top: 7px; +} + +.newfile .errorMsg{ + float:left; + margin-top: 7px; +} +.newfile .errorMsg span{ + color: #BF3B3B; +} + +.newfile .disable{ + color:#5f5f5f; + cursor:auto; +} + +.newfile .hide{ + display: none; +} + +.newfile .treeArrow + .name{ + font-weight: bold; +} + +.newfile .atreeItem .name{ + padding: 3px; +} + +.newfile .atreeItem .selected{ + background-color: #3f3f3f; +} + +.newfile .icon .selected{ + background-color: #7f7f7f; +} + +.newfile .icon{ + height:90px; +} + +.newfile .icon .iconLabel{ + margin-top:4px; + max-width:90%; + white-space: normal; + padding-bottom:4px; + overflow: visible; +} + +.newfile .icon .iconImg{ + margin-left:25px; +} + +.newfile .okButton{ + margin-right:25px; + -webkit-box-align: center; + text-align: center; + cursor: default; + padding: 0px 6px 0px; + border:2px solid #d1d1d1; + background-color: #e1e1e1; + box-sizing: border-box; + border-radius:10px; + background-image: -webkit-linear-gradient(bottom, #e1e1e1 13%, #d1d1d1 58%, #e1e1e1 40%); + cursor:pointer; +} + +.newfile .cancelButton{ + -webkit-box-align: center; + text-align: center; + cursor: default; + padding: 0px 6px 0px; + border:2px solid #d1d1d1; + background-color: #e1e1e1; + box-sizing: border-box; + border-radius:10px; + background-image: -webkit-linear-gradient(bottom, #e1e1e1 13%, #d1d1d1 58%, #e1e1e1 40%); + cursor:pointer; +} + +.newfile input[type="button"]:disabled{ + background-color: #a1a1a1; + border:2px solid #a1a1a1; + background-image:none; + cursor:auto; +} \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html new file mode 100755 index 00000000..eb4a8045 --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html @@ -0,0 +1,92 @@ + + + + + + + + + +
+
Create New File
+
+
File Type
+
+
+
+
+
+
+
+
templateIcon
+
selections
+
+
+
+
+ + +
+
+ + \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js new file mode 100644 index 00000000..cee8d4b7 --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js @@ -0,0 +1,378 @@ +/* +This file contains proprietary software owned by Motorola Mobility, Inc.
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +var Montage = require("montage/core/core").Montage, + Component = require("montage/ui/component").Component, + iconsListModule = require("js/components/ui/icon-list-basic/iconsList.reel"), + treeModule = require("js/components/ui/tree-basic/tree.reel"), + newFileLocationSelectionModule = require("js/io/ui/new-file-dialog/new-file-workflow-controller"), + nj= require("js/lib/NJUtils.js").NJUtils; + +var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(Component, { + + newFileModel: { + writable: true, + enumerable:false, + value:null + }, + selectedProjectType:{ + writable: true, + enumerable:false, + value:null + }, + selectedTemplate:{ + writable: true, + enumerable:false, + value:null + }, + newFileName:{ + writable:true, + enumerable:false, + value:"" + }, + newFileDirectory:{ + writable:true, + enumerable:false, + value:"" + }, + templateWidth:{ + writable:true, + enumerable:false, + value:"0 px" + }, + templateHeight:{ + writable:true, + enumerable:false, + value:"0 px" + }, + willDraw: { + enumerable: false, + value: function() {} + }, + draw: { + enumerable: false, + value: function() {} + }, + didDraw: { + enumerable: false, + value: function() { + var that = this; + + this.templateList = null; + + //draw left nav project type tree + var tree = treeModule.Tree.create(); + tree.showIcons = false; + tree.expandTreeAfterDraw = true; + tree.directoryBold = true; + tree.highlightedUri = this.newFileModel.defaultProjectType; + tree.treeViewDataObject = this.newFileModel.prepareContents("categories"); + tree.element = this.projectTypeTree; + tree.needsDraw = true; + + //highlight defaultProjectType + + this.addIdentifiers(); + + this.element.addEventListener("drawTree", function(evt){that.handleNewFileNavDrawTree(evt);}, false); + this.element.addEventListener("selectedItem", function(evt){that.handleNewFileNavSelectedItem(evt);}, false);//for single selection only + this.eventManager.addEventListener("newFileDirectorySet", function(evt){that.handleNewFileDirectorySet(evt);}, false); + this.eventManager.addEventListener("newFileNameSet", function(evt){that.handleNewFileNameSet(evt);}, false); + + if(!!this.newFileModel.defaultProjectType){ + var templates = this.newFileModel.prepareContents(this.newFileModel.defaultProjectType); + this.templateList = iconsListModule.IconsList.create(); + this.templateList.iconsViewDataObject = templates; + this.templateList.element = this.templateIcons; + this.templateList.needsDraw = true; + + + this.selectedProjectType = {"uri":this.newFileModel.defaultProjectType, "element":null}; + } + } + + }, + + /** + * Event Listners + */ + + addIdentifiers:{ + value: function(){ + this.element.identifier = "newFileNav"; + } + }, + + handleNewFileNavDrawTree:{ + value: function(evt){ + //toggle open or close for directory + if((evt.uriType === "directory") && (!!evt.subTreeContainer)){ + var tree = treeModule.Tree.create(); + tree.showIcons = false; + tree.highlightedUri = this.newFileModel.defaultProjectType; + tree.treeViewDataObject = this.newFileModel.prepareContents(evt.uri); + tree.element = evt.subTreeContainer; + tree.needsDraw = true; + } + } + }, + + handleNewFileNavSelectedItem:{ + value: function(evt){ + var selectionType = this.newFileModel.projectTypeData[evt.uri].type; + if(evt.target.classList.contains("atreeItemContent") && (selectionType === "file")){//populate templates for project type selection + this.highlightSelection(evt.target, "projectType", evt.uri); + + //clear current template selection + if((!!this.selectedTemplate) && (this.selectedTemplate.element.classList.contains("selected"))){ + this.selectedTemplate.element.classList.remove("selected"); + } + + //disable ok + if(!this.okButton.hasAttribute("disabled")){ + this.okButton.setAttribute("disabled", "true"); + } + + //save project type selection + this.selectedProjectType = {"uri":evt.uri, "element":evt.target}; + + //render templates + var templates = this.newFileModel.prepareContents(evt.uri); + if(this.templatesContainer.querySelectorAll(".list").length > 0){ + this.templateList.iconsViewDataObject = templates; + }else{ + this.templateList = iconsListModule.IconsList.create(); + this.templateList.iconsViewDataObject = templates; + this.templateList.element = this.templateIcons; + this.templateList.needsDraw = true; + } + + + } + + if(evt.target.classList.contains("icon")){ + this.highlightSelection(evt.target, "template", evt.uri); + + //save template selection + this.selectedTemplate = {"uri":evt.uri, "element":evt.target}; + + this.enableOk(); + + } + } + }, + + handleCancelButtonAction :{ + value:function(evt){ + //clean up memory + this.cleanup(); + + if(this.popup){ + this.popup.hide(); + } + + } + }, + + handleOkButtonAction:{ + value: function(evt){ + var selectedProjectTypeID = this.selectedProjectType.uri, + templateID = this.selectedTemplate.uri, + projectName = this.newFileLocation.newFileName.value, + projectDirectory = this.newFileLocation.fileInputField.newFileDirectory.value, + projectWidth = this.newFileLocation.templateWidth, + projectHeight = this.newFileLocation.templateHeight, + + + selectionlog= "selectedProjectTypeID="+selectedProjectTypeID +"\n"+ + "templateID="+templateID+ "\n"+ + "projectName="+projectName+"\n"+ + "projectDirectory="+projectDirectory+"\n"+ + "projectWidth="+projectWidth+"\n"+ + "projectHeight="+projectHeight; + + if(!!this.selectedProjectType && !!this.selectedTemplate + && this.isValidFileName(projectName) && this.isValidUri(projectDirectory) + && !this.checkFileExists(projectName, projectDirectory, this.selectedProjectType) + ){ + this.error.innerHTML=""; + console.log("$$$ new file selections: \n" + selectionlog); + if(!!this.newFileModel.callback && !!this.newFileModel.callbackScope){//inform document-controller if save successful + this.newFileModel.callback.call(this.newFileModel.callbackScope, {"selectedProjectTypeID":selectedProjectTypeID, + "templateID":templateID, + "projectName": projectName, + "projectDirectory":projectDirectory, + "projectWidth":projectWidth, + "projectHeight":projectHeight});//document-controller api + }else{ + //send selection event + var newFileSelectionEvent = document.createEvent("Events"); + newFileSelectionEvent.initEvent("createNewFile", false, false); + newFileSelectionEvent.newFileOptions = {"selectedProjectTypeID":selectedProjectTypeID, + "templateID":templateID, + "projectName": projectName, + "projectDirectory":projectDirectory, + "projectWidth":projectWidth, + "projectHeight":projectHeight}; + this.eventManager.dispatchEvent(newFileSelectionEvent); + } + //store last selected project type + var dataStore = window.sessionStorage; + try { + dataStore.setItem('lastSelectedProjectType',escape(""+selectedProjectTypeID)); + } + catch(e){ + if(e.code == 22){ + dataStore.clear(); + } + } + + this.cleanup();//clear up any unnecessary memory + + if(this.popup){ + this.popup.hide(); + } + }else{ + if(this.error.innerHTML !== ""){ + this.showError("! Project Template, Name and Directory should be valid."); + } + //disable ok + if(!this.okButton.hasAttribute("disabled")){ + this.okButton.setAttribute("disabled", "true"); + } + } + } + }, + + handleNewFileDirectorySet:{ + value:function(evt){ + if(!!evt._event.newFileDirectory){ + this.newFileDirectory = evt._event.newFileDirectory; + if(this.isValidUri(this.newFileDirectory)){ + this.enableOk(); + } + } + } + }, + + handleNewFileNameSet:{ + value:function(evt){ + if(!!evt._event.newFileName){ + this.newFileName = evt._event.newFileName; + if(this.isValidFileName(this.newFileName)){ + this.enableOk(); + } + } + } + }, + + highlightSelection:{ + value: function(el, selectionType, uri){ + var elem; + //clear previous selection + if(selectionType === "projectType"){ + if((!!this.selectedProjectType) && (uri !== this.selectedProjectType.uri)){ + if(!!this.selectedProjectType.element){ + this.selectedProjectType.element.classList.remove("selected"); + }else{ + //find the selected element + elem = document.querySelector(".projectTypeTree").querySelector(".selected"); + if(!!elem){ + elem.classList.remove("selected"); + } + } + el.classList.add("selected"); + }else if(this.selectedProjectType === null){ + el.classList.add("selected"); + } + }else if(selectionType === "template"){ + if((!!this.selectedTemplate) && (uri !== this.selectedTemplate.element)){ + if(!!this.selectedTemplate.element){this.selectedTemplate.element.classList.remove("selected");} + el.classList.add("selected"); + }else if(this.selectedTemplate === null){ + el.classList.add("selected"); + } + } + + } + }, + + enableOk:{ + value: function(){ + var status = false; + + if(!!this.selectedProjectType && !!this.selectedTemplate + && this.isValidFileName(this.newFileName) && this.isValidUri(this.newFileDirectory) + && !this.checkFileExists(this.newFileName, this.newFileDirectory, this.selectedProjectType) + ){ + status = true; + this.okButton.removeAttribute("disabled"); + this.error.innerHTML=""; + } + return status; + } + }, + + cleanup:{ + value:function(){ + var that = this; + + this.newFileName = ""; + this.newFileDirectory = ""; + this.selectedProjectType = null; + this.selectedTemplate = null; + + //remove event listeners + this.element.removeEventListener("drawTree", function(evt){that.handleNewFileNavDrawTree(evt);}, false); + this.element.removeEventListener("selectedItem", function(evt){that.handleNewFileNavSelectedItem(evt);}, false);//for single selection only + this.eventManager.removeEventListener("newFileDirectorySet", function(evt){that.handleNewFileDirectorySet(evt);}, false); + this.eventManager.removeEventListener("newFileNameSet", function(evt){that.handleNewFileNameSet(evt);}, false); + } + }, + + isValidUri:{ + value: function(uri){ + var status= nj.isValidUri(uri); + if(uri !== ""){ + if(!status){ + this.showError("! Invalid directory."); + } + } + return status; + } + }, + isValidFileName:{ + value: function(fileName){ + var status = nj.isValidFileName(fileName); + if(fileName !== ""){ + if(!status){ + this.showError("! Invalid file name."); + } + } + return status; + } + }, + checkFileExists:{ + value: function(fileUri, folderUri, fileType){ + var status= this.application.ninja.coreIoApi.checkFileExists(fileUri, folderUri, fileType); + if(status){ + this.showError("! File already exists."); + } + return status; + } + }, + showError:{ + value:function(errorString){ + this.error.innerHTML = ""; + this.error.innerHTML=errorString; + //disable ok + if(!this.okButton.hasAttribute("disabled")){ + this.okButton.setAttribute("disabled", "true"); + } + } + } + +}); \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-workflow-controller.js b/js/io/ui/new-file-dialog/new-file-workflow-controller.js new file mode 100755 index 00000000..cfe7db16 --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-workflow-controller.js @@ -0,0 +1,116 @@ +/* +This file contains proprietary software owned by Motorola Mobility, Inc.
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +var Montage = require("montage/core/core").Montage, + Popup = require("montage/ui/popup/popup.reel").Popup, + newFileOptionsNavigatorModule = require("js/io/ui/new-file-dialog/new-file-options-navigator.reel"), + newFileWorkflowModelModule = require("js/io/ui/new-file-dialog/new-file-workflow-model"); + saveAsModule = require("js/io/ui/save-as-dialog.reel"); + +//singleton +var NewFileWorkflowController = exports.NewFileWorkflowController = Montage.create(require("montage/ui/component").Component, { + /** + * Register a listener for showPicker event + */ + deserializedFromTemplate:{ + writable:false, + enumerable:true, + value:function(){ + var that = this; + this.eventManager.addEventListener("executeNewFile", function(evt){ + var data = evt._event.data || {};//data will contain callback + that.showNewFileDialog(data); + }, false); + + this.eventManager.addEventListener("saveAs", function(evt){ + var data = evt._event.data || {};//data will contain the current file name, directory location and callback + that.showSaveAsDialog(data); + }, false); + } + }, + + model:{ + writable: true, + enumerable:true, + value: newFileWorkflowModelModule.NewFileWorkflowModel + }, + + showNewFileDialog:{ + writable:false, + enumerable:true, + value:function(data){ + //get default project type + this.model.defaultProjectType = "htmlTemplate"; + this.model.callback = data.callback || null; + this.model.callbackScope = data.callbackScope || null; + + //populate the last opened folder first, if none then populate default root + var sessionStorage = window.sessionStorage; + var lastSelectedProjectType = sessionStorage.getItem("lastSelectedProjectType"); + + if(!!lastSelectedProjectType){ + this.model.defaultProjectType = lastSelectedProjectType; + } + + //render modal dialog + var newFileNavContent = document.createElement("div"); + newFileNavContent.id = "newFileDialog"; + + //elements needs to be on DOM to be drawn + document.getElementById('modalContainer').appendChild(newFileNavContent); + + var newFileOptionsNav = newFileOptionsNavigatorModule.NewFileOptionsNavigator.create(); + newFileOptionsNav.newFileModel = this.model; + newFileOptionsNav.element = newFileNavContent; + + //remove after rendering and add in modal dialog + document.getElementById('modalContainer').removeChild(newFileNavContent); + + var popup = Popup.create(); + popup.content = newFileOptionsNav; + popup.modal = true; + popup.type = "newFileDialog"; + popup.show(); + + newFileOptionsNav.popup = popup;//handle to be used for hiding the popup + + } + }, + + showSaveAsDialog:{ + writable:false, + enumerable:true, + value:function(data){ + var fileName = data.fileName || "filename.txt"; + var folderUri = data.folderUri || "/Documents"; + + //render modal dialog + var saveAsDialogContainer = document.createElement("div"); + saveAsDialogContainer.id = "saveAsDialog"; + + //elements needs to be on DOM to be drawn + document.getElementById('modalContainer').appendChild(saveAsDialogContainer); + + var saveAsDialog = saveAsModule.SaveAsDialog.create(); + saveAsDialog.fileName = fileName; + saveAsDialog.folderUri = folderUri; + saveAsDialog.callback = data.callback; + saveAsDialog.callbackScope = data.callbackScope; + saveAsDialog.element = saveAsDialogContainer; + + //remove after rendering and add in modal dialog + document.getElementById('modalContainer').removeChild(saveAsDialogContainer); + + var popup = Popup.create(); + popup.content = saveAsDialog; + popup.modal = true; + popup.type = "saveAsDialog"; + popup.show(); + + saveAsDialog.popup = popup;//handle to be used for hiding the popup + } + } +}); \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-workflow-model.js b/js/io/ui/new-file-dialog/new-file-workflow-model.js new file mode 100755 index 00000000..bcaf8132 --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-workflow-model.js @@ -0,0 +1,146 @@ +/* +This file contains proprietary software owned by Motorola Mobility, Inc.
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + + +//a singleton + +exports.NewFileWorkflowModel = Object.create(Object.prototype, { + prepareContents: { + value: function(id){ + var contents = []; + if(!!this.projectTypeData[id].children && (this.projectTypeData[id].children.length > 0)){ + this.projectTypeData[id].children.forEach(function(elem){ + if(!!this.projectTypeData[elem]){ + contents.push(this.projectTypeData[elem]); + } + }, this); + } + + return contents; + } + }, + + defaultProjectType:{ + writable: true, + enumerable: true, + value: null + }, + + callback : { + enumerable: true, + writable: true, + value: null + }, + + callbackScope : { + enumerable: true, + writable: true, + value: null + }, + + projectTypeData:{ + writable:false, + enumerable:false, + value:{//dummy data for testing + "categories":{ + "children":["newFile", "newProject", "fromTemplate"] + }, + "newProject":{ + "type":"directory", + "name":"New Project", + "uri":"newProject", + "children":["animation", "bannerAd", "montageComponent", "androidApp"] + }, + "newFile":{ + "name":"Blank Template", + "uri":"newFile", + "type":"directory", + "children":["htmlTemplate", "javascriptTemplate", "cssTemplate"] + }, + "fromTemplate":{ + "name":"From Template", + "uri":"fromTemplate", + "type":"directory", + "children":["xoomApp", "website", "iosApp"] + }, + "bannerAd":{ + "name":"Banner Ad", + "uri":"bannerAd", + "type":"file", + "children":["176x208", "176x220", "208x320", "230x240", "208x320", "230x240", "208x320", "230x240"] + }, + "animation":{ + "name":"Animation", + "uri":"animation", + "type":"file", + "children":["176x208", "176x220", "208x320", "230x240"] + }, + "montageComponent":{ + "name":"Montage Component", + "uri":"montageComponent", + "type":"file", + "children":["176x208", "176x208", "176x220", "208x320", "230x240","176x208", "176x220", "208x320", "230x240"] + }, + "androidApp":{ + "name":"Android App", + "uri":"androidApp", + "type":"file", + "children":["176x208", "176x220"] + }, + "xoomApp":{ + "name":"Xoom Application", + "uri":"xoomApp", + "type":"file", + "children":["176x208", "176x208", "176x220", "208x320", "176x220", "208x320", "230x240"] + }, + "iosApp":{ + "name":"iOS Application", + "uri":"iosApp", + "type":"file", + "children":["176x208"] + }, + "176x208":{ + "name":"176 x 208", + "uri":"176x208", + "type":"file" + }, + "176x220":{ + "name":"176 x 220", + "uri":"176x220", + "type":"file" + }, + "208x320":{ + "name":"208 x 320", + "uri":"208x320", + "type":"file" + }, + "htmlTemplate":{ + "name":"HTML", + "uri":"htmlTemplate", + "type":"file", + "children":["defaultTemplate", "xoomApp", "iosApp", "androidApp", "bannerAd"] + }, + "cssTemplate":{ + "name":"CSS", + "uri":"cssTemplate", + "type":"file", + "children":["defaultTemplate"] + }, + "javascriptTemplate":{ + "name":"JavaScript", + "uri":"javascriptTemplate", + "type":"file", + "children":["defaultTemplate"] + }, + defaultTemplate:{ + "name": "default", + "uri": "defaultTemplate", + "type":"file" + } + + } + } +}); -- cgit v1.2.3 From 476a25e8a662270dfe5b37c560e4235f02b146e4 Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Thu, 2 Feb 2012 12:59:41 -0800 Subject: uri validation moved to file io apis Signed-off-by: Ananya Sen --- .../new-file-options-navigator.reel/new-file-options-navigator.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/io/ui/new-file-dialog') diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js index cee8d4b7..a747b8de 100644 --- a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js @@ -335,7 +335,7 @@ var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(C isValidUri:{ value: function(uri){ - var status= nj.isValidUri(uri); + var status= this.application.ninja.coreIoApi.isValidUri(uri); if(uri !== ""){ if(!status){ this.showError("! Invalid directory."); -- cgit v1.2.3 From 6890662caba94598675679f40dbb725301c93e98 Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Thu, 2 Feb 2012 17:45:22 -0800 Subject: integrated new file dialog with the template descriptor.json and document-controller.js Signed-off-by: Ananya Sen --- .../new-file-location.reel/new-file-location.css | 7 +- .../new-file-location.reel/new-file-location.html | 10 +- .../new-file-options-navigator.css | 4 + .../new-file-options-navigator.html | 2 +- .../new-file-options-navigator.js | 48 +++++++--- .../new-file-workflow-controller.js | 37 ++++++-- .../ui/new-file-dialog/new-file-workflow-model.js | 101 +-------------------- 7 files changed, 82 insertions(+), 127 deletions(-) (limited to 'js/io/ui/new-file-dialog') diff --git a/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css index 7f11c225..092ca626 100755 --- a/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css +++ b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css @@ -5,7 +5,7 @@ */ .newfileLocation .newFileName{ - width:70%; + width:65%; margin-left:5px; } @@ -49,7 +49,7 @@ } .newfileLocation .nameText{ - margin-right:31px; + margin-right:28px; } .newfileLocation .hottextunit{ @@ -57,3 +57,6 @@ display: inline; } +.newfileLocation .fileExtension{ + color:#d7d7d7; +} diff --git a/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html index d7fbc235..8c0327eb 100755 --- a/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html +++ b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html @@ -76,14 +76,18 @@
-
NAME:
+
+ NAME: + + +
DIRECTORY:

-
WIDTH:
-
HEIGHT:
+
WIDTH:
+
HEIGHT:
diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css index 7ef6d2ce..95ce01f9 100755 --- a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css @@ -153,4 +153,8 @@ border:2px solid #a1a1a1; background-image:none; cursor:auto; +} + +.newfile .atree ul{ + -webkit-padding-start: 10px; } \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html index eb4a8045..c9178d65 100755 --- a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html @@ -70,7 +70,7 @@
Create New File
-
File Type
+
Choose Type
diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js index a747b8de..467c5452 100644 --- a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js @@ -92,6 +92,14 @@ var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(C this.selectedProjectType = {"uri":this.newFileModel.defaultProjectType, "element":null}; } + + //update file Extension + if(!!this.newFileModel.projectTypeData[this.newFileModel.defaultProjectType].fileExtension){ + var fileExtensionEl = this.element.querySelector(".fileExtension"); + if(!!fileExtensionEl){ + fileExtensionEl.innerHTML = ""+this.newFileModel.projectTypeData[this.newFileModel.defaultProjectType].fileExtension; + } + } } }, @@ -128,7 +136,15 @@ var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(C //clear current template selection if((!!this.selectedTemplate) && (this.selectedTemplate.element.classList.contains("selected"))){ - this.selectedTemplate.element.classList.remove("selected"); + this.selectedTemplate.element.classList.remove("selected"); + } + + //update file Extension + if(!!this.newFileModel.projectTypeData[evt.uri].fileExtension){ + var fileExtensionEl = this.element.querySelector(".fileExtension"); + if(!!fileExtensionEl){ + fileExtensionEl.innerHTML = ""+this.newFileModel.projectTypeData[evt.uri].fileExtension; + } } //disable ok @@ -186,6 +202,7 @@ var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(C projectWidth = this.newFileLocation.templateWidth, projectHeight = this.newFileLocation.templateHeight, + newFilePath = "", fileExtension=this.newFileModel.projectTypeData[selectedProjectTypeID].fileExtension, selectionlog= "selectedProjectTypeID="+selectedProjectTypeID +"\n"+ "templateID="+templateID+ "\n"+ @@ -194,29 +211,30 @@ var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(C "projectWidth="+projectWidth+"\n"+ "projectHeight="+projectHeight; + + if(/[^/\\]$/g.test(projectDirectory)){ + projectDirectory = projectDirectory + "/"; + } + if(!!fileExtension && (projectName.lastIndexOf(fileExtension) !== (projectName.length - fileExtension.length))){ + projectName = projectName+fileExtension; + } + newFilePath = "" + projectDirectory + projectName; + + if(!!this.selectedProjectType && !!this.selectedTemplate && this.isValidFileName(projectName) && this.isValidUri(projectDirectory) && !this.checkFileExists(projectName, projectDirectory, this.selectedProjectType) ){ this.error.innerHTML=""; - console.log("$$$ new file selections: \n" + selectionlog); + //console.log("$$$ new file selections: \n" + selectionlog); if(!!this.newFileModel.callback && !!this.newFileModel.callbackScope){//inform document-controller if save successful - this.newFileModel.callback.call(this.newFileModel.callbackScope, {"selectedProjectTypeID":selectedProjectTypeID, - "templateID":templateID, - "projectName": projectName, - "projectDirectory":projectDirectory, - "projectWidth":projectWidth, - "projectHeight":projectHeight});//document-controller api + this.newFileModel.callback.call(this.newFileModel.callbackScope, {"fileTemplateUri":selectedProjectTypeID, + "newFilePath":newFilePath});//document-controller api }else{ //send selection event var newFileSelectionEvent = document.createEvent("Events"); newFileSelectionEvent.initEvent("createNewFile", false, false); - newFileSelectionEvent.newFileOptions = {"selectedProjectTypeID":selectedProjectTypeID, - "templateID":templateID, - "projectName": projectName, - "projectDirectory":projectDirectory, - "projectWidth":projectWidth, - "projectHeight":projectHeight}; + newFileSelectionEvent.newFileOptions = {"fileTemplateUri":selectedProjectTypeID, "newFilePath":newFilePath}; this.eventManager.dispatchEvent(newFileSelectionEvent); } //store last selected project type @@ -306,7 +324,7 @@ var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(C if(!!this.selectedProjectType && !!this.selectedTemplate && this.isValidFileName(this.newFileName) && this.isValidUri(this.newFileDirectory) - && !this.checkFileExists(this.newFileName, this.newFileDirectory, this.selectedProjectType) + && !this.checkFileExists(this.newFileName, this.newFileDirectory, this.newFileModel.projectTypeData[this.selectedProjectType.uri].fileExtension) ){ status = true; this.okButton.removeAttribute("disabled"); diff --git a/js/io/ui/new-file-dialog/new-file-workflow-controller.js b/js/io/ui/new-file-dialog/new-file-workflow-controller.js index cfe7db16..16075ecf 100755 --- a/js/io/ui/new-file-dialog/new-file-workflow-controller.js +++ b/js/io/ui/new-file-dialog/new-file-workflow-controller.js @@ -7,7 +7,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot var Montage = require("montage/core/core").Montage, Popup = require("montage/ui/popup/popup.reel").Popup, newFileOptionsNavigatorModule = require("js/io/ui/new-file-dialog/new-file-options-navigator.reel"), - newFileWorkflowModelModule = require("js/io/ui/new-file-dialog/new-file-workflow-model"); + newFileWorkflowModelModule = require("js/io/ui/new-file-dialog/new-file-workflow-model").NewFileWorkflowModel; saveAsModule = require("js/io/ui/save-as-dialog.reel"); //singleton @@ -20,10 +20,6 @@ var NewFileWorkflowController = exports.NewFileWorkflowController = Montage.cre enumerable:true, value:function(){ var that = this; - this.eventManager.addEventListener("executeNewFile", function(evt){ - var data = evt._event.data || {};//data will contain callback - that.showNewFileDialog(data); - }, false); this.eventManager.addEventListener("saveAs", function(evt){ var data = evt._event.data || {};//data will contain the current file name, directory location and callback @@ -35,15 +31,20 @@ var NewFileWorkflowController = exports.NewFileWorkflowController = Montage.cre model:{ writable: true, enumerable:true, - value: newFileWorkflowModelModule.NewFileWorkflowModel + value: null }, showNewFileDialog:{ writable:false, enumerable:true, value:function(data){ + this.model = newFileWorkflowModelModule; + + //read file descriptor to populate model + this.model.projectTypeData = this.loadDescriptor("js/io/templates/descriptor.json"); + //get default project type - this.model.defaultProjectType = "htmlTemplate"; + this.model.defaultProjectType = "files/html.txt"; this.model.callback = data.callback || null; this.model.callbackScope = data.callbackScope || null; @@ -112,5 +113,27 @@ var NewFileWorkflowController = exports.NewFileWorkflowController = Montage.cre saveAsDialog.popup = popup;//handle to be used for hiding the popup } + }, + + loadDescriptor:{ + value: function(descriptorPath){ + var content = null, descriptorObj=null; + var xhr = new XMLHttpRequest(); + xhr.open("GET", descriptorPath, false); + xhr.send(); + if (xhr.readyState === 4) { + if(xhr.status == 200) { + content = xhr.responseText; + } + } + if(!!content && (content.length > 0)){ + try{ + descriptorObj = JSON.parse(content); + }catch(e){ + console.log(e,stack); + } + } + return descriptorObj; + } } }); \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-workflow-model.js b/js/io/ui/new-file-dialog/new-file-workflow-model.js index bcaf8132..892dd3cf 100755 --- a/js/io/ui/new-file-dialog/new-file-workflow-model.js +++ b/js/io/ui/new-file-dialog/new-file-workflow-model.js @@ -42,105 +42,8 @@ exports.NewFileWorkflowModel = Object.create(Object.prototype, { }, projectTypeData:{ - writable:false, + writable:true, enumerable:false, - value:{//dummy data for testing - "categories":{ - "children":["newFile", "newProject", "fromTemplate"] - }, - "newProject":{ - "type":"directory", - "name":"New Project", - "uri":"newProject", - "children":["animation", "bannerAd", "montageComponent", "androidApp"] - }, - "newFile":{ - "name":"Blank Template", - "uri":"newFile", - "type":"directory", - "children":["htmlTemplate", "javascriptTemplate", "cssTemplate"] - }, - "fromTemplate":{ - "name":"From Template", - "uri":"fromTemplate", - "type":"directory", - "children":["xoomApp", "website", "iosApp"] - }, - "bannerAd":{ - "name":"Banner Ad", - "uri":"bannerAd", - "type":"file", - "children":["176x208", "176x220", "208x320", "230x240", "208x320", "230x240", "208x320", "230x240"] - }, - "animation":{ - "name":"Animation", - "uri":"animation", - "type":"file", - "children":["176x208", "176x220", "208x320", "230x240"] - }, - "montageComponent":{ - "name":"Montage Component", - "uri":"montageComponent", - "type":"file", - "children":["176x208", "176x208", "176x220", "208x320", "230x240","176x208", "176x220", "208x320", "230x240"] - }, - "androidApp":{ - "name":"Android App", - "uri":"androidApp", - "type":"file", - "children":["176x208", "176x220"] - }, - "xoomApp":{ - "name":"Xoom Application", - "uri":"xoomApp", - "type":"file", - "children":["176x208", "176x208", "176x220", "208x320", "176x220", "208x320", "230x240"] - }, - "iosApp":{ - "name":"iOS Application", - "uri":"iosApp", - "type":"file", - "children":["176x208"] - }, - "176x208":{ - "name":"176 x 208", - "uri":"176x208", - "type":"file" - }, - "176x220":{ - "name":"176 x 220", - "uri":"176x220", - "type":"file" - }, - "208x320":{ - "name":"208 x 320", - "uri":"208x320", - "type":"file" - }, - "htmlTemplate":{ - "name":"HTML", - "uri":"htmlTemplate", - "type":"file", - "children":["defaultTemplate", "xoomApp", "iosApp", "androidApp", "bannerAd"] - }, - "cssTemplate":{ - "name":"CSS", - "uri":"cssTemplate", - "type":"file", - "children":["defaultTemplate"] - }, - "javascriptTemplate":{ - "name":"JavaScript", - "uri":"javascriptTemplate", - "type":"file", - "children":["defaultTemplate"] - }, - defaultTemplate:{ - "name": "default", - "uri": "defaultTemplate", - "type":"file" - } - - } + value:{} } }); -- cgit v1.2.3 From 79b0173eeca079dec42ff1480182656dbe3af44f Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Fri, 3 Feb 2012 09:49:23 -0800 Subject: removed usage of NJUtils.js as it is being deleted. Signed-off-by: Ananya Sen --- .../new-file-options-navigator.js | 24 ++++++++++++++++++---- 1 file changed, 20 insertions(+), 4 deletions(-) (limited to 'js/io/ui/new-file-dialog') diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js index 467c5452..f17b15d5 100644 --- a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js @@ -8,8 +8,7 @@ var Montage = require("montage/core/core").Montage, Component = require("montage/ui/component").Component, iconsListModule = require("js/components/ui/icon-list-basic/iconsList.reel"), treeModule = require("js/components/ui/tree-basic/tree.reel"), - newFileLocationSelectionModule = require("js/io/ui/new-file-dialog/new-file-workflow-controller"), - nj= require("js/lib/NJUtils.js").NJUtils; + newFileLocationSelectionModule = require("js/io/ui/new-file-dialog/new-file-workflow-controller"); var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(Component, { @@ -364,7 +363,7 @@ var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(C }, isValidFileName:{ value: function(fileName){ - var status = nj.isValidFileName(fileName); + var status = this.isValidFileName(fileName); if(fileName !== ""){ if(!status){ this.showError("! Invalid file name."); @@ -391,6 +390,23 @@ var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(C this.okButton.setAttribute("disabled", "true"); } } - } + }, + + /*** + * file name validation + */ + isValidFileName:{ + value: function(fileName){ + var status = false; + if(fileName !== ""){ + fileName = fileName.replace(/^\s+|\s+$/g,""); + status = !(/[/\\]/g.test(fileName)); + if(status && navigator.userAgent.indexOf("Macintosh") != -1){//for Mac files beginning with . are hidden + status = !(/^\./g.test(fileName)); + } + } + return status; + } + } }); \ No newline at end of file -- cgit v1.2.3 From 7618cabe1945acc6392c48f3b57820f67f7973b0 Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Fri, 3 Feb 2012 10:22:26 -0800 Subject: removed using montage button, since it has changed in Montafe 0.6 Signed-off-by: Ananya Sen --- .../new-file-options-navigator.html | 30 ---------------------- .../new-file-options-navigator.js | 3 +++ 2 files changed, 3 insertions(+), 30 deletions(-) (limited to 'js/io/ui/new-file-dialog') diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html index c9178d65..58bbed30 100755 --- a/js/io/ui/new-file-dialog/new-file-options-navi