110swag / flashy-frontend

Commit f0541be900e37f9c65f920ea1de48d7f927a30ab

Authored by Andrew Buss 2015-05-25 00:13:49 -0700

navbar icons!

Showing 7 changed files with 45 additions and 84 deletions Side-by-side Diff

config.js
home.html
scripts/FeedController.js
scripts/RootController.js
templates/cardlist.html
templates/deck.html
templates/feed.html

...	...	@@ -65,7 +65,7 @@
65	65	}).
66	66	state('root', {
67	67	resolve: auth_resolve,
68		- url: '/',
	68	+ url: '',
69	69	templateUrl: 'templates/root.html',
70	70	controller: 'RootController'
71	71	}).

...	...	@@ -14,54 +14,35 @@
14	14	</head>
15	15	<header>
16	16
17		- <!--<a href="#" style="position:absolute;top:0;left:0;" data-activates="sidebar" class="button-collapse"><i
18		- class="medium mdi-navigation-menu"></i></a>
19		- <ul ng-show="isLoggedIn" id="sidebar" class="side-nav fixed ng-cloak">
20		- <li class="logo"><a href="//flashy.cards/" id="logo-container">
21		-
22		- <h1>Flashy</h1>
23		- </a></li>
24		- <li class="no-padding">
25		- <ul class="collapsible" data-collapsible="accordion">
26		- <li class="bold">
27		- <a class="collapsible-header black-text">Classes</a>
28		- </li>
29		- <div class="collapsible-body" style="display: block">
30		- <ul>
31		- <li ui-sref-active="active" ng-repeat="section in sections">
32		- <a class="class bold" ui-sref="feed({sectionId:{{section.id}}})">{{section.short_name}}</a>
33		- </li>
34		- </ul>
35		- </div>
36		- </ul>
37		- </li>
38		- <li class="bold"><a ui-sref="addclass">Add Class</a></li>
39		- <li class="bold"><a ui-sref="study">Study</a></li>
40		- <li class="bold"><a ui-sref="logout">Logout</a></li>
41		- </ul>-->
42		-
43		-
44	17	</header>
45	18	<body ng-controller="RootController">
46	19
47	20	<!-- Menu Bar -->
48	21	<nav>
49	22	<div class="nav-wrapper">
	23	+ <ul ng-show="sectionId && isLoggedIn" class="left">
	24	+ <li ui-sref-active="active"><a ui-sref="feed({sectionId:sectionId})" class="tooltipped" data-position="bottom"
	25	+ data-delay="50" data-tooltip="Feed"><i
	26	+ class="mdi-action-view-module"></i></a></li>
	27	+ <li ui-sref-active="active"><a ui-sref="deck({sectionId:sectionId})" class="tooltipped" data-position="bottom"
	28	+ data-delay="50" data-tooltip="Deck"><i
	29	+ class="mdi-action-view-carousel"></i></a></li>
	30	+ <li ui-sref-active="active"><a ui-sref="cardlist({sectionId:sectionId})" class="tooltipped" data-position="bottom"
	31	+ data-delay="50" data-tooltip="Card List"><i
	32	+ class="mdi-action-view-list"></i></a></li>
	33	+ </ul>
50	34	<a href="#" class="brand-logo center">Flashy</a>
51	35	<a href="#" data-activates="mobile-demo" class="button-collapse"><i class="mdi-navigation-menu"></i></a>
52	36	<ul ng-show="isLoggedIn" id="nav-mobile" class="right hide-on-med-and-down">
53	37	<!-- User's classes dropdown -->
54	38	<ul id="dropdown1" class="dropdown-content">
55	39	<li ui-sref-active="active" ng-repeat="section in sections">
56		- <a class="class bold" ui-sref="feed({sectionId:{{section.id}}})">{{section.short_name}}</a>
	40	+ <a class="class bold" ui-sref="feed({sectionId:section.id})">{{section.short_name}}</a>
