From e34ea468b205836271e9da869990ed839159e72a Mon Sep 17 00:00:00 2001 From: Harvey Kandola Date: Thu, 30 Jun 2016 15:34:01 -0700 Subject: [PATCH] profile UX --- app/app/components/layout/zone-navigation.js | 14 +- app/app/pods/profile/route.js | 4 +- app/app/pods/profile/template.hbs | 86 +++++++----- app/app/styles/view/layout.scss | 4 +- app/app/styles/view/page-documents.scss | 4 - app/app/styles/view/page-folder-settings.scss | 3 - app/app/styles/view/page-profile.scss | 0 .../components/folder/folders-list.hbs | 127 +++++++++--------- .../components/layout/zone-navigation.hbs | 4 +- 9 files changed, 128 insertions(+), 118 deletions(-) create mode 100644 app/app/styles/view/page-profile.scss diff --git a/app/app/components/layout/zone-navigation.js b/app/app/components/layout/zone-navigation.js index 5602844a..0c7acc0e 100644 --- a/app/app/components/layout/zone-navigation.js +++ b/app/app/components/layout/zone-navigation.js @@ -13,12 +13,8 @@ import Ember from 'ember'; import netUtil from '../../utils/net'; export default Ember.Component.extend({ - dashboardMode: false, - searchMode: false, - profileMode: false, - settingsMode: false, - folderMode: false, - documentMode: false, + folderService: Ember.inject.service('folder'), + folder: null, didInitAttrs() { let self = this; @@ -29,6 +25,12 @@ export default Ember.Component.extend({ } }, + didReceiveAttrs() { + if (this.get('folder') === null) { + this.set("folder", this.get('folderService.currentFolder')); + } + }, + actions: { switchAccount(domain) { this.audit.record('switched-account'); diff --git a/app/app/pods/profile/route.js b/app/app/pods/profile/route.js index f6dc5b21..851ac21f 100644 --- a/app/app/pods/profile/route.js +++ b/app/app/pods/profile/route.js @@ -2,6 +2,7 @@ import Ember from 'ember'; export default Ember.Route.extend({ userService: Ember.inject.service('user'), + folderService: Ember.inject.service('folder'), beforeModel: function() { if (!this.session.authenticated) { @@ -19,7 +20,6 @@ export default Ember.Route.extend({ setupController(controller, model) { controller.set('model', model); - let fullname = model.get('fullname'); - controller.set('message', `Profile for ${fullname}`); + controller.set("folder", this.get('folderService.currentFolder')); } }); diff --git a/app/app/pods/profile/template.hbs b/app/app/pods/profile/template.hbs index 62860e4f..af3f6b5d 100644 --- a/app/app/pods/profile/template.hbs +++ b/app/app/pods/profile/template.hbs @@ -1,38 +1,52 @@ -{{#header/page-navigation profileMode=true}} - {{header/message-box message="Manage your profile"}} -{{/header/page-navigation}} +{{#layout/zone-container}} -{{#layout/page-container}} - {{#layout/page-sidebar}} + {{layout/zone-navigation}} + + {{#layout/zone-header title=session.user.fullname message="Your Documize profile"}} +
+ {{#link-to 'folders.folder' folder.id folder.slug}} +
+ arrow_back +
home
+
+ {{/link-to}} +
+ {{/layout/zone-header}} + + {{#layout/zone-sidebar}} +
{{session.user.initials}}
- {{/layout/page-sidebar}} - {{#layout/page-content}} -
-
-
- - {{focus-input id="firstname" type="text" value=model.firstname}} -
-
- - {{input id="lastname" type="text" value=model.lastname}} -
-
- - {{input id="email" type="text" value=model.email}} -
-
- -
Optional change your password
- {{input id="password" type="password" value=password.password}} -
-
- -
Confirm your new password
- {{input id="confirmPassword" type="password" value=password.confirmation}} -
-
save
-
-
- {{/layout/page-content}} -{{/layout/page-container}} +
+ {{/layout/zone-sidebar}} + + {{#layout/zone-content}} +
+
+
+ + {{focus-input id="firstname" type="text" value=model.firstname}} +
+
+ + {{input id="lastname" type="text" value=model.lastname}} +
+
+ + {{input id="email" type="text" value=model.email}} +
+
+ +
Optional change your password
+ {{input id="password" type="password" value=password.password}} +
+
+ +
Confirm your new password
+ {{input id="confirmPassword" type="password" value=password.confirmation}} +
+
save
+
+
+ {{/layout/zone-content}} + +{{/layout/zone-container}} diff --git a/app/app/styles/view/layout.scss b/app/app/styles/view/layout.scss index e8df14a1..fdd91163 100644 --- a/app/app/styles/view/layout.scss +++ b/app/app/styles/view/layout.scss @@ -133,7 +133,7 @@ } .zone-sidebar { - height:100%; + height: 100%; min-height:100%; padding: 0 0 0 40px; border-right: 1px solid $color-border; @@ -141,6 +141,6 @@ } .zone-content { - padding: 0 40px 0 40px; + padding: 30px 40px 30px 40px; float: left; } diff --git a/app/app/styles/view/page-documents.scss b/app/app/styles/view/page-documents.scss index 46631231..1c6f4248 100644 --- a/app/app/styles/view/page-documents.scss +++ b/app/app/styles/view/page-documents.scss @@ -1,7 +1,5 @@ .folders-list { - margin: 30px 0; - > .add-space-action { text-align: center; margin-bottom: 30px; @@ -53,8 +51,6 @@ } .documents-list { - margin: 15px 0; - > .document { margin: 0; padding: 20px 20px 25px 20px; diff --git a/app/app/styles/view/page-folder-settings.scss b/app/app/styles/view/page-folder-settings.scss index 7fd7502d..e69de29b 100644 --- a/app/app/styles/view/page-folder-settings.scss +++ b/app/app/styles/view/page-folder-settings.scss @@ -1,3 +0,0 @@ -.folder-settings { - margin-top: 30px; -} diff --git a/app/app/styles/view/page-profile.scss b/app/app/styles/view/page-profile.scss new file mode 100644 index 00000000..e69de29b diff --git a/app/app/templates/components/folder/folders-list.hbs b/app/app/templates/components/folder/folders-list.hbs index 78952711..10c9fb12 100644 --- a/app/app/templates/components/folder/folders-list.hbs +++ b/app/app/templates/components/folder/folders-list.hbs @@ -1,69 +1,70 @@ +
+
-
- - {{#if session.isEditor}} - - - diff --git a/app/app/templates/components/layout/zone-navigation.hbs b/app/app/templates/components/layout/zone-navigation.hbs index dc402fee..6d7345f2 100644 --- a/app/app/templates/components/layout/zone-navigation.hbs +++ b/app/app/templates/components/layout/zone-navigation.hbs @@ -6,13 +6,13 @@ apps
{{else}} - {{#link-to 'folders.folder' title=session.appMeta.title}} + {{#link-to 'folders.folder' folder.id folder.slug title=session.appMeta.title}}
apps
{{/link-to}} {{/if}} - {{#link-to 'folders.folder' class="title"}} + {{#link-to 'folders.folder' folder.id folder.slug class="title"}}
{{session.appMeta.title}}
{{/link-to}}