simplified footer and school listing on home, corrected pathing of courses link on...

diff --git a/public/assets/css/screen.css b/public/assets/css/screen.css
index adfc4940039604440b944a069b2726285c83bf2f..2a82b4431499dad47fb4e2bbfd66c1ededc7a279 100755 (executable)
--- a/public/assets/css/screen.css
+++ b/public/assets/css/screen.css
@@ -54,21 +54,21 @@ Please have a look around, I hope you enjoy your stay.
   margin-left: 1.705%;
   margin-right: 1.705%; }
 
-.grid-3 {
+.grid-3, #g-logo {
   float: left;
   width: 34.091%;
   padding: 0;
   margin-left: 1.705%;
   margin-right: 1.705%; }
 
-.grid-4, #g-logo, #nav-main, #intro-text, #intro-video {
+.grid-4, #intro-video, #intro-text {
   float: left;
   width: 46.591%;
   padding: 0;
   margin-left: 1.705%;
   margin-right: 1.705%; }
 
-.grid-5 {
+.grid-5, #nav-main {
   float: left;
   width: 59.091%;
   padding: 0;
@@ -96,7 +96,7 @@ Please have a look around, I hope you enjoy your stay.
   margin-left: 1.705%;
   margin-right: 1.705%; }
 
-.futura, .futura-oblique, .futura-light, .subheader h2, .futura-bold, h1, h2, h3, h4, h5, h6, p, #g-masthead {
+.futura, .futura-oblique, .futura-light, .subheader h2, .futura-bold, .link-bar a, h1, h2, h3, h4, h5, h6, p, #g-masthead {
   font-family: "futura-pt", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
   font-weight: 500;
   -webkit-font-smoothing: antialiased; }
@@ -107,7 +107,7 @@ Please have a look around, I hope you enjoy your stay.
 .futura-light, .subheader h2 {
   font-weight: 300; }
 
-.futura-bold {
+.futura-bold, .link-bar a {
   font-weight: 700; }
 
 .minion, .minion-italic {
@@ -126,12 +126,17 @@ body {
   font-size: 1em;
   line-height: 1.5em; }
 
-.tiny, #g-nav-footer li, #g-footer-copyright, #intro-schools li {
-  /* 14px / 18px */
-  font-size: 0.75em;
+.tiny, #g-footer-copyright {
+  /* 11px / 12px */
+  font-size: 0.688em;
   line-height: 1.091em; }
 
-.small, #nav-user, .link-bar a {
+.mini, #g-nav-footer li {
+  /* 12px / 12px */
+  font-size: 0.75em;
+  line-height: 1em; }
+
+.small, #nav-user, #intro-schools li, .link-bar a {
   /* 14px / 18px */
   font-size: 0.875em;
   line-height: 1.286em; }
@@ -142,12 +147,12 @@ body {
   line-height: 1.5em;
   /* 24 */ }
 
-.big, h4, p, #nav-main a {
+.big, p, #nav-main a {
   /* 18px / 24px */
   font-size: 1.125em;
   line-height: 1.333em; }
 
-.large, h3 {
+.large, h3, h4 {
   /* 26 / 36px */
   font-size: 1.625em;
   line-height: 1.385em; }
@@ -361,11 +366,12 @@ body {
   margin-bottom: 3em; }
 
 .page {
+  margin-bottom: 1.5em;
+  border-top: 3px solid #ffcd58;
   color: #333; }
 
 .subheader {
   padding: 3em 0;
-  border-top: 3px solid #ffcd58;
   text-align: center; }
   .subheader h1, .subheader h3 {
     display: inline;
@@ -380,6 +386,7 @@ body {
   text-align: center; }
 
 #g-nav-footer {
+  margin-bottom: 0.75em;
   text-align: center; }
   #g-nav-footer li {
     display: inline;
@@ -388,7 +395,8 @@ body {
     padding: 0 0.75em; }
 
 #g-footer-copyright img {
-  margin: 0 auto; }
+  margin: 0 auto;
+  margin-bottom: 0.75em; }
 
 .footer {
   color: #444;
@@ -424,7 +432,7 @@ body {
 
 /* 7.`Extensible Classes
 ---------------------------------------------- */
-.group:after, .wrapper:after, #nav-main:after, .schools ul:after {
+.group:after, .wrapper:after, #nav-main:after, .page:after, .schools ul:after {
   content: ".";
   display: block;
   height: 0;
@@ -592,20 +600,32 @@ body {
 .section-home {
   margin-bottom: 1.5em; }
 
-#intro-schools h4 {
-  padding-bottom: 0.75em;
-  border-bottom: 1px solid #e5e5e5; }
 #intro-schools li {
-  display: inline;
-  padding: 0.5em; }
+  display: inline-block;
+  *display: inline;
+  *zoom: 1;
+  vertical-align: middle;
+  position: relative;
+  padding: 0.375em 0;
+  padding-right: 0.75em; }
+  #intro-schools li:after {
+    content: "";
+    position: absolute;
+    right: 3px;
+    top: 50%;
+    width: 3px;
+    height: 2px;
+    background-color: #999; }
 
 .link-bar {
   margin-left: -0.375em; }
   .link-bar li {
-    display: inline; }
+    display: block;
+    float: left; }
     .link-bar li.last a {
       border: 0; }
   .link-bar a {
+    display: block;
     padding: 0 0.375em;
     border-right: 1px solid #ffcd58;
     color: #e8a200; }

diff --git a/public/assets/css/scss/partials/_modules.scss b/public/assets/css/scss/partials/_modules.scss
index 93347fa6a86de07c70c4b36be6948465b7e07bab..90d876b1a4907825b0d6ea0c7d6e31bade1f449d 100644 (file)
--- a/public/assets/css/scss/partials/_modules.scss
+++ b/public/assets/css/scss/partials/_modules.scss
@@ -2,7 +2,8 @@
     margin-left: $base/-4;
 
     li {
-        display: inline;
+        display: block;
+        float: left;
 
         &.last {
             a {
@@ -13,10 +14,12 @@
     }
 
     a {
+        display: block;
         padding: 0 $base/4;
         border-right: 1px solid $gold;
         color: $mustard;
         @extend .small;
+        @extend .futura-bold;
     }
 }
 

diff --git a/public/assets/css/scss/partials/_pages.scss b/public/assets/css/scss/partials/_pages.scss
index 78f2c4be3df34913c679e371e84c199a7d8f5a99..2dbd30bf53eccee1eea5f568228fdd75b30af661 100644 (file)
--- a/public/assets/css/scss/partials/_pages.scss
+++ b/public/assets/css/scss/partials/_pages.scss
@@ -16,11 +16,11 @@
     margin-bottom: $base;
 }
 
-#intro-text {
+#intro-video {
     @extend .grid-4;
 }
 