57	41	</li>
58	42	<li class="divider"></li>
59	43	<li><a ui-sref="addclass">Add Class</a></li>
60	44	</ul>
61	45
62		- <!--<ul ui-sref-active="active" >-->
63		- <!--<li><a ui-sref="deck">Deck</a></li>-->
64		- <!--</ul>-->
65	46	<li><a class="dropdown-button" href="#!" data-activates="dropdown1">Classes<i
66	47	class="mdi-navigation-arrow-drop-down right"></i></a></li>
67	48	<li><a ui-sref="study">Study</a></li>
...	...	@@ -79,8 +60,8 @@
79	60	</li>
80	61	<div class="collapsible-body" style="display: block">
81	62	<ul>
82		- <li ui-sref-active="active" ng-repeat="section in sections">
83		- <a class="class bold" ui-sref="feed({sectionId:{{section.id}}})">{{section.short_name}}</a>
	63	+ <li ng-repeat="section in sections">
	64	+ <a ui-sref-active="active" class="class bold" ui-sref="feed({sectionId:section.id})">{{section.short_name}}</a>
84	65	</li>
85	66	<hr>
86	67	<li><a ui-sref="addclass"><i class="tiny mdi-content-add"> Add Class</i></a></li>
...	...	@@ -92,7 +73,6 @@
92	73	</ul>
93	74	</div>
94	75	</nav>
95		-
96	76	<main ui-view></main>
97	77
98	78	</body>

