110swag / flashy-frontend

Download as
Browse Code ยป

Commit 6fd36f978c0cfd21cca17c1c5e10b758d343ac60

Authored by Andrew Buss
1 parent 742c7cd5f8
Exists in master and in 1 other branch ef9f9dd363e92d55eb4d80d036193be39572172b

autocomplete is working

Showing 7 changed files with 62 additions and 55 deletions Inline Diff

home.html View file @ 6fd36f9
<!DOCTYPE html> 1 1 <!DOCTYPE html>
<html ng-app="flashy"> 2 2 <html ng-app="flashy">
<base href="/app/"> 3 3 <base href="/app/">
<head> 4 4 <head>
<link type="text/css" rel="stylesheet" href="styles/materialize.min.css" media="screen,projection"/> 5 5 <link type="text/css" rel="stylesheet" href="styles/materialize.min.css" media="screen,projection"/>
<!--<link rel="stylesheet" href="styles/bootstrap-3.3.4-dist/css/bootstrap.css"/>--> 6 6 <!--<link rel="stylesheet" href="styles/bootstrap-3.3.4-dist/css/bootstrap.css"/>-->
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.8.3/angular-material.min.css"> 7 7 <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.0/angular-material.min.css">
8 8
<link rel="stylesheet" href="flashy.css"/> 9 9 <link rel="stylesheet" href="flashy.css"/>
</head> 10 10 </head>
11 11
<body ng-controller="RootController"> 12 12 <body ng-controller="RootController">
13 13
<ul id="nav" class="side-nav fixed"> 14 14 <ul id="nav" class="side-nav fixed">
<li class="bold"><a ui-sref="login">Login</a></li> 15 15 <li class="bold"><a ui-sref="login">Login</a></li>
<li class="bold"><a ui-sref="addclass">Add Class</a></li> 16 16 <li class="bold"><a ui-sref="addclass">Add Class</a></li>
</ul> 17 17 </ul>
<div class="container" ui-view></div> 18 18 <div class="container" ui-view></div>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script> 19 19 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.14/angular-ui-router.js"></script> 20 20 <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.14/angular-ui-router.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-cookies.js"></script> 21 21 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-cookies.js"></script>
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script> 22 22 <script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="scripts/materialize.min.js"></script> 23 23 <script type="text/javascript" src="scripts/materialize.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.0/angular-material.min.js"></script> 24 24 <script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.0/angular-material.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script> 25 25 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script> 26 26 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script>
27 27
<script src="config.js"></script> 28 28 <script src="config.js"></script>
29 29
<script src="scripts/FeedController.js"></script> 30 30 <script src="scripts/FeedController.js"></script>
<script src="scripts/RootController.js"></script> 31 31 <script src="scripts/RootController.js"></script>
<script src="scripts/LoginController.js"></script> 32 32 <script src="scripts/LoginController.js"></script>
<script src="scripts/LogoutController.js"></script> 33 33 <script src="scripts/LogoutController.js"></script>
<script src="scripts/DeckController.js"></script> 34 34 <script src="scripts/DeckController.js"></script>
<script src="scripts/RequestResetController.js"></script> 35 35 <script src="scripts/RequestResetController.js"></script>
<script src="scripts/ClassAddController.js"></script> 36 36 <script src="scripts/ClassAddController.js"></script>
<!--<script src="scripts/StudyController.js"></script>--> 37 37 <!--<script src="scripts/StudyController.js"></script>-->
<script src="scripts/UserService.js"></script> 38 38 <script src="scripts/UserService.js"></script>
scripts/ClassAddController.js View file @ 6fd36f9
angular.module('flashy.ClassAddController', ['ui.router', 'angucomplete-alt', 'ngMaterial']). 1 1 angular.module('flashy.ClassAddController', ['ui.router', 'angucomplete-alt', 'ngMaterial']).
2 2
controller('ClassAddController', ['$scope', '$state', '$http', function ($scope, $state, $http) { 3 3 controller('ClassAddController', ['$scope', '$state', '$http', function($scope, $state, $http) {
4 4
$scope.trySearch = function (searchText) { 5 5 $scope.trySearch = function(searchText) {
return $http.get('/api/sections/search/', { 6 6 return $http.get('/api/sections/search/', {
params: { 7 7 params: {
q: searchText 8 8 q: searchText
} 9 9 }
}).then(function (response) { 10 10 }).then(function(response) {
return response.data; 11 11 return response.data;
}) 12 12 });
}; 13 13 };
14 14
$scope.searchText = ""; 15 15 $scope.searchText = '';
16 16
/*$scope.trySearch = function() { 17 17 /*$scope.trySearch = function() {
$http.get('/api/sections/search', [$scope.searchText]). 18 18 $http.get('/api/sections/search', [$scope.searchText]).
success(function(data) { 19 19 success(function(data) {
return data; 20 20 return data;
}). 21 21 }).
error(function(err) { 22 22 error(function(err) {
console.log('you eejit'); 23 23 console.log('you eejit');
}); 24 24 });
};*/ 25 25 };*/
26 26
}]); 27 27 }]);
scripts/DeckController.js View file @ 6fd36f9
var app = angular.module('flashy.DeckController', ['ui.router']); 1 1 var app = angular.module('flashy.DeckController', ['ui.router']);
2 2
app.controller('DeckController', ['$scope', '$http', function($scope, $http) { 3 3 app.controller('DeckController', ['$scope', '$http', function($scope, $http) {
4
5 4
6 5
6
$scope.cards = []; 7 7 $scope.cards = [];
8
9 8
10 9
$scope.cards[0] = { "id": 1, "title": "title1", "content": "abc" }; 11
$scope.cards[1] = { "id": 2, "title": "title2", "content": "xyz" }; 12
$scope.cards[2] = { "id": 2, "title": "title3", "content": "qwe" }; 13
14 10
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' };
15 14
$scope.removeCard = function (item) { 16
17 15
16 $scope.removeCard = function(item) {
18 17
18
var index = $scope.cards.indexOf(item); 19 19 var index = $scope.cards.indexOf(item);
20 20
$scope.cards.splice(index, 1); 21 21 $scope.cards.splice(index, 1);
22 22
alert("removed card"); 23 23 alert('removed card');
} 24 24 };
25 25
26 26
$http.get('/api/sections/{pk}/deck'). 27 27 $http.get('/api/sections/{pk}/deck').
success(function (data) { 28 28 success(function(data) {
29 29
30 30
scripts/FeedController.js View file @ 6fd36f9
angular.module('flashy.FeedController', ['ui.router']). 1 1 angular.module('flashy.FeedController', ['ui.router']).
2 2
controller('FeedController', ['$scope', '$state', '$http', function($scope, $state, $http) { 3 3 controller('FeedController', ['$scope', '$state', '$http', function($scope, $state, $http) {
console.log('Hello from feed'); 4 4 console.log('Hello from feed');
5 5
$scope.viewDeck = function() { 6 6 $scope.viewDeck = function() {
$state.go('deck'); 7 7 $state.go('deck');
console.log('go to deck'); 8 8 console.log('go to deck');
}; 9 9 };
10 10
$scope.pullCard = function() { 11 11 $scope.pullCard = function() {
console.log('card clicked'); 12 12 console.log('card clicked');
}; 13 13 };
14 14
$scope.create = false; // show make flashcard 15 15 $scope.create = false; // show make flashcard
16 16
$scope.pushCard = function() { 17 17 $scope.pushCard = function() {
console.log('make! card content:' + $scope.text); 18 18 console.log('make! card content:' + $scope.text);
var pushed = new Date(Date.now()); 19 19 var pushed = new Date(Date.now());
console.log(pushed.toString()); 20 20 console.log(pushed.toString());
21 21
// attempt to make card :( 22 22 // attempt to make card :(
$http.post('/api/flashcards/', {"text": $scope.text, "pushed": pushed, "mask": []}). 23 23 $http.post('/api/flashcards/', {'text': $scope.text, 'pushed': pushed, 'mask': []}).
success(function(data) { 24 24 success(function(data) {
console.log("No way, really?"); 25 25 console.log('No way, really?');
}). 26 26 }).
error(function(error) { 27 27 error(function(error) {
console.log("haha, n00b"); 28 28 console.log('haha, n00b');
}); 29 29 });
30 30
$scope.create = false; // hide make flashcard 31 31 $scope.create = false; // hide make flashcard
$scope.text = ""; 32 32 $scope.text = '';
}; 33 33 };
34 34
$scope.flashcard = "hi i am a flashcard"; 35 35 $scope.flashcard = 'hi i am a flashcard';
scripts/LoginController.js View file @ 6fd36f9
angular.module('flashy.LoginController', ['ui.router']). 1 1 angular.module('flashy.LoginController', ['ui.router']).
2 2
controller('LoginController', ['$scope', '$state', '$http', 'UserService', 3 3 controller('LoginController', ['$scope', '$state', '$http', 'UserService',
function ($scope, $state, $http, UserService) { 4 4 function($scope, $state, $http, UserService) {
'use strict'; 5 5 'use strict';
6 6
$scope.uniqueError = false; 7 7 $scope.uniqueError = false;
$scope.loginError = false; 8 8 $scope.loginError = false;
$scope.login = function (email, password) { 9 9 $scope.login = function(email, password) {
$http.post('/api/login', JSON.stringify({ 10 10 $http.post('/api/login', JSON.stringify({
'email': email, 11 11 'email': email,
'password': password 12 12 'password': password
})). 13 13 })).
success(function (data) { 14 14 success(function(data) {
UserService.getUserData(); 15 15 UserService.getUserData();
$state.go('feed'); 16 16 $state.go('feed');
console.log(data); 17 17 console.log(data);
}). 18 18 }).
error(function (data, status, header, config) { 19 19 error(function(data, status, header, config) {
if (data.detail) { // assume 'invalid email or pass' 20 20 if (data.detail) { // assume 'invalid email or pass'
$scope.loginError = true; 21 21 $scope.loginError = true;
} 22 22 }
console.log(data); 23 23 console.log(data);
}); 24 24 });
}; 25 25 };
$scope.signUp = function (email, password) { 26 26 $scope.signUp = function(email, password) {
$http.post('/api/register', JSON.stringify({ 27 27 $http.post('/api/register', JSON.stringify({
'email': email, 28 28 'email': email,
'password': password 29 29 'password': password
})). 30 30 })).
success(function (data) { 31 31 success(function(data) {
$state.go('feed'); 32 32 $state.go('feed');
console.log(data); 33 33 console.log(data);
}). 34 34 }).
error(function (data, status, headers, config) { 35 35 error(function(data, status, headers, config) {
console.log(data.email); 36 36 console.log(data.email);
if (data.email == 'This field is required.') { 37 37 if (data.email == 'This field is required.') {
$scope.invalid = true; 38 38 $scope.invalid = true;
$scope.uniqueError = false; 39 39 $scope.uniqueError = false;
} else if (data.email) { 40 40 } else if (data.email) {
// assume 'email not unique' error 41 41 // assume 'email not unique' error
$scope.uniqueError = true; 42 42 $scope.uniqueError = true;
$scope.invalid = false; 43 43 $scope.invalid = false;
} 44 44 }
console.log(data); 45 45 console.log(data);
}); 46 46 });
47 47
}; 48 48 };
$scope.triggerPasswordReset = function () { 49 49 $scope.triggerPasswordReset = function() {
$state.go('requestpasswordreset'); 50 50 $state.go('requestpasswordreset');
}; 51 51 };
} 52 52 }
]); 53 53 ]);
54 54
scripts/RootController.js View file @ 6fd36f9
angular.module('flashy.RootController', ['ui.router']). 1 1 angular.module('flashy.RootController', ['ui.router']).
2 2
controller('RootController', ['$scope', '$state', 'UserService', function ($scope, $state, UserService) { 3 3 controller('RootController', ['$scope', '$state', 'UserService', function($scope, $state, UserService) {
if (UserService.isLoggedIn()) $state.go('login'); 4 4 if (UserService.isLoggedIn()) $state.go('login');
else $state.go('addclass'); 5 5 else $state.go('addclass');
}]); 6 6 }]);
templates/addclass.html View file @ 6fd36f9
<div layout="column"> 1 1 <div>
<div> 2 2
<md-content layout-padding layout="column"> 3 3 <div layout="column">
<form> 4 4 <md-content layout-padding="" layout="column" style="overflow:hidden">
<md-autocomplete flex 5 5
nd-no-cache="noCache" 6 6 <form ng-submit="$event.preventDefault()">
md-selected-item="selectedItem" 7 7 <div layout="column">
md-search-text="searchText" 8 8 <md-autocomplete flex=""
md-items="item in trySearch(searchText)" 9 9 md-autofocus="true"
md-item-text="item.short_name" 10 10 md-selected-item="selectedItem"
md-floating-label="Search Classes"> 11 11 md-search-text="searchText"
<md-item-template> 12 12 md-items="item in trySearch(searchText)"
<span md-highlight-text="searchText">{{item.long_name}}</span> 13 13 md-item-text="item.short_name"
</md-item-template> 14 14 >
<md-not-found> 15 15 <md-item-template>
No matching classes found. 16 16 <div layout="row">
</md-not-found> 17 17 <div>{{item.short_name}}: {{item.course_title}} ({{item.instructor}})</div>
</md-autocomplete> 18 18 <div style="margin-left:auto;text-align:right;padding-left:30px">{{item.lecture_times}}</div>
19 </div>
20 </md-item-template>
21 <md-not-found>
22 No classes match "{{searchText}}".
23 </md-not-found>
24 </md-autocomplete>
25 </div>
</form> 19 26 </form>
</md-content> 20 27 </md-content>
</div> 21 28 </div>
</div> 22 29 </div>
23