summaryrefslogtreecommitdiffstats
path: root/client/components
diff options
context:
space:
mode:
Diffstat (limited to 'client/components')
-rw-r--r--client/components/boards/boardBody.styl1
-rw-r--r--client/components/lists/main.styl35
-rw-r--r--client/components/main/header.styl12
-rw-r--r--client/components/main/layouts.jade7
-rw-r--r--client/components/main/popup.js13
-rw-r--r--client/components/main/popup.styl23
-rw-r--r--client/components/main/popup.tpl.jade5
-rw-r--r--client/components/main/templates.html2
-rw-r--r--client/components/sidebar/sidebarFilters.js4
-rw-r--r--client/components/users/router.js10
-rw-r--r--client/components/users/userForm.styl93
-rw-r--r--client/components/users/userHeader.jade35
-rw-r--r--client/components/users/userHeader.js73
13 files changed, 197 insertions, 116 deletions
diff --git a/client/components/boards/boardBody.styl b/client/components/boards/boardBody.styl
index 70d8f3d6..281199e2 100644
--- a/client/components/boards/boardBody.styl
+++ b/client/components/boards/boardBody.styl
@@ -21,6 +21,7 @@
&.is-dragging-active
+ .list-composer,
.open-minicard-composer
display: none
diff --git a/client/components/lists/main.styl b/client/components/lists/main.styl
index 2ff2ef5f..98b4abf4 100644
--- a/client/components/lists/main.styl
+++ b/client/components/lists/main.styl
@@ -103,25 +103,22 @@
.ps-scrollbar-y-rail
transform: translateX(2px)
-.open-minicard-composer
- border-radius: 2px
- color: #8c8c8c
- display: block
- padding: 7px 10px
- position: relative
- text-decoration: none
- animation: fadeIn 0.3s
-
- i.fa
- margin-right: 7px
-
- &:hover
- background: white
- color: #222
- box-shadow: 0 1px 2px rgba(0,0,0,.2)
-
- &::selection
- background: transparent
+ .open-minicard-composer
+ border-radius: 2px
+ color: #8c8c8c
+ display: block
+ padding: 7px 10px
+ position: relative
+ text-decoration: none
+ animation: fadeIn 0.3s
+
+ i.fa
+ margin-right: 7px
+
+ &:hover
+ background: #fafafa
+ color: #222
+ box-shadow: 0 1px 2px rgba(0,0,0,.2)
@keyframes fadeIn
from
diff --git a/client/components/main/header.styl b/client/components/main/header.styl
index 8e1682eb..e6f13239 100644
--- a/client/components/main/header.styl
+++ b/client/components/main/header.styl
@@ -47,12 +47,14 @@
#header-user-bar
margin: 2px 0
- .member
- width: 24px
- height: @width
+ .header-user-bar-avatar
float: left
- margin: 0
- margin-top: 1px
+
+ .member
+ width: 24px
+ height: @width
+ margin: 0
+ margin-top: 1px
.header-user-bar-name
margin: 4px 8px 0 0
diff --git a/client/components/main/layouts.jade b/client/components/main/layouts.jade
index 18df4d9e..d1ea36b5 100644
--- a/client/components/main/layouts.jade
+++ b/client/components/main/layouts.jade
@@ -5,9 +5,10 @@ head
link(rel="shortcut icon" href="/favicon.png")
template(name="userFormsLayout")
- h1.at-form-landing-logo
- img(src="/logo.png" title="LibreBoard")
- +yield
+ section.auth-layout
+ h1.at-form-landing-logo
+ img(src="/logo.png" title="LibreBoard")
+ +yield
template(name="defaultLayout")
#surface
diff --git a/client/components/main/popup.js b/client/components/main/popup.js
index 48847525..8672d08a 100644
--- a/client/components/main/popup.js
+++ b/client/components/main/popup.js
@@ -31,6 +31,19 @@ Popup.template.events({
},
'click .js-confirm': function() {
this.__afterConfirmAction.call(this);
+ },
+ // This handler intends to solve a pretty tricky bug with our popup
+ // transition. The transition is implemented using a large container
+ // (.content-container) that is moved on the x-axis (from 0 to n*PopupSize)
+ // inside a wrapper (.container-wrapper) with a hidden overflow. The problem
+ // is that sometimes the wrapper is scrolled -- even if there are no
+ // scrollbars. This happen for instance when the newly opened popup has some
+ // focused field, the browser will automatically scroll the wrapper, resulting
+ // in moving the whole popup container outside of the popup wrapper. To
+ // disable this behavior we have to manually reset the scrollLeft position
+ // whenever it is modified.
+ 'scroll .content-wrapper': function(evt) {
+ evt.currentTarget.scrollLeft = 0;
}
});
diff --git a/client/components/main/popup.styl b/client/components/main/popup.styl
index cf1fd46e..43b0dae7 100644
--- a/client/components/main/popup.styl
+++ b/client/components/main/popup.styl
@@ -6,8 +6,6 @@
border: 1px solid #dbdbdb
border-bottom-color: #c2c2c2
box-shadow: 0 1px 6px rgba(0, 0, 0, .3)
- display: none
- overflow: hidden
position: absolute
width: 300px
z-index: 99999
@@ -20,12 +18,10 @@
input[type="text"],
input[type="email"],
input[type="password"]
+ input[type="file"]
margin: 4px 0 12px
width: 100%
- input[type="file"]
- width: 240px
-
select
width: 100%
margin-bottom: 14px
@@ -35,9 +31,6 @@
margin: 4px 0 12px
width: 100%
- img
- max-width: 270px
-
.header
height: 36px
position: relative
@@ -80,6 +73,7 @@
.content-wrapper
width: 100%
+ overflow: hidden
.content-container
width: 5000px
@@ -92,7 +86,7 @@
float: left
&.no-height
- height: 0
+ height: 20px
.quiet
padding: 6px 6px 4px
@@ -113,6 +107,17 @@
height: 4px
width: 4px
+ .at-form
+ .at-error, .at-result
+ padding: 8px 12px
+ margin: -8px -10px 10px
+
+ .at-error
+ background: #ef9a9a
+
+ .at-result
+ background: #b2dfdb
+
.select-members-list
margin-bottom: 8px
diff --git a/client/components/main/popup.tpl.jade b/client/components/main/popup.tpl.jade
index dade8449..be528f46 100644
--- a/client/components/main/popup.tpl.jade
+++ b/client/components/main/popup.tpl.jade
@@ -1,8 +1,8 @@
-.pop-over.clearfix(
+.pop-over(
class="{{#unless title}}miniprofile{{/unless}}"
class=currentBoard.colorClass
class="{{#unless title}}no-title{{/unless}}"
- style="display:block; left:{{offset.left}}px; top:{{offset.top}}px;")
+ style="left:{{offset.left}}px; top:{{offset.top}}px;")
.header
a.back-btn.js-back-view(class="{{#unless hasPopupParent}}is-hidden{{/unless}}")
i.fa.fa-chevron-left
@@ -20,3 +20,4 @@
Hopefully the @last helper will come soon (or at least @index)
.content(class="{{#unless $eq popupName ../popupName}}no-height{{/unless}}")
+Template.dynamic(template=popupName data=dataContext)
+ .clearfix
diff --git a/client/components/main/templates.html b/client/components/main/templates.html
index 4828663a..c252f1e4 100644
--- a/client/components/main/templates.html
+++ b/client/components/main/templates.html
@@ -5,7 +5,7 @@
<template name='message'>
<div class="big-message quiet {{ color }}">
<h1>{{_ label}}</h1>
- {{#with pathFor route='Login'}}
+ {{#with pathFor route='atSignIn'}}
<p>{{{_ 'page-maybe-private' this}}}</p>
{{/with}}
</div>
diff --git a/client/components/sidebar/sidebarFilters.js b/client/components/sidebar/sidebarFilters.js
index df0db529..42b6e185 100644
--- a/client/components/sidebar/sidebarFilters.js
+++ b/client/components/sidebar/sidebarFilters.js
@@ -6,12 +6,12 @@ BlazeComponent.extendComponent({
events: function() {
return [{
'click .js-toggle-label-filter': function(event) {
- Filter.labelIds.toogle(this._id);
+ Filter.labelIds.toogle(this.currentData()._id);
Filter.resetExceptions();
event.preventDefault();
},
'click .js-toogle-member-filter': function(event) {
- Filter.members.toogle(this._id);
+ Filter.members.toogle(this.currentData()._id);
Filter.resetExceptions();
event.preventDefault();
},
diff --git a/client/components/users/router.js b/client/components/users/router.js
index 6c4ab3b6..6c3b3429 100644
--- a/client/components/users/router.js
+++ b/client/components/users/router.js
@@ -1,5 +1,5 @@
-_.each(['signIn', 'signUp', 'resetPwd',
- 'forgotPwd', 'enrollAccount', 'changePwd'], function(routeName) {
+_.each(['signIn', 'signUp', 'resetPwd', 'forgotPwd', 'enrollAccount'],
+ function(routeName) {
AccountsTemplates.configureRoute(routeName, {
layoutTemplate: 'userFormsLayout'
});
@@ -20,9 +20,3 @@ Router.route('/profile/:username', {
};
}
});
-
-Router.route('/settings', {
- name: 'Settings',
- template: 'settings',
- layoutTemplate: 'AuthLayout'
-});
diff --git a/client/components/users/userForm.styl b/client/components/users/userForm.styl
index 5ecef7aa..2117bfcb 100644
--- a/client/components/users/userForm.styl
+++ b/client/components/users/userForm.styl
@@ -1,49 +1,50 @@
-.at-form-landing-logo
- width: 275px
- margin: auto
- margin-top: 50px
- margin-top: 17vh
-
- img
+.auth-layout
+ .at-form-landing-logo
width: 275px
+ margin: auto
+ margin-top: 50px
+ margin-top: 17vh
+
+ img
+ width: 275px
-.at-form
- margin: auto
- width: 275px
- padding: 25px
- margin-top: 20px
- padding-bottom: 10px
- background: #fff
- border-radius: 3px
- border: 1px solid #dbdbdb
- border-bottom-color: #c2c2c2
- box-shadow: 0 1px 6px rgba(0, 0, 0, .3)
-
- .at-link
- color: darken(#27AE60, 40%)
-
- label
- margin-bottom: 3px
-
- input
- width: 100%
-
- .at-title
- background: #F7F7F7
- margin: -25px
- padding: 15px 25px 5px
- margin-bottom: 20px
- border-bottom: 1px solid #dcdcdc
- color: darken(white, 70%)
- font-weight: bold
-
- .at-signup-link,
- .at-signin-link,
- .at-forgotPwd
- font-size: 0.9em
- margin-top: 15px
- color: darken(white, 70%)
-
- .at-signUp,
- .at-signIn
+ .at-form
+ margin: auto
+ width: 275px
+ padding: 25px
+ margin-top: 20px
+ padding-bottom: 10px
+ background: #fff
+ border-radius: 3px
+ border: 1px solid #dbdbdb
+ border-bottom-color: #c2c2c2
+ box-shadow: 0 1px 6px rgba(0, 0, 0, .3)
+
+ .at-link
+ color: darken(#27AE60, 40%)
+
+ label
+ margin-bottom: 3px
+
+ input
+ width: 100%
+
+ .at-title
+ background: #F7F7F7
+ margin: -25px
+ padding: 15px 25px 5px
+ margin-bottom: 20px
+ border-bottom: 1px solid #dcdcdc
+ color: darken(white, 70%)
font-weight: bold
+
+ .at-signup-link,
+ .at-signin-link,
+ .at-forgotPwd
+ font-size: 0.9em
+ margin-top: 15px
+ color: darken(white, 70%)
+
+ .at-signUp,
+ .at-signIn
+ font-weight: bold
diff --git a/client/components/users/userHeader.jade b/client/components/users/userHeader.jade
index eb3d265c..b8201cb6 100644
--- a/client/components/users/userHeader.jade
+++ b/client/components/users/userHeader.jade
@@ -1,23 +1,44 @@
template(name="headerUserBar")
- a#header-user-bar.js-open-header-member-menu
- .header-user-bar-name
+ a#header-user-bar
+ .header-user-bar-name.js-open-header-member-menu
i.fa.fa-chevron-down
if currentUser.profile.name
= currentUser.profile.name
else
= currentUser.username
- +userAvatar(user=currentUser)
+ .header-user-bar-avatar.js-change-avatar
+ +userAvatar(user=currentUser)
template(name="memberMenuPopup")
ul.pop-over-list
- li: a(href="{{pathFor route='Profile' username=currentUser.username}}") {{_ 'profile'}}
- li: a.js-language {{_ 'language'}}
- li: a(href = "{{pathFor route='Settings'}}") {{_ 'settings'}}
+ with currentUser
+ li: a.js-edit-profile Edit Profile…
+ li: a.js-change-avatar Change Avatar…
+ li: a.js-change-password Change Password…
+ li: a.js-change-language Change Language…
hr
ul.pop-over-list
li: a.js-logout {{_ 'log-out'}}
-template(name="setLanguagePopup")
+template(name="editProfilePopup")
+ form
+ label
+ | {{_ "fullname"}}
+ input.js-profile-fullname(type="text" value=profile.name autofocus)
+ label
+ | {{_ "username"}}
+ input.js-profile-username(type="text" value=username)
+ label
+ | Initials
+ input.js-profile-initials(type="text" value=profile.initials)
+ input.primary.wide(type="submit" value="{{_ 'save'}}")
+
+template(name="changeAvatarPopup")
+
+template(name="changePasswordPopup")
+ +atForm(state='changePwd')
+
+template(name="changeLanguagePopup")
ul.pop-over-list
each languages
li(class="{{# if isCurrentLanguage}}active{{/if}}")
diff --git a/client/components/users/userHeader.js b/client/components/users/userHeader.js
index 3bb9e623..234bf9e3 100644
--- a/client/components/users/userHeader.js
+++ b/client/components/users/userHeader.js
@@ -1,8 +1,64 @@
Template.headerUserBar.events({
- 'click .js-open-header-member-menu': Popup.open('memberMenu')
+ 'click .js-open-header-member-menu': Popup.open('memberMenu'),
+ 'click .js-change-avatar': Popup.open('changeAvatar')
});
-Template.setLanguagePopup.helpers({
+Template.memberMenuPopup.events({
+ 'click .js-edit-profile': Popup.open('editProfile'),
+ 'click .js-change-avatar': Popup.open('changeAvatar'),
+ 'click .js-change-password': Popup.open('changePassword'),
+ 'click .js-change-language': Popup.open('changeLanguage'),
+ 'click .js-logout': function(evt) {
+ evt.preventDefault();
+
+ AccountsTemplates.logout();
+ }
+});
+
+Template.editProfilePopup.events({
+ submit: function(evt, tpl) {
+ evt.preventDefault();
+ var fullname = $.trim(tpl.find('.js-profile-fullname').value);
+ var username = $.trim(tpl.find('.js-profile-username').value);
+ var initials = $.trim(tpl.find('.js-profile-initials').value);
+ Users.update(Meteor.userId(), {$set: {
+ 'profile.fullname': fullname,
+ 'profile.initials': initials
+ }});
+ // XXX We should report the error to the user.
+ if (username !== Meteor.user().username) {
+ Meteor.call('setUsername', username);
+ }
+ Popup.back();
+ }
+});
+
+// We display the form to change the password in a popup window that already
+// have a title, so we unset the title automatically displayed by useraccounts.
+AccountsTemplates.configure({
+ texts: {
+ title: {
+ changePwd: ''
+ }
+ }
+});
+
+AccountsTemplates.configureRoute('changePwd', {
+ redirect: function() {
+ // XXX We should emit a notification once we have a notification system.
+ // Currently the user has no indication that his modification has been
+ // applied.
+ Popup.back();
+ }
+});
+
+// XXX For some reason the useraccounts autofocus isnt working in this case.
+// See https://github.com/meteor-useraccounts/core/issues/384
+Template.changePasswordPopup.onRendered(function() {
+ this.find('#at-field-current_password').focus();
+});
+
+Template.changeLanguagePopup.helpers({
languages: function() {
return _.map(TAPi18n.getLanguages(), function(lang, tag) {
return {
@@ -16,18 +72,7 @@ Template.setLanguagePopup.helpers({
}
});
-Template.memberMenuPopup.events({
- 'click .js-language': Popup.open('setLanguage'),
- 'click .js-logout': function(evt) {
- evt.preventDefault();
-
- Meteor.logout(function() {
- Router.go('Home');
- });
- }
-});
-
-Template.setLanguagePopup.events({
+Template.changeLanguagePopup.events({
'click .js-set-language': function(evt) {
Users.update(Meteor.userId(), {
$set: {
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-10-31 13:33:12 +0000