1	1	angular.module('flashy.FeedController', ['ui.router']).
2		-
3		- controller('FeedController', ['$scope', '$stateParams', '$state', '$http', function($scope, $stateParams, $state, $http) {
4		-
5		-
	2	+ controller('FeedController', function ($scope, $rootScope, $stateParams, $state, $http) {
6	3	console.log('Hello from feed');
7	4	sectionId = $stateParams.sectionId;
	5	+ $rootScope.sectionId = sectionId;
8	6	$scope.cards = [];
9	7
10	8	var loc = window.location, new_uri;
11	9
12	10
13	11
14	12
15	13
16	14
17	15
18	16
...	...	@@ -16,39 +14,39 @@
16	14	new_uri += '//' + loc.host;
17	15	var ws = new WebSocket(new_uri + '/ws/feed/' + sectionId + '?subscribe-broadcast');
18	16
19		- ws.onopen = function() {
	17	+ ws.onopen = function () {
20	18	console.log('websocket connected');
21	19	};
22		- ws.onmessage = function(e) {
	20	+ ws.onmessage = function (e) {
23	21	console.log('got websocket message ' + e.data);
24	22	$scope.refreshCards();
25	23	};
26		- ws.onerror = function(e) {
	24	+ ws.onerror = function (e) {
27	25	console.error(e);
28	26	};
29		- ws.onclose = function(e) {
	27	+ ws.onclose = function (e) {
30	28	console.log('connection closed');
31	29	};
32	30
33	31	$http.get('/api/sections/' + sectionId + '/feed/').
34		- success(function(data) {
	32	+ success(function (data) {
35	33	console.log(data);
36	34	$scope.cards = data;
37	35	}).
38		- error(function(err) {
	36	+ error(function (err) {
39	37	console.log('pulling feed failed');
40	38	});
41	39
42		- $scope.viewDeck = function() {
	40	+ $scope.viewDeck = function () {
43	41	$state.go('deck', {sectionId: sectionId});
44	42	console.log('go to deck');
45	43	};
46	44
47		- $scope.pushCard = function() {
	45	+ $scope.pushCard = function () {
48	46	var pushed = new Date(Date.now());
49	47	var i = 0;
50	48	var blanks = [];
51		- $('#new-card-input')[0].childNodes.forEach(function(node) {
	49	+ $('#new-card-input')[0].childNodes.forEach(function (node) {
52	50	node = $(node)[0];
53	51	console.log(node);
54	52	if (node.tagName == 'B') {
55	53
56	54
57	55
58	56
...	...	@@ -68,25 +66,25 @@
68	66	section: sectionId
69	67	};
70	68	$http.post('/api/flashcards/', myCard).
71		- success(function(data) {
	69	+ success(function (data) {
72	70	console.log('pushed a card!');
73	71	listenForC = true;
74	72	}).
75		- error(function(error) {
	73	+ error(function (error) {
76	74	console.log('something went wrong pushing a card!');
77	75	});
78	76
79	77	$('#new-card-input').html('');
80	78	};
81	79
82		- $scope.refreshCards = function() {
	80	+ $scope.refreshCards = function () {
83	81	$http.get('/api/sections/' + sectionId + '/feed/').
84		- success(function(data) {
	82	+ success(function (data) {
85	83	console.log(data);
86	84	$scope.cards = data;
87	85	console.log('success in refresh cards...');
88	86	}).
89		- error(function(err) {
	87	+ error(function (err) {
90	88	console.log('refresh fail');
91	89	});
92	90	};
93	91
94	92
...	...	@@ -102,19 +100,19 @@
102	100	opacity: 0, // Opacity of modal background
103	101	in_duration: 300, // Transition in duration
104	102	out_duration: 200, // Transition out duration
105		- ready: function() {
	103	+ ready: function () {
106	104	listenForC = false;
107	105	console.log('modal OPENING');
108	106	$('#new-card-input').focus();
109	107	},
110		- complete: function() {
	108	+ complete: function () {
111	109	listenForC = true;
112	110	console.log('modal done, closing');
113	111	$('#new-card-input').blur();
114	112	}
115	113	};
116	114
117		- $(document).keydown(function(e) {
	115	+ $(document).keydown(function (e) {
118	116	var keyed = e.which;
119	117	if (keyed == 67 && listenForC) { // "c" or "C" for compose
120	118	$('#newCard').openModal(modal_options);
121	119
...	...	@@ -130,10 +128,10 @@
130	128	$scope.text = '';
131	129	var selected_start = 0;
132	130	var selected_end = 0;
133		- $(document).ready(function() {
	131	+ $(document).ready(function () {
134	132	// the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered
135	133	$('.modal-trigger').leanModal(modal_options);
136		- $('#new-card-input').on('keydown', function(e) {
	134	+ $('#new-card-input').on('keydown', function (e) {
137	135	if (e.which == 13) {
138	136	e.preventDefault();
139	137	$scope.pushCard();
140	138
141	139
142	140
...	...	@@ -141,19 +139,19 @@
141	139	return false;
142	140	}
143	141	});
144		- $('#new-card-input').on('mouseup', function() {
	142	+ $('#new-card-input').on('mouseup', function () {
145	143	console.log('got selection: ' + selected_start);
146	144	});
147		- $('button#blank-selected').click(function() {
	145	+ $('button#blank-selected').click(function () {
148	146	console.log(window.getSelection());
149	147	document.execCommand('bold');
150	148	});
151	149	});
152	150
153		- $scope.$on('$destroy', function() {
	151	+ $scope.$on('$destroy', function () {
154	152	ws.close();
155	153	$(document).off('keydown');
156	154	});
157	155
158		- }]);
	156	+ });

1	1	angular.module('flashy.RootController', ['ui.router']).
2	2
3		- controller('RootController', ['$rootScope', '$scope', '$state', 'UserService', function($rootScope, $scope, $state, UserService) {
4		- //UserService.getUserData();
5		- //$('#top').collapsible('accordion');
6		- //$('.button-collapse').sideNav();
7		- if (UserService.isLoggedIn()) $state.go('login');
8		- else $state.go('addclass');
	3	+ controller('RootController', function ($rootScope, $scope, $state, UserService) {
9	4	$rootScope.isLoggedIn = false;
10		- console.log(UserService._user);
11		- UserService.getUserData().then(function(data) {
	5	+ $rootScope.sectionId = 0;
	6	+ UserService.getUserData().then(function (data) {
12	7	console.log(data);
13	8	$rootScope.user = data;
14	9	});
...	...	@@ -18,5 +13,5 @@
18	13	closeOnClick: true // Closes side-nav on <a> clicks, useful for Angular/Meteor
19	14	}
20	15	);
21		- }]);
	16	+ });

1		-<div class="row">
2		- <a class="btn" ng-click="viewFeed()" style="margin-top: 15px">View Feed</a>
3		-</div>
4		-
5	1	<!--<i class="small mdi-content-sort" ng-click="filter()">Filter</i>-->
6	2	<div class="row">
7	3	<table>

1		-<div class="row">
2		- <a class="btn" ui-sref="feed({sectionId:{{sectionId}}})" style="margin-top: 15px">View Feed</a>
3		-</div>
4		-
5		-<!--<i class="small mdi-content-sort" ng-click="filter()">Filter</i>-->
	1	+<!--<i class="small mdi-content-sort" ng-click="filter()">Filter</i>-->
6	2	<div class="row">
7	3	<div ng-repeat="card in cards">
8	4	<flashcard flashcard-obj="card" refresh="refreshCards()"/>

1		-<div class="row">
2		- <a class="btn" ng-click="viewDeck()" style="margin-top: 15px">View Deck</a>
3		-</div>
4	1
5		-<!--cards-->
6	2	<div class="row">
7	3	<div ng-repeat="card in cards">
8	4	<flashcard flashcard-obj="card" refresh="refreshCards()"/>