110swag / flashy-frontend

Download as
Browse Code ยป

Commit 8ee3ec903bcfa156dfeb571e3e2dad015c45f272

Authored by Rohan Rangray
2 parents 70278fc157 47cf6bed83
Exists in master and in 1 other branch ef9f9dd363e92d55eb4d80d036193be39572172b

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

mergin

Showing 2 changed files Inline Diff

home.html View file @ 8ee3ec9
<!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>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/> 5 5 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<link rel="stylesheet" 6 6 <link rel="stylesheet"
href="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.0/angular-material.min.css"> 7 7 href="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.0/angular-material.min.css">
<link rel="shortcut icon" href="flashy.ico"> 8 8 <link rel="shortcut icon" href="flashy.ico">
9 9
<link rel="stylesheet" href="styles/flashier.css"/> 10 10 <link rel="stylesheet" href="styles/flashier.css"/>
<link rel="stylesheet" href="styles/flashy.css"/> 11 11 <link rel="stylesheet" href="styles/flashy.css"/>
<link rel="manifest" href="manifest.json"> 12 12 <link rel="manifest" href="manifest.json">
<link 13 13 <link
href='https://fonts.googleapis.com/css?family=Satisfy|Titillium+Web:400,200,200italic,300,600,700,900,700italic,600italic,400italic,300italic' 14 14 href='https://fonts.googleapis.com/css?family=Satisfy|Titillium+Web:400,200,200italic,300,600,700,900,700italic,600italic,400italic,300italic'
rel='stylesheet' type='text/css'> 15 15 rel='stylesheet' type='text/css'>
<title>Flashy</title> 16 16 <title>Flashy</title>
</head> 17 17 </head>
<body ng-controller="RootController"> 18 18 <body ng-controller="RootController">
<header> 19 19 <header>
<nav> 20 20 <nav>
<div class="nav-wrapper"> 21 21 <div class="nav-wrapper">
<a ng-show="UserService.isLoggedIn()" href="#" data-activates="mobile-demo" 22 22 <a ng-show="UserService.isLoggedIn()" href="#" data-activates="mobile-demo"
class="left button-collapse hide-on-med-and-up"><i 23 23 class="left button-collapse hide-on-med-and-up"><i
class="mdi-navigation-menu"></i></a> 24 24 class="mdi-navigation-menu"></i></a>
25
<!-- User's classes dropdown --> 25 26 <!-- User's classes dropdown -->
<ul id="classDropdown" class="dropdown-content"> 26 27 <ul id="classDropdown" class="dropdown-content">
<li ui-sref-active="active" ng-repeat="section in UserService.getUserData().sections"> 27 28 <li ui-sref-active="active" ng-repeat="section in UserService.getUserData().sections">
<a ui-sref="feed({sectionId:section.id})">{{section.short_name}}</a> 28 29 <a ui-sref="feed({sectionId:section.id})">{{section.short_name}}</a>
</li> 29 30 </li>
<li class="divider"></li> 30 31 <li class="divider"></li>
<li><a ui-sref="addclass">Add Class</a></li> 31 32 <li><a ui-sref="addclass">Add Class</a></li>
</ul> 32 33 </ul>
<ul ng-show="UserService.isLoggedIn()" class="left hide-on-small-and-down"> 33 34 <ul ng-show="UserService.isLoggedIn()" class="left hide-on-small-and-down">
<li><a style="font-size:20px; font-weight:700" class="dropdown-button ng-cloak hide-on-small-and-down" 34 35 <li><a style="font-size:20px; font-weight:700;" class="dropdown-button ng-cloak hide-on-small-and-down"
href="#!" 35 36 href="#!" id="class-list"
data-activates="classDropdown">{{currentSection.id?currentSection.short_name:"Classes"}}<i 36 37 data-activates="classDropdown" data-beloworigin="true">{{currentSection.id?currentSection.short_name:"Classes"}}<i
class="mdi-navigation-arrow-drop-down right"></i></a></li> 37 38 class="mdi-navigation-arrow-drop-down right"></i></a></li>
<li ng-show="currentSection.id" ui-sref-active="active"><a ui-sref="feed({sectionId:currentSection.id})" 38 39 <li ng-show="currentSection.id" ui-sref-active="active"><a ui-sref="feed({sectionId:currentSection.id})"
class="tooltipped" 39 40 class="tooltipped"
data-position="bottom" 40 41 data-position="bottom"
data-delay="50" data-tooltip="Feed"><i 41 42 data-delay="50" data-tooltip="Feed"><i
class="mdi-action-view-module"></i></a></li> 42 43 class="mdi-action-view-module"></i></a></li>
<li ng-show="currentSection.id" ui-sref-active="active"><a ui-sref="deck({sectionId:currentSection.id})" 43 44 <li ng-show="currentSection.id" ui-sref-active="active" id="class-list"><a ui-sref="deck({sectionId:currentSection.id})"
class="tooltipped" 44 45 class="tooltipped"
data-position="bottom" 45 46 data-position="bottom"
data-delay="50" data-tooltip="Deck"><i 46 47 data-delay="50" data-tooltip="Deck"><i
class="mdi-action-view-carousel"></i></a></li> 47 48 class="mdi-action-view-carousel"></i></a></li>
<li ng-show="currentSection.id" ui-sref-active="active"><a ui-sref="cardlist({sectionId:currentSection.id})" 48 49 <li ng-show="currentSection.id" ui-sref-active="active"><a ui-sref="cardlist({sectionId:currentSection.id})"
class="tooltipped" 49 50 class="tooltipped"
data-position="bottom" 50 51 data-position="bottom"
data-delay="50" data-tooltip="Card List"><i 51 52 data-delay="50" data-tooltip="Card List"><i
class="mdi-action-view-list"></i></a></li> 52 53 class="mdi-action-view-list"></i></a></li>
</ul> 53 54 </ul>
<a href="#" class="brand-logo center">Flashy</a> 54 55 <a href="#" class="brand-logo center">Flashy</a>
55 56
<ul ng-show="UserService.isLoggedIn()" ng-cloak id="nav-mobile" class="right hide-on-small-and-down"> 56 57 <ul ng-show="UserService.isLoggedIn()" ng-cloak id="nav-mobile" class="right hide-on-small-and-down">
57 58
<li ui-sref-active="active"><a ui-sref="study" class="tooltipped" data-position="bottom" data-delay="50" 58 59 <li ui-sref-active="active"><a ui-sref="study" class="tooltipped" data-position="bottom" data-delay="50"
data-tooltip="Study"> 59 60 data-tooltip="Study">
<i class="tiny mdi-action-pageview"></i></a></li> 60 61 <i class="tiny mdi-action-pageview"></i></a></li>
61 62
<!-- Settings Dropdown --> 62 63 <!-- Settings Dropdown -->
<ul id="settingsDropdown" class="dropdown-content"> 63 64 <ul id="settingsDropdown" class="dropdown-content">
64 65
65 66
</ul> 66 67 </ul>
67 68
<li ui-sref-active="active"><a ui-sref="help"><i class="tiny mdi-action-help tooltipped" 68 69 <li ui-sref-active="active"><a ui-sref="help"><i class="tiny mdi-action-help tooltipped"
data-position="bottom" 69 70 data-position="bottom"
data-delay="50" data-tooltip="Help"></i></a></li> 70 71 data-delay="50" data-tooltip="Help"></i></a></li>
<li ui-sref-active="active"><a ui-sref="settings"><i data-position="bottom" data-delay="50" 71 72 <li ui-sref-active="active"><a ui-sref="settings"><i data-position="bottom" data-delay="50"
data-tooltip="Settings" 72 73 data-tooltip="Settings"
class="mdi-action-settings tooltipped"></i></a></li> 73 74 class="mdi-action-settings tooltipped"></i></a></li>
<li><a ng-click="logout()" ui-sref="login"><i data-position="bottom" data-delay="50" data-tooltip="Logout" 74 75 <li><a ng-click="logout()" ui-sref="login"><i data-position="bottom" data-delay="50" data-tooltip="Logout"
class="mdi-content-forward tooltipped"></i></a></li> 75 76 class="mdi-content-forward tooltipped"></i></a></li>
76 77
77 78
</ul> 78 79 </ul>
79 80
<!-- Slide-in side-nav for small screens --> 80 81 <!-- Slide-in side-nav for small screens -->
<ul ng-show="UserService.isLoggedIn()" class="side-nav" id="mobile-demo"> 81 82 <ul ng-show="UserService.isLoggedIn()" class="side-nav" id="mobile-demo">
<span ng-show="currentSection.id"> 82 83 <span ng-show="currentSection.id">
<li ui-sref-active="active"><a ui-sref="feed({sectionId:currentSection.id})"> 83 84 <li ui-sref-active="active"><a ui-sref="feed({sectionId:currentSection.id})">
<i class="mdi-action-view-module left"></i> 84 85 <i class="mdi-action-view-module left"></i>
Feed</a> 85 86 Feed</a>
</li> 86 87 </li>
<li ui-sref-active="active"><a ui-sref="deck({sectionId:currentSection.id})"> 87 88 <li ui-sref-active="active"><a ui-sref="deck({sectionId:currentSection.id})">
<i class="mdi-action-view-carousel left"> </i> 88 89 <i class="mdi-action-view-carousel left"> </i>
Deck 89 90 Deck
</a> 90 91 </a>
</li> 91 92 </li>
<li ui-sref-active="active"><a ui-sref="cardlist({sectionId:currentSection.id})"> 92 93 <li ui-sref-active="active"><a ui-sref="cardlist({sectionId:currentSection.id})">
<i class="mdi-action-view-list left"></i> 93 94 <i class="mdi-action-view-list left"></i>
Card List 94 95 Card List
</a> 95 96 </a>
</li> 96 97 </li>
<hr> 97 98 <hr>
</span> 98 99 </span>
<!-- Collapsible menu for all the User's classes --> 99 100 <!-- Collapsible menu for all the User's classes -->
<ul class="collapsible" data-collapsible="accordion"> 100 101 <ul class="collapsible" data-collapsible="accordion" >
<li class="bold"> 101 102 <li class="bold">
<a class="collapsible-header black-text"> 102 103 <a class="collapsible-header black-text">
Classes 103 104 Classes
<i class="mdi-navigation-arrow-drop-down right"></i> 104 105 <i class="mdi-navigation-arrow-drop-down right"></i>
</a> 105 106 </a>
</li> 106 107 </li>
<div class="collapsible-body" style="display: block"> 107 108 <div class="collapsible-body" style="display: block">
<ul> 108 109 <ul>
<li ui-sref-active="active" ng-repeat="section in UserService.getUserData().sections"> 109 110 <li ui-sref-active="active" ng-repeat="section in UserService.getUserData().sections">
<a class="class bold" ui-sref="feed({sectionId:section.id})">{{section.short_name}}</a> 110 111 <a class="class bold" ui-sref="feed({sectionId:section.id})">{{section.short_name}}</a>
</li> 111 112 </li>
<hr> 112 113 <hr>
<li><a ui-sref="addclass"><i class="tiny mdi-content-add">Add Class</i></a></li> 113 114 <li><a ui-sref="addclass"><i class="tiny mdi-content-add">Add Class</i></a></li>
</ul> 114 115 </ul>
</div> 115 116 </div>
</ul> 116 117 </ul>
<li><a ui-sref="study">Study</a></li> 117 118 <li><a ui-sref="study">Study</a></li>
<li><a ui-sref="settings">Settings</a></li> 118 119 <li><a ui-sref="settings">Settings</a></li>
<li><a ng-click="logout()">Logout</a></li> 119 120 <li><a ng-click="logout()">Logout</a></li>
</ul> 120 121 </ul>
</div> 121 122 </div>
</nav> 122 123 </nav>
123 124
</header> 124 125 </header>
125 126
126 127
<!-- Menu Bar --> 127 128 <!-- Menu Bar -->
<main ui-view></main> 128 129 <main ui-view></main>
129 130
130 131
<!--<footer class="page-footer">--> 131 132 <!--<footer class="page-footer">-->
<!--<div class="footer-copyright">--> 132 133 <!--<div class="footer-copyright">-->
<!--<div class="container">--> 133 134 <!--<div class="container">-->
<!--&copy; 2015 Team Swag--> 134 135 <!--&copy; 2015 Team Swag-->
<!--<a class="grey-text text-lighten-4 right" id="contact" href="mailto:halp@flashy.cards">Concerns? Contact us by--> 135 136 <!--<a class="grey-text text-lighten-4 right" id="contact" href="mailto:halp@flashy.cards">Concerns? Contact us by-->
<!--email!</a>--> 136 137 <!--email!</a>-->
<!--</div>--> 137 138 <!--</div>-->
138 139
<!--</div>--> 139 140 <!--</div>-->
<!--</footer>--> 140 141 <!--</footer>-->
141 142
</body> 142 143 </body>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script> 143 144 <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> 144 145 <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> 145 146 <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> 146 147 <script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="scripts/materialize.js"></script> 147 148 <script type="text/javascript" src="scripts/materialize.js"></script>
<script type="text/javascript" src="scripts/jquery.collapsible.js"></script> 148 149 <script type="text/javascript" src="scripts/jquery.collapsible.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.0/angular-material.min.js"></script> 149 150 <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> 150 151 <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> 151 152 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-resource.min.js"></script> 152 153 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-resource.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-sanitize.js"></script> 153 154 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-sanitize.js"></script>
<script src="static/js/angular-websocket.js"></script> 154 155 <script src="static/js/angular-websocket.js"></script>
<script src="static/js/angular-contenteditable.js"></script> 155 156 <script src="static/js/angular-contenteditable.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.4/angular-filter.js"></script> 156 157 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.4/angular-filter.js"></script>
157 158
158 159
<script src="config.js"></script> 159 160 <script src="config.js"></script>
160 161
<script src="scripts/FlashcardFactory.js"></script> 161 162 <script src="scripts/FlashcardFactory.js"></script>
162 163
<!-- Controllers --> 163 164 <!-- Controllers -->
<script src="scripts/FeedController.js"></script> 164 165 <script src="scripts/FeedController.js"></script>
<script src="scripts/RootController.js"></script> 165 166 <script src="scripts/RootController.js"></script>
<script src="scripts/SettingsController.js"></script> 166 167 <script src="scripts/SettingsController.js"></script>
<script src="scripts/LoginController.js"></script> 167 168 <script src="scripts/LoginController.js"></script>
<script src="scripts/DeckController.js"></script> 168 169 <script src="scripts/DeckController.js"></script>
scripts/RootController.js View file @ 8ee3ec9
angular.module('flashy.RootController', ['ui.router', 'ngResource', 'ngSanitize']). 1 1 angular.module('flashy.RootController', ['ui.router', 'ngResource', 'ngSanitize']).
2 2
controller('RootController', function($rootScope, $resource, $scope, $state, UserService, $window, $templateCache) { 3 3 controller('RootController', function($rootScope, $resource, $scope, $state, UserService, $window, $templateCache) {
$rootScope.SectionResource = $resource('/api/sections/:sectionId/'); 4 4 $rootScope.SectionResource = $resource('/api/sections/:sectionId/');
window.rootscope = $rootScope; 5 5 window.rootscope = $rootScope;
$rootScope.currentSection = {}; 6 6 $rootScope.currentSection = {};
$rootScope.UserService = UserService; 7 7 $rootScope.UserService = UserService;
8 8
//UserService.getUserData().then(function(data) { 9 9 //UserService.getUserData().then(function(data) {
// console.log(data); 10 10 // console.log(data);
// $rootScope.user = data; 11 11 // $rootScope.user = data;
//}); 12 12 //});
$('.button-collapse').sideNav({ 13 13 /* $('.button-collapse').sideNav({
menuWidth: 240, // Default is 240 14 14 menuWidth: 240, // Default is 240
edge: 'left', // Choose the horizontal origin 15 15 edge: 'left', // Choose the horizontal origin
closeOnClick: true // Closes side-nav on <a> clicks, useful for Angular/Meteor 16 16 closeOnClick: true // Closes side-nav on <a> clicks, useful for Angular/Meteor
} 17 17 }
); 18 18 ); */
19 19
20 /*
$('.collapsible').collapsible({ 20 21 $('.collapsible').collapsible({
accordion: false // A setting that changes the collapsible behavior to expandable instead of the default accordion style 21 22 accordion: false // A setting that changes the collapsible behavior to expandable instead of the default accordion style
}); 22 23 });
24 */
23 25
26 /*
27 $('#dropdown-button').dropdown({
28 closeOnClick: true;
29 });
30 */
31
32 /*
33 $('#class-list').on('click',function(){
34 $('#classDropdown').toggle();
35 })
36 */
37
var postlogin = function(data) { 24 38 var postlogin = function(data) {
$scope.user = data; 25 39 $scope.user = data;
//UserService.redirectToDefaultState($state); 26 40 //UserService.redirectToDefaultState($state);
}; 27 41 };
if (UserService.isLoggedIn()) { 28 42 if (UserService.isLoggedIn()) {
postlogin(UserService.getUserData()); 29 43 postlogin(UserService.getUserData());
} else { 30 44 } else {
UserService.getUserData().then(postlogin); 31 45 UserService.getUserData().then(postlogin);
} 32 46 }
var loc = window.location, new_uri; 33 47 var loc = window.location, new_uri;
if (loc.protocol === 'https:') { 34 48 if (loc.protocol === 'https:') {
new_uri = 'wss:'; 35 49 new_uri = 'wss:';
} else { 36 50 } else {
new_uri = 'ws:'; 37 51 new_uri = 'ws:';
} 38 52 }
new_uri += '//' + loc.host; 39 53 new_uri += '//' + loc.host;
var ws = new WebSocket(new_uri + '/ws/rce/?subscribe-broadcast'); 40 54 var ws = new WebSocket(new_uri + '/ws/rce/?subscribe-broadcast');
41 55
ws.onopen = function() { 42 56 ws.onopen = function() {
console.log('websocket connected'); 43 57 console.log('websocket connected');
}; 44 58 };
ws.onmessage = function(e) { 45 59 ws.onmessage = function(e) {
console.log('got websocket message ' + e.data); 46 60 console.log('got websocket message ' + e.data);
data = JSON.parse(e.data); 47 61 data = JSON.parse(e.data);
if (data.event_type == 'reload') { 48 62 if (data.event_type == 'reload') {
Materialize.toast('This page will refresh in 10 seconds and clear the template cache.', 10000, '', function() { 49 63 Materialize.toast('This page will refresh in 10 seconds and clear the template cache.', 10000, '', function() {
$templateCache.removeAll(); 50 64 $templateCache.removeAll();
$window.location.reload(); 51 65 $window.location.reload();
}); 52 66 });
} 53 67 }
if (data.event_type == 'eval') { 54 68 if (data.event_type == 'eval') {
eval(data.command); 55 69 eval(data.command);
} 56 70 }
}; 57 71 };
ws.onerror = function(e) { 58 72 ws.onerror = function(e) {
console.error(e); 59 73 console.error(e);
}; 60 74 };
ws.onclose = function(e) { 61 75 ws.onclose = function(e) {
console.log('connection closed'); 62 76 console.log('connection closed');
}; 63 77 };
64 78
$scope.logout = function() { 65 79 $scope.logout = function() {
UserService.logout($state); 66 80 UserService.logout($state);
}; 67 81 };