From 7b578b835a2e94e94ef5a1aba7f4fffe8baa8cd6 Mon Sep 17 00:00:00 2001
From: Piotr Mitros <pmitros@mit.edu>
Date: Sun, 11 Dec 2011 15:57:23 -0500
Subject: [PATCH] X Module fully refactored

---
 create_account.html | 10 ++++++--
 problem.html        |  2 --
 profile.html        | 59 ++++++++++++++++++++++++++++++++++++++-------
 seq_module.html     | 27 ++++++---------------
 seq_module.js       |  8 ++----
 video.html          | 16 ++++--------
 video_init.js       |  4 +++
 7 files changed, 76 insertions(+), 50 deletions(-)

diff --git a/create_account.html b/create_account.html
index 47dceb5159..a210ae4aca 100644
--- a/create_account.html
+++ b/create_account.html
@@ -9,13 +9,19 @@
 <tr><td colspan=3 align=center
 style="color:red;"><div id="enroll_error"
 name="enroll_error"></div></td></tr>
-<tr><td align=right>Username</td><td><input name="username"
-id="ca_username" type="text"> </td><td></span> </td></tr>
 <tr><td align=right>E-mail</td><td><input name="email" id="ca_email"
 type="text"> </td><td></td></tr>
 <tr><td align=right>Password</td><td><input name="password"
 id="ca_password" type="password"> </td><td></td></tr>
 
+<tr><td align=right>Public Name</td><td><input name="username"
+id="ca_username" type="text"> </td><td><span class="ui-icon ui-icon-help" id="spinner_nick" style="display:inline-block;"></td></tr>
+<tr><td colspan=3 align=center><div style="display:none"
+id="sregion_nick">Nickname you'd like to use on forums. We recommend
+some variant of your real name (e.g. first name, last initial), but we
+allow you to be fully anonymous as well. </div></td></tr>
+
+
 <tr><td align=right>Full name</td><td><input name="name" id="ca_name" type="input">  </td><td><span class="ui-icon ui-icon-help" id="spinner_name" style="display:inline-block;"></td></tr>
 <tr><td colspan=3 align=center><div style="display:none" id="sregion_name">If you would
 like us to give you a certificate of completion at the end, we need
diff --git a/problem.html b/problem.html
index 76e56c6311..5505692bb3 100644
--- a/problem.html
+++ b/problem.html
@@ -35,5 +35,3 @@
 % else:
   <input id="check_${ id }" type="button" value="Reset" >
 % endif
-
-<!--$("[id^=input_resistor_]");-->
diff --git a/profile.html b/profile.html
index 418bd44e4f..061661e9bc 100644
--- a/profile.html
+++ b/profile.html
@@ -1,5 +1,13 @@
 <%inherit file="main.html" />
 
+<script>
+$(function() {
+	$("a#inline").fancybox({
+		'hideOnContentClick': false
+	});
+})
+</script>
+
 <div align="right"><table><tr><td align=right valign=top><a href="/courseware">Digital Textbook</a> 
 <span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span> 
 <a href="/discussion">Discussion</a> 
@@ -13,24 +21,57 @@
 <center>
 <br><br><br><br>
 <h1> ${name} </h1>
-<table><td align=right>Username:</td><td>${username}</td></tr>
+<table><td align=right>Forum name:</td><td>${username}</td></tr>
 <td align=right>E-mail:</td><td>${email}</td></tr>
-<td align=right>Location:</td><td>${location}</td></tr>
-<td align=right>Language:</td><td>${language}</td></tr></table>
+<td align=right><a id="inline" href="#change_location">Location:</a></td><td><a id="inline" href="#change_location">${location}</a></td></tr>
+<td align=right><a id="inline" href="#change_language">Language:</a></td><td><a id="inline" href="#change_location">${language}</a></td></tr>
+<td align=right><a id="inline" href="#change_password">Password:</a></td><td><a id="inline" href="#change_location">********</a></td></tr></table>
 <h1> Course Status </h1>
 <table>
   % for hw in homeworks:
-    <td> ${ hw['chapter'] }</td><td>/</td> <td> ${ hw['section'] } </td><td>&nbsp;</td><td>
+    <tr><td> ${ hw['chapter'] }</td><td>/</td> <td> ${ hw['section'] } </td><td>&nbsp;</td><td>
     % for score in hw['scores']:
       ${ score[0] }/${ score[1] }
     % endfor
-    </td>
+    </td></tr>
   % endfor
 </table>
 </center>
-<br><br><br><br><br><br><br><br><br><br><br><br>
-<br><br><br><br><br><br><br><br><br><br><br><br>
-<br><br><br><br><br><br><br><br><br><br><br><br>
-<br><br><br><br><br><br><br><br><br><br><br><br>
+
+<div style="display:none" ><div id="change_location"><h1>Change location</h1>
+<table width=400><tr><td> Preferred format is city, state, country (so for us,
+&quot;Cambridge, Massachusetts, USA&quot;), but give as 
+much or as little detail as you want. 
+<p>
+<div align=right>
+<input id="id_loc_text" type="text" name="loc_text" maxlength="75" value="${location}" /> 
+<input type="button" id="change_loc_button" value="Change" /></p>
+</div>
+</td></tr></table>
+</div></div>
+<div style="display:none"><div id="change_language"><h1>Change language</h1>
+<table width=400><tr><td> Update your language:
+<p>
+<div align=right>
+<input id="id_lang_text" type="text" name="lang_text" maxlength="75" value="${language}" /> 
+<input type="button" id="change_lang_button" value="Change" /></p>
+</div>
+</td></tr></table>
+
+</div></div>
+<div style="display:none"><div id="change_password">
+<table width=400><tr><td> <h1>Password reset</h1>
+
+<p>Hit the button below, and we'll e-mail you a password reset link at ${email}.</p>
+
+<p>
+<div align=right>
+<input id="id_email" type="hidden" name="email" maxlength="75" value="${email}" /> 
+<input type="button" id="pwd_change_button" value="E-mail me" /></p>
+</div>
+</td></tr></table>
+
+</div></div>
+
 
 <hr>
