From 6ab0e3c4ce20cebd4fb735231b433524f1d6971e Mon Sep 17 00:00:00 2001
From: ec2-user <ec2-user@fcdev4.finalsclub.org>
Date: Sun, 13 Nov 2011 04:19:59 +0000
Subject: [PATCH] more work on 1page changes + adding in pushstate support

---
 public/index.html          | 26 ++++++++----
 public/javascripts/main.js | 87 ++++++++++++++++++++++++++++++++++----
 public/stylesheets/fc2.css |  3 +-
 3 files changed, 98 insertions(+), 18 deletions(-)

diff --git a/public/index.html b/public/index.html
index a7a0aac..b315443 100644
--- a/public/index.html
+++ b/public/index.html
@@ -33,7 +33,7 @@
 							<a href="/"><img src="/images/finals-club-wht.png" class="logo"/></a>
 						</td>
 						<td class="menu">
-							<a href="javascript:goSchools()">Courses</a>
+							<a href="javascript:goSchools()">Start Here!</a>
 							<a href="http://blog.finalsclub.org">Blog</a>
 							<a href="javascript:goArchivedSubjects()">Archive</a>
 							<a href="javascript:goPress()">Press</a>
@@ -46,6 +46,8 @@
 			<div class="logbar">&nbsp;</div>
 		</div>
 
+		<div id="topofcontent"></div>
+
 
 
 		<div class="content">
@@ -86,14 +88,9 @@
 
 			<div class=page id=pg_schools>
 				<h1>Universities</h1>
-				<div class="school" id=PROTO_school>
+				<div class="school" id=PROTO_school onclick="goCourses('__name__', '___id__', __i__)">
 					<div class=name>__name__</div>
 					<div class=desc>__description__</div>
-					<div class=tocourses>
-						<a href="javascript:goCourses('__name__', '___id__', __i__)">
-						Click for courses ...
-						</a>
-					</div>
 				</div>
 			</div>
 
@@ -113,9 +110,20 @@
 
 			<div class=page id=pg_lectures>
 				<h1>Lectures for <span id=course_name></span></h1>
-				<div class=course id=PROTO_lecture>
+				<div class=lecture id=PROTO_lecture>
+					<div class=name>
+						<a href="javascript:goPads('___id__')">__name__</a>
+					</div>
+				</div>
+			</div>
+
+
+
+			<div class=page id=pg_pads>
+				<h1>Notepads for <span id=lecture_name></span></h1>
+				<div class=pad id=PROTO_pad>
 					<div class=name>
-						<a href="goPads('___id__')">__name__</a>
+						<a href="">__name__</a>
 					</div>
 				</div>
 			</div>
diff --git a/public/javascripts/main.js b/public/javascripts/main.js
index 7273f79..bf9ce3d 100644
--- a/public/javascripts/main.js
+++ b/public/javascripts/main.js
@@ -20,7 +20,25 @@ function hideAllPages() {
 	$(".page").fadeOut(100);
 }
 function showPage(id) {
+	//alert("showPage "+id);
 	$("#pg_"+id).fadeIn(100);
+
+	$('html, body').animate({ scrollTop: 0 }, 10);
+	/*$('html, body').animate({
+		scrollTop: $("#topofcontent").offset().top
+	}, 100);*/
+
+}
+
+function goPage(id) {
+
+	showPage(id)
+
+	//if(id == 'home')
+	//	id = 'index.html'
+	//history.pushState({prev:document.location.pathname.substr(1)}, "Page "+id, "/"+id);
+	history.pushState({prev:id}, "Page "+id, "/"+id);
+
 }
 
 
@@ -36,7 +54,7 @@ function goSchools() {
 			schools = response.schools
 		}
 		ProtoDiv.replicate("PROTO_school", schools);
-		showPage("schools")
+		goPage("schools")
 	});
 }
 
@@ -55,7 +73,7 @@ function goCourses(schoolName, schoolId, a) {
 			courses = school.courses
 		}
 		ProtoDiv.replicate("PROTO_course", courses);
-		showPage("courses")
+		goPage("courses", "/courses/"+schoolId)
 	});
 }
 
@@ -85,7 +103,37 @@ response = {
 			lectures = course.lectures
 		}
 		ProtoDiv.replicate("PROTO_lecture", lectures);
-		showPage("lectures")
+		goPage("lectures")
+	});
+}
+
+
+
+
+// go to the page that lists the lectures for a specific course
+var pads = []
+function goPads(lectureId) {
+	ProtoDiv.reset("PROTO_pad");
+	hideAllPages();
+	$.get("/lecture/"+lectureId, {}, function(response) {
+
+response = {
+	lecture: {
+		name: "Foo Lecture",
+		pads: [
+			{ _id: 1, name: "pad 1" },
+			{ _id: 2, name: "pad 2" },
+		]
+	}
+}
+		pads = []
+		if(typeof response == 'object') {
+			var lecture = response.lecture
+			$("#lecture_name").html(lecture.name);
+			pads = course.pads
+		}
+		ProtoDiv.replicate("PROTO_pad", lectures);
+		goPage("pads")
 	});
 }
 
@@ -108,7 +156,7 @@ function goArchivedSubjects() {
 	ProtoDiv.reset("PROTO_archived_subjects");
 	ProtoDiv.replicate("PROTO_archived_subjects", archivedSubjects);
 
-	showPage("archive");
+	goPage("archive");
 }
 
 
@@ -118,28 +166,51 @@ function goRegister() {
 	hideAllPages();
 	// xxx clear fields?
 	// xxx change FORM to use AJAX
-	showPage("register");
+	goPage("register");
 }
 
 
 // go to the press articles page
 function goPress() {
 	hideAllPages();
-	showPage("press");
+	goPage("press");
 }
 
 
 // go to the "code of conduct" page
 function goConduct() {
 	hideAllPages();
-	showPage("conduct");
+	goPage("conduct");
 }
 
 
 
 $(document).ready(function() {
 	// This executes after the page has been fully loaded
-	showPage("home");
+
+	window.onpopstate = function(event) {  
+
+		var state = event.state
+		//alert("pop: "+o2j(state));
+
+		hideAllPages();
+
+		if(!state) {
+
+			history.replaceState(null, "", "/index.html");
+			showPage("home");
+
+		}
+		else {
+			//alert("location: " + document.location + ", state: " + JSON.stringify(event.state));  
+			//history.replaceState(null, "", state.prev);
+			showPage(state.prev);
+			// showPage(state.prev);
+			//alert("location: " + document.location + ", state: " + JSON.stringify(event.state));  
+		}
+	}; 
+
+	//showPage("home");
 })
 
 
diff --git a/public/stylesheets/fc2.css b/public/stylesheets/fc2.css
index 9c4a236..6ae1b86 100644
--- a/public/stylesheets/fc2.css
+++ b/public/stylesheets/fc2.css
@@ -603,14 +603,15 @@ span.sub_menu a:hover {
 
 div.school {
 
+	cursor: pointer; cursor: hand;
 	margin: 1%; 
 	padding: 2%;
-	/*
 	border: solid 1px #888;
 	-moz-border-radius: 0.20em;
 	-webkit-border-radius: 0.20em;
 	-webkit-box-shadow: 0 0.2em 0.3em rgba(0, 0, 0, .1);
 	-moz-box-shadow: 0 0.2em 0.3em rgba(0, 0, 0, .1);
+	/*
 	*/
 
 
-- 
2.25.1