Repository: ambari Updated Branches: refs/heads/trunk 00135dff9 -> 1064ade01
AMBARI-5915. View: Files UI clean-up and adjustments (PART 2). (jaimin) Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/1064ade0 Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/1064ade0 Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/1064ade0 Branch: refs/heads/trunk Commit: 1064ade010ce05ca6e13a25d1df25bcc4290a8b9 Parents: 00135df Author: Jaimin Jetly <[email protected]> Authored: Wed May 28 16:11:45 2014 -0700 Committer: Jaimin Jetly <[email protected]> Committed: Wed May 28 16:11:45 2014 -0700 ---------------------------------------------------------------------- .../resources/ui/app/components/renameInput.js | 103 +++++++++++++++++++ .../main/resources/ui/app/controllers/files.js | 62 ++++++++--- .../src/main/resources/ui/app/initialize.js | 2 + .../src/main/resources/ui/app/models/file.js | 4 + .../src/main/resources/ui/app/routes/file.js | 21 ++-- .../resources/ui/app/styles/application.less | 26 ++++- .../main/resources/ui/app/templates/files.hbs | 6 +- .../ui/app/templates/util/errorRow.hbs | 2 +- .../ui/app/templates/util/renameInput.hbs | 38 +++++++ 9 files changed, 235 insertions(+), 29 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/1064ade0/contrib/views/files/src/main/resources/ui/app/components/renameInput.js ---------------------------------------------------------------------- diff --git a/contrib/views/files/src/main/resources/ui/app/components/renameInput.js b/contrib/views/files/src/main/resources/ui/app/components/renameInput.js new file mode 100644 index 0000000..9a826a4 --- /dev/null +++ b/contrib/views/files/src/main/resources/ui/app/components/renameInput.js @@ -0,0 +1,103 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + + +var App = require('app'); + +App.RenameInputComponent = Ember.Component.extend({ + tagName:'span', + layoutName:'util/renameInput', + actions:{ + rename:function (opt) { + var target, tmpName; + + switch (opt) { + case 'edit': this.set('isRenaming',true); break; + case 'cancel': this.set('isRenaming',false); break; + case 'confirm': + tmpName = this.get('tmpName'); + if (tmpName.length==0) { + break; + }; + target = this.get('targetObject'); + target.send(this.get('actionName'),this.get('filePath'),tmpName); + this.set('isRenaming',false); + break; + + default: this.toggleProperty('isRenaming'); + } + }, + }, + + /** + * passed params + */ + file:null, + actionName:null, + isRenaming:false, + + fileName:function () { + var name, file = this.get('file'); + if (file instanceof DS.Model) { + name = this.get('file.name'); + } else { + name = file.substr(file.lastIndexOf('/')+1); + }; + return name; + }.property('file'), + + filePath:function () { + var path, file = this.get('file'); + if (file instanceof DS.Model) { + path = this.get('file.path'); + } else { + path = file; + }; + return path; + }.property('file'), + + setTmpName:function () { + if (this.get('isRenaming')) { + this.set('tmpName',this.get('fileName')); + } else { + this.set('tmpName',''); + }; + }.observes('isRenaming'), + + onFileChange:function () { + this.set('isRenaming',false); + }.observes('file'), + + renameInputView: Em.TextField.extend({ + controller:null, + didInsertElement:function () { + var element = $(this.get('element')); + element.focus().val(this.value) + }, + keyUp: function(e) { + var target = this.get('targetObject'); + if (e.keyCode==13) { + return target.send('rename', 'confirm'); + }; + + if (e.keyCode==27) { + return target.send('rename', 'cancel'); + }; + } + }) +}); http://git-wip-us.apache.org/repos/asf/ambari/blob/1064ade0/contrib/views/files/src/main/resources/ui/app/controllers/files.js ---------------------------------------------------------------------- diff --git a/contrib/views/files/src/main/resources/ui/app/controllers/files.js b/contrib/views/files/src/main/resources/ui/app/controllers/files.js index 81d703a..11b7c0c 100644 --- a/contrib/views/files/src/main/resources/ui/app/controllers/files.js +++ b/contrib/views/files/src/main/resources/ui/app/controllers/files.js @@ -43,6 +43,36 @@ App.FilesController = Ember.ArrayController.extend({ this.set('movingFile',null); }; }, + showRenameInput:function () { + this.toggleProperty('isRenaming'); + }, + renameDir:function (path,newName) { + var self = this, + basedir = path.substring(0,path.lastIndexOf('/')+1); + newPath = basedir + newName; + + if (path === newPath) { + return false; + }; + + this.store.listdir(basedir).then(function (listdir) { + var recordExists = listdir.isAny('id',newPath); + + listdir.forEach(function (file) { + self.store.unloadRecord(file); + }); + + if (recordExists) { + return self.send('showAlert',{message:newPath + ' already exists.'}); + }; + + self.store.move(path,newPath).then(function (newDir) { + self.store.unloadRecord(newDir); + self.set('path',newPath); + }); + }); + + }, deleteFile:function () { var self = this; var selected = this.get('selectedFiles'); @@ -118,12 +148,14 @@ App.FilesController = Ember.ArrayController.extend({ needs: ["file"], movingFile:null, uploader:App.Uploader, + isRenaming:false, isRemoving:false, isMkdir:false, isUploading:false, newDirName:'', queryParams: ['path'], path: '/', + isRootDir:Ember.computed.equal('path', '/'), hideMoving:function () { return (this.movingFile)?[this.path,this.movingFile.name].join('/').replace('//','/')===this.movingFile.path:false; }.property('movingFile','path'), @@ -131,23 +163,25 @@ App.FilesController = Ember.ArrayController.extend({ var splitpath = this.get('path').split('/'); return splitpath.get(splitpath.length-1) || '/'; }.property('path'), - selectedOne:function () { - return this.get('selectedFiles.length') == 1; - }.property('selectedFiles'), - isSelected:function () { - return this.get('selectedFiles.length') > 0; - }.property('selectedFiles'), - selectedFiles:function () { - return this.get('content').filterProperty('selected',true); - }.property('[email protected]'), + selectedOne:Ember.computed.equal('selectedFiles.length', 1), + isSelected:Ember.computed.gt('selectedFiles.length', 0), + selectedFiles:Ember.computed.filterBy('content', 'selected', true), canConcat:function () { return this.get('selectedFiles').filterProperty('isDirectory').get('length')==0; - }.property('selectedFiles'), - fileList:function () { - return this.get('arrangedContent'); - }.property('arrangedContent') + }.property('selectedFiles.length'), + + fileList: Ember.computed.alias('arrangedContent') }); App.FilesAlertController = Em.ObjectController.extend({ - content:null + content:null, + output:function () { + var error = this.get('content'),output; + if (error instanceof Em.Error) { + output = error; + } else { + output = {status:error.status, message:error.statusText||error.message}; + }; + return output; + }.property('content') }); http://git-wip-us.apache.org/repos/asf/ambari/blob/1064ade0/contrib/views/files/src/main/resources/ui/app/initialize.js ---------------------------------------------------------------------- diff --git a/contrib/views/files/src/main/resources/ui/app/initialize.js b/contrib/views/files/src/main/resources/ui/app/initialize.js index 8697d76..1421a5a 100644 --- a/contrib/views/files/src/main/resources/ui/app/initialize.js +++ b/contrib/views/files/src/main/resources/ui/app/initialize.js @@ -35,6 +35,7 @@ require('templates/util/uploader'); require('templates/util/contextMenu'); require('templates/util/deleteBulk'); require('templates/util/errorRow'); +require('templates/util/renameInput'); ////////////////////////////////// // Models @@ -55,6 +56,7 @@ require('controllers/file'); require('components/uploader'); require('components/contextMenu'); +require('components/renameInput'); ///////////////////////////////// // Views http://git-wip-us.apache.org/repos/asf/ambari/blob/1064ade0/contrib/views/files/src/main/resources/ui/app/models/file.js ---------------------------------------------------------------------- diff --git a/contrib/views/files/src/main/resources/ui/app/models/file.js b/contrib/views/files/src/main/resources/ui/app/models/file.js index 9b63f2b..6908f44 100644 --- a/contrib/views/files/src/main/resources/ui/app/models/file.js +++ b/contrib/views/files/src/main/resources/ui/app/models/file.js @@ -24,6 +24,10 @@ App.File = DS.Model.extend({ path: function() { return this.get('id'); }.property('id'), + basedir:function () { + var path = this.get('id'); + return path.substring(0,path.lastIndexOf('/'))||'/'; + }.property('id'), isDirectory: a('boolean'), len: a('number'), owner: a('string'), http://git-wip-us.apache.org/repos/asf/ambari/blob/1064ade0/contrib/views/files/src/main/resources/ui/app/routes/file.js ---------------------------------------------------------------------- diff --git a/contrib/views/files/src/main/resources/ui/app/routes/file.js b/contrib/views/files/src/main/resources/ui/app/routes/file.js index bad821c..afe98a8 100644 --- a/contrib/views/files/src/main/resources/ui/app/routes/file.js +++ b/contrib/views/files/src/main/resources/ui/app/routes/file.js @@ -27,12 +27,7 @@ App.FilesRoute = Em.Route.extend({ actions:{ error:function (error,transition,e) { if (this.router._lookupActiveView('files')) { - this.controllerFor('filesAlert').set('content',error); - this.render('files.alert',{ - into:'files', - outlet:'error', - controller:'filesAlert' - }); + this.send('showAlert',error); } else { return true; }; @@ -46,6 +41,14 @@ App.FilesRoute = Em.Route.extend({ willTransition:function (argument) { this.send('removeAlert'); }, + showAlert:function (error) { + this.controllerFor('filesAlert').set('content',error); + this.render('files.alert',{ + into:'files', + outlet:'error', + controller:'filesAlert' + }); + }, removeAlert:function () { this.disconnectOutlet({ outlet: 'error', @@ -69,11 +72,5 @@ App.FilesRoute = Em.Route.extend({ file.store.unloadRecord(file); }) }); - }, - setupController:function (controller,model,transition) { - controller.set('model', model); - }, - renderTemplate:function (q,w,e) { - this.render('files'); } }); http://git-wip-us.apache.org/repos/asf/ambari/blob/1064ade0/contrib/views/files/src/main/resources/ui/app/styles/application.less ---------------------------------------------------------------------- diff --git a/contrib/views/files/src/main/resources/ui/app/styles/application.less b/contrib/views/files/src/main/resources/ui/app/styles/application.less index fa1db60..6242bc5 100644 --- a/contrib/views/files/src/main/resources/ui/app/styles/application.less +++ b/contrib/views/files/src/main/resources/ui/app/styles/application.less @@ -67,6 +67,7 @@ .panel-body { .i-am-in { margin: 0; + width: 80%; } } @@ -296,4 +297,27 @@ margin: -4px 0; } - +.renameable { + display: inline-block; + &.half { + width: 50%; + } + &.stocked { + margin-top: -12px; + margin-bottom: -12px; + } + .form-control { + font-size: 14px; + } + .mod-time{ + margin: 0; + } + .file-name { + margin-top: -5px; + margin-bottom: -5px; + } + .btn-rename-cancel { + border-radius: 0 !important; + margin-left: -1px; + } +} http://git-wip-us.apache.org/repos/asf/ambari/blob/1064ade0/contrib/views/files/src/main/resources/ui/app/templates/files.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/files/src/main/resources/ui/app/templates/files.hbs b/contrib/views/files/src/main/resources/ui/app/templates/files.hbs index ba5b573..8b4cff0 100644 --- a/contrib/views/files/src/main/resources/ui/app/templates/files.hbs +++ b/contrib/views/files/src/main/resources/ui/app/templates/files.hbs @@ -60,7 +60,11 @@ </div> <div class="panel-body"> - <h4 class="i-am-in pull-left" > <i class="fa fa-folder fa-lg"></i> {{currentDir}}</h4> + <h4 class="i-am-in pull-left"> <i class="fa fa-folder fa-lg"></i> + {{#rename-input file=path actionName='renameDir' isRenaming=isRenaming class='renameable stocked half'}} + {{currentDir}} <a href="#" {{bind-attr class="isRootDir:hide"}} {{action showRenameInput}}><i class="fa fa-edit"></i></a> + {{/rename-input}} + </h4> <div class="btn-group btn-sort pull-right" data-toggle="tooltip" data-placement="left" title="Sort by:"> <button type="button" class="btn btn-xs btn-default" {{action sort 'toggle'}}> http://git-wip-us.apache.org/repos/asf/ambari/blob/1064ade0/contrib/views/files/src/main/resources/ui/app/templates/util/errorRow.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/files/src/main/resources/ui/app/templates/util/errorRow.hbs b/contrib/views/files/src/main/resources/ui/app/templates/util/errorRow.hbs index 828517a..443c99f 100644 --- a/contrib/views/files/src/main/resources/ui/app/templates/util/errorRow.hbs +++ b/contrib/views/files/src/main/resources/ui/app/templates/util/errorRow.hbs @@ -18,7 +18,7 @@ <div class="text-center"> <button {{action 'removeAlert'}} type="button" class="close" aria-hidden="true">×</button> - <strong>{{content.status}} </strong> {{content.statusText}} + <strong>{{output.status}} </strong> {{output.message}} </div> http://git-wip-us.apache.org/repos/asf/ambari/blob/1064ade0/contrib/views/files/src/main/resources/ui/app/templates/util/renameInput.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/files/src/main/resources/ui/app/templates/util/renameInput.hbs b/contrib/views/files/src/main/resources/ui/app/templates/util/renameInput.hbs new file mode 100644 index 0000000..57a7b7c --- /dev/null +++ b/contrib/views/files/src/main/resources/ui/app/templates/util/renameInput.hbs @@ -0,0 +1,38 @@ +{{! + Licensed to the Apache Software Foundation (ASF) under one + or more contributor license agreements. See the NOTICE file + distributed with this work for additional information + regarding copyright ownership. The ASF licenses this file + to you under the Apache License, Version 2.0 (the + "License"); you may not use this file except in compliance + with the License. You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +}} +{{#if isRenaming}} + +<div class="input-group input-group-sm rename-area"> + {{view view.renameInputView class="form-control rename-input" valueBinding='tmpName'}} + <div class="input-group-btn"> + <button type="button" {{action 'rename' 'cancel'}} {{bind-attr class=":btn :btn-danger :btn-xs :btn-rename-cancel isRenaming:show"}} > + <i class="fa fa-times"></i> Cancel + </button> + </div> + <div class="input-group-btn"> + <button type="button" {{action 'rename' 'confirm'}} {{bind-attr class=":btn :btn-success :btn-xs :btn-rename isRenaming:show"}} > + <i class="fa fa-check"></i> Rename + </button> + </div> +</div> + +{{else}} + + {{yield}} + +{{/if}}
