rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

simplified and separate sign in/register flow

Browse Source
This commit is contained in:
Mo Bitar
2017-05-05 20:40:20 -05:00
parent 776f6adbfe
commit 5937675668
6 changed files with 92 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
app/assets/javascripts/app/services/directives/views/accountMenu.js
View File

@@ -78,10 +78,17 @@ class AccountMenu {
}); });
}) })
}) })
} }
$scope.loginSubmitPressed = function() { $scope.submitAuthForm = function() {
if($scope.formData.showLogin) {
$scope.login();
} else {
$scope.register();
}
}
$scope.login = function() {
$scope.formData.status = "Generating Login Keys..."; $scope.formData.status = "Generating Login Keys...";
$timeout(function(){ $timeout(function(){
authManager.login($scope.formData.url, $scope.formData.email, $scope.formData.user_password, function(response){ authManager.login($scope.formData.url, $scope.formData.email, $scope.formData.user_password, function(response){
@@ -98,12 +105,8 @@ class AccountMenu {
}) })
} }
$scope.submitRegistrationForm = function() { $scope.register = function() {
$scope.formData.confirmPassword = true; let confirmation = $scope.formData.password_conf;
}
$scope.submitPasswordConfirmation = function() {
let confirmation = $scope.formData.pw_confirmation;
if(confirmation !== $scope.formData.user_password) { if(confirmation !== $scope.formData.user_password) {
alert("The two passwords you entered do not match. Please try again."); alert("The two passwords you entered do not match. Please try again.");
return; return;

4
app/assets/stylesheets/app/_standard.scss
View File

@@ -78,6 +78,10 @@
padding-bottom: 0px !important; padding-bottom: 0px !important;
} }
.pt-5 {
padding-top: 5px;
}
.faded { .faded {
opacity: 0.5; opacity: 0.5;
} }

57
app/assets/stylesheets/app/_mostrap.scss → app/assets/stylesheets/app/_ui.scss
View File

@@ -63,32 +63,41 @@ $screen-md-max: ($screen-lg-min - 1) !default;
*:focus {outline:0;} *:focus {outline:0;}
button:focus {outline:0;} .float-group {
height: 15px;
&.h10 {
height: 10px;
}
.btn { &.h20 {
display: inline-block; height: 20px;
margin-bottom: 0; }
font-weight: normal;
text-align: center; &.h30 {
vertical-align: middle; height: 30px;
touch-action: manipulation; }
cursor: pointer; clear: both;
background-image: none;
border: 1px solid transparent;
white-space: nowrap;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857;
border-radius: 4px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
} }
.btn-block { button:focus {outline:0;}
display: block;
width: 100%;
.button-group {
clear: both;
height: 36px;
}
.ui-button {
background-color: $blue-color;
border: 0;
color: white;
font-weight: bold;
min-height: 36px;
font-size: 14px;
&.block {
width: 100%;
}
} }
.panel { .panel {
@@ -123,8 +132,6 @@ button:focus {outline:0;}
border: 1px solid #ccc; border: 1px solid #ccc;
border-radius: 4px; border-radius: 4px;
box-shadow: 0; box-shadow: 0;
-webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
} }
input, button, select, textarea { input, button, select, textarea {

2
app/assets/stylesheets/frontend.css.scss
View File

@@ -1,8 +1,8 @@
$dark-gray: #2e2e2e; $dark-gray: #2e2e2e;
@import "app/standard"; @import "app/standard";
@import "app/mostrap";
@import "app/main"; @import "app/main";
@import "app/ui";
@import "app/header"; @import "app/header";
@import "app/tags"; @import "app/tags";
@import "app/notes"; @import "app/notes";

76
app/assets/templates/frontend/directives/account-menu.html.haml
View File

@@ -1,44 +1,52 @@
.panel.panel-default.panel-right.account-data-menu .panel.panel-default.panel-right.account-data-menu
.panel-body.large-padding .panel-body.large-padding
%div{"ng-if" => "!user"} %div{"ng-if" => "!user"}
%div{"ng-if" => "!formData.confirmPassword"}
%p Enter your account information. You can also register for free using the default server address.
.small-v-space
%form.mt-5 -# Account Section
%input.form-control{:name => 'server', :placeholder => 'Server URL', :required => true, :type => 'text', 'ng-model' => 'formData.url'} .mb-10
%input.form-control{:autofocus => 'autofocus', :name => 'email', :placeholder => 'Email', :required => true, :type => 'email', 'ng-model' => 'formData.email'}
%input.form-control{:placeholder => 'Password', :name => 'password', :required => true, :type => 'password', 'ng-model' => 'formData.user_password'}
.checkbox{"ng-if" => "localNotesCount() > 0"}
%label
%input{"type" => "checkbox", "ng-model" => "formData.mergeLocal", "ng-bind" => "true", "ng-change" => "mergeLocalChanged()"}
Merge local notes ({{localNotesCount()}} notes)
%div{"ng-if" => "!formData.status"} .step-one{"ng-if" => "!formData.showLogin && !formData.showRegister"}
%button.btn.dark-button.half-button{"ng-click" => "loginSubmitPressed()"} %h3 To enable encryption and sync, sign in or register (free).
.small-v-space
.button-group.mt-5
%button.ui-button.half-button{"ng-click" => "formData.showLogin = true"}
%span Sign In %span Sign In
%button.btn.dark-button.half-button{"ng-click" => "submitRegistrationForm()"} %button.ui-button.half-button{"ng-click" => "formData.showRegister = true"}
%span Register %span Register
%br
.block.bold.center-align{"style" => "font-size: 14px;"}
%a.btn.mt-5{"ng-click" => "formData.showResetForm = !formData.showResetForm"} Passwords cannot be forgotten.
%div{"ng-if" => "formData.confirmPassword"} %a.block.mt-10.center-align.centered{"href" => "https://standardnotes.org/your-data", "target" => "_blank"} Learn more about Standard Notes accounts.
%h3 Confirm your password.
%p.mt-5 Note that because your notes are encrypted using your password, Standard Notes does not have a password reset option. You cannot forget your password.
%form.mt-10
%input.form-control{:placeholder => 'Confirm Password', :name => 'password', :required => true, :type => 'password', 'ng-model' => 'formData.pw_confirmation'}
%button.btn.dark-button.btn-block{"ng-click" => "submitPasswordConfirmation()"}
%span Confirm
%em.block.center-align.mt-10{"ng-if" => "formData.status", "style" => "font-size: 14px;"} {{formData.status}} .step-two{"ng-if" => "formData.showLogin || formData.showRegister"}
.float-group.h20
%h3.pull-left {{formData.showLogin ? "Sign In" : "Register (free)"}}
%a.pull-right.pt-5{"ng-click" => "formData.showLogin = false; formData.showRegister = false;"} Cancel
.gray-bg.medium-padding{"ng-if" => "formData.showResetForm"} %form.mt-5
%p{"style" => "font-size: 13px;"} %input.form-control.mt-10{:autofocus => 'autofocus', :name => 'email', :placeholder => 'Email', :required => true, :type => 'email', 'ng-model' => 'formData.email'}
Because notes are locally encrypted using a secret key derived from your password, there's no way to decrypt these notes if you forget your password. %input.form-control{:placeholder => 'Password', :name => 'password', :required => true, :type => 'password', 'ng-model' => 'formData.user_password'}
For this reason, Standard Notes cannot offer a password reset option. You %input.form-control{:placeholder => 'Confirm Password', "ng-if" => "formData.showRegister", :name => 'password', :required => true, :type => 'password', 'ng-model' => 'formData.password_conf'}
%span.bold must
make sure to store or remember your password. %a.block{"ng-click" => "formData.showAdvanced = !formData.showAdvanced"} Advanced Options
.advanced-options.mt-10{"ng-if" => "formData.showAdvanced"}
.float-group
%label.pull-left Standard File Domain
%a.pull-right{"href" => "https://standardnotes.org/your-data", "target" => "_blank"} ⓘ
%input.form-control.mt-5{:name => 'server', :placeholder => 'Server URL', :required => true, :type => 'text', 'ng-model' => 'formData.url'}
.checkbox{"ng-if" => "localNotesCount() > 0"}
%label
%input{"type" => "checkbox", "ng-model" => "formData.mergeLocal", "ng-bind" => "true", "ng-change" => "mergeLocalChanged()"}
Merge local notes ({{localNotesCount()}} notes)
%button.ui-button.block.mt-10{"ng-click" => "submitAuthForm()"} {{formData.showLogin ? "Sign In" : "Register"}}
.mt-15{"ng-if" => "formData.showRegister"}
%h3 No Password Reset.
%p.mt-5 Because your notes are encrypted using your password, Standard Notes does not have a password reset option. You cannot forget your password.
%em.block.center-align.mt-10{"ng-if" => "formData.status", "style" => "font-size: 14px;"} {{formData.status}}
-# End account section
%div{"ng-if" => "user"} %div{"ng-if" => "user"}
%h2 {{user.email}} %h2 {{user.email}}
@@ -73,7 +81,7 @@
%form %form
%input.form-control{"type" => "text", "ng-model" => "newPasswordData.newPassword", "placeholder" => "Enter new password"} %input.form-control{"type" => "text", "ng-model" => "newPasswordData.newPassword", "placeholder" => "Enter new password"}
%input.form-control{"type" => "text", "ng-model" => "newPasswordData.newPasswordConfirmation", "placeholder" => "Confirm new password"} %input.form-control{"type" => "text", "ng-model" => "newPasswordData.newPasswordConfirmation", "placeholder" => "Confirm new password"}
%button.btn.dark-button.btn-block{"ng-click" => "submitPasswordChange()"} Submit %button.ui-button.block{"ng-click" => "submitPasswordChange()"} Submit
%p.italic.mt-10{"ng-if" => "newPasswordData.status"} {{newPasswordData.status}} %p.italic.mt-10{"ng-if" => "newPasswordData.status"} {{newPasswordData.status}}
.medium-v-space .medium-v-space
@@ -112,8 +120,8 @@
.mt-25 .mt-25
%h4 Analytics %h4 Analytics
%p %p
Help Standard Notes improve by sending anonymous data on general usage. Learn more Help Standard Notes improve by sending anonymous data on general usage.
%a{"href" => "https://standardnotes.org/philosophy", "target" => "_blank"} here. %a{"href" => "https://standardnotes.org/philosophy", "target" => "_blank"} Learn more.
%div.mt-5 %div.mt-5
%label Status: %label Status:
{{analyticsManager.enabled ? "Enabled" : "Disabled"}} {{analyticsManager.enabled ? "Enabled" : "Disabled"}}

4
app/assets/templates/frontend/directives/global-extensions-menu.html.haml
View File

@@ -53,11 +53,11 @@
.large-v-space .large-v-space
%a.block{"ng-click" => "toggleExtensionForm()"} Add new extension %a.block{"ng-click" => "toggleExtensionForm()"} Add New Extension
%form.mt-10.mb-10{"ng-if" => "showNewExtensionForm"} %form.mt-10.mb-10{"ng-if" => "showNewExtensionForm"}
%input.form-control{:autofocus => 'autofocus', :name => 'url', :placeholder => 'Extension URL', :required => true, :type => 'url', 'ng-model' => 'newExtensionData.url'} %input.form-control{:autofocus => 'autofocus', :name => 'url', :placeholder => 'Extension URL', :required => true, :type => 'url', 'ng-model' => 'newExtensionData.url'}
%button.btn.dark-button.btn-block{"ng-click" => "submitNewExtensionForm()", :type => 'submit', "data-style" => "expand-right", "data-size" => "s", "state" => "buttonState"} %button.ui-button.block{"ng-click" => "submitNewExtensionForm()", :type => 'submit', "data-style" => "expand-right", "data-size" => "s", "state" => "buttonState"}
Add Extension Add Extension
%a.block.mt-5{"ng-click" => "reloadExtensionsPressed()", "ng-if" => "extensionManager.extensions.length > 0"} Reload all extensions %a.block.mt-5{"ng-click" => "reloadExtensionsPressed()", "ng-if" => "extensionManager.extensions.length > 0"} Reload all extensions