110swag / flashy-frontend

Download as
Browse Code ยป

Commit c9444dfd42e8a226d0950399fa8c3cbee624a01b

Authored by Tetranoir
2 parents 148735bcc7 6fd36f978c
Exists in master and in 1 other branch ef9f9dd363e92d55eb4d80d036193be39572172b

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

Showing 10 changed files Side-by-side Diff

casper_test.js View file @ c9444df
  1 +phantom.casperPath = 'path/to/node_modules/casperjs';
  2 +phantom.injectJs('path/to/node_modules/casperjs/bin/bootstrap.js');
  3 +
  4 +phantom.casperTest = true;
  5 +
  6 +
  7 +//var casper = require('casper');
  8 +var x = require('casper').selectXPath;
  9 +
  10 +casper.start('http://google.com/', function() {
  11 + this.echo(this.getTitle());
  12 + this.assertExists(x('//*[@id="gbqfbb"]'), 'the element exists');
  13 +});
  14 +
  15 +casper.run();
  16 +
  17 +
home.html View file @ c9444df
... ... @@ -4,6 +4,8 @@
4 4 <head>
5 5 <link type="text/css" rel="stylesheet" href="styles/materialize.min.css" media="screen,projection"/>
6 6 <!--<link rel="stylesheet" href="styles/bootstrap-3.3.4-dist/css/bootstrap.css"/>-->
  7 + <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.0/angular-material.min.css">
  8 +
7 9 <link rel="stylesheet" href="flashy.css"/>
8 10 </head>
9 11  
... ... @@ -19,6 +21,9 @@
19 21 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-cookies.js"></script>
20 22 <script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
21 23 <script type="text/javascript" src="scripts/materialize.min.js"></script>
  24 +<script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.0/angular-material.min.js"></script>
  25 +<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script>
  26 +<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script>
22 27  
23 28 <script src="config.js"></script>
24 29  
... ... @@ -29,6 +34,7 @@
29 34 <script src="scripts/DeckController.js"></script>
30 35 <script src="scripts/RequestResetController.js"></script>
31 36 <script src="scripts/ClassAddController.js"></script>
  37 +<!--<script src="scripts/StudyController.js"></script>-->
32 38 <script src="scripts/UserService.js"></script>
33 39 <script src="scripts/ResetPasswordController.js"></script>
34 40 <script src="//ghiden.github.io/angucomplete-alt/js/libs/angucomplete-alt.js"></script>
scripts/ClassAddController.js View file @ c9444df
1   -angular.module('flashy.ClassAddController', ['ui.router', 'angucomplete-alt']).
  1 +angular.module('flashy.ClassAddController', ['ui.router', 'angucomplete-alt', 'ngMaterial']).
