110swag / flashy-frontend

Download as
Browse Code »

Commit 453e33ddb7b03461e2fda6440810adbc3eb591bf

Authored by Rachel Lee
2 parents 414def2b3a be9a576630
Exists in master and in 1 other branch ef9f9dd363e92d55eb4d80d036193be39572172b

Merge branch 'master' of https://git.ucsd.edu/110swag/flashy-frontend 

Conflicts:
	flashy.css

Showing 16 changed files Side-by-side Diff

config.js View file @ 453e33d
... ... @@ -10,6 +10,7 @@
10 10 'flashy.UserService',
11 11 'flashy.FlashcardDirective',
12 12 'flashy.ResetPasswordController',
  13 + 'flashy.VerifyEmailController',
13 14 'ngCookies']).
14 15 config(['$stateProvider', '$urlRouterProvider', '$httpProvider',
15 16 '$locationProvider',
16 17  
17 18  
... ... @@ -67,10 +68,14 @@
67 68 controller: 'RequestResetController'
68 69 }).
69 70 state('resetpassword', {
70   - url: '/resetpassword',
  71 + url: '/resetpassword/{uid}/{token}',
71 72 templateUrl: 'templates/resetpassword.html',
72 73 controller: 'ResetPasswordController'
  74 + }).
  75 + state('verifyemail', {
  76 + url: '/verifyemail/{key}',
  77 + templateUrl: 'templates/verifyemail.html',
  78 + controller: 'VerifyEmailController'
73 79 });
74   -
75 80 }]);
flashy.css View file @ 453e33d
1   -.diclaimer {
2   - color:#00AFD8;
3   -}
4   -
5   -.form-section {
6   - width: 330px;
7   - top: 50%;
8   - position: relative;
9   -}
10   -
11   -.form-inputs {
12   - margin-top: 0px;
13   - border: 0px none;
14   - font: 16px/1.4 "Helvetica Neue","HelveticaNeue",Helvetica,Arial;
15   - padding: 5px 10px 11px 13px;
16   - width: 100%;
17   - box-sizing: border-box;
18   -}
19   -
20   -.form-buttons {
21   - margin-top: 10px;
22   - width: 100%;
23   - font-size: 16px;
24   -}
25   -
26   -.form-buttons .last-button {
27   - float: right;
28   -}
29   -
30   -.container {
31   - position: relative;
32   - width: 600px;
33   - height: 80px;
34   -}
35   -
36   -.angucomplete-dropdown {
  1 +.angucomplete-dropdown {
37 2 border-color: #ececec;
38 3 border-width: 1px;
39 4 border-style: solid;
... ... @@ -126,5 +91,72 @@
126 91  
127 92 .center-me {
128 93 margin: 0 auto;
  94 +=======
  95 +.container {
  96 + position: relative;
  97 + width: 600px;
  98 + height: 80px;
  99 +}
  100 +
  101 +.modal.bottom-sheet {
  102 + width: 40%;
  103 + margin-left: auto;
  104 + margin-right: auto;
  105 +}
  106 +
  107 +/* label color */
  108 +.input-field label {
  109 + color: #673ab7;
  110 +}
  111 +
  112 +/* label focus color */
  113 +.input-field input[type]:focus + label {
  114 + color: #b388ff;
  115 +}
  116 +
  117 +/* label underline focus color */
  118 +.input-field input[type]:focus {
  119 + border-bottom: 1px solid #b388ff;
  120 + box-shadow: 0 1px 0 0 #b388ff;
  121 +}
  122 +
  123 +/* valid color */
  124 +.input-field input[type].valid {
  125 + border-bottom: 1px solid #673ab7;
  126 + box-shadow: 0 1px 0 0 #673ab7;
  127 +}
  128 +
  129 +/* invalid color */
  130 +.input-field input[type].invalid {
  131 + border-bottom: 1px solid #673ab7;
  132 + box-shadow: 0 1px 0 0 #673ab7;
  133 +}
  134 +
  135 +/* icon prefix focus color */
  136 +.input-field .prefix.active {
  137 + color: #b388ff;
  138 +}
  139 +
  140 +/* label focus color */
  141 +.input-field textarea[type]:focus + label {
  142 + color: #b388ff;
  143 +}
  144 +
  145 +/* label underline focus color */
  146 +.input-field textarea[type]:focus {
  147 + border-bottom: 1px solid #b388ff;
  148 + box-shadow: 0 1px 0 0 #b388ff;
  149 +}
  150 +
  151 +body {
  152 + background-color: #3e1944;
  153 +}
  154 +
  155 +.btn {
  156 + background-color: #673ab7;
  157 +}
  158 +
  159 +.btn-floating {
  160 + background-color: #673ab7;
129 161 }
home.html View file @ 453e33d
... ... @@ -36,6 +36,7 @@
36 36 <script src="scripts/RequestResetController.js"></script>
37 37 <script src="scripts/ClassAddController.js"></script>
38 38 <script src="scripts/ReviewController.js"></script>
  39 +<script src="scripts/VerifyEmailController.js"></script>
39 40  
40 41 <!-- Services -->
41 42 <script src="scripts/UserService.js"></script>
scripts/DeckController.js View file @ 453e33d
... ... @@ -4,30 +4,79 @@
4 4  
5 5  
6 6  
  7 +
  8 +
  9 +
  10 + // cards array
7 11 $scope.cards = [];
8 12  
  13 + $scope.cards[0] = { 'content': 'abc' };
  14 + $scope.cards[1] = { 'content': 'xyz' };
  15 + $scope.cards[2] = { 'content': 'qwe' };
9 16  
10 17  
11   - $scope.cards[0] = { 'id': 1, 'title': 'title1', 'content': 'abc' };
12   - $scope.cards[1] = { 'id': 2, 'title': 'title2', 'content': 'xyz' };
13   - $scope.cards[2] = { 'id': 2, 'title': 'title3', 'content': 'qwe' };
  18 + // reorganize cards in array based on time
  19 + $scope.filter = function (card) {
  20 +
  21 + // get index of card
  22 + var index = $scope.cards.indexOf(card);
14 23  
  24 + //$scope.cards[index];
15 25  
16   - $scope.removeCard = function(item) {
17 26  
  27 + };
18 28  
19   - var index = $scope.cards.indexOf(item);
  29 + // remove card from deck
  30 + $scope.removeCard = function(card) {
20 31  
  32 + // get index of card
  33 + var index = $scope.cards.indexOf(card);
  34 +
21 35 $scope.cards.splice(index, 1);
22 36  
23   - alert('removed card');
  37 + alert('Removed card!');
24 38 };
25 39  
26 40  
27   - $http.get('/api/sections/{pk}/deck').
  41 + $scope.editCard = function (card) {
  42 +
  43 + $('.modal-trigger').leanModal({
  44 + dismissible: true, // Modal can be dismissed by clicking outside of the modal
  45 + opacity: .5, // Opacity of modal background
  46 + in_duration: 300, // Transition in duration
  47 + out_duration: 200, // Transition out duration
  48 + }
  49 + );
  50 +
  51 +
  52 + // get index of card
  53 + var index = $scope.cards.indexOf(card);
  54 +
  55 + $scope.editedContent = $scope.cards[index].content;
  56 +
  57 + $scope.cards[index].content = $scope.editedContent;
  58 +
  59 +
  60 + // post flashcard edits
  61 + /*$http.post('/api/flashcards/', { 'text': $scope.editedContent }).
  62 + success(function (data) {
  63 + console.log('No way, really?');
  64 + }).
  65 + error(function (error) {
  66 + console.log('haha, n00b');
  67 + });
  68 +
  69 + */
  70 + }
  71 +
  72 +
  73 +
  74 + // get all cards from your deck and push into array
  75 + /*$http.get('/api/sections/{pk}/deck').
28 76 success(function(data) {
29 77  
30 78  
  79 +
31 80 for (var i = 0; i < data.length; i++) {
32 81 cards.push({ 'title': data[i].title, 'content': data[i].content });
33 82 }
... ... @@ -36,9 +85,7 @@
36 85  
37 86 console.log('no cards?!!');
38 87  
39   - });
40   -
41   -
  88 + });*/
42 89  
43 90  
44 91 }]);
scripts/FeedController.js View file @ 453e33d
... ... @@ -3,17 +3,34 @@
3 3 controller('FeedController', ['$scope', '$state', '$http', function($scope, $state, $http) {
4 4 console.log('Hello from feed');
5 5  
  6 + $scope.cards = [];
  7 +
  8 +
  9 + $scope.cards[0] = { 'id': 1, 'title': 'title1', 'content': 'abc' };
  10 + $scope.cards[1] = { 'id': 2, 'title': 'title2', 'content': 'xyz' };
  11 + $scope.cards[2] = { 'id': 2, 'title': 'title3', 'content': 'qwe' };
  12 +
  13 + $http.get("/api/sections/{pk}/flashcards").
  14 + success(function(data) {
  15 + for (var i = 0; i < data.length; i++) {
  16 + cards.push({ 'title': data[i].title, 'content': data[i].content });
  17 + }
  18 + }).
  19 + error(function(err) {
  20 + console.log('no');
  21 + });
  22 +
6 23 $scope.viewDeck = function() {
7 24 $state.go('deck');
8 25 console.log('go to deck');
9 26 };
10 27  
11   - $scope.pullCard = function() {
12   - console.log('card clicked');
  28 + $scope.pullCard = function(card) {
  29 + var index = $scope.cards.indexOf(card);
  30 +
  31 + console.log($scope.cards[index]);
13 32 };
14 33  
15   - $scope.create = false; // show make flashcard
16   -
17 34 $scope.pushCard = function() {
18 35 console.log('make! card content:' + $scope.text);
19 36 var pushed = new Date(Date.now());
20 37  
21 38  
... ... @@ -28,12 +45,24 @@
28 45 console.log('haha, n00b');
29 46 });
30 47  
31   - $scope.create = false; // hide make flashcard
32 48 $scope.text = '';
33 49 };
34 50  
35   - $scope.flashcard = 'hi i am a flashcard';
  51 + $scope.flashcard = 'hi i am a flashcard. I need to be really long and awesome I ain\'t know how long I am right now. Is it good enough now?????????? Howz about now???';
36 52 $scope.text = '';
  53 +
  54 + $(document).ready(function(){
  55 + // the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered
  56 + $('.modal-trigger').leanModal({
  57 + dismissible: true, // Modal can be dismissed by clicking outside of the modal
  58 + opacity: 0, // Opacity of modal background
  59 + in_duration: 300, // Transition in duration
  60 + out_duration: 200, // Transition out duration
  61 + /*ready: function() { alert('Ready'); }, // Callback for Modal open
  62 + complete: function() { alert('Closed'); } // Callback for Modal close*/
  63 + }
  64 + );
  65 + });
37 66  
38 67 }]);
scripts/LoginController.js View file @ 453e33d
... ... @@ -3,7 +3,6 @@
3 3 controller('LoginController', ['$scope', '$state', '$http', 'UserService',
4 4 function($scope, $state, $http, UserService) {
5 5 'use strict';
6   -
7 6 $scope.uniqueError = false;
8 7 $scope.loginError = false;
9 8 $scope.login = function(email, password) {
... ... @@ -37,7 +36,7 @@
37 36 if (data.email == 'This field is required.') {
38 37 $scope.invalid = true;
39 38 $scope.uniqueError = false;
40   - } else if (data.email) {
  39 + } else if (data.email == 'This field must be unique.') {
41 40 // assume 'email not unique' error
42 41 $scope.uniqueError = true;
43 42 $scope.invalid = false;
... ... @@ -49,6 +48,9 @@
49 48 $scope.triggerPasswordReset = function() {
50 49 $state.go('requestpasswordreset');
51 50 };
  51 + $(document).ready(function(){
  52 + $('ul.tabs').tabs();
  53 + });
52 54 }
53 55 ]);
scripts/RequestResetController.js View file @ 453e33d
... ... @@ -4,20 +4,22 @@
4 4 function($scope, $state, $http) {
5 5 'use strict';
6 6 $scope.success = false;
7   - $scope.invalid = false;
  7 + $scope.error = false;
8 8 $scope.resetPass = function(email) {
9 9 $http.post('/api/request_password_reset', JSON.stringify({
10 10 'email': email
11 11 }))
12 12 .success(function(data) {
13 13 $scope.success = true;
14   - $state.go('passwordreset');
  14 + //$state.go('requestresetsuccess');
  15 + console.log("SUCCESS");
15 16 console.log(data);
16 17 })
17 18 .error(function(data, status, header, config) {
18 19 if (data.email) {
19   - $scope.invalid = true;
  20 + $scope.error = true;
20 21 }
  22 + console.log("ERROR");
21 23 console.log(data);
22 24 });
23 25 };
scripts/ResetPasswordController.js View file @ 453e33d
1 1 angular.module('flashy.ResetPasswordController', ['ui.router']).
2 2  
3   - controller('ResetPasswordController', ['$scope', '$state', '$http',
4   - function($scope, $state, $http) {
  3 + controller('ResetPasswordController', ['$scope', '$state', '$http', '$timeout',
  4 + function($scope, $state, $http, $timeout) {
5 5 'use strict';
6   - var url = document.location.href.split("/");
  6 + var url = document.location.href.split('/');
7 7 var token = url[url.length-1];
8 8 var uid = url[url.length-2];
9 9 $scope.error = false;
10   - $scope.confirmResetPass = function(newPassword) {
  10 + $scope.success = false;
  11 + $scope.mismatch = false;
  12 + $scope.unacceptable = false;
  13 + /*if(token == 'resetpassword') {
  14 + $state.go('login');
  15 + }*/
  16 + console.log("RESETTING");
  17 + $scope.confirmResetPass = function() {
  18 + if($scope.newPassword.length < 8) {
  19 + $scope.unacceptable = true;
  20 + return;
  21 + }
  22 + if($scope.newPassword != $scope.confirmPassword) {
  23 + $scope.mismatch = true;
  24 + $scope.confirmPassword.$setPristine();
  25 + console.log("mismatch");
  26 + return;
  27 + }
11 28 $http.post('/api/reset_password', JSON.stringify({
12 29 'uid': uid,
13   - 'token': token
  30 + 'token': token,
  31 + 'new_password': $scope.newPassword
14 32 }))
15 33 .success(function(data) {
16 34 $scope.error = false;
17   - $state.go('resetpasssuccess');
  35 + $scope.success = true;
  36 + //$state.go('resetpasssuccess');
  37 + $timeout(function($state) {
  38 + $state.go('login');
  39 + }, 1000);
18 40 console.log(data);
19 41 })
20 42 .error(function(data, status, header, config) {
21 43 $scope.error = true;
  44 + $scope.success = false;
  45 + $scope.mismatch = false;
  46 + $scope.unacceptable = false;
22 47 console.log(data);
23 48 });
24 49 };
scripts/VerifyEmailController.js View file @ 453e33d
  1 +angular.module('flashy.VerifyEmailController', ['ui.router'])
  2 +
  3 + .controller('VerifyEmailController', ['$scope', '$state', '$http', '$timeout',
  4 + function($scope, $state, $http, $timeout) {
  5 + 'use strict';
  6 + var url = document.location.href.split('/');
  7 + var key = url[url.length-1];
  8 + $scope.success = false;
  9 + $scope.error = false;
  10 +
  11 + $http.patch('/api/me', JSON.stringify({
  12 + 'confirmation_key': key
  13 + }))
  14 + .success(function(data) {
  15 + $scope.success = true;
  16 + console.log("SUCCESS");
  17 + console.log(data);
  18 + $timeout(function($state) {
  19 + $state.go('feed');
  20 + }, 2000);
  21 + })
  22 + .error(function(data, status, header, config) {
  23 + $scope.error = true;
  24 + console.log("ERROR");
  25 + console.log(data);
  26 + });
  27 + }
  28 + ]);
ss_test.js View file @ 453e33d
  1 +//http://docs.casperjs.org/en/latest/modules/casper.html#captureselector
  2 +
  3 +
  4 +var casper = require('casper').create();
  5 +
  6 +casper.start('https://flashy.cards/app/login', function() {
  7 + this.captureSelector('test.png', 'ul#nav.side-nav.fixed');
  8 +});
  9 +
  10 +casper.run();
templates/deck.html View file @ 453e33d
1   -<div class="row">
  1 +
  2 +<!--<i class="small mdi-content-sort" ng-click="filter()">Filter</i>-->
2 3  
3   - <div ng-repeat="card in cards">
4 4  
5   - <div class="col s6">
  5 +<div>
6 6  
7   - <div class="card">
  7 + <div class="row">
  8 + <div ng-repeat="card in cards">
  9 + <div class="col s6">
  10 + <div class="card">
  11 + <div class="card-content">
  12 + <p>{{card.content}}</p>
  13 + </div>
8 14  
  15 + <div class="card-action">
9 16  
  17 + <!--<button type="button" class="waves-effect waves-light btn" ng-click="removeCard()">Remove</button>-->
  18 + <i class="small mdi-action-delete" ng-click="removeCard(card)"></i>
10 19  
11   - <div class="card-image">
12   - <span class="card-title">{{card.title}}</span>
13   - </div>
14   - <div class="card-content">
  20 + <a class="modal-trigger" href="#editModal"><i class="small mdi-editor-border-color modal-trigger" ng-click="editCard(card)"></i></a>
15 21  
  22 + <!-- Modal Structure -->
  23 + <div id="editModal" class="modal modal-fixed-footer">
  24 + <div class="modal-content">
  25 + <div class="row">
  26 + <form class="col s12">
  27 + <div class="row">
  28 + <div class="input-field col s6">
  29 + <i class="mdi-editor-mode-edit prefix"></i>
  30 + <textarea id="icon_prefix2" class="materialize-textarea">{{editedContent}}</textarea>
  31 + <label for="icon_prefix2"></label>
  32 + </div>
  33 + </div>
  34 + </form>
  35 + </div>
16 36  
  37 + </div>
17 38  
18   - <p>
19   - {{card.content}}
  39 +
  40 + <div class="modal-footer">
  41 + <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">Done</a>
  42 + <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">Cancel</a>
20 43  
  44 + </div>
  45 + </div>
21 46  
22   - </p>
23   - </div>
24 47  
  48 + </div>
25 49  
26   -
27   - <div class="card-action">
28   -
29   -
30   - <button type="button" class="waves-effect waves-light btn" ng-click="removeCard()">Remove</button>
31   -
32   -
33 50 </div>
34 51  
35 52 </div>
36 53  
37   - </div>
38 54  
39   -
  55 + </div>
40 56 </div>
41 57 </div>
42   -
templates/feed.html View file @ 453e33d
1   - <div class="col s9">
2   - <div class="row">
3   - <a class="waves-effect waves-light btn purple" ng-click="viewDeck()" style="top: 15px">View Deck</a>
4   - </div>
5   -
6   - <!--random dummy cards-->
7   - <div class="row">
8   - <div class="col s1 m2 l4">
9   - <div class="card-panel" ng-click="pullCard()">
10   - <span>{{ flashcard }}</span>
  1 +<body>
  2 + <div class="col s12">
  3 + <div class="row">
  4 + <a class="waves-effect waves-light btn" ng-click="viewDeck()" style="top: 15px">View Deck</a>
11 5 </div>
12   - </div>
13 6  
14   - <div class="col s1 m2 l4">
15   - <div class="card" ng-click="pullCard()">
16   - <div class="card-content">
17   - <span class="card-title activator grey-text text-darken-4">{{ flashcard }}<i class="mdi-navigation-more-vert right"></i></span>
  7 + <!--cards-->
  8 + <div class="row">
  9 + <div ng-repeat="card in cards">
  10 + <div class="col s6">
  11 + <div class="card" ng-click="pullCard(card)">
  12 + <div class="card-content">
  13 + <span> {{card.content}} </span>
  14 + </div>
  15 + </div>
  16 + </div>
18 17 </div>
19   - <div class="card-reveal">
20   - <span class="card-title grey-text text-darken-4">{{ flashcard }}<i class="mdi-navigation-close right"></i></span>
21   - <p>Herro der. I see you have found me.</p>
22   - </div>
23 18 </div>
24   - </div>
25 19  
26   - <div class="col s1 m2 l4">
27   - <div class="card-panel" ng-click="pullCard()">
28   - <span>{{ flashcard }}</span>
29   - </div>
30   - </div>
31   -
32   - <!--New flashcard (still working on placement)-->
33   - <div class="row" ng-show="create">
34   - <form class="col s6 offset-s10" ng-submit="pushCard()">
35   - <div class="row">
36   - <div class="input-field col s12">
37   - <i class="mdi-editor-mode-edit prefix"></i>
38   - <textarea class="materialize-textarea" ng-model="text" name="text"></textarea>
39   - <label id="newCardSign" for="newCard">New Flashcard</label>
40   - <div class="container">
41   - <button class="btn waves-effect waves-light purple" type="submit" name="action">Submit
42   - <i class="mdi-content-send right"></i>
43   - </button>
44   - </div>
  20 +
  21 + <!--Lil plus button in corner-->
  22 + <div class="fixed-action-btn" style="bottom: 45px; right: 24px;">
  23 + <a data-target="newCard" class="btn-floating btn-large modal-trigger" href="#newCard">
  24 + <i class="large mdi-content-add"></i>
  25 + </a>
  26 + <!--Maybe this will come in handy later? Floating bubbles on mouseover-->
  27 + <ul>
  28 + <li><a class="btn-floating red"><i class="large mdi-editor-insert-chart"></i></a></li>
  29 + <li><a class="btn-floating yellow darken-1"><i class="large mdi-editor-format-quote"></i></a></li>
  30 + <li><a class="btn-floating green"><i class="large mdi-editor-publish"></i></a></li>
  31 + <li><a class="btn-floating blue"><i class="large mdi-editor-attach-file"></i></a></li>
  32 + </ul>
45 33 </div>
46 34 </div>
47   - </form>
48   - </div>
49 35  
50   - <!--Lil plus button in corner-->
51   - <div class="fixed-action-btn" ng-click="create = !create" style="bottom: 45px; right: 24px;">
52   - <a class="btn-floating btn-large purple">
53   - <i class="large mdi-content-add"></i>
54   - </a>
55   - <!--Maybe this will come in handy later? Floating bubbles on mouseover-->
56   - <ul>
57   - <li><a class="btn-floating red"><i class="large mdi-editor-insert-chart"></i></a></li>
58   - <li><a class="btn-floating yellow darken-1"><i class="large mdi-editor-format-quote"></i></a></li>
59   - <li><a class="btn-floating green"><i class="large mdi-editor-publish"></i></a></li>
60   - <li><a class="btn-floating blue"><i class="large mdi-editor-attach-file"></i></a></li>
61   - </ul>
62   - </div>
63   -</div>
  36 + <div id="newCard" class="modal bottom-sheet">
  37 + <div class="modal-content">
  38 + <form>
  39 + <div class="row">
  40 + <div class="input-field">
  41 + <i class="mdi-editor-mode-edit prefix"></i>
  42 + <textarea class="materialize-textarea" ng-model="text" type="text"></textarea>
  43 + <label id="newCardSign" for="newCard">New Flashcard</label>
  44 + </div>
  45 + </div>
  46 + </form>
  47 + </div>
  48 + <div class="modal-footer">
  49 + <button class="btn waves-effect waves-light purple modal-close" type="submit" ng-click="pushCard()">Submit
  50 + <i class="mdi-content-send right"></i>
  51 + </button>
  52 + </div>
  53 + </div>
  54 + </div>
  55 +</body>
templates/login.html View file @ 453e33d
1   -<div class="container">
2   - <div class="row">
3   - <div class="col s6">
4   - <ul class="tabs" tabs>
5   - <li class="tab col s3"><a href="#register-tab">Sign Up</a></li>
6   - <li class="tab col s3"><a class="active" href="#login-tab">Login</a></li>
7   - </ul>
8   - </div>
  1 +<div class="row">
  2 +<div class="offset-s2 col s8">
  3 + <ul class="tabs">
  4 + <li class="tab col s6"><a href="#register-tab">Sign Up</a></li>
  5 + <li class="tab col s6"><a class="active" href="#login-tab">Login</a></li>
  6 + </ul>
  7 +</div>
  8 +</div>
  9 +<div class="row">
  10 +<div class="offset-s2 col s8">
  11 +<div class="card">
9 12 <!--LOGIN TAB-->
10   - <div id="login-tab" class="col s12">
11   - <div class="check-element animate-show" role="alert" ng-show="loginError">
12   - <span style="color:#8E2323">Invalid username or password!!</span>
13   - </div>
14   - <div class="row">
15   - <div class="input-field col s6">
16   - <input id="email" type="email" class="validate" ng-model="loginEmail" placeholder="Email" required/>
  13 + <div id="login-tab" class="row col s12">
  14 + <div class="card-content">
  15 + <div class="check-element animate-show" role="alert" ng-show="loginError">
  16 + <span style="color:#8E2323">Invalid username or password!!</span>
  17 + </div>
  18 + <div class="input-field">
  19 + <input id="email" type="email" class="validate" ng-model="loginEmail" required/>
17 20 <label for="email">Email</label>
18 21 </div>
19   - </div>
20   - <div class="row">
21   - <div class="input-field col s6">
22   - <input id="password" type="password" class="validate" ng-model="loginPassword" placeholder="Password" required/>
  22 + <div class="input-field">
  23 + <input id="password" type="password" class="validate" ng-model="loginPassword" required/>
23 24 <label for="password">Password</label>
24 25 </div>
25 26 </div>
26   - <div class="row">
27   - <button class="btn waves-effect waves-light right-align" type="submit" name="action"
28   - ng-click="login(loginEmail, loginPassword)">Login
29   - </button>
  27 + <div class="card-action">
  28 + <button class="btn waves-effect waves-light col s12 blue lighten-1" type="submit" name="action"
  29 + ng-click="login(loginEmail, loginPassword)">Login</button>
30 30 </div>
31 31 </div>
32 32 <!--REGISTER TAB-->
33   - <div id="register-tab" class="col s12">
34   - <div class="row">
35   - <div class="input-field col s6">
36   - <input type="email" class="validate" ng-model="loginEmail" placeholder="Email" required/>
  33 + <div id="register-tab" class="row col s12">
  34 + <div class="card-content">
  35 + <div class="check-element animate-show" role="alert" ng-show="uniqueError">
  36 + <span style="color:#8E2323">Invalid username or password!!</span>
  37 + </div>
  38 + <div class="input-field">
  39 + <input id="email" type="email" class="validate" ng-model="loginEmail" required/>
37 40 <label for="email">Email</label>
38 41 </div>
39   - </div>
40   - <div class="row">
41   - <div class="input-field col s6">
42   - <input type="password" class="validate" ng-model="registerPassword" placeholder="Password" required/>
  42 + <div class="input-field">
  43 + <input type="password" class="validate" ng-model="registerPassword" required/>
43 44 <label for="password">Password</label>
44 45 </div>
45 46 </div>
46   - <div class="row">
47   - <button class="btn waves-effect waves-light left-align" type="" name="action"
48   - ng-click="signUp(loginEmail, registerPassword)">Register
49   - </button>
  47 + <div class="card-action">
  48 + <button class="btn waves-effect waves-light col s12 blue lighten-1" type="" name="action"
  49 + ng-click="signUp(loginEmail, registerPassword)">Register</button>
50 50 </div>
51 51 </div>
52   - </div>
53   - <a class="trigger-password-reset" ng-click="triggerPasswordReset()" href="#">Forgot Password?</a>
  52 +
  53 + <div class="row offset-s1 col s12">
  54 + <a class="trigger-password-reset" ng-click="triggerPasswordReset()" href="#">Forgot Password?</a>
  55 + </div>
  56 +</div>
  57 +</div>
54 58 </div>
templates/requestpasswordreset.html View file @ 453e33d
1   -<div class="content">
2   - <div class="container">
3   - <h1 class="text-muted">Reset Password</h1>
  1 +<div class="row" ng-show="success">
  2 + <h1>Request sent!</h1>
  3 + <h1>Check your email in a few minutes.</h1>
  4 +</div>
  5 +
  6 +<div class="row" ng-hide="success">
  7 +<div class="offset-s2 col s8">
  8 +<div class="card">
  9 + <form class="col s12" name="passreset_form">
  10 + <div class="card-content">
  11 + <h2>Reset Password</h2>
4 12 </div>
5   - <div name="passreset" class="form-section">
6   - <form class="form-inputs" name="passreset_form">
7   - <div class="check-element animate-show" role="alert" ng-show="invalid">
8   - <span style="color:#8E2323">Enter a valid email!</span>
9   - </div>
10   - <!--FORM INPUTS-->
11   - <div class="form-group">
12   - <input type="email" class="form-control" ng-model="user_email" placeholder="Email" required />
13   - </div>
14   - <div class="row">
15   - <div class="btn-group">
16   - <button type="button" class="btn btn-default" ng-click="cancelReset()"><strong>Cancel</strong></button>
17   - </div>
18   - <div class="last-button">
19   - <div class="btn-group">
20   - <button type="button" class="btn btn-danger" ng-click="resetPass(user_email)"><strong>Reset Password</strong></button>
21   - </div>
22   - </div>
23   - </div>
24   - </form>
25   - </div>
  13 +
  14 + <div class="divider"></div>
  15 + <div name="passreset" class="card-content">
  16 + <div class="section">
  17 + <div ng-show="error" role="error">
  18 + <i style="color:#8E2323" class="mdi-alert-error"></i>
  19 + <span style="color:#8E2323">Enter a valid email!</span>
  20 + </div>
  21 + </div>
  22 + <!--FORM INPUT-->
  23 + <div class="input-field">
  24 + <label for="email">Enter Your Email</label>
  25 + <input id="email" type="email" class="form-control" ng-model="user_email" placeholder="" required />
  26 + </div>
  27 + </div>
  28 +
  29 + <div class="card-action">
  30 + <button class="btn waves-effect waves-light red" type="submit" name="action"
  31 + ng-click="cancelReset()">Cancel</button>
  32 + <button class="btn waves-effect waves-light green right" type="submit" name="action"
  33 + ng-click="resetPass(user_email)">Reset</button>
  34 + </div>
  35 + </form>
  36 +</div>
  37 +</div>
26 38 </div>
templates/resetpassword.html View file @ 453e33d
1   -<div class="container">
2   - <div class="row">
3   - <h1>Reset Password</h1>
4   - </div>
5   -
6   - <div class="row">
7   - <form class="col s12">
8   - <div class="row" ng-show="error" role="alert">
  1 +<div class="row" ng-show="success">
  2 + <h1>Reset password successful!</h1>
  3 +</div>
  4 +
  5 +<div class="container" ng-hide="success">
  6 +<div class="row">
  7 +<div class="offset-s2 col s8">
  8 +<div class="card">
  9 + <form class="col s12" name="resetpass_form">
  10 + <div class="card-content">
  11 + <h2 class="">Reset Password</h2>
  12 + </div>
  13 + <div class="divider"></div>
  14 + <div class="card-content">
  15 + <!--ERRORS-->
  16 + <div role="alert" ng-show="error">
9 17 <i style="color:#8E2323" class="mdi-alert-error"></i>
10   - <span style="color:#8E2323">Please use link from email!</span>
  18 + <span style="color:#8E2323">Please check your reset password link!</span>
11 19 </div>
12   - <div class="row">
13   - <input id="newpassword" type="password" class="validate" ng-model="newPassword" placeholder="New password" required/>
14   - <label for="newpassword">New password</label>
  20 + <div role="alert" ng-show="mismatch && newPassword != confirmPassword">
  21 + <i style="color:#8E2323" class="mdi-alert-error"></i>
  22 + <span style="color:#8E2323">Passwords do not match!</span>
15 23 </div>
16   - <div class="row">
17   - <input id="confirmpassword" type="password" class="validate" ng-model="confirmPassword" placeholder="Confirm password" required/>
  24 + <div role="alert" ng-show="unacceptable && newPassword.length < 8">
  25 + <i style="color:#8E2323" class="mdi-alert-error"></i>
  26 + <span style="color:#8E2323">Please make a password with at least 8 characters!</span>
  27 + </div>
  28 + <!--INPUTS-->
  29 + <div class="input-field">
  30 + <input id="newpassword" type="password" class="validate" ng-model="newPassword" placeholder="" required/>
  31 + <label for="newpassword">Password</label>
  32 + </div>
  33 + <div class="input-field">
  34 + <input id="confirmpassword" type="password" class="validate" ng-model="confirmPassword" placeholder="" required/>
18 35 <label for="confirmpassword">Confirm password</label>
19 36 </div>
20   - </form>
21   - <div class="row">
  37 + </div>
  38 +
  39 + <div class="card-action">
22 40 <button class="btn waves-effect waves-light red" type="submit" name="action"
23   - ng-click="cancelReset()">Cancel
24   - </button>
25   - <button class="btn waves-effect waves-light green" type="submit" name="action"
26   - ng-click="confirmResetPass(newPassword)">Confirm
27   - </button>
  41 + ng-click="cancelReset()">Cancel</button>
  42 + <button class="btn waves-effect waves-light green right" type="submit" name="action"
  43 + ng-click="confirmResetPass()">Confirm</button>
28 44 </div>
29   - </div>
  45 + </form>
  46 +</div>
  47 +</div>
  48 +</div>
30 49 </div>
templates/verifyemail.html View file @ 453e33d
  1 +<div class="row" ng-show="success">
  2 + <h1>Email verified!</h1>
  3 +</div>
  4 +
  5 +<div class="row" ng-show="error">
  6 + <h1>Problem with email verification!</h1>
  7 +</div>
  8 +
  9 +<div class="row" ng-show="!success && !error">
  10 + <p>hi, how did you get here?</p>
  11 +</div>