diff --git a/seq_module.html b/seq_module.html
index 7d60188c94..32987ad250 100644
--- a/seq_module.html
+++ b/seq_module.html
@@ -1,27 +1,14 @@
-    <div id='debug' ellpadding=5></div>
     <table width=800 >
-      <tr><td></td><td style="background-color:grey" id="tt_1" height=10></td>
-<td style="background-color:grey" id="tt_2"></td>
-<td style="background-color:grey" id="tt_3"></td>
-<td style="background-color:grey" id="tt_4"></td>
-<td style="background-color:grey" id="tt_5"></td>
-<td style="background-color:grey" id="tt_6"></td>
-<td style="background-color:grey" id="tt_7"></td>
-<td style="background-color:grey" id="tt_8"></td>
-<td style="background-color:grey" id="tt_9"></td>
-<td style="background-color:grey" id="tt_10"></td><td></td></tr>
+      <tr><td></td>
+% for t in range(1,1+len(items)):
+<td style="background-color:grey" id="tt_${ t }" height=10></td>
+% endfor
+
+<td></td></tr>
 <tr><td align=center valign=center><div id="prev"><span class="ui-icon ui-icon-circle-triangle-w" onclick="pause();"></span></div></td>
-<td colspan=10><div id="content">This is content</div></td>
+<td colspan=10><div id="content"></div></td>
 <td align=center valign=center><div id="next"><span class="ui-icon ui-icon-circle-triangle-e" onclick="pause();">&nbsp;</span></div></td>
 </tr>
       <tr></tr>
     </table>
 
-
-<div>
- %for t in items:
-  <div id="vert-${items.index(t)}">
-  ${t[1]['content']}
-  </div>
- %endfor
-</div>
diff --git a/seq_module.js b/seq_module.js
index 040f8ef89d..f666069910 100644
--- a/seq_module.js
+++ b/seq_module.js
@@ -13,15 +13,12 @@ function goto(i) {
 }
 
 function setup_click(i) {
-    $.get(i+'.html', function(data){
-	    files[i]=data;
-        })
         $('#tt_'+i).click(function(eo) { goto(i);});
 }
 
 function next() { 
     loc=loc+1;
-    if(loc>10) loc=10;
+    if(loc> ${ len(items) } ) loc=${ len(items) };
     goto(loc);
 }
 
@@ -38,6 +35,5 @@ $(function() {
 	}
         $('#next').click(function(eo) { next();});
         $('#prev').click(function(eo) { prev();});
+	goto(1);
     });
-
-$('#debug').text('loaded');
\ No newline at end of file
diff --git a/video.html b/video.html
index d4bb6463d1..c8b825a148 100644
--- a/video.html
+++ b/video.html
@@ -1,14 +1,8 @@
-    <table>
-      <tr><td rowspan=13 colspan=4>
-    <div id="ytapiplayer">
-      You need Flash player 8+ and JavaScript enabled to view this video.
-    </div>
-    <script type="text/javascript">
-      var params = { allowScriptAccess: "always", bgcolor: "#cccccc" };
-      var atts = { id: "myytplayer" };
-      swfobject.embedSWF("http://www.youtube.com/apiplayer?enablejsapi=1&playerapiid=ytplayer", 
-                         "ytapiplayer", "400", "300", "8", null, null, params, atts);
-    </script>
+<table>
+  <tr><td rowspan=13 colspan=4>
+      <div id="ytapiplayer">
+	You need Flash player 8+ and JavaScript enabled to view this video.
+      </div>
     </td>
 <td width=15>    <span class="" onclick="">&nbsp;</span></td><td colspan=2 id=stt_n5 align=center><div id=std_n5 onclick="title_seek(-5);">&nbsp;</div></td></tr>
 <tr><td width=15><span class="" onclick="">&nbsp;</span></td><td colspan=2 id=stt_n4 align=center><div id=std_n4 onclick="title_seek(-4);">&nbsp;</div></td></tr>
diff --git a/video_init.js b/video_init.js
index c51af43ef7..872098cc92 100644
--- a/video_init.js
+++ b/video_init.js
@@ -1,3 +1,7 @@
+var params = { allowScriptAccess: "always", bgcolor: "#cccccc" };
+var atts = { id: "myytplayer" };
+swfobject.embedSWF("http://www.youtube.com/apiplayer?enablejsapi=1&playerapiid=ytplayer", 
+		   "ytapiplayer", "400", "300", "8", null, null, params, atts);
 var captions=0;
 $("#slider").slider({slide:function(event,ui){seek_slide('slide',event.originalEvent,ui.value);},
                      stop:function(event,ui){seek_slide('stop',event.originalEvent,ui.value);}});