-#intro-video {
+#intro-text {
     @extend .grid-4;
 }
 
@@ -28,13 +28,23 @@
     @extend .grid-8;
 
     h4 {
-        padding-bottom: $base/2;
-        border-bottom: 1px solid #e5e5e5;
     }
 
     li {
-        display: inline;
-        padding: $base/3;
-        @extend .tiny;
+        @include inline-block;
+        position: relative;
+        padding: $base/4 0;
+        padding-right: $base/2;
+        @extend .small;
+
+        &:after {
+            content: "";
+            position: absolute;
+            right: 3px;
+            top: 50%;
+            width: 3px;
+            height: 2px;
+            background-color: #999;
+        }
     }
 }

diff --git a/public/assets/css/scss/partials/_type.scss b/public/assets/css/scss/partials/_type.scss
index f41ac2cecbde8d040cac46bbadc94c844015be51..4d252aee7ce5adfa741dc780761ded287de380df 100755 (executable)
--- a/public/assets/css/scss/partials/_type.scss
+++ b/public/assets/css/scss/partials/_type.scss
@@ -47,11 +47,17 @@ body {
 }
 
 .tiny {
-    /* 14px / 18px */
-    font-size: #{($font-size*0.75) / $em}em;
+    /* 11px / 12px */
+    font-size: #{($font-size*0.6875) / $em}em;
     line-height: ($line*0.5) / ($font-size*0.6875) * 1em;
 }
 
+.mini {
+    /* 12px / 12px */
+    font-size: #{($font-size*0.75) / $em}em;
+    line-height: ($line*0.5) / ($font-size*0.75) * 1em;
+}
+
 .small {
     /* 14px / 18px */
     font-size: #{($font-size*0.875) / $em}em;

diff --git a/public/assets/css/scss/screen.scss b/public/assets/css/scss/screen.scss
index 14b5e67db5ab960a3bacf7fea795b4541a7a02ab..ae1a08f83a4ab8282bb959a1f8ccd527e6a9272b 100755 (executable)
--- a/public/assets/css/scss/screen.scss
+++ b/public/assets/css/scss/screen.scss
@@ -36,7 +36,7 @@ Please have a look around, I hope you enjoy your stay.
     s: state
 
 ---------------------------------------------------------------- */
-// hello
+
 $blue: #0ca6ff;
 $dark: #1f1e1c;
 $gold: #ffcd58;
@@ -69,7 +69,7 @@ h3 {
 }
 
 h4 {
-    @extend .big;
+    @extend .large;
 }
 
 a {
@@ -138,7 +138,7 @@ body {
 }
 
 #g-logo {
-    @extend .grid-4;
+    @extend .grid-3;
 
     a {
         display: block;
@@ -170,7 +170,7 @@ body {
 }
 
 #nav-main {
-    @extend .grid-4;
+    @extend .grid-5;
     @extend .group;
 
     ul {
@@ -245,13 +245,15 @@ body {
 }
 
 .page {
+    @extend .group;
+    margin-bottom: $base;
+    border-top: 3px solid $gold;
     color: #333;
 }
 
 .subheader {
     @extend .grid-8;
     padding: $base*2 0;
-    border-top: 3px solid $gold;
     text-align: center;
 
     h1, h3 {
@@ -281,12 +283,13 @@ body {
 }
 
 #g-nav-footer {
+    margin-bottom: $base/2;
     text-align: center;
 
     li {
         display: inline;
         text-align: center;
-        @extend .tiny;
+        @extend .mini;
     }
 
     a {
@@ -299,6 +302,7 @@ body {
 
     img {
         margin: 0 auto;
+        margin-bottom: $base/2;
     }
 
 }

diff --git a/public/index.html b/public/index.html
index 765e9de68cb926d2c14b81cc4c7b31453b7e8186..446edf86f364d2f4db1f9f3e73357debe05f52a0 100644 (file)
--- a/public/index.html
+++ b/public/index.html
@@ -85,30 +85,27 @@
         <div id="topofcontent"></div>
         <div id="messages" class="page"><span id="PROTO_message" class="__type__">__msg__</span></div>
         <div id="g-page">
+            <div class="wrapper">
+                <style>
+                    /* This related less to "styling" and more to UI "behavior" */
+                    .page { display: none; }
+                </style>
 
-            <style>
-                /* This related less to "styling" and more to UI "behavior" */
-                .page { display: none; }
-            </style>
-
-            <noscript>
-                This site requires JavaScript to properly function.
-                Please enable JavaScript or use a modern browser such as
-                <a href="http://google.com/chrome">Google Chrome</a>
-                or
-                <a href="http://firefox.com">Firefox</a>.
-            </noscript>
+                <noscript>
+                    This site requires JavaScript to properly function.
+                    Please enable JavaScript or use a modern browser such as
+                    <a href="http://google.com/chrome">Google Chrome</a>
+                    or
+                    <a href="http://firefox.com">Firefox</a>.
+                </noscript>
 
-      <!--================================================================= -->
+          <!--================================================================= -->
 
-            <div class="page" id="pg_home">
-                <div class="wrapper">
+                <div class="page" id="pg_home">
                     <header class="subheader">
                         <h1>Welcome to FinalsClub.</h1>
                         <h2>Collaborate. Learn. Share.</h2>
                     </header>
-                </div>
-                <div class="wrapper">
                     <div id="intro">
 
                         <section class="section-home" id="intro-video">
@@ -153,538 +150,534 @@
                         </section>
                     </div>
                 </div>
-            </div>
-      <!--================================================================= -->
-
-            <div class="page" id="pg_schools">
-                <h1>Universities</h1>
-            </div>
-            <script id="schoolTmpl" type="text/x-jquery-tmpl">
-                <div class="school">
-                    <div class="name">${name}</div>
-                    <div class="desc">${description}</div>
-                    <ul class="courses">
-                    {{tmpl(courses) "#course"}}
+          <!--================================================================= -->
 
-                    </ul>
-                </div> <!-- .school -->
-            </script>
-            <script id="course" type="text/x-jquery-tmpl">
-                <li>${dept}: ${name} (${number})</li>
-            </script>
+                <div class="page" id="pg_schools">
+                    <h1>Universities</h1>
+                </div>
+                <script id="schoolTmpl" type="text/x-jquery-tmpl">
+                    <a href="school/${_id}" class="school">
+                        <div class="name">${name}</div>
+                        <div class="desc">${description}</div>
+                        <ul class="courses">
+                            {{tmpl(courses) "#course"}}
+                        </ul>
+                    </a> <!-- .school -->
+                </script>
+                <script id="course" type="text/x-jquery-tmpl">
+                    <li>${dept}: ${name} (${number})</li>
+                </script>
 
-      <!--================================================================= -->
-            <div class=page id=pg_courses>
-                <h1>Courses for <span id=school_name></span></h1>
-        <div>
-          <span class="sub_menu" style="display:none;">
-          </span>
-          <form method="POST" id="form_course" style="display:none;">
-            <h1>Create New Course</h1>
-            <p>Use this form to create a new course. After creating the course, you can create a lecture within it.</p>
-            <div class="row">
-              <div class="label">Course number</div>
-              <div class="field">
-                <input type="text" name="number">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">Course name</div>
-              <div class="field">
-                <input type="text" name="name">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">Course subject</div>
-              <div class="field">
-                <input type="text" name="subject">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">Course department</div>
-              <div class="field">
-                <input type="text" name="department">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">Instructor's Name</div>
-              <div class="field">
-                <input type="text" name="instructorName">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">Instructor's Email</div>
-              <div class="field">
-                <input type="text" name="email">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">&nbsp;</div>
-              <div class="field">
-                <button>Create Course</button>
-              </div>
+          <!--================================================================= -->
+                <div class=page id=pg_courses>
+                    <h1>Courses for <span id=school_name></span></h1>
+                <div>
+              <span class="sub_menu" style="display:none;">
+              </span>
+              <form method="POST" id="form_course" style="display:none;">
+                <h1>Create New Course</h1>
+                <p>Use this form to create a new course. After creating the course, you can create a lecture within it.</p>
+                <div class="row">
+                  <div class="label">Course number</div>
+                  <div class="field">
+                    <input type="text" name="number">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">Course name</div>
+                  <div class="field">
+                    <input type="text" name="name">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">Course subject</div>
+                  <div class="field">
+                    <input type="text" name="subject">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">Course department</div>
+                  <div class="field">
+                    <input type="text" name="department">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">Instructor's Name</div>
+                  <div class="field">
+                    <input type="text" name="instructorName">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">Instructor's Email</div>
+                  <div class="field">
+                    <input type="text" name="email">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">&nbsp;</div>
+                  <div class="field">
+                    <button>Create Course</button>
+                  </div>
+                </div>
+              </form>
             </div>
-          </form>
-        </div>
-                <div class="proto course" id=PROTO_course>
-                    <div class=dept>__department__</div>
-                    <div class=name>
-                        <a href="/course/___id__">__number__: __name__</a>
+                    <div class="proto course" id=PROTO_course>
+                        <div class=dept>__department__</div>
+                        <div class=name>
+                            <a href="/course/___id__">__number__: __name__</a>
+                        </div>
                     </div>
                 </div>
-            </div>
-      <!--================================================================= -->
-            <div class=page id=pg_lectures>
-                <div class="proto lectures_head" id=PROTO_lectures_head>
-                    <h1>Lectures for Course __number__ : __name__</h1>
-                    Subject: __subject__<br>
-                    Department: __department__<br>
-                </div>
-                <div class="proto lectures_instructor" id=PROTO_lectures_instructor>
-          Instructor: __name__ <span class="instructor_email">(__email__)</span><br>
-                </div>
-                <div class="proto lecture" id=PROTO_lecture>
-                    <div class=name>
-                        <a href="/lecture/___id__">__name__</a><br>
-                        Created: __date__<br>
+          <!--================================================================= -->
+                <div class=page id=pg_lectures>
+                    <div class="proto lectures_head" id=PROTO_lectures_head>
+                        <h1>Lectures for Course __number__ : __name__</h1>
+                        Subject: __subject__<br>
+                        Department: __department__<br>
+                    </div>
+                    <div class="proto lectures_instructor" id=PROTO_lectures_instructor>
+              Instructor: __name__ <span class="instructor_email">(__email__)</span><br>
                     </div>
+                    <div class="proto lecture" id=PROTO_lecture>
+                        <div class=name>
+                            <a href="/lecture/___id__">__name__</a><br>
+                            Created: __date__<br>
+                        </div>
+                    </div>
+            <div>
+              <span class="sub_menu" style="display:none;">
+                <a href="" id="new_lecture">New Lecture</a>
+              </span>
+              <form method="POST" id="form_lecture" style="display:none;">
+                <h1>Create New Lecture</h1>
+                <p>Use this form to create a new lecture. After creating the lecture, you can then create a notes-taking session within it.</p>
+                <div class="row">
+                  <div class="label">Lecture Name</div>
+                  <div class="field">
+                    <input type="text" name="name">
+                  </div>
                 </div>
-        <div>
-          <span class="sub_menu" style="display:none;">
-            <a href="" id="new_lecture">New Lecture</a>
-          </span>
-          <form method="POST" id="form_lecture" style="display:none;">
-            <h1>Create New Lecture</h1>
-            <p>Use this form to create a new lecture. After creating the lecture, you can then create a notes-taking session within it.</p>
-            <div class="row">
-              <div class="label">Lecture Name</div>
-              <div class="field">
-                <input type="text" name="name">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">&nbsp;</div>
-              <div class="field">
-                <button>Create Lecture</button>
-              </div>
-            </div>
-          </form>
-        </div>
+                <div class="row">
+                  <div class="label">&nbsp;</div>
+                  <div class="field">
+                    <button>Create Lecture</button>
+                  </div>
+                </div>
+              </form>
             </div>
-      <!--================================================================= -->
-            <div class=page id=pg_notes>
-                <div class="proto notes_head" id=PROTO_notes_head>
-                    <h1>Note pads for Course __number__ : __name__</h1>
-                    Subject: __subject__<br>
-                    Department: __department__<br>
-                </div>
-                <div class="proto notes_instructor" id=PROTO_notes_instructor>
-          Instructor: __name__ <span class="instructor_email">(__email__)</span><br>
-                </div>
-                <div class="proto note" id=PROTO_note>
-                    <div class=name>
-                        <a href="/note/___id__">__name__</a> Visits: __visits__
+                </div>
+          <!--================================================================= -->
+                <div class=page id=pg_notes>
+                    <div class="proto notes_head" id=PROTO_notes_head>
+                        <h1>Note pads for Course __number__ : __name__</h1>
+                        Subject: __subject__<br>
+                        Department: __department__<br>
+                    </div>
+                    <div class="proto notes_instructor" id=PROTO_notes_instructor>
+              Instructor: __name__ <span class="instructor_email">(__email__)</span><br>
                     </div>
+                    <div class="proto note" id=PROTO_note>
+                        <div class=name>
+                            <a href="/note/___id__">__name__</a> Visits: __visits__
+                        </div>
+                    </div>
+            <div>
+              <span class="sub_menu" style="display:none;">
+                <a href="" id="new_note">New Note Pad</a>
+              </span>
+              <form method="POST" id="form_note" style="display:none;">
+                <h1>Create New Note Pad</h1>
+                <p>Use this form to create a new note pad. You can then use this as a notes-taking session.</p>
+                <div class="row">
+                  <div class="label">Note Pad Name</div>
+                  <div class="field">
+                    <input type="text" name="name">
+                  </div>
                 </div>
-        <div>
-          <span class="sub_menu" style="display:none;">
-            <a href="" id="new_note">New Note Pad</a>
-          </span>
-          <form method="POST" id="form_note" style="display:none;">
-            <h1>Create New Note Pad</h1>
-            <p>Use this form to create a new note pad. You can then use this as a notes-taking session.</p>
-            <div class="row">
-              <div class="label">Note Pad Name</div>
-              <div class="field">
-                <input type="text" name="name">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">Private</div>
-              <div class="field">
-                <input type="checkbox" name="private" value="true">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">&nbsp;</div>
-              <div class="field">
-                <button>Create Note Pad</button>
-              </div>
-            </div>
-          </form>
-        </div>
+                <div class="row">
+                  <div class="label">Private</div>
+                  <div class="field">
+                    <input type="checkbox" name="private" value="true">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">&nbsp;</div>
+                  <div class="field">
+                    <button>Create Note Pad</button>
+                  </div>
+                </div>
+              </form>
             </div>
-      <!--================================================================= -->
-            <div class=page id=pg_archive_subjects>
-                <h1>Archived Subjects</h1>
-                <p>
-                Please browse our archive of past courses
-                covered at Harvard from 2008 through 2010.
-                </p>
-                <ul>
-                    <li class=proto id=PROTO_archive_subject>
-                        <a href="/archive/subject/__id__">__name__</a>
-                    </li>
-                </ul>
+                </div>
+          <!--================================================================= -->
+                <div class=page id=pg_archive_subjects>
+                    <h1>Archived Subjects</h1>
+                    <p>
+                    Please browse our archive of past courses
+                    covered at Harvard from 2008 through 2010.
+                    </p>
+                    <ul>
+                        <li class=proto id=PROTO_archive_subject>
+                            <a href="/archive/subject/__id__">__name__</a>
+                        </li>
+                    </ul>
 
-            </div>
-      <!--================================================================= -->
-            <div class=page id=pg_archive_courses>
-                <h1>Archived Courses</h1>
-                <ul>
-                    <li class=proto id=PROTO_archive_course>
-                        <a href="/archive/course/__id__">__name__</a>
-                    </li>
-                </ul>
-            </div>
-      <!--================================================================= -->
-            <div class=page id=pg_archive_notes>
-                <h1>Archived Notes</h1>
-                <ul>
-                    <li class=proto id=PROTO_archive_note>
-                        <a href="/archive/note/___id__">__topic__</a>
-                    </li>
-                </ul>
-            </div>
-      <!--================================================================= -->
-            <div class=page id=pg_archive_note_display>
-                <div id=PROTO_archive_note_display>
-                    <h1>__topic__</h1>
-                    <div>__text__</div>
                 </div>
-            </div>
-      <!--================================================================= -->
-            <div class=page id=pg_register>
-                <h1>Create an Account</h1>
-                <form id="form_register" action="/register" method="POST">
-                    <div class="zarea">
-                        <div class="row">
-                            <div class="label">
-                                <label for="email">School email*</label>
-                            </div>
-                            <div class="field">
-                                <input type="text" name="email">
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="label">
-                                <label for="password">Password*</label>
-                            </div>
-                            <div class="field">
-                                <input type="password" name="password">
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="label">
-                                <label for="school">School*</label>
-                            </div>
-                            <div class="field">
-                                <select name="school">
-                                    <option value="Harvard">Harvard</option>
-                                    <option value="Berkeley">Berkeley</option>
-                                    <option value="Brown">Brown</option>
-                                    <option value="Columbia">Columbia</option>
-                                    <!--
-                                    <option value="Cornell">Cornell</option>
-                                    <option value="Dartmouth">Dartmouth</option>
-                                    <option value="MIT">MIT</option>
-                                    <option value="Princeton">Princeton</option>
-                                    <option value="Stanford">Stanford</option>
-                                    <option value="UPenn">UPenn</option>
-                                    <option value="University of Texas">University of Texas</option>
-                                    <option value="Yale">Yale</option>
-                                    <option value="Other">Other</option>
-                                    -->
-                                </select>
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="label">
-                                <label for="name">Site Handle</label>
+          <!--================================================================= -->
+                <div class=page id=pg_archive_courses>
+                    <h1>Archived Courses</h1>
+                    <ul>
+                        <li class=proto id=PROTO_archive_course>
+                            <a href="/archive/course/__id__">__name__</a>
+                        </li>
+                    </ul>
+                </div>
+          <!--================================================================= -->
+                <div class=page id=pg_archive_notes>
+                    <h1>Archived Notes</h1>
+                    <ul>
+                        <li class=proto id=PROTO_archive_note>
+                            <a href="/archive/note/___id__">__topic__</a>
+                        </li>
+                    </ul>
+                </div>
+          <!--================================================================= -->
+                <div class=page id=pg_archive_note_display>
+                    <div id=PROTO_archive_note_display>
+                        <h1>__topic__</h1>
+                        <div>__text__</div>
+                    </div>
+                </div>
+          <!--================================================================= -->
+                <div class=page id=pg_register>
+                    <h1>Create an Account</h1>
+                    <form id="form_register" action="/register" method="POST">
+                        <div class="zarea">
+                            <div class="row">
+                                <div class="label">
+                                    <label for="email">School email*</label>
+                                </div>
+                                <div class="field">
+                                    <input type="text" name="email">
+                                </div>
                             </div>
-                            <div class="field">
-                                <input type="text" name="name">
+                            <div class="row">
+                                <div class="label">
+                                    <label for="password">Password*</label>
+                                </div>
+                                <div class="field">
+                                    <input type="password" name="password">
+                                </div>
                             </div>
-                        </div>
-                        <div class="row">
-                            <div class="label">
-                                <label for="affil">Affiliation</label>
+                            <div class="row">
+                                <div class="label">
+                                    <label for="school">School*</label>
+                                </div>
+                                <div class="field">
+                                    <select name="school">
+                                        <option value="Harvard">Harvard</option>
+                                        <option value="Berkeley">Berkeley</option>
+                                        <option value="Brown">Brown</option>
+                                        <option value="Columbia">Columbia</option>
+                                        <!--
+                                        <option value="Cornell">Cornell</option>
+                                        <option value="Dartmouth">Dartmouth</option>
+                                        <option value="MIT">MIT</option>
+                                        <option value="Princeton">Princeton</option>
+                                        <option value="Stanford">Stanford</option>
+                                        <option value="UPenn">UPenn</option>
+                                        <option value="University of Texas">University of Texas</option>
+                                        <option value="Yale">Yale</option>
+                                        <option value="Other">Other</option>
+                                        -->
+                                    </select>
+                                </div>
                             </div>
-                            <div class="field">
-                                <select name="affil">
-                                    <option value="Student">Student</option>
-                                    <option value="Teachers Assistant">Teachers Assistant</option>
-                                </select>
+                            <div class="row">
+                                <div class="label">
+                                    <label for="name">Site Handle</label>
+                                </div>
+                                <div class="field">
+                                    <input type="text" name="name">
+                                </div>
                             </div>
-                        </div>
-                        <div class="row">
-                            <div class="label">
-                                &nbsp;
+                            <div class="row">
+                                <div class="label">
+                                    <label for="affil">Affiliation</label>
+                                </div>
+                                <div class="field">
+                                    <select name="affil">
+                                        <option value="Student">Student</option>
+                                        <option value="Teachers Assistant">Teachers Assistant</option>
+                                    </select>
+                                </div>
                             </div>
-                            <div class="field">
-                                <button>Register</button>
+                            <div class="row">
+                                <div class="label">
+                                    &nbsp;
+                                </div>
+                                <div class="field">
+                                    <button>Register</button>
+                                </div>
                             </div>
                         </div>
-                    </div>
-                </form>
-            </div>
-      <!--================================================================= -->
-      <div class="page" id="pg_profile">
-        <h1>User Profile</h1>
-        <form id="form_profile" action="/profile" method="POST">
-          <h2>Account Information</h2>
-          <div class="area">
-            <div class="row">
-              <div class="label">
-                <span>Email</span>
-              </div>
-              <div class="field">
-                <span class="email"></span>
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">
-                <label for="affiliation">Affiliation</label>
-              </div>
-              <div class="field">
-                <select id="affiliation" name="affiliation">
-                  <option value="Student">Student</option>
-                  <option value="Teachers Assistant">Teachers Assistant</option>
-                </select>
-              </div>
-            </div>
-          </div>
-          <h2>Profile Information</h2>
-          <div class="area">
-            <div class="row">
-              <div class="label">
-                <label for="name">User Name</label>
-              </div>
-              <div class="field">
-                <input id="name" type="text" name="name" value="">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">
-                <label>&nbsp;</label>
-              </div>
-              <div class="field">
-                <input style="width: auto;" id="showName" type="checkbox" name="showName">
-                Display your real name in contributions
-              </div>
-            </div>
-              <!--
-            <div class="row">
-              <div class="label">
-                <label for="major">Major</label>
-              </div>
-              <div class="field">
-                <input id="major" type="text" name="major" value="">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">
-                <label for="bio">Bio</label>
-              </div>
-              <div class="field">
-                <input id="bio" type="text" name="bio" value="">
-              </div>
-            </div>
-            -->
-          </div>
-          <h2>Change Password</h2>
-          <div class="area">
-            <div class="row">
-              <div class="label">
-                <label for="existingPassword">Old Password</label>
-              </div>
-              <div class="field">
-                <input id="existingPassword" type="password" name="existingPassword">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">
-                <label for="newPassword">New Password</label>
-              </div>
-              <div class="field">
-                <input id="newPassword" type="password" name="newPassword">
+                    </form>
+                </div>
+          <!--================================================================= -->
+          <div class="page" id="pg_profile">
+            <h1>User Profile</h1>
+            <form id="form_profile" action="/profile" method="POST">
+              <h2>Account Information</h2>
+              <div class="area">
+                <div class="row">
+                  <div class="label">
+                    <span>Email</span>
+                  </div>
+                  <div class="field">
+                    <span class="email"></span>
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">
+                    <label for="affiliation">Affiliation</label>
+                  </div>
+                  <div class="field">
+                    <select id="affiliation" name="affiliation">
+                      <option value="Student">Student</option>
+                      <option value="Teachers Assistant">Teachers Assistant</option>
+                    </select>
+                  </div>
+                </div>
               </div>
-            </div>
-            <div class="row">
-              <div class="label">
-                <label for="newPasswordConfirm">Confirm Password</label>
+              <h2>Profile Information</h2>
+              <div class="area">
+                <div class="row">
+                  <div class="label">
+                    <label for="name">User Name</label>
+                  </div>
+                  <div class="field">
+                    <input id="name" type="text" name="name" value="">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">
+                    <label>&nbsp;</label>
+                  </div>
+                  <div class="field">
+                    <input style="width: auto;" id="showName" type="checkbox" name="showName">
+                    Display your real name in contributions
+                  </div>
+                </div>
+                  <!--
+                <div class="row">
+                  <div class="label">
+                    <label for="major">Major</label>
+                  </div>
+                  <div class="field">
+                    <input id="major" type="text" name="major" value="">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">
+                    <label for="bio">Bio</label>
+                  </div>
+                  <div class="field">
+                    <input id="bio" type="text" name="bio" value="">
+                  </div>
+                </div>
+                -->
+              </div>
+              <h2>Change Password</h2>
+              <div class="area">
+                <div class="row">
+                  <div class="label">
+                    <label for="existingPassword">Old Password</label>
+                  </div>
+                  <div class="field">
+                    <input id="existingPassword" type="password" name="existingPassword">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">
+                    <label for="newPassword">New Password</label>
+                  </div>
+                  <div class="field">
+                    <input id="newPassword" type="password" name="newPassword">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">
+                    <label for="newPasswordConfirm">Confirm Password</label>
+                  </div>
+                  <div class="field">
+                    <input id="newPasswordConfirm" type="password" name="newPasswordConfirm">
+                  </div>
+                </div>
               </div>
-              <div class="field">
-                <input id="newPasswordConfirm" type="password" name="newPasswordConfirm">
+              <div class="row">
+                <div class="label">&nbsp;</div>
+                <div class="field">
+                  <button>Submit</button>
+                </div>
               </div>
-            </div>
-          </div>
-          <div class="row">
-            <div class="label">&nbsp;</div>
-            <div class="field">
-              <button>Submit</button>
-            </div>
+            </form>
           </div>
-        </form>
-      </div>
-      <!--================================================================= -->
-            <div class=page id=pg_login>
-                <h1>Login</h1>
-                <form id="form_login" action="/login" method="POST">
-                    <div class="zarea">
-                        <div class="row">
-                            <div class="label">
-                                <label for="email">School email</label>
-                            </div>
-                            <div class="field">
-                                <input type="text" name="email" size="15" value="joe@sleepless.com">
+          <!--================================================================= -->
+                <div class=page id=pg_login>
+                    <h1>Login</h1>
+                    <form id="form_login" action="/login" method="POST">
+                        <div class="zarea">
+                            <div class="row">
+                                <div class="label">
+                                    <label for="email">School email</label>
+                                </div>
+                                <div class="field">
+                                    <input type="text" name="email" size="15" value="joe@sleepless.com">
+                                </div>
                             </div>
-                        </div>
-                        <div class="row">
-                            <div class="label">
-                                <label for="password">Password</label>
+                            <div class="row">
+                                <div class="label">
+                                    <label for="password">Password</label>
+                                </div>
+                                <div class="field">
+                                    <input type="password" name="password" size="15">
+                                </div>
                             </div>
-                            <div class="field">
-                                <input type="password" name="password" size="15">
-                            </div>
-                        </div>
-                        <div class="row">
-                            <div class="label">&nbsp;
+                            <div class="row">
+                                <div class="label">&nbsp;
+                                </div>
+                                <div class="field">
+                                    <button class="major">Login</button>
+                                    <span class="reglink">
+                                        <a href="/resetpass">Forgot password?</a>
+                                    </span>
+                                </div>
                             </div>
-                            <div class="field">
-                                <button class="major">Login</button>
-                                <span class="reglink">
-                                    <a href="/resetpass">Forgot password?</a>
-                                </span>
+                            <div class="row">
+                                <div class="label">&nbsp;
+                                </div>
+                                <div class="field">
+                                    <span class="reglink">
+                                        <a href="/register">Create an Account</a>
+                                    </span>
+                                </div>
                             </div>
                         </div>
-                        <div class="row">
-                            <div class="label">&nbsp;
-                            </div>
-                            <div class="field">
-                                <span class="reglink">
-                                    <a href="/register">Create an Account</a>
-                                </span>
-                            </div>
-                        </div>
-                    </div>
-                </form>
-            </div>
-      <!--================================================================= -->
-      <div class="page" id="pg_resetpass">
-        <h1>Password Reset</h1>
-        <form id="form_resetpass" action="/resetpass" method="POST">
-          <div class="zarea">
-            <p>To reset your password, enter your email address click "Reset". An email will be sent to you with a link to reset your password.</p>
-            <div class="row">
-              <div class="label">
-                <label for="email">School email</label>
-              </div>
-              <div class="field">
-                <input type="text" name="email" size="15" value="">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">&nbsp;</div>
-              <div style="min-width: 200px" class="field">
-                <button>Reset</button>
+                    </form>
+                </div>
+          <!--================================================================= -->
+          <div class="page" id="pg_resetpass">
+            <h1>Password Reset</h1>
+            <form id="form_resetpass" action="/resetpass" method="POST">
+              <div class="zarea">
+                <p>To reset your password, enter your email address click "Reset". An email will be sent to you with a link to reset your password.</p>
+                <div class="row">
+                  <div class="label">
+                    <label for="email">School email</label>
+                  </div>
+                  <div class="field">
+                    <input type="text" name="email" size="15" value="">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">&nbsp;</div>
+                  <div style="min-width: 200px" class="field">
+                    <button>Reset</button>
+                  </div>
+                </div>
               </div>
-            </div>
+            </form>
           </div>
-        </form>
-      </div>
-      <!--================================================================= -->
-      <div class="page" id="pg_resetpw">
-        <h1>Password Reset</h1>
-        <form id="form_resetpw" action="/resetpw" method="POST">
-          <div class="zarea">
-            <p>To verify and reset your password, type the full email address and your new password twice, then click submit.</p>
-            <div class="row">
-              <div class="label">
-                <label for="email">Email</label>
-              </div>
-              <div class="field">
-                <input type="text" name="email" size="15" value="">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">
-                <label for="pass1">New Password</label>
-              </div>
-              <div class="field">
-                <input type="password" name="pass1" size="15" value="">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">
-                <label for="pass2">Repeat New Password</label>
-              </div>
-              <div class="field">
-                <input type="password" name="pass2" size="15" value="">
-              </div>
-            </div>
-            <div class="row">
-              <div class="label">&nbsp;</div>
-              <div style="min-width: 200px" class="field">
-                <button>Reset</button>
+          <!--================================================================= -->
+          <div class="page" id="pg_resetpw">
+            <h1>Password Reset</h1>
+            <form id="form_resetpw" action="/resetpw" method="POST">
+              <div class="zarea">
+                <p>To verify and reset your password, type the full email address and your new password twice, then click submit.</p>
+                <div class="row">
+                  <div class="label">
+                    <label for="email">Email</label>
+                  </div>
+                  <div class="field">
+                    <input type="text" name="email" size="15" value="">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">
+                    <label for="pass1">New Password</label>
+                  </div>
+                  <div class="field">
+                    <input type="password" name="pass1" size="15" value="">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">
+                    <label for="pass2">Repeat New Password</label>
+                  </div>
+                  <div class="field">
+                    <input type="password" name="pass2" size="15" value="">
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="label">&nbsp;</div>
+                  <div style="min-width: 200px" class="field">
+                    <button>Reset</button>
+                  </div>
+                </div>
               </div>
-            </div>
+            </form>
           </div>
-        </form>
-      </div>
-            <div class=page id=pg_conduct>
-                <div class="conduct">
-                    <h1>Code of Conduct</h1>
-                    <p class="academic">
-                        <img src="/images/keep-it-academic.png" alt="Keep it academic.">
-                    </p>
-                    <p class="vague">
-                        This directive is deliberately vague to
-                        accommodate creative humor, insight, and exploration.<br>
-                        Disruptive or irrelevant material, however,
-                        will be subject to removal.<br>
-                        Just keep it academic, and we'll all be better off.<br>
-                    </p>
-                </div>
-            </div>
-            <div class=page id=pg_press>
-                <h1>FinalsClub in the Press</h1>
-                <div class="press">
-                    <img src="/images/boston.com.png" class="press">
-                    <p class="date">December 13, 2009</p>
-                    <p>Plenty of Harvard graduates have traded on the fame and prestige of their alma mater, but few have done so the way Andrew Magliozzi has. The year he graduated, 2005, he started a tutoring company located steps from Harvard Yard, with a name, Veritas, that is the motto of his storied alma mater.</p>
-                    <p>Then, two years ago, Magliozzi started up a side project called Finalsclub.org.</p>
-                    <p class="readmore">
-                    <a href="http://www.boston.com/bostonglobe/ideas/articles/2009/12/13/freeharvardeducationcom">Read more ...</a>
-                    </p>
+                <div class=page id=pg_conduct>
+                    <div class="conduct">
+                        <h1>Code of Conduct</h1>
+                        <p class="academic">
+                            <img src="/images/keep-it-academic.png" alt="Keep it academic.">
+                        </p>
+                        <p class="vague">
+                            This directive is deliberately vague to
+                            accommodate creative humor, insight, and exploration.<br>
+                            Disruptive or irrelevant material, however,
+                            will be subject to removal.<br>
+                            Just keep it academic, and we'll all be better off.<br>
+                        </p>
+                    </div>
                 </div>
-                <hr>
-                <div class="press">
-                    <img src="/images/harvard-crimson.jpg" class="press">
-                    <p class="date">Wednesday, February 18, 2009</p>
-                    <p>A rapidly growing course preparatory Web site, FinalsClub.org, is moving forward with a plan to expand its site in spite of controversy over the legality of the venture. </p>
-                    <p>The Web site, which allows students to share notes, create study groups, and blog about lectures and sections, recently hired 10 Harvard College students to serve as BETA testers for the site. </p>
-                    <p class="readmore">
-                    <a href="http://www.thecrimson.com/article/2009/2/18/finalscluborg-passes-punch-span-stylefont-weight-boldcorrection">Read more ...</a>
-                    </p>
+                <div class=page id=pg_press>
+                    <h1>FinalsClub in the Press</h1>
+                    <div class="press">
+                        <img src="/images/boston.com.png" class="press">
+                        <p class="date">December 13, 2009</p>
+                        <p>Plenty of Harvard graduates have traded on the fame and prestige of their alma mater, but few have done so the way Andrew Magliozzi has. The year he graduated, 2005, he started a tutoring company located steps from Harvard Yard, with a name, Veritas, that is the motto of his storied alma mater.</p>
+                        <p>Then, two years ago, Magliozzi started up a side project called Finalsclub.org.</p>
+                        <p class="readmore">
+                        <a href="http://www.boston.com/bostonglobe/ideas/articles/2009/12/13/freeharvardeducationcom">Read more ...</a>
+                        </p>
+                    </div>
+                    <hr>
+                    <div class="press">
+                        <img src="/images/harvard-crimson.jpg" class="press">
+                        <p class="date">Wednesday, February 18, 2009</p>
+                        <p>A rapidly growing course preparatory Web site, FinalsClub.org, is moving forward with a plan to expand its site in spite of controversy over the legality of the venture. </p>
+                        <p>The Web site, which allows students to share notes, create study groups, and blog about lectures and sections, recently hired 10 Harvard College students to serve as BETA testers for the site. </p>
+                        <p class="readmore">
+                        <a href="http://www.thecrimson.com/article/2009/2/18/finalscluborg-passes-punch-span-stylefont-weight-boldcorrection">Read more ...</a>
+                        </p>
+                    </div>
+                    <hr>
+                    <div class="press">
+                        <img src="/images/blown-to-bits.png" class="press">
+                        <p class="date">September 27th, 2009</p>
+                        <p>Computer Science professor and former Dean of Harvard, Harry Lewis, embraces FinalsClub's work and its guiding principle of open education.  Even as Harvard University has not been wholly sympathetic to the FinalsClub mission, invoking the Copyright Act of 1976, assuming a similar position to other major institutions such as University of Texas, Lewis supports working towards the proverbial "temple of the free exchange of ideas."  A course he taught in the Harvard Extension School was also shared freely online.  </p>
+                        <p class="readmore">
+                        <a href="http://www.bitsbook.com/2009/09/a-harvard-skirmish-in-the-copyright-wars">Read more ...</a>
+                        </p>
+                    </div>
                 </div>
-                <hr>
-                <div class="press">
-                    <img src="/images/blown-to-bits.png" class="press">
-                    <p class="date">September 27th, 2009</p>
-                    <p>Computer Science professor and former Dean of Harvard, Harry Lewis, embraces FinalsClub's work and its guiding principle of open education.  Even as Harvard University has not been wholly sympathetic to the FinalsClub mission, invoking the Copyright Act of 1976, assuming a similar position to other major institutions such as University of Texas, Lewis supports working towards the proverbial "temple of the free exchange of ideas."  A course he taught in the Harvard Extension School was also shared freely online.  </p>
-                    <p class="readmore">
-                    <a href="http://www.bitsbook.com/2009/09/a-harvard-skirmish-in-the-copyright-wars">Read more ...</a>
-                    </p>
+                <div class=page id=pg_notfound>
+                    <h1>Page Not Found</h1>
+                    Sorry, there is no content for this page.
                 </div>
-            </div>
-            <div class=page id=pg_notfound>
-                <h1>Page Not Found</h1>
-                Sorry, there is no content for this page.
-            </div>
-        </div>
 
-        <div class="wrapper">
             <div id="g-footer">
                 <nav id="g-nav-footer">
                     <ul>
@@ -706,6 +699,7 @@
                 </div>
             </div>
         </div>
+
     <!-- start Mixpanel --><script type="text/javascript">var mpq=[];mpq.push(["init","252cf14807e7553594607c10b64418b5"]);(function(){var b,a,e,d,c;b=document.createElement("script");b.type="text/javascript";b.async=true;b.src=(document.location.protocol==="https:"?"https:":"http:")+"//api.mixpanel.com/site_media/js/api/mixpanel.js";a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(b,a);e=function(f){return function(){mpq.push([f].concat(Array.prototype.slice.call(arguments,0)))}};d=["init","track","track_links","track_forms","register","register_once","identify","name_tag","set_config"];for(c=0;c<d.length;c++){mpq[d[c]]=e(d[c])}})(); </script><!-- end Mixpanel -->
     </body>
 </html>

diff --git a/public/javascripts/main.js b/public/javascripts/main.js
index 7fac64e3dc5932cdb29cf8bbb8014a8b9aa16e24..000c933b6c94df38dec185ff5ce76222293f2b56 100644 (file)
--- a/public/javascripts/main.js
+++ b/public/javascripts/main.js
@@ -142,6 +142,7 @@ router.add('schools', function(data, cb) {
     id: 'school',
     data: data.schools
   }
+  console.log(response.data);
 
   $('#pg_schools').css('display', 'block');
   $('#schoolTmpl').tmpl( data.schools ).appendTo("#pg_schools");