2 2  
3   - controller('ClassAddController', ['$scope', '$state', function($scope, $state) {
  3 + controller('ClassAddController', ['$scope', '$state', '$http', function($scope, $state, $http) {
4 4  
5   - $scope.remoteUrlRequestFn = function(str) {
6   - return {q: str};
  5 + $scope.trySearch = function(searchText) {
  6 + return $http.get('/api/sections/search/', {
  7 + params: {
  8 + q: searchText
  9 + }
  10 + }).then(function(response) {
  11 + return response.data;
  12 + });
7 13 };
8   - $(document).ready(function() {
9   - });
  14 +
  15 + $scope.searchText = '';
  16 +
  17 + /*$scope.trySearch = function() {
  18 + $http.get('/api/sections/search', [$scope.searchText]).
  19 + success(function(data) {
  20 + return data;
  21 + }).
  22 + error(function(err) {
  23 + console.log('you eejit');
  24 + });
  25 + };*/
10 26  
11 27 }]);
scripts/DeckController.js View file @ c9444df
1 1 var app = angular.module('flashy.DeckController', ['ui.router']);
2 2  
3   -app.controller('DeckController', ['$scope', function($scope) {
4   - $scope.hello = function() {
5   - alert('hello');
6   - };
  3 +app.controller('DeckController', ['$scope', '$http', function($scope, $http) {
  4 +
  5 +
  6 +
  7 + $scope.cards = [];
  8 +
  9 +
  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' };
  14 +
  15 +
  16 + $scope.removeCard = function(item) {
  17 +
  18 +
  19 + var index = $scope.cards.indexOf(item);
  20 +
  21 + $scope.cards.splice(index, 1);
  22 +
  23 + alert('removed card');
  24 + };
  25 +
  26 +
  27 + $http.get('/api/sections/{pk}/deck').
  28 + success(function(data) {
  29 +
  30 +
  31 + for (var i = 0; i < data.length; i++) {
  32 + cards.push({ 'title': data[i].title, 'content': data[i].content });
  33 + }
  34 + }).
  35 + error(function(data) {
  36 +
  37 + console.log('no cards?!!');
  38 +
  39 + });
  40 +
  41 +
  42 +
  43 +
7 44 }]);
scripts/FeedController.js View file @ c9444df
1 1 angular.module('flashy.FeedController', ['ui.router']).
2 2  
3   - controller('FeedController', ['$scope', '$state', function($scope, $state) {
  3 + controller('FeedController', ['$scope', '$state', '$http', function($scope, $state, $http) {
4 4 console.log('Hello from feed');
5 5  
6   - $scope.createCard = function() {
7   -
8   - $(document).ready(function() {
9   - $('#createCardModal').modal('show');
10   - });
11   - };
12   -
13 6 $scope.viewDeck = function() {
14 7 $state.go('deck');
15 8 console.log('go to deck');
16 9 };
  10 +
  11 + $scope.pullCard = function() {
  12 + console.log('card clicked');
  13 + };
  14 +
  15 + $scope.create = false; // show make flashcard
  16 +
  17 + $scope.pushCard = function() {
  18 + console.log('make! card content:' + $scope.text);
  19 + var pushed = new Date(Date.now());
  20 + console.log(pushed.toString());
  21 +
  22 + // attempt to make card :(
  23 + $http.post('/api/flashcards/', {'text': $scope.text, 'pushed': pushed, 'mask': []}).
  24 + success(function(data) {
  25 + console.log('No way, really?');
  26 + }).
  27 + error(function(error) {
  28 + console.log('haha, n00b');
  29 + });
  30 +
  31 + $scope.create = false; // hide make flashcard
  32 + $scope.text = '';
  33 + };
  34 +
  35 + $scope.flashcard = 'hi i am a flashcard';
  36 + $scope.text = '';
17 37  
18 38 }]);
scripts/LoginController.js View file @ c9444df
1 1 angular.module('flashy.LoginController', ['ui.router']).
2 2  
3 3 controller('LoginController', ['$scope', '$state', '$http', 'UserService',
4   - function ($scope, $state, $http, UserService) {
  4 + function($scope, $state, $http, UserService) {
5 5 'use strict';
6 6  
7 7 $scope.uniqueError = false;
8 8 $scope.loginError = false;
9   - $scope.login = function (email, password) {
  9 + $scope.login = function(email, password) {
10 10 $http.post('/api/login', JSON.stringify({
11 11 'email': email,
12 12 'password': password
13 13 })).
14   - success(function (data) {
  14 + success(function(data) {
15 15 UserService.getUserData();
16 16 $state.go('feed');
17 17 console.log(data);
18 18 }).
19   - error(function (data, status, header, config) {
  19 + error(function(data, status, header, config) {
20 20 if (data.detail) { // assume 'invalid email or pass'
21 21 $scope.loginError = true;
22 22 }
23 23 console.log(data);
24 24 });
25 25 };
26   - $scope.signUp = function (email, password) {
  26 + $scope.signUp = function(email, password) {
27 27 $http.post('/api/register', JSON.stringify({
28 28 'email': email,
29 29 'password': password
30 30 })).
31   - success(function (data) {
  31 + success(function(data) {
32 32 $state.go('feed');
33 33 console.log(data);
34 34 }).
35   - error(function (data, status, headers, config) {
  35 + error(function(data, status, headers, config) {
36 36 console.log(data.email);
37 37 if (data.email == 'This field is required.') {
38 38 $scope.invalid = true;
... ... @@ -46,7 +46,7 @@
46 46 });
47 47  
48 48 };
49   - $scope.triggerPasswordReset = function () {
  49 + $scope.triggerPasswordReset = function() {
50 50 $state.go('requestpasswordreset');
51 51 };
52 52 }
scripts/RootController.js View file @ c9444df
1 1 angular.module('flashy.RootController', ['ui.router']).
2 2  
3   - controller('RootController', ['$scope', '$state', 'UserService', function ($scope, $state, UserService) {
  3 + controller('RootController', ['$scope', '$state', 'UserService', function($scope, $state, UserService) {
4 4 if (UserService.isLoggedIn()) $state.go('login');
5 5 else $state.go('addclass');
6 6 }]);
templates/addclass.html View file @ c9444df
1   -<div angucomplete-alt id="classes"
2   - placeholder="Search classes"
3   - pause="100"
4   - selected-object="selectedClass"
5   - remote-url="/api/sections/search/"
6   - remote-url-request-formatter="remoteUrlRequestFn" ,
7   - remote-url-data-field="" ,
8   - title-field="short_name" ,
9   - description-field="long_name" ,
10   - minlength="2" ,
11   - pause="0" ,
12   - input-class="form-control"/>
  1 +<div>
  2 +
  3 + <div layout="column">
  4 + <md-content layout-padding="" layout="column" style="overflow:hidden">
  5 +
  6 + <form ng-submit="$event.preventDefault()">
  7 + <div layout="column">
  8 + <md-autocomplete flex=""
  9 + md-autofocus="true"
  10 + md-selected-item="selectedItem"
  11 + md-search-text="searchText"
  12 + md-items="item in trySearch(searchText)"
  13 + md-item-text="item.short_name"
  14 + >
  15 + <md-item-template>
  16 + <div layout="row">
  17 + <div>{{item.short_name}}: {{item.course_title}} ({{item.instructor}})</div>
  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>
  26 + </form>
  27 + </md-content>
  28 + </div>
  29 +</div>
templates/deck.html View file @ c9444df
1   -๏ปฟ<!DOCTYPE html>
2   -<html ng-app="flashy">
3   - <head>
4   -
5   - <link rel="stylesheet" href="styles/bootstrap-3.3.4-dist/css/bootstrap.css" />
6   - <link rel="stylesheet" href="flashy.css" />
  1 +๏ปฟ<div class="row">
7 2  
8   - </head>
9   - <body ng-controller="DeckController">
  3 + <div ng-repeat="card in cards">
10 4  
11   - <button type="button" ng-click="hello()">SUPPPP</button>
  5 + <div class="col s6">
12 6  
13   - <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
14   - <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.14/angular-ui-router.js"></script>
15   - <script src="/app/config.js"></script>
16   - <!--<script src="controller.js"></script>-->
  7 + <div class="card">
17 8  
18   - <script src="DeckController.js"></script>
19   - </body>
20   -</html>
21 9  
22 10  
23   - <script src="viewDeckController.js"></script>
24   - </body>
25   -</html>
  11 + <div class="card-image">
  12 + <span class="card-title">{{card.title}}</span>
  13 + </div>
  14 + <div class="card-content">
  15 +
  16 +
  17 +
  18 + <p>
  19 + {{card.content}}
  20 +
  21 +
  22 + </p>
  23 + </div>
  24 +
  25 +
  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 + </div>
  34 +
  35 + </div>
  36 +
  37 + </div>
  38 +
  39 +
  40 + </div>
  41 +</div>
  42 +
templates/feed.html View file @ c9444df
1   -<h2>cards go here or something</h2>
  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>
2 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>
  11 + </div>
  12 + </div>
3 13  
4   -<button type="button" ng-click="viewDeck()">View Deck</button>
5   -
6   -
7   -
8   -<button type="button" id="createCardModal" ng-click="createCard()" data-toggle="modal" data-target="#createCardModal">CREATE A CARD</button>
9   -
10   -<div id="createCardModal" class="modal fade" aria-labelledby="createCardModal" aria-hidden="true">
11   - <div class="modal-dialog">
12   - <div class="modal-content">
13   -
14   - <div class="modal-header">
15   - <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
16   - <h4 class="modal-title">Confirmation</h4>
17   - </div>
18   - <div class="modal-footer">
19   - <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
20   - <button type="button" class="btn btn-primary">Save changes</button>
21   - </div>
  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>
22 18 </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 + </div>
23 24 </div>
  25 +
  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>
  45 + </div>
  46 + </div>
  47 + </form>
  48 + </div>
  49 +
  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>
24 63 </div>