110swag / flashy-frontend

Commit 18a7fb3d7b1f67b678adf7b8aab480c69c6e3c0f

Authored by Andrew Buss 2015-05-31 20:31:35 -0700

merge; cleanup

Showing 2 changed files Inline Diff

scripts/HelpController.js
templates/help.html

angular.module('flashy.HelpController', ['ui.router']).	1	1	angular.module('flashy.HelpController', ['ui.router']).
	2	2
controller('HelpController', ['$scope', '$state', '$http', '$timeout', 'UserService',	3	3	controller('HelpController', ['$scope', '$state', '$http', '$timeout', 'UserService',
function($scope, $state, $http, $timeout, UserService) {	4	4	function($scope, $state, $http, $timeout, UserService) {
$scope.toggleContent = function(event, index) {	5	5	$scope.toggleContent = function(event, index) {
console.log(event, index);	6	6	console.log(event, index);
	7	7
if ($('#content-' + index).hasClass('open')) { // let's close it	8	8	if ($('#content-' + index).hasClass('open')) { // let's close it
// Note: 250 is duration (ms) of animation	9	9	// Note: 250 is duration (ms) of animation
$('#content-' + index).slideUp(250).removeClass('open');	10	10	$('#content-' + index).slideUp(250).removeClass('open');
} else { // let'd open it	11	11	} else { // let'd open it
$('#content-' + index).slideDown(250).addClass('open');	12	12	$('#content-' + index).slideDown(250).addClass('open');
}	13	13	}
	14	14
// event.currentTarget	15	15	// event.currentTarget
};	16	16	};
	17	17
$scope.closeContent = function(event) {	18	18	$scope.closeContent = function(event) {
	19	19
};	20	20	};
	21	21
// JSON OF FAQ ENTRIES	22	22	// JSON OF FAQ ENTRIES
$scope.entries = [	23	23	$scope.entries = [
{	24	24	{
icon: 'mdi-editor-insert-emoticon',	25	25	icon: 'mdi-editor-insert-emoticon',
question: 'What is Flashy?',	26	26	question: 'What is Flashy?',
answer: "<p>Flashy is a service for creating, sharing, and reviewing flashcards for your courses.</p><p>Flashy is optimized for contributing cards in real time during lecture to a shared live feed. Don't want to contribute cards? That's fine! By adding others' cards to your deck, you help identify high-quality cards which should remain at the top of the feed for others to choose.</p><p>Based on the principles of spaced repetition, Flashy also intelligently determines which cards you are most at risk of forgetting, based on your review history. Recieve push notifications on your Android device's Chrome browser without installing any other app, and we'll notify you when you have a few cards which need to be reviewed.</p>"	27	27	answer: "<p>Flashy is a service for creating, sharing, and reviewing flashcards for your courses.</p><p>Flashy is optimized for contributing cards in real time during lecture to a shared live feed. Don't want to contribute cards? That's fine! By adding others' cards to your deck, you help identify high-quality cards which should remain at the top of the feed for others to choose.</p><p>Based on the principles of spaced repetition, Flashy also intelligently determines which cards you are most at risk of forgetting, based on your review history. Recieve push notifications on your Android device's Chrome browser without installing any other app, and we'll notify you when you have a few cards which need to be reviewed.</p>"
},	28	28	},
{	29	29	{
icon: 'mdi-file-cloud-queue',	30	30	icon: 'mdi-file-cloud-queue',
question: 'Does Flashy work outside of UCSD?',	31	31	question: 'Does Flashy work outside of UCSD?',
answer: "To simplify development, Flashy was configured only for courses at UCSD. If you'd like Flashy for your school, please send us an email to let us know!"	32	32	answer: "To simplify development, Flashy was configured only for courses at UCSD. If you'd like Flashy for your school, please send us an email to let us know!"
},	33	33	},
{	34	34	{
icon: 'mdi-hardware-security',	35	35	icon: 'mdi-hardware-security',
question: 'How do registration and verification work?',	36	36	question: 'How do registration and verification work?',
answer: "An account is required to use Flashy. We store the cards you save to your deck with your account. When you register, you'll be able to use the site immediately, but you must verify ownership of your email address within 24 hours. After 24 hours have passed, you'll need to verify your address before continuing to use the site. Don't worry, your cards and deck won't be deleted."	37	37	answer: "An account is required to use Flashy. We store the cards you save to your deck with your account. When you register, you'll be able to use the site immediately, but you must verify ownership of your email address within 24 hours. After 24 hours have passed, you'll need to verify your address before continuing to use the site. Don't worry, your cards and deck won't be deleted."
}];	38	38	}];
}	39	39
]);	40	40	// Functions
		41	$scope.toggleContent = function(event, index) {
		42	if ($('#content-' + index).hasClass('open')) { // let's close it
		43	// Note: 250 is duration (ms) of animation
		44	$('#content-' + index).slideUp(250).removeClass('open');
		45	} else { // let's open it
		46	$('#content-' + index).slideDown(250).addClass('open');
		47	}
		48	};
		49
		50	$scope.expandAllContent = function() {
		51	for (var i = 0; i < $scope.entries.length; i++) {
		52	$('#content-' + i).slideDown(0).addClass('open');
		53	}
		54	};
		55
		56	$scope.collapseAllContent = function() {
		57	for (var i = 0; i < $scope.entries.length; i++) {
		58	$('#content-' + i).slideUp(0).removeClass('open');
		59	}
		60	};
		61	}]);
	41	62

<div class="container">	1	1	<div class="container">
<div class="row">	2	2	<div class="row">
<h2>FAQ</h2>	3	3	<h2>FAQ</h2>
		4	<button class="btn waves-effect waves-light" ng-click="expandAllContent()">
		5	Expand all
		6	</button>
		7	<button class="btn waves-effect waves-light" ng-click="collapseAllContent()">
		8	Collapse all
		9	</button>
	4	10
<!-- Please enter entries in JSON format in HelpController.js -->	5	11	<!-- Please enter entries in JSON format in HelpController.js -->
<ul class="collection st-accordion">	6	12	<ul class="collection st-accordion">
<li class="st-accordion--item" ng-repeat="entry in entries">	7	13	<li class="st-accordion--item" ng-repeat="entry in entries">
<div class="st-accordion--header" ng-click="toggleContent($event, $index)">	8	14	<div class="st-accordion--header" ng-click="toggleContent($event, $index)">
<i class="{{entry.icon}}"></i>	9	15	<i class="{{entry.icon}}"></i>
{{entry.question}}</div>	10	16	{{entry.question}}</div>
<div id="content-{{$index}}" class="st-accordion--content"	11	17	<div id="content-{{$index}}" class="st-accordion--content"
ng-bind-html="entry.answer"></div>	12	18	ng-bind-html="entry.answer"></div>
</li>	13	19	</li>
</ul>	14	20	</ul>
</div>	15	21	</div>