public/index.html

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   2 <html>
   3
   4         <head>
   5                 <title>FinalsClub.org</title>
   6
   7                 <!-- XXX Some SEO here would be nice -->
   8
   9                 <link rel='stylesheet' href='/stylesheets/fc2.css'>
  10
  11                 <script type='text/javascript' src='/javascripts/jquery.min.js'></script>
  12                 <script type='text/javascript' src='/javascripts/es5-shim.min.js'></script>
  13                 <script type='text/javascript' src='/javascripts/protodiv.js'></script>
  14                 <script type='text/javascript' src='/javascripts/main.js'></script>
  15                 <script type='text/javascript' src='/socket.io/socket.io.js'></script>
  16
  17                 <meta name="viewport" content="width=device-width,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0">
  18                 <meta name="apple-touch-icon" href=""> <!-- XXX -->
  19                 <meta name="icon" href="">
  20
  21         </head>
  22
  23         <body>
  24
  25                 <div class="masthead">
  26                         <div class="logbar">
  27         <div class="loginstatus"><div id="login_status" style="display:none;">Currently logged in as <span class="username"></span></div></div>
  28                         </div>
  29                         <div class="navbar">
  30                                 <table>
  31                                         <tr>
  32                                                 <td>
  33                                                         <a href="/"><img src="/images/finals-club-wht.png" class="logo"/></a>
  34                                                 </td>
  35                                                 <td class="menu">
  36                                                         <a href="/schools">Start Here!</a>
  37                                                         <a href="http://blog.finalsclub.org">Blog</a>
  38                                                         <a href="/archive">Archive</a>
  39                                                         <a href="/press">Press</a>
  40                                                         <a href="/register" id="register_link">Create an Account</a>
  41                                                         <a href="/profile" id="profile_link" style="display:none;">Profile</a>
  42                                                         <a href="/login" id="login_link" class="special">Login</a>
  43                                                 </td>
  44                                         </tr>
  45                                 </table>
  46                         </div>
  47                         <div class="logbar">&nbsp;</div>
  48                 </div>
  49
  50                 <div id="topofcontent"></div>
  51
  52                 <div id="messages" class="page">
  53                         <div id="PROTO_message" class="__type__">__msg__</div>
  54                 </div>
  55
  56                 <div class="content">
  57                         <style>
  58                                 /* The is here is because it's related less to "styling" and more to UI "behavior" */
  59                                 .page { display: none; }
  60                         </style>
  61
  62       <noscript>
  63         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>.
  64       </noscript>
  65
  66
  67                         <div class=page id=pg_home>
  68                                 <div class="contenthome">
  69                                         <div class="tagline">
  70                                                 <p>
  71                                                 Welcome to FinalsClub.org, a 501(c)(3) non-profit
  72                                                 open education project dedicated to helping college
  73                                                 students collaborate, learn, and share their
  74                                                 knowledge freely online.
  75                                                 </p>
  76                                                 <p>
  77                                                 Please create an account with your school email address
  78                                                 to try our tools or browse our course archive to learn
  79                                                 something new.
  80                                                 Thank you for helping us improve access to education,
  81                                                 one lecture at a time.
  82                                                 </p>
  83                                                 <p></p>
  84                                                 <div id="learnsomething" class="button green">Learn something &gt;&gt; </div>
  85                                                 <p></p>
  86             <div id="screencast"></div>
  87                                         </div>
  88                                 </div>
  89
  90                         </div>
  91
  92
  93
  94                         <div class=page id=pg_schools>
  95                                 <h1>Universities</h1>
  96                                 <div class="proto school" id=PROTO_school onclick="goPage('/school/___id__')">
  97                                         <div class=name>__name__</div>
  98                                         <div class=desc>__description__</div>
  99                                 </div>
 100                         </div>
 101
 102
 103
 104                         <div class=page id=pg_courses>
 105                                 <h1>Courses for <span id=school_name></span></h1>
 106                                 <div class="proto course" id=PROTO_course>
 107                                         <div class=dept>__department__</div>
 108                                         <div class=name>
 109                                                 <a href="/course/___id__">__number__: __name__</a>
 110                                         </div>
 111                                 </div>
 112         <div>
 113           <span class="sub_menu" style="display:none;">
 114             <a href="" id="new_course">New Course</a>
 115           </span>
 116           <form method="POST" id="form_course" style="display:none;">
 117             <h1>Create New Course</h1>
 118             <p>Use this form to create a new course. After creating the course, you can create a lecture within it.</p>
 119             <div class="row">
 120               <div class="label">Course number</div>
 121               <div class="field">
 122                 <input type="text" name="number">
 123               </div>
 124             </div>
 125             <div class="row">
 126               <div class="label">Course name</div>
 127               <div class="field">
 128                 <input type="text" name="name">
 129               </div>
 130             </div>
 131             <div class="row">
 132               <div class="label">Course subject</div>
 133               <div class="field">
 134                 <input type="text" name="subject">
 135               </div>
 136             </div>
 137             <div class="row">
 138               <div class="label">Course department</div>
 139               <div class="field">
 140                 <input type="text" name="department">
 141               </div>
 142             </div>
 143             <div class="row">
 144               <div class="label">Instructor's Name</div>
 145               <div class="field">
 146                 <input type="text" name="instructorName">
 147               </div>
 148             </div>
 149             <div class="row">
 150               <div class="label">Instructor's Email</div>
 151               <div class="field">
 152                 <input type="text" name="email">
 153               </div>
 154             </div>
 155             <div class="row">
 156               <div class="label">&nbsp;</div>
 157               <div class="field">
 158                 <button>Create Course</button>
 159               </div>
 160             </div>
 161           </form>
 162         </div>
 163                         </div>
 164
 165
 166
 167                         <div class=page id=pg_lectures>
 168                                 <div class="proto lectures_head" id=PROTO_lectures_head>
 169                                         <h1>Lectures for Course __number__ : __name__</h1>
 170                                         Subject: __subject__<br>
 171                                         Department: __department__<br>
 172                                 </div>
 173                                 <div class="proto lectures_instructor" id=PROTO_lectures_instructor>
 174                                         Instructor: __name__ <span class="instructor_email">(__email__)</span>
 175                                 </div>
 176                                 <div class="proto lecture" id=PROTO_lecture>
 177                                         <div class=name>
 178                                                 <a href="/lecture/___id__">__name__</a>
 179                                         </div>
 180                                         <div class=created>
 181                                                 Created: __date__
 182                                         </div>
 183                                 </div>
 184         <div>
 185           <span class="sub_menu" style="display:none;">
 186             <a href="" id="new_lecture">New Lecture</a>
 187           </span>
 188           <form method="POST" id="form_lecture" style="display:none;">
 189             <h1>Create New Lecture</h1>
 190             <p>Use this form to create a new lecture. After creating the lecture, you can then create a notes-taking session within it.</p>
 191             <div class="row">
 192               <div class="label">Lecture Name</div>
 193               <div class="field">
 194                 <input type="text" name="name">
 195               </div>
 196             </div>
 197             <div class="row">
 198               <div class="label">&nbsp;</div>
 199               <div class="field">
 200                 <button>Create Lecture</button>
 201               </div>
 202             </div>
 203           </form>
 204         </div>
 205                         </div>
 206
 207
 208
 209                         <div class=page id=pg_notes>
 210                                 <div class="proto notes_head" id=PROTO_notes_head>
 211                                         <h1>Note pads for Course __number__ : __name__</h1>
 212                                         Subject: __subject__<br>
 213                                         Department: __department__<br>
 214                                 </div>
 215                                 <div class="proto notes_instructor" id=PROTO_notes_instructor>
 216           Instructor: __name__ <span class="instructor_email">(__email__)</span><br>
 217                                 </div>
 218                                 <div class="proto note" id=PROTO_note>
 219                                         <div class=name>
 220                                                 <a href="/note/___id__">__name__</a><br>
 221                                         </div>
 222                                         <div class=visits>
 223                                                 Visits: __visits__
 224                                         </div>
 225                                 </div>
 226         <div>
 227           <span class="sub_menu" style="display:none;">
 228             <a href="" id="new_note">New Note Pad</a>
 229           </span>
 230           <form method="POST" id="form_note" style="display:none;">
 231             <h1>Create New Note Pad</h1>
 232             <p>Use this form to create a new note pad. You can then use this as a notes-taking session.</p>
 233             <div class="row">
 234               <div class="label">Note Pad Name</div>
 235               <div class="field">
 236                 <input type="text" name="name">
 237               </div>
 238             </div>
 239             <div class="row">
 240               <div class="label">Private</div>
 241               <div class="field">
 242                 <input type="checkbox" name="private" value="true">
 243               </div>
 244             </div>
 245             <div class="row">
 246               <div class="label">&nbsp;</div>
 247               <div class="field">
 248                 <button>Create Note Pad</button>
 249               </div>
 250             </div>
 251           </form>
 252         </div>
 253                         </div>
 254
 255
 256
 257                         <div class=page id=pg_archive_subjects>
 258                                 <h1>Archived Subjects</h1>
 259                                 <p>
 260                                 Please browse our archive of past courses
 261                                 covered at Harvard from 2008 through 2010.
 262                                 </p>
 263                                 <ul>
 264                                         <li class=proto id=PROTO_archive_subject>
 265                                                 <a href="/archive/subject/__id__">__name__</a>
 266                                         </li>
 267                                 </ul>
 268
 269                         </div>
 270
 271
 272
 273                         <div class=page id=pg_archive_courses>
 274                                 <h1>Archived Courses</h1>
 275                                 <ul>
 276                                         <li class=proto id=PROTO_archive_course>
 277                                                 <a href="/archive/course/__id__">__name__</a>
 278                                         </li>
 279                                 </ul>
 280
 281                         </div>
 282
 283
 284
 285                         <div class=page id=pg_archive_notes>
 286                                 <h1>Archived Notes</h1>
 287                                 <ul>
 288                                         <li class=proto id=PROTO_archive_note>
 289                                                 <a href="/archive/note/___id__">__topic__</a>
 290                                         </li>
 291                                 </ul>
 292                         </div>
 293
 294
 295
 296                         <div class=page id=pg_archive_note_display>
 297                                 <div id=PROTO_archive_note_display>
 298                                         <h1>__topic__</h1>
 299                                         <div>__text__</div>
 300                                 </div>
 301                         </div>
 302
 303
 304
 305                         <div class=page id=pg_register>
 306                                 <h1>Create an Account</h1>
 307                                 <form id="form_register" action="/register" method="POST">
 308                                         <div class="zarea">
 309                                                 <div class="row">
 310                                                         <div class="label">
 311                                                                 <label for="email">Email</label>
 312                                                         </div>
 313                                                         <div class="field">
 314                                                                 <input type="text" name="email">
 315                                                         </div>
 316                                                 </div>
 317                                                 <div class="row">
 318                                                         <div class="label">
 319                                                                 <label for="password">Password</label>
 320                                                         </div>
 321                                                         <div class="field">
 322                                                                 <input type="password" name="password">
 323                                                         </div>
 324                                                 </div>
 325                                                 <div class="row">
 326                                                         <div class="label">
 327                                                                 <label for="school">School</label>
 328                                                         </div>
 329                                                         <div class="field">
 330                                                                 <select name="school">
 331                                                                         <option value="Berkeley">Berkeley</option>
 332                                                                         <option value="Brown">Brown</option>
 333                                                                         <option value="Columbia">Columbia</option>
 334                                                                         <option value="Cornell">Cornell</option>
 335                                                                         <option value="Dartmouth">Dartmouth</option>
 336                                                                         <option value="Harvard">Harvard</option>
 337                                                                         <option value="MIT">MIT</option>
 338                                                                         <option value="Princeton">Princeton</option>
 339                                                                         <option value="Stanford">Stanford</option>
 340                                                                         <option value="UPenn">UPenn</option>
 341                                                                         <option value="University of Texas">University of Texas</option>
 342                                                                         <option value="Yale">Yale</option>
 343                                                                         <option value="Other">Other</option>
 344                                                                 </select>
 345                                                         </div>
 346                                                 </div>
 347                                                 <div class="row">
 348                                                         <div class="label">
 349                                                                 <label for="name">Name</label>
 350                                                         </div>
 351                                                         <div class="field">
 352                                                                 <input type="text" name="name">
 353                                                         </div>
 354                                                 </div>
 355                                                 <div class="row">
 356                                                         <div class="label">
 357                                                                 <label for="affil">Affiliation</label>
 358                                                         </div>
 359                                                         <div class="field">
 360                                                                 <select name="affil">
 361                                                                         <option value="Student">Student</option>
 362                                                                         <option value="Teachers Assistant">Teachers Assistant</option>
 363                                                                 </select>
 364                                                         </div>
 365                                                 </div>
 366                                                 <div class="row">
 367                                                         <div class="label">
 368                                                                 &nbsp;
 369                                                         </div>
 370                                                         <div class="field">
 371                                                                 <button>Register</button>
 372                                                         </div>
 373                                                 </div>
 374                                         </div>
 375                                 </form>
 376                         </div>
 377
 378       <div class="page" id="pg_profile">
 379         <h1>User Profile</h1>
 380         <form id="form_profile" action="/profile" method="POST">
 381           <h2>Account Information</h2>
 382           <div class="area">
 383             <div class="row">
 384               <div class="label">
 385                 <span>Email</span>
 386               </div>
 387               <div class="field">
 388                 <span class="email"></span>
 389               </div>
 390             </div>
 391             <div class="row">
 392               <div class="label">
 393                 <label for="affiliation">Affiliation</label>
 394               </div>
 395               <div class="field">
 396                 <select id="affiliation" name="affiliation">
 397                   <option value="Student">Student</option>
 398                   <option value="Teachers Assistant">Teachers Assistant</option>
 399                 </select>
 400               </div>
 401             </div>
 402           </div>
 403           <h2>Profile Information</h2>
 404           <div class="area">
 405             <div class="row">
 406               <div class="label">
 407                 <label for="name">User Name</label>
 408               </div>
 409               <div class="field">
 410                 <input id="name" type="text" name="name" value="">
 411               </div>
 412             </div>
 413             <div class="row">
 414               <div class="label">
 415                 <label>&nbsp;</label>
 416               </div>
 417               <div class="field">
 418                 <input style="width: auto;" id="showName" type="checkbox" name="showName">
 419                 Display your real name in contributions
 420               </div>
 421             </div>
 422               <!--
 423             <div class="row">
 424               <div class="label">
 425                 <label for="major">Major</label>
 426               </div>
 427               <div class="field">
 428                 <input id="major" type="text" name="major" value="">
 429               </div>
 430             </div>
 431             <div class="row">
 432               <div class="label">
 433                 <label for="bio">Bio</label>
 434               </div>
 435               <div class="field">
 436                 <input id="bio" type="text" name="bio" value="">
 437               </div>
 438             </div>
 439             -->
 440           </div>
 441           <h2>Change Password</h2>
 442           <div class="area">
 443             <div class="row">
 444               <div class="label">
 445                 <label for="existingPassword">Old Password</label>
 446               </div>
 447               <div class="field">
 448                 <input id="existingPassword" type="password" name="existingPassword">
 449               </div>
 450             </div>
 451             <div class="row">
 452               <div class="label">
 453                 <label for="newPassword">New Password</label>
 454               </div>
 455               <div class="field">
 456                 <input id="newPassword" type="password" name="newPassword">
 457               </div>
 458             </div>
 459             <div class="row">
 460               <div class="label">
 461                 <label for="newPasswordConfirm">Confirm Password</label>
 462               </div>
 463               <div class="field">
 464                 <input id="newPasswordConfirm" type="password" name="newPasswordConfirm">
 465               </div>
 466             </div>
 467           </div>
 468           <div class="row">
 469             <div class="label">&nbsp;</div>
 470             <div class="field">
 471               <button>Submit</button>
 472             </div>
 473           </div>
 474         </form>
 475       </div>
 476
 477
 478                         <div class=page id=pg_login>
 479                                 <h1>Login</h1>
 480                                 <form id="form_login" action="/login" method="POST">
 481                                         <div class="zarea">
 482                                                 <div class="row">
 483                                                         <div class="label">
 484                                                                 <label for="email">Email</label>
 485                                                         </div>
 486                                                         <div class="field">
 487                                                                 <input type="text" name="email" size="15" value="joe@sleepless.com">
 488                                                         </div>
 489                                                 </div>
 490                                                 <div class="row">
 491                                                         <div class="label">
 492                                                                 <label for="password">Password</label>
 493                                                         </div>
 494                                                         <div class="field">
 495                                                                 <input type="password" name="password" size="15">
 496                                                         </div>
 497                                                 </div>
 498                                                 <div class="row">
 499                                                         <div class="label">&nbsp;
 500                                                         </div>
 501                                                         <div class="field">
 502                                                                 <button class="major">Login</button>
 503                                                                 <span class="reglink">
 504                                                                         <a href="/resetpass">Forgot password?</a>
 505                                                                 </span>
 506                                                         </div>
 507                                                 </div>
 508                                                 <div class="row">
 509                                                         <div class="label">&nbsp;
 510                                                         </div>
 511                                                         <div class="field">
 512                                                                 <span class="reglink">
 513                                                                         <a href="/register">Create an Account</a>
 514                                                                 </span>
 515                                                         </div>
 516                                                 </div>
 517                                         </div>
 518                                 </form>
 519                         </div>
 520
 521       <div class="page" id="pg_resetpass">
 522         <h1>Password Reset</h1>
 523         <form id="form_resetpass" action="/resetpass" method="POST">
 524           <div class="zarea">
 525             <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>
 526             <div class="row">
 527               <div class="label">
 528                 <label for="email">Email</label>
 529               </div>
 530               <div class="field">
 531                 <input type="text" name="email" size="15" value="">
 532               </div>
 533             </div>
 534             <div class="row">
 535               <div class="label">&nbsp;</div>
 536               <div style="min-width: 200px" class="field">
 537                 <button>Reset</button>
 538               </div>
 539             </div>
 540           </div>
 541         </form>
 542       </div>
 543
 544       <div class="page" id="pg_resetpw">
 545         <h1>Password Reset</h1>
 546         <form id="form_resetpw" action="/resetpw" method="POST">
 547           <div class="zarea">
 548             <p>To verify and reset your password, type the full email address and your new password twice, then click submit.</p>
 549             <div class="row">
 550               <div class="label">
 551                 <label for="email">Email</label>
 552               </div>
 553               <div class="field">
 554                 <input type="text" name="email" size="15" value="">
 555               </div>
 556             </div>
 557             <div class="row">
 558               <div class="label">
 559                 <label for="pass1">New Password</label>
 560               </div>
 561               <div class="field">
 562                 <input type="password" name="pass1" size="15" value="">
 563               </div>
 564             </div>
 565             <div class="row">
 566               <div class="label">
 567                 <label for="pass2">Repeat New Password</label>
 568               </div>
 569               <div class="field">
 570                 <input type="password" name="pass2" size="15" value="">
 571               </div>
 572             </div>
 573             <div class="row">
 574               <div class="label">&nbsp;</div>
 575               <div style="min-width: 200px" class="field">
 576                 <button>Reset</button>
 577               </div>
 578             </div>
 579           </div>
 580         </form>
 581       </div>
 582
 583                         <div class=page id=pg_conduct>
 584                                 <div class="conduct">
 585                                         <h1>Code of Conduct</h1>
 586                                         <p class="academic">
 587                                                 <img src="/images/keep-it-academic.png" alt="Keep it academic.">
 588                                         </p>
 589                                         <p class="vague">
 590                                                 This directive is deliberately vague to
 591                                                 accommodate creative humor, insight, and exploration.<br>
 592                                                 Disruptive or irrelevant material, however,
 593                                                 will be subject to removal.<br>
 594                                                 Just keep it academic, and we'll all be better off.<br>
 595                                         </p>
 596                                 </div>
 597                         </div>
 598
 599
 600
 601
 602                         <div class=page id=pg_press>
 603                                 <h1>FinalsClub in the Press</h1>
 604                                 <div class="press">
 605                                         <img src="/images/boston.com.png" class="press">
 606                                         <p class="date">December 13, 2009</p>
 607                                         <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>
 608                                         <p>Then, two years ago, Magliozzi started up a side project called Finalsclub.org.</p>
 609                                         <p class="readmore">
 610                                         <a href="http://www.boston.com/bostonglobe/ideas/articles/2009/12/13/freeharvardeducationcom">Read more ...</a>
 611                                         </p>
 612                                 </div>
 613                                 <hr>
 614                                 <div class="press">
 615                                         <img src="/images/harvard-crimson.jpg" class="press">
 616                                         <p class="date">Wednesday, February 18, 2009</p>
 617                                         <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>
 618                                         <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>
 619                                         <p class="readmore">
 620                                         <a href="http://www.thecrimson.com/article/2009/2/18/finalscluborg-passes-punch-span-stylefont-weight-boldcorrection">Read more ...</a>
 621                                         </p>
 622                                 </div>
 623                                 <hr>
 624                                 <div class="press">
 625                                         <img src="/images/blown-to-bits.png" class="press">
 626                                         <p class="date">September 27th, 2009</p>
 627                                         <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>
 628                                         <p class="readmore">
 629                                         <a href="http://www.bitsbook.com/2009/09/a-harvard-skirmish-in-the-copyright-wars">Read more ...</a>
 630                                         </p>
 631                                 </div>
 632                         </div>
 633
 634
 635
 636
 637                         <div class=page id=pg_notfound>
 638                                 <h1>Page Not Found</h1>
 639                                 Sorry, there is no content for this page.
 640                         </div>
 641
 642
 643
 644
 645                 </div>
 646
 647
 648
 649
 650                 <div class="footer">
 651                         <table>
 652                                 <tr>
 653                                         <td class="col1">
 654                                                 <div class="logo">
 655                                                         <img src="/images/finals-club-wht.png" title="FinalsClub.org" class="lilogo"/>
 656                                                 </div>
 657                                                 <div>Copyright 2011</div>
 658                                                 <div>All Rights Reserved</div>
 659                                         </td>
 660                                         <td class="col2">
 661                                                 <a href="/conduct">Code of Conduct</a>
 662                                                 <a href="http://blog.finalsclub.org/about.html">About</a>
 663                                                 <a href="http://blog.finalsclub.org/contact.html">Contact</a>
 664                                                 <a href="http://blog.finalsclub.org/legal.html">Legal</a>
 665                                                 <a href="http://blog.finalsclub.org/team.html">Team</a>
 666                                         </td>
 667                                 </tr>
 668                         </table>
 669                 </div>
 670                 <div class="footerer">
 671                         <p>
 672                                 This work is licensed under a
 673                                 Creative Commons Attribution-ShareAlike 3.0
 674                                 United States License
 675                         </p>
 676                         <p>
 677                                 <a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/us/"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-sa/3.0/us/88x31.png"/></a>
 678                                 <a href="http://mixpanel.com/f/partner"><img alt="Real Time Web Analytics" src="http://mixpanel.com/site_media/images/partner/badge_blue.png" style="border-width:0;margin:2px;"/></a>
 679                         </p>
 680                 </div>
 681
 682
 683
 684
 685         </body>
 686 </html>