Commit 84da0507 by Kyle Fiedler

Merged in with default

--HG--
branch : close_sidebar
parents 5f7d2558 db55c642
../data/problems/Lab2A.html
\ No newline at end of file
<%!
from django.core.urlresolvers import reverse
%>
<%def name="make_chapter(chapter)"> <%def name="make_chapter(chapter)">
<h3><a href="#">${chapter['name']}</a></h3> <h3><a href="#">${chapter['name']}</a></h3>
...@@ -9,16 +13,12 @@ ...@@ -9,16 +13,12 @@
% endif % endif
> >
<a href='/courseware/${format_string(course_name)}/${format_string(chapter['name'])}/${format_string(section['name'])}'> <a href="${reverse('courseware_section', args=format_url_params([course_name, chapter['name'], section['name']]))}">
<p>${section['name']}</p> <p>${section['name']}</p>
<p class="subtitle"> <p class="subtitle">
${section['format']} ${section['format']}
% if 'time' in section and section['time']!="":
(${int(section['time'])/60} min)
% endif
% if 'due' in section and section['due']!="": % if 'due' in section and section['due']!="":
due ${section['due']} due ${section['due']}
% endif % endif
......
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
}); });
</script> </script>
<%include file="navigation.html" /> <%include file="navigation.html" args="active_page='courseware'" />
<section class="main-content"> <section class="main-content">
<div class="course-wrapper"> <div class="course-wrapper">
......
...@@ -9,56 +9,52 @@ ...@@ -9,56 +9,52 @@
<ol> <ol>
<li> <li class="email">
<label>E-mail*</label> <label>E-mail*</label>
<input name="email" id="ca_email" type="email" required /> <input name="email" id="ca_email" type="email" required />
</li> </li>
<li> <li class="password">
<label>Password*</label> <label>Password*</label>
<input name="password" id="ca_password" type="password" required /> <input name="password" id="ca_password" type="password" required />
</li> </li>
<li> <li class="username">
<label>Public Name* <span class="ui-icon ui-icon-help" id="spinner_nick" style="display:inline-block;"></span></label> <label>Username (public)* <span class="ui-icon ui-icon-help" id="spinner_nick" style="display:inline-block;"></span></label>
<input name="username" id="ca_username" type="text" required /> <input name="username" id="ca_username" type="text" required />
<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> <div id="sregion_nick" class="tip">Nickname you'd like to use on forums.</div>
</li> </li>
<li class="full-name">
<li> <label>Full name<span class="ui-icon ui-icon-help" id="spinner_name" style="display:inline-block;"></span></label>
<label>Full name <span class="ui-icon ui-icon-help" id="spinner_name" style="display:inline-block;"></span></label>
<input name="name" id="ca_name" type="text" /> <input name="name" id="ca_name" type="text" />
<div style="display:none" id="sregion_name">If you would like us to give you a certificate of completion at the end, we need your full legal name, as you would like it to appear on the certificate (e.g. &quot;John Smith, Jr&quot;). Otherwise, feel free to leave it blank. </div> <div class="tip" id="sregion_name">If you would like us to give you a certificate of completion at the end, we need your full legal name, as you would like it to appear on the certificate (e.g. &quot;John Smith, Jr&quot;).</div>
</li> </li>
<li> <li class="location">
<label>Location <span class="ui-icon ui-icon-help" id="spinner_location" style="display:inline-block;"></span></label> <label>Location <span class="ui-icon ui-icon-help" id="spinner_location" style="display:inline-block;"></span></label>
<input name="location" id="ca_location" type="text" /> <input name="location" id="ca_location" type="text" />
<div style="display:none" id="sregion_location">Preferred format is city, state, country (so for us, &quot;Cambridge, Massachusetts, USA&quot;). We'd eventually like to group people into study groups. Studies show that geographic proximity helps. It'll also help us understand efforts needed for internationalization, low bandwidth, cultural issues, etc. We may also use statistics from this to help us raise money. </div> <div id="sregion_location" class="tip">Preferred format is city, state, country (so for us, &quot;Cambridge, Massachusetts, USA&quot;).</div>
</li> </li>
<li> <li class="language">
<label>Preferred Language <span class="ui-icon ui-icon-help" id="spinner_language" style="display:inline-block;"></span></label> <label>Preferred Language <span class="ui-icon ui-icon-help" id="spinner_language" style="display:inline-block;"></span></label>
<input name="language" id="ca_language" type="text" /> <input name="language" id="ca_language" type="text" />
<div style="display:none" id="sregion_language">Please let us know what language you'd most like to see the content in (even if not your native). We're working on translations and internationalization. This will help us know what languages and regions to focus on. </div> <div id="sregion_language" class="tip">Please let us know what language you'd most like to see the content in (even if not your native). We're working on translations and internationalization.</div>
</li> </li>
<li class="terms"> <li class="terms">
<label> <label> <input name="terms_of_service" id="cb_terms_of_service" type="checkbox" value="terms_of_service" required />I agree to the Terms of Service*</label>
<input name="terms_of_service" id="cb_terms_of_service" type="checkbox" value="terms_of_service" required />I agree to the Terms of Service
</label>
</li> </li>
<li class="honor-code"> <li class="honor-code">
<label> <label>
<input name="honor_code" id="cb_honor_code" type="checkbox" value="honor_code" required />I agree to the Honor code. </label> <input name="honor_code" id="cb_honor_code" type="checkbox" value="honor_code" required />I agree to the Honor code.*</label>
<ul> <ul>
<li>Not engage in any activities that would dishonestly improve my results, or improve or hurt those of others.</li> <li>Not engage in any activities that would dishonestly improve my results, or improve or hurt those of others.</li>
<li>Never post answers to problems.</li> <li>Never post answers to problems.</li>
......
<%inherit file="main.html" /> <%inherit file="main.html" />
<%include file="navigation.html" /> <%include file="navigation.html" args="active_page='help'"/>
<section class="help main-content"> <section class="help main-content">
<h1>Help</h1> <h1>Help</h1>
<p> If you need help, first try <a href="/discussion">asking a question in the forums</a> and in the IRC channel (irc.mitx.org, channel #6002). As the semester starts, we will add a Frequently Asked Questions section.</p> <section class="self-help">
<h2>Self-help</h2>
<p> If you can't solve your problems with self-help, we have several e-mail addresses set up:</p> <ul>
<li>Ask on the <a href="/discussion">discussion forums</a></li>
<li>Ask in the IRC channel (irc.mitx.mit.edu, channel #6002)]</li>
<li>Check the <a href="/info">course handouts.</a></li>
</ul>
</section>
<dl> <section class="help-email">
<dt> technical@mitx.mit.edu</dt> <h2>Help email</h2>
<dd> System-related questions</dd> <p> If you can't solve your problems with self-help, we have several
<dt> content@mitx.mit.edu</dt> e-mail addresses set up:</p>
<dd> Content-related questions</dd>
<dt> bugs@mitx.mit.edu</dt>
<dd> Bug reports</dd>
<dt> suggestions@mitx.mit.edu</dt>
<dd> Suggestions</dd>
</dl>
<p> Please bear in mind that while we read them, we do not expect to have time to respond to all e-mails.</p> <dl>
<dt>System-related questions</dt>
<dd><a href="mailto:technical@mitx.mit.edu">technical@mitx.mit.edu</a></dd>
<dt>Content-related questions</dt>
<dd><a href="mailto:content@mitx.mit.edu">content@mitx.mit.edu</a></dd>
<dt>Bug reports</dt>
<dd><a href="mailto:bugs@mitx.mit.edu">bugs@mitx.mit.edu</a></dd>
<dt>Suggestions</dt>
<dd><a href="mailto:suggestions@mitx.mit.edu">suggestions@mitx.mit.edu</a></dd>
</dl>
<p> Please bear in mind that while we read them, we do not expect to
have time to respond to all e-mails.</p>
</section>
</section> </section>
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
% for problem in homework['problems']: % for problem in homework['problems']:
<li> <li>
<h2>${ problem['name'] }</h2> <h2>${ problem['name'] }</h2>
${ problem['html'] } ${ problem['html'] }
<section> <section>
......
<%inherit file="main.html" /> <%inherit file="main.html" />
<%include file="navigation.html" /> <%include file="navigation.html" args="active_page='info'" />
<section class="main-content"> <section class="main-content">
<div class="profile-wrapper"> <div class="info-wrapper">
<section class="user-info"> <section class="updates">
<%include file="info_files/updates.html" /> <%include file="info_files/updates.html" />
</section> </section>
<section class="course-info"> <section class="handouts">
<%include file="info_files/handouts.html" /> <%include file="info_files/handouts.html" />
</section> </section>
</div> </div>
......
...@@ -45,8 +45,8 @@ ...@@ -45,8 +45,8 @@
<footer> <footer>
<!-- Template based on a design from http://www.dotemplate.com/ - Donated $10 (pmitros) so we don't need to include credit. --> <!-- Template based on a design from http://www.dotemplate.com/ - Donated $10 (pmitros) so we don't need to include credit. -->
<p> Copyright &copy; 2011. MIT. <a href=http://creativecommons.org/licenses/by-sa/3.0/>Some rights reserved.</a></p> <p> Copyright &copy; 2012. MIT. <a href="/t/copyright.html">Some rights reserved.</a>
</p>
<ul> <ul>
<li><a href="#feedback_div" rel="leanModal">Feedback</a></li> <li><a href="#feedback_div" rel="leanModal">Feedback</a></li>
<li><a href="#calculator_div" rel="leanModal">Calculator</a></li> <li><a href="#calculator_div" rel="leanModal">Calculator</a></li>
...@@ -73,8 +73,17 @@ ...@@ -73,8 +73,17 @@
<input id="calculator_button" type=button value="=&gt;"> <input id="calculator_button" type=button value="=&gt;">
<input type="text" id="calculator_output" readonly> <input type="text" id="calculator_output" readonly>
<p>Supported suffixes: %kMGTcmunp</p> <table> <tr><td align="right">Suffixes</td><td>&nbsp;:&nbsp;</td><td align="left"> %kMGTcmunp</td></tr>
<p>Supported operations: ^ * / + - || ()</p> <tr><td align="right">Operations</td><td>&nbsp;:&nbsp;</td><td align="left"> ^ * / + - ()</td></tr>
<tr><td align="right">Functions</td><td>&nbsp;:&nbsp;</td><td align="left"> sin, cos, tan, sqrt, log10, log2, ln, arccos, arcsin, arctan, abs </td></tr>
<tr><td align="right">Constants</td><td>&nbsp;:&nbsp;</td><td align="left"> e</td></tr>
<!--p> Unsupported: ||, j </p
Students won't know what parallel means at this time.
Complex numbers aren't well tested in the courseware, so we would prefer to not expose them.
If you read the comments in the source, feel free to use them. If you run into a bug, please
let us know. But we can't officially support them right now.
-->
</table>
</div> </div>
<script> <script>
......
...@@ -89,7 +89,7 @@ function postJSON(url, data, callback) { ...@@ -89,7 +89,7 @@ function postJSON(url, data, callback) {
<footer> <footer>
<!-- Template based on a design from http://www.dotemplate.com/ - Donated $10 (pmitros) so we don't need to include credit. --> <!-- Template based on a design from http://www.dotemplate.com/ - Donated $10 (pmitros) so we don't need to include credit. -->
<div class="footer-wrapper"> <div class="footer-wrapper">
<p> Copyright &copy; 2011. MIT. <a href="/t/copyright.html">Some rights reserved.</a></p> <p> Copyright &copy; 2012. MIT. <a href="/t/copyright.html">Some rights reserved.</a></p>
<ul> <ul>
<li><a href="/t/tos.html">Terms of Service</a></li> <li><a href="/t/tos.html">Terms of Service</a></li>
......
...@@ -6,8 +6,15 @@ ...@@ -6,8 +6,15 @@
<section class="about"> <section class="about">
<section class="intro"> <section class="intro">
<section class="intro-text">
<p><em>MITx</em> will offer a portfolio of MIT courses for free to a virtual community of learners around the world. It will also enhance the educational experience of its on-campus students, offering them online tools that supplement and enrich their classroom and laboratory experiences.</p> <p><em>MITx</em> will offer a portfolio of MIT courses for free to a virtual community of learners around the world. It will also enhance the educational experience of its on-campus students, offering them online tools that supplement and enrich their classroom and laboratory experiences.</p>
<p>The first <em>MITx</em> course, 6.002x (Circuits and Electronics), will be launched in an experimental prototype form. Watch this space for further upcoming courses, which will become available in Fall 2012.</p> <p>The first <em>MITx</em> course, 6.002x (Circuits and Electronics), will be launched in an experimental prototype form. Watch this space for further upcoming courses, which will become available in Fall 2012.</p>
</section>
<section class="intro-video">
<a rel="leanModal" href="#video-overlay"><img src="/static/images/video-image.png" alt="" /><span> Watch intro video</span></a>
</section>
</section> </section>
<section class="features"> <section class="features">
...@@ -22,6 +29,7 @@ ...@@ -22,6 +29,7 @@
<p><strong>Press &amp; links:</strong> <a href="http://www.boston.com/news/local/massachusetts/articles/2011/12/19/mit_to_launch_online_only_graded_courses_free_to_all/?page=full" target="_blank">Boston Globe</a>, <a href="http://www.nytimes.com/2011/12/19/education/mit-expands-free-online-courses-offering-certificates.html?_r=3&hpw=" target="_blank">New York Times</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html" target="_blank">MIT Press Release</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-faq-1219" target="_blank"><em>MITx</em> FAQ</a></p> <p><strong>Press &amp; links:</strong> <a href="http://www.boston.com/news/local/massachusetts/articles/2011/12/19/mit_to_launch_online_only_graded_courses_free_to_all/?page=full" target="_blank">Boston Globe</a>, <a href="http://www.nytimes.com/2011/12/19/education/mit-expands-free-online-courses-offering-certificates.html?_r=3&hpw=" target="_blank">New York Times</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html" target="_blank">MIT Press Release</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-faq-1219" target="_blank"><em>MITx</em> FAQ</a></p>
</section> </section>
</section> </section>
<section class="course"> <section class="course">
...@@ -38,6 +46,10 @@ ...@@ -38,6 +46,10 @@
<p>Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, 6.002x (Circuits and Electronics) is an on-line adaption of 6.002, MIT&rsquo;s first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from <em>MITx</em>.</p> <p>Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, 6.002x (Circuits and Electronics) is an on-line adaption of 6.002, MIT&rsquo;s first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from <em>MITx</em>.</p>
</section> </section>
</section> </section>
<div id="video-overlay" class="leanModal_box">
<iframe width="560" height="315" src="http://www.youtube.com/embed/p2Q6BrNhdh8?rel=0" frameborder="0" allowfullscreen></iframe>
</div>
<script> <script>
$(function() { $(function() {
......
<%page args="active_page" />
<div class="header-wrapper"> <div class="header-wrapper">
<header> <header>
<h1><em>MITx</em></h1> <hgroup>
<h1><em>MITx</em></h1>
<nav>
<h2><a href="/courseware">Circuits and Electronics</a></h2> <h2><a href="/courseware">Circuits and Electronics</a></h2>
</hgroup>
<nav class="${active_page}">
<ul class="coursenav"> <ul class="coursenav">
<li><a href="/courseware">Courseware</a></li> <li class="courseware"><a href="/courseware">Courseware</a></li>
<li><a href="/info">Course Info</a></li> <li class="info"><a href="/info">Course Info</a></li>
<li><a href="/book">Textbook</a></li> <li class="book"><a href="/book">Textbook</a></li>
<li><a href="/discussion">Discussion</a></li> <li class="discussion"><a href="/discussion">Discussion</a></li>
<li><a href="/wiki">Wiki</a></li> <li class="wiki"><a href="/wiki">Wiki</a></li>
<li><a href="/profile">Profile</a></li> <li class="profile"><a href="/profile">Profile</a></li>
</ul> </ul>
</nav> </nav>
</header> </header>
......
...@@ -2,6 +2,189 @@ ...@@ -2,6 +2,189 @@
<section class="privacy-policy"> <section class="privacy-policy">
<div> <div>
<h1> Privacy Policy </h1> <h1>Privacy Policy</h1>
<h2>Confidentiality &amp; Security of Personally
Identifiable Information</h2>
<p>We care about the confidentiality and security of your personal
information. We will use commercially reasonable efforts to keep your
Personally Identifiable Information private and will not share it with third
parties, except as set forth in this Privacy Policy. However, no method of
transmitting or storing electronic data is ever completely secure, and we
cannot guarantee that such information will never be accessed, used, or
released in a manner that is inconsistent with this policy. </p>
<p>This Privacy Policy only applies to information that we collect
through the Site and does not apply to information that we may collect
from you in other ways (for example, this policy does not apply to
information that you may provide to us over the phone, by fax or
through conventional mail). In addition, please note that this policy
does not apply to your educational records -- those records are protected
by the Family Educational Rights and Privacy Act (&quot;FERPA&quot;)
with which we are committed to comply.</p>
<h2>Usernames and Postings </h2>
<p>Comments or other information posted by you to our forums,
wikis, or other areas of the Site designed for public communications may be
viewed and downloaded by others who visit the Site. For this reason, we
encourage you to use an anonymous username, and to not post any personally
identifiable information to those forums (or other public areas).</p>
<h2>What You Consent to by Using Our Site</h2>
<p>Please understand that by submitting any Personally Identifiable
Information to us, you consent and agree that we may collect, use and
disclose such Personally Identifiable Information in accordance with
this Privacy Policy and our TOS, and as permitted or required by
law. If you do not agree with these terms, then please do not provide
any Personally Identifiable Information to us. As used herein,
&quot;Personally Identifiable Information&quot; means your full name,
email address and your student identification number. If you refuse,
or if you choose not to provide us with any required Personally
Identifiable Information, we may not be able to provide you with the
services that can be offered on our Site.</p>
<h2>What Information We Collect </h2>
<p>We collect information, including Personally Identifiable
Information, when you sign up for a User Account, participate in
online courses, send us email messages and/or participate in our
public forums. We collect information about student performance and
patterns of learning. We track information indicating, among other
things, which pages of our Site were visited, the order in which they
were visited, when they were visited, and which hyperlinks and other
user interface controls were used.</p>
<p>We may log the IP address, operating system and browser software
used by each user of the Site, and we may be able to determine from an
IP address a user's Internet Service Provider and the geographic
location of his or her point of connectivity. Various web analysis
tools are used to collect this information. Some of the information is
collected through cookies (a small text file placed on your
computer). You should be able to control how and whether cookies will
be accepted by your web browser. Most browsers offer instructions on
how to reset the browser to reject cookies in the &quot;Help&quot;
section of the toolbar. If you reject our cookies, many functions and
conveniences of this Site may not work properly.</p>
<p>Among other things, we may use the information that you provide
(including your Personally Identifiable Information) in connection
with the following:</p>
<ul>
<li>To help us improve <i>MITx</i> offerings, both individually
(e.g. by course staff when working with a student) and in
aggregate, and to individualize the experience and to evaluate
the access and use of the Site and the impact of <i>MITx</i> on
the worldwide educational community.
</li>
<li>For purposes of scientific research, particularly, for
example, in the areas of cognitive science and education. </li>
<li>For the purpose for which you specifically provided
the personal information, for example to respond to a specific inquiry or
provide you the specific course and/or services you select. </li>
<li>To track both individual and aggregate attendance,
progress and completion of an online course, and to analyze statistics on
student performance and how students learn. </li>
<li>To monitor and detect violations of the Honor Code, the
Terms of Service, as well as other misuses and potential misuses of the
site. </li>
<li>To publish information gathered about <i>MITx</i>
access, use, impact, and student performance but only as non-personally
identifiable data.</li>
<li>To send you updates about online courses offered by <i>MITx</i>
or other MIT events or to send you email messages about Site maintenance
or updates.</li>
<li>To archive this information and/or use it for future
communications with you.</li>
<li>As otherwise described to you at the point of
collection. </li>
</ul>
<h2>Sharing with Third Parties</h2>
<p>We may share the information we collect with third parties
as follows:</p>
<ul>
<li> With service providers or
contractors that perform certain functions on our behalf, including processing
information that you provide to us on the Site, operating the Site or portions
of it, or in connection with other aspects of <i>MITx</i> services. These
service providers and contractors will be obligated to keep your information
confidential.</p>
<li> With all users and other visitors
to the Site, to the extent that you submit post comments or other information
to a portion of the Site designed for public communications. As provided in the
Terms of Service, we may provide those postings to students in future offerings
of the course, either within the context of the forums, the courseware, or
otherwise, for marketing purposes, or in any other way. If we do use your postings,
we will use them without your real name and e-mail (except with explicit
permission), but we may use your username. </p>
<li>To connect you to other users of the web site. For instance, we
may recommend specific study partners, or connect potential student
mantees and mentors. In such cases, we may use all information
collected to determine who to connect you to, but we will only connect
you by username, and not disclose your real name or e-mail address to
your contact. </p>
<li> To respond to subpoenas, court orders, or other legal process, in
response to a request for cooperation from law enforcement or another
government agency, to investigate, prevent, or take action regarding
illegal activities, suspected fraud, or to enforce our user agreement
or privacy policy, or to protect our rights or the rights of
others.</p>
<li> As otherwise described to you at the point of collection or
pursuant to your consent. For example, from time to time, we may ask
your permission to use your Personally Identifiable Information in
other ways. In the future, <i>MITx</i> may have an alumni association,
resume book, etc. We may offer services where it is possible to
verify <i>MITx</i> credentials. </p>
<li> For integration with third party services. Videos and other
content may be hosted on YouTube and other web sites not controlled
by <i>MITx</i>. We may provide links and other integration with social
networks, and other sites. Those web sites are guided by their own
privacy policies. </p>
</ul>
<h2>Personalization and Pedagogical Improvements</h2>
<p>Our goal is to provide current and future visitors with the best
possible educational experience. To further this goal, we sometimes
present different users with different versions of course materials
and software. We do this to personalize the experience to the
individual learner (assess the learner's level of ability and learning
style, and present materials best suited to the learner), to evaluate
the effectiveness of our course materials, to improve our
understanding of the learning process, and to otherwise improve the
effectiveness of our offerings. We may publish or otherwise publicize
results from this process, but only as non-personally-identifiable
data. </p>
<h2>Changing Our Privacy Policy</h2>
<p>Please note that we review our privacy practices from time to time,
and that these practices are subject to change. Any change, update, or
modification will be effective immediately upon posting on our
Site. We will notify you of any material change to this Privacy Policy
by posting a notice on our Site's homepage for a reasonable period of
time following such update, and by changing the effective date
(located at the bottom of this page). Be sure to return to this page
periodically to ensure familiarity with the most current version of
this Privacy Policy. </p>
<h2>Privacy Concerns</h2>
<p>If you have privacy concerns, or have disclosed data you would
prefer to keep private, please contact us
at <a href="mailto:privacy@mitx.mit.edu">privacy@mitx.mit.edu</a>. </p>
</div> </div>
</section> </section>
<h2>${ problem['name'] }</h2> <h2>${ problem['name'] }</h2>
<p> ${ problem['html'] } </p> <section class="problem">
${ problem['html'] }
<section class="action"> <section class="action">
<input type="hidden" name="problem_id" value="${ problem['name'] }"> <input type="hidden" name="problem_id" value="${ problem['name'] }">
% if check_button: % if check_button:
<input id="check_${ id }" type="button" value="Check ${ attempts }" > <input id="check_${ id }" type="button" value="Check ${ attempts }" >
% endif % endif
% if reset_button: % if reset_button:
<input id="reset_${ id }" type="button" value="Reset ${ attempts }" > <input id="reset_${ id }" type="button" value="Reset ${ attempts }" >
% endif % endif
% if save_button: % if save_button:
<input id="save_${ id }" type="button" value="Save" > <input id="save_${ id }" type="button" value="Save" >
% endif % endif
% if answer_available: % if answer_available:
<input id="show_${ id }" type="button" value="Show Answer" > <input id="show_${ id }" type="button" value="Show Answer" >
% endif % endif
% if explain : % if explain :
<a href="/courseware/6.002_Spring_2012/${ explain }" class="new-page">Explanation</a> <a href="/courseware/6.002_Spring_2012/${ explain }" class="new-page">Explanation</a>
% endif % endif
</section> </section>
</section>
<div id="main_${id}"></div> <section id="main_${id}" class="problems-wrapper"></section>
<%inherit file="main.html" /> <%inherit file="main.html" />
<%!
from django.core.urlresolvers import reverse
%>
<%block name="headextra">
<script type="text/javascript" src="${ settings.LIB_URL }flot/jquery.flot.min.js"></script>
<script type="text/javascript" src="${ settings.LIB_URL }flot/jquery.flot.stack.js"></script>
<script language="javascript" type="text/javascript" src="${ settings.LIB_URL }flot/jquery.flot.symbol.js"></script>
<script>
<%include file="profile_graphs.js"/>
</script>
<script> <script>
var loc=true; // Activate on clicks? Not if already clicked. var loc=true; // Activate on clicks? Not if already clicked.
var lang=true; var lang=true;
$(function() { $(function() {
$("#change_location").click(function() { $("#change_location").click(function() {
$(this).hide();
log_event("profile", {"type":"location_show", "old":$("#location_sub").text()}); log_event("profile", {"type":"location_show", "old":$("#location_sub").text()});
if(loc) { if(loc) {
...@@ -18,6 +32,8 @@ $(function() { ...@@ -18,6 +32,8 @@ $(function() {
$("#location_sub").html('<input id="id_loc_text" type="text" name="loc_text" />'+ $("#location_sub").html('<input id="id_loc_text" type="text" name="loc_text" />'+
'<input type="button" id="change_loc_button" value="Change" />'); '<input type="button" id="change_loc_button" value="Change" />');
$("#change_loc_button").click(function() { $("#change_loc_button").click(function() {
$("#change_location").show();
postJSON('/change_setting', {'location':$("#id_loc_text").attr("value")}, function(json) { postJSON('/change_setting', {'location':$("#id_loc_text").attr("value")}, function(json) {
$("#location_sub").text(json.location); $("#location_sub").text(json.location);
loc=true; loc=true;
...@@ -29,6 +45,7 @@ $(function() { ...@@ -29,6 +45,7 @@ $(function() {
}); });
$("#change_language").click(function() { $("#change_language").click(function() {
$(this).hide();
log_event("profile", {"type":"language_show", "old":$("#language_sub").text()}); log_event("profile", {"type":"language_show", "old":$("#language_sub").text()});
if(lang) { if(lang) {
...@@ -36,6 +53,7 @@ $(function() { ...@@ -36,6 +53,7 @@ $(function() {
$("#language_sub").html('<input id="id_lang_text" type="text" name="lang_text" />'+ $("#language_sub").html('<input id="id_lang_text" type="text" name="lang_text" />'+
'<input type="button" id="change_lang_button" value="Change" />'); '<input type="button" id="change_lang_button" value="Change" />');
$("#change_lang_button").click(function() { $("#change_lang_button").click(function() {
$("#change_language").show();
postJSON('/change_setting', {'language':$("#id_lang_text").attr("value")}, function(json) { postJSON('/change_setting', {'language':$("#id_lang_text").attr("value")}, function(json) {
$("#language_sub").text(json.language); $("#language_sub").text(json.language);
lang=true; lang=true;
...@@ -59,20 +77,72 @@ $(function() { ...@@ -59,20 +77,72 @@ $(function() {
}); });
}); });
}); });
</script> </script>
</%block>
<%include file="navigation.html" />
<%include file="navigation.html" args="active_page='profile'" />
<section class="main-content"> <section class="main-content">
<div class="profile-wrapper"> <div class="profile-wrapper">
<section class="course-info">
<h1>Course Progress</h1>
<div id="grade-detail-graph" style="width:650px;height:200px;"></div>
<ol>
<%
lastChapter = None
%>
% for hw in homeworks:
<li>
%if hw['chapter'] != lastChapter:
<h2><a href="${reverse('courseware_chapter', args=format_url_params([hw['course'], hw['chapter']])) }">
${ hw['chapter'] }</a></h2>
<% lastChapter = hw['chapter'] %>
%else:
<h2>-</h2>
%endif
<div class="scores">
<h3><a href="${reverse('courseware_section', args=format_url_params([hw['course'], hw['chapter'], hw['section']])) }">
<%
earned = hw['section_total'][0]
total = hw['section_total'][1]
percentageString = "{0:.0%}".format( float(earned)/total) if earned > 0 else ""
%>
${ hw['section'] }</a> ${"({0}/{1}) {2}".format( earned, total, percentageString )}</h3>
${hw['subtitle']}
% if 'due' in hw and hw['due']!="":
due ${hw['due']}
% endif
<ul>
%if len(hw['scores']) > 0:
%if hw['graded']:
Problem Scores:
%else:
Practice Scores:
%endif
% for score in hw['scores']:
<li>${ score[0] }/${ score[1] }</li>
% endfor
%endif
</ul>
</div>
</li>
% endfor
</ol>
</section>
<section class="user-info"> <section class="user-info">
<h1>${name}</h1> <h1>${name}</h1>
<ul> <ul>
<li>Forum name: ${username}</li> <li>Forum name: <strong>${username}</strong></li>
<li>E-mail: ${email}</li> <li>E-mail: <strong>${email}</strong></li>
<li> <li>
Location: <div id="location_sub">${location}</div><div id="description"></div> <a href="#" id="change_location">Change</a> Location: <div id="location_sub">${location}</div><div id="description"></div> <a href="#" id="change_location">Change</a>
</li> </li>
...@@ -94,26 +164,6 @@ $(function() { ...@@ -94,26 +164,6 @@ $(function() {
</div> </div>
</section> </section>
<section class="course-info">
<h1>Course Progress</h1>
<!-- <div id="description"></div> -->
<ol>
% for hw in homeworks:
<li>
<h2>${ hw['chapter'] }</h2>
<h3>${ hw['section'] }</h3>
<ul>
% for score in hw['scores']:
<li>${ score[0] }/${ score[1] }</li>
% endfor
</ul>
</li>
% endfor
</ol>
</section>
</div> </div>
</section> </section>
<%!
import json
%>
$(function () {
function showTooltip(x, y, contents) {
$('<div id="tooltip">' + contents + '</div>').css( {
position: 'absolute',
display: 'none',
top: y + 5,
left: x + 5,
border: '1px solid #fdd',
padding: '2px',
'background-color': '#fee',
opacity: 0.90
}).appendTo("body").fadeIn(200);
}
/* -------------------------------- Grade detail graph -------------------------------- */
var colors = [$.color.parse("#E8B800"), $.color.parse("#A0CEFA"), $.color.parse("#BD3738"), $.color.parse("#429A2E")];
//var colors = [$.color.parse("#1B2045"), $.color.parse("#557a00"), $.color.parse("#F5600"), $.color.parse("#FEBA2C")];
//var colors = [$.color.parse("#E7C856"), $.color.parse("#CD462E"), $.color.parse("#B01732"), $.color.parse("#41192A")];
//var colors = [$.color.parse("#434F5E"), $.color.parse("#BEF731"), $.color.parse("#FB5455"), $.color.parse("#44C4B7")];
//var colors = [$.color.parse("#147A7D"), $.color.parse("#C0C900"), $.color.parse("#C9005B"), $.color.parse("#FCF9A5")];
var series = [];
var ticks = []; //These are the indices and x-axis labels for the data
var bottomTicks = []; //Labels on the bottom
var detail_tooltips = {}; //This an dictionary mapping from 'section' -> array of detail_tooltips
var droppedScores = []; //These are the datapoints to indicate assignments which aren't factored into the total score
detail_tooltips['Dropped Scores'] = [];
<%
tickIndex = 1
sectionSpacer = 0.5
sectionIndex = 0
%>
%for section in grade_summary:
%if 'subscores' in section: ##This is for sections like labs or homeworks, with several smaller components and a total
series.push({label: "${section['category']}",
data: ${ json.dumps( [[i + tickIndex, score['percentage']] for i,score in enumerate(section['subscores'])] ) },
color: colors[${sectionIndex}].toString(),
});
ticks = ticks.concat( ${ json.dumps( [[i + tickIndex, str(i + 1)] for i,score in enumerate(section['subscores'])] ) } );
bottomTicks.push( [ ${tickIndex + len(section['subscores'])/2}, "${section['category']}" ] );
detail_tooltips["${section['category']}"] = ${ json.dumps([score['summary'] for score in section['subscores']] ) };
droppedScores = droppedScores.concat(${ json.dumps( [[tickIndex + index, 0.05] for index in section['dropped_indices']]) });
<% dropExplanation = "The lowest {0} {1} scores are dropped".format( len(section['dropped_indices']), section['category'] ) %>
detail_tooltips['Dropped Scores'] = detail_tooltips['Dropped Scores'].concat( ${json.dumps( [dropExplanation] * len(section['dropped_indices']) )} );
<% tickIndex += len(section['subscores']) + sectionSpacer %>
##Now put on the aggregate score
series.push({label: "${section['category']} Total",
data: [[${tickIndex}, ${section['totalscore']['score']}]],
color: colors[${sectionIndex}].toString(),
});
ticks = ticks.concat( [ [${tickIndex}, "Total"] ] );
detail_tooltips["${section['category']} Total"] = [ "${section['totalscore']['summary']}" ];
<% tickIndex += 1 + sectionSpacer %>
%else: ##This is for sections like midterm or final, which have no smaller components
series.push({label: "${section['category']}",
data: [[${tickIndex}, ${section['totalscore']['score']}]],
color: colors[${sectionIndex}].toString(),
});
%if section['category'] == "Midterm":
bottomTicks = bottomTicks.concat( [ [${tickIndex}, "${section['category']}"] ] );
%else:
ticks = ticks.concat( [ [${tickIndex}, "${section['category']}"] ] );
%endif
detail_tooltips["${section['category']}"] = [ "${section['totalscore']['summary']}" ];
<% tickIndex += 1 + sectionSpacer %>
%endif
<%sectionIndex += 1 %>
%endfor
//Alwasy be sure that one series has the xaxis set to 2, or the second xaxis labels won't show up
series.push( {label: 'Dropped Scores', data: droppedScores, points: {symbol: "cross", show: true, radius: 3}, bars: {show: false}, color: "red", xaxis: 2} );
var options = {
series: {lines: {show: false, steps: false },
bars: {show: true, barWidth: 0.6, align: 'center', lineWidth: 1},},
xaxis: {tickLength: 0, min: 0.0, max: ${tickIndex - sectionSpacer}},
xaxes: [{ticks: ticks}, {ticks: bottomTicks}],
yaxis: {ticks: [[1, "100%"], [0.87, "A 87%"], [0.7, "B 70%"], [0.6, "C 60%"], [0, "0%"]], min: 0.0, max: 1.0, labelWidth: 50},
grid: { hoverable: true, clickable: true, borderWidth: 1,
markings: [ {yaxis: {from: 0.87, to: 1 }, color: "#EBFFD5"}, {yaxis: {from: 0.7, to: 0.87 }, color: "#E6FFFF"},
{yaxis: {from: 0.6, to: 0.7 }, color: "#FFF2E3"}, ] },
legend: {show: false},
};
if ($("#grade-detail-graph").length > 0) {
$.plot($("#grade-detail-graph"), series, options);
}
var previousPoint = null;
$("#grade-detail-graph").bind("plothover", function (event, pos, item) {
$("#x").text(pos.x.toFixed(2));
$("#y").text(pos.y.toFixed(2));
if (item) {
if (previousPoint != item.dataIndex) {
previousPoint = item.dataIndex;
$("#tooltip").remove();
if (item.series.label in detail_tooltips) {
var series_tooltips = detail_tooltips[item.series.label];
if (item.dataIndex < series_tooltips.length) {
var x = item.datapoint[0].toFixed(2), y = item.datapoint[1].toFixed(2);
showTooltip(item.pageX, item.pageY, series_tooltips[item.dataIndex]);
}
}
}
} else {
$("#tooltip").remove();
previousPoint = null;
}
});
});
...@@ -972,30 +972,30 @@ ul { ...@@ -972,30 +972,30 @@ ul {
.main-page h1 { .main-page h1 {
margin-right: 5px; } margin-right: 5px; }
.delete-icon { // .delete-icon {
margin-top: -1px; // margin-top: -1px;
float: left; // float: left;
height: 21px; // height: 21px;
width: 18px; // width: 18px;
display: block; // display: block;
line-height: 20px; // line-height: 20px;
text-align: center; // text-align: center;
background: #bbcdcd; // background: #bbcdcd;
cursor: default; // cursor: default;
color: #fff; // color: #fff;
border-top: #cfdbdb 1px solid; // border-top: #cfdbdb 1px solid;
font-family: Arial; // font-family: Arial;
border-top-right-radius: 4px; // border-top-right-radius: 4px;
border-bottom-right-radius: 4px; // border-bottom-right-radius: 4px;
-moz-border-radius-topright: 4px; // -moz-border-radius-topright: 4px;
-moz-border-radius-bottomright: 4px; // -moz-border-radius-bottomright: 4px;
-webkit-border-bottom-right-radius: 4px; // -webkit-border-bottom-right-radius: 4px;
-webkit-border-top-right-radius: 4px; // -webkit-border-top-right-radius: 4px;
text-shadow: 0px 1px 0px #7ea0a0; // text-shadow: 0px 1px 0px #7ea0a0;
-moz-text-shadow: 0px 1px 0px #7ea0a0; // -moz-text-shadow: 0px 1px 0px #7ea0a0;
-webkit-text-shadow: 0px 1px 0px #7ea0a0; // -webkit-text-shadow: 0px 1px 0px #7ea0a0;
&:hover { // &:hover {
background: #b32f2f; } } // background: #b32f2f; } }
.tag-number { .tag-number {
font-weight: normal; font-weight: normal;
......
...@@ -39,6 +39,7 @@ ...@@ -39,6 +39,7 @@
.content { .content {
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(inset 0 0 2px 3px #f3f3f3);
display: table-cell; display: table-cell;
padding: lh(); padding: lh();
vertical-align: top; vertical-align: top;
...@@ -46,8 +47,9 @@ ...@@ -46,8 +47,9 @@
} }
.sidebar { .sidebar {
@include box-shadow( inset -1px 0 0 #f6f6f6); @include box-shadow( inset 0 0 0 1px #f6f6f6);
@include box-sizing(border-box); @include box-sizing(border-box);
@include border-radius(4px 0 0 4px);
background: #e3e3e3; background: #e3e3e3;
border-right: 1px solid #d3d3d3; border-right: 1px solid #d3d3d3;
display: table-cell; display: table-cell;
...@@ -106,6 +108,7 @@ ...@@ -106,6 +108,7 @@
margin: (-$body-line-height) (-$body-line-height) $body-line-height; margin: (-$body-line-height) (-$body-line-height) $body-line-height;
font-size: 12px; font-size: 12px;
text-shadow: 0 1px 0 #fff; text-shadow: 0 1px 0 #fff;
@include box-shadow(inset 0 1px 0 #fff, inset 1px 0 0 #fff);
@extend .clearfix; @extend .clearfix;
a { a {
......
...@@ -41,6 +41,26 @@ em { ...@@ -41,6 +41,26 @@ em {
} }
} }
a {
color: $mit-red;
&:link {
color: $mit-red;
}
&:visited {
color: darken($mit-red, 10%);
}
&:link, &:visited {
text-decoration:none;
}
&:hover, &:focus {
text-decoration:underline;
}
}
input[type="submit"], input[type="button"], button { input[type="submit"], input[type="button"], button {
@extend .button; @extend .button;
} }
......
nav.sequence-nav {
@extend .topbar;
margin-bottom: $body-line-height;
ol {
display: table-row;
float: left;
width: flex-grid(7.5,9) + flex-gutter();
a {
@extend .block-link;
}
.inactive {
background-repeat: no-repeat;
&:hover {
background-color: lighten(#F6EFD4, 3%);
}
}
.visited {
background-color: shade(#F6EFD4, 10%);
background-repeat: no-repeat;
border-color: shade(#F6EFD4, 10%);
&:hover {
background-color: #F6EFD4;
}
}
.active {
// @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%));
@include box-shadow(0 1px 0 #fff);
background-color: #fff;
background-repeat: no-repeat;
&:hover {
background-color: #fff;
}
}
li {
@include box-shadow(1px 0 0 #fff);
background-position: center center;
border: none;
border-right: 1px solid darken(#F6EFD4, 10%);
cursor: pointer;
display: table-cell;
padding: 14px 4px;
width: 28px;
// @media screen and (max-width: 800px) {
// padding: 12px 8px;
// }
//video
&.seq_video_inactive {
@extend .inactive;
background-image: url('/static/images/sequence-nav/video-icon-normal.png');
}
&.seq_video_visited {
@extend .visited;
background-image: url('/static/images/sequence-nav/video-icon-visited.png');
}
&.seq_video_active {
@extend .active;
background-image: url('/static/images/sequence-nav/video-icon-current.png');
}
//other
&.seq_other_inactive {
@extend .inactive;
background-image: url('/static/images/sequence-nav/document-icon-normal.png');
}
&.seq_other_visited {
@extend .visited;
background-image: url('/static/images/sequence-nav/document-icon-visited.png');
}
&.seq_other_active {
@extend .active;
background-image: url('/static/images/sequence-nav/document-icon-current.png');
}
//vertical & problems
&.seq_vertical_inactive, &.seq_problem_inactive {
@extend .inactive;
background-image: url('/static/images/sequence-nav/list-icon-normal.png');
}
&.seq_vertical_visited, &.seq_problem_visited {
@extend .visited;
background-image: url('/static/images/sequence-nav/list-icon-visited.png');
}
&.seq_vertical_active, &.seq_problem_active {
@extend .active;
background-image: url('/static/images/sequence-nav/list-icon-current.png');
}
}
}
ul {
float: right;
margin-right: 1px;
width: flex-grid(1.5, 9);
display: table-row;
li {
&.prev, &.next {
// color: darken(#F6EFD4, 80%);
// letter-spacing: 1px;
// text-transform: uppercase;
@include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
background-color: darken(#F6EFD4, 5%);
background-position: center center;
background-repeat: no-repeat;
border-left: 1px solid darken(#f6efd4, 20%);
cursor: pointer;
display: table-cell;
padding: 14px 4px;
text-indent: -9999px;
width: 82px;
&:hover {
text-decoration: none;
color: darken(#F6EFD4, 60%);
text-decoration: none;
background-color: none;
}
}
&.prev {
background-image: url('/static/images/sequence-nav/previous-icon.png');
&:hover {
background-color: none;
}
}
&.next {
background-image: url('/static/images/sequence-nav/next-icon.png');
&:hover {
background-color: none;
}
}
}
}
}
...@@ -62,19 +62,23 @@ section.course-content { ...@@ -62,19 +62,23 @@ section.course-content {
background: #c2c2c2; background: #c2c2c2;
border: none; border: none;
border-bottom: 1px solid #000; border-bottom: 1px solid #000;
height: 20px; height: 14px;
a.ui-slider-handle { a.ui-slider-handle {
@include border-radius(0); @include border-radius(20px);
@include box-shadow(inset 0 1px 0 lighten($mit-red, 10%));
background: $mit-red url(/static/images/slider-handle.png) center center no-repeat; background: $mit-red url(/static/images/slider-handle.png) center center no-repeat;
border: 0; border: 0;
border-right: 1px solid darken($mit-red, 20%); border: 1px solid darken($mit-red, 20%);
border-left: 1px solid darken($mit-red, 20%);
cursor: pointer; cursor: pointer;
height: 20px; height: 20px;
margin: 0; margin-left: -10px;
top: 0; top: -4px;
width: 20px; width: 20px;
&:focus {
outline: none;
}
} }
} }
...@@ -132,7 +136,9 @@ section.course-content { ...@@ -132,7 +136,9 @@ section.course-content {
font-weight: bold; font-weight: bold;
span { span {
@include inline-block();
cursor: pointer; cursor: pointer;
margin-bottom: 0;
&:hover { &:hover {
color: $mit-red; color: $mit-red;
...@@ -146,7 +152,8 @@ section.course-content { ...@@ -146,7 +152,8 @@ section.course-content {
ol.subtitles { ol.subtitles {
float: left; float: left;
width: flex-grid(3, 9); width: flex-grid(3, 9);
min-height: 570px; height: 530px;
overflow: hidden;
li { li {
margin-bottom: 0px; margin-bottom: 0px;
......
...@@ -78,146 +78,127 @@ div.course-wrapper { ...@@ -78,146 +78,127 @@ div.course-wrapper {
section.course-content { section.course-content {
@extend .content; @extend .content;
ol.vert-mod { p {
> li { margin-bottom: lh();
@extend .clearfix;
border-bottom: 1px solid #eee;
padding: 15px 0;
&:last-child {
border-bottom: none;
}
h2 { &:empty {
margin-top: 0; display: none;
margin-bottom: 15px; margin-bottom: 0;
}
input[type="text"] {
display: inline-block;
margin: 8px 4px 4px 10px;
}
} }
} }
ol.sequence-nav { .problem-set {
margin-bottom: $body-line-height; position: relative;
@extend .topbar; @extend .clearfix;
h2 {
margin-top: 0;
margin-bottom: 15px;
width: flex-grid(2, 9);
padding-right: flex-gutter(9);
border-right: 1px dotted #ccc;
@include box-sizing(border-box);
display: table-cell;
vertical-align: top;
a { @media screen and (max-width:1120px) {
@extend .block-link; display: block;
width: auto;
border-right: 0;
}
} }
li { section.problem {
border: none;
cursor: pointer;
display: table-cell; display: table-cell;
padding: lh(.75); width: flex-grid(7, 9);
float: left; padding-left: flex-gutter(9);
//problem
&.seq_problem_inactive {
width: 14px;
background: url('/static/images/problem-icon.png') 13px 13px no-repeat;
@include box-shadow(inset -1px 0 0 darken(#F6EFD4, 10%));
&:hover { @media screen and (max-width:1120px) {
background-color: lighten(#F6EFD4, 3%); display: block;
width: auto;
padding: 0;
}
span {
&.unanswered, &.ui-icon-bullet {
@include inline-block();
background: url('/static/images/unanswered-icon.png') center center no-repeat;
height: 14px;
position: relative;
top: 4px;
width: 14px;
} }
}
&.seq_problem_visited { &.correct, &.ui-icon-check {
width: 14px; @include inline-block();
background: shade(#F6EFD4, 4%) url('/static/images/problem-icon.png') -57px 13px no-repeat; background: url('/static/images/correct-icon.png') center center no-repeat;
&:hover { height: 20px;
background-color: #F6EFD4; position: relative;
top: 6px;
width: 25px;
} }
}
&.seq_problem_active {
width: 14px;
background: #FFFBEB url('/static/images/problem-icon.png') -22px 13px no-repeat;
@include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%));
&:hover { &.incorrect, &.ui-icon-close {
background-color: #F6EFD4; @include inline-block();
} background: url('/static/images/incorrect-icon.png') center center no-repeat;
} height: 20px;
width: 20px;
//video position: relative;
&.seq_video_inactive { top: 6px;
width: 14px;
background: url('/static/images/video-icon.png') 13px 15px no-repeat;
@include box-shadow(inset -1px 0 0 darken(#F6EFD4, 10%));
&:hover {
background-color: lighten(#F6EFD4, 3%);
} }
} }
}
&.seq_video_visited { div {
width: 14px; > span {
background: shade(#F6EFD4, 4%) url('/static/images/video-icon.png') -81px 15px no-repeat; display: block;
&:hover { margin-bottom: lh(.5);
background-color: #F6EFD4;
}
} }
}
&.seq_video_active { input[type="text"] {
width: 14px; display: inline-block;
background: #FFFBEB url('/static/images/video-icon.png') -32px 15px no-repeat; }
@include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%),inset 1px 0 0 darken(#F6EFD4, 20%));
&:hover {
background-color: #F6EFD4;
}
}
center {
display: block;
margin: lh() 0;
border: 1px solid #ccc;
padding: lh();
}
//vertical section.action {
&.seq_vertical_inactive { margin-top: lh();
width: 14px; }
background: url('/static/images/vertical-icon.png') -82px 15px no-repeat; }
@include box-shadow(inset -1px 0 0 darken(#F6EFD4, 10%));
&:hover {
background-color: lighten(#F6EFD4, 3%);
}
}
&.seq_vertical_visited { section.problems-wrapper, div#seq_content {
width: 14px; @extend .problem-set;
background: shade(#F6EFD4, 4%) url('/static/images/vertical-icon.png') 13px 15px no-repeat; }
&:hover {
background-color: #F6EFD4;
}
}
&.seq_vertical_active { section.problems-wrapper {
width: 14px; display: table;
background: #FFFBEB url('/static/images/vertical-icon.png') -35px 15px no-repeat; width: 100%;
@include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%));
&:hover { @media screen and (max-width:1120px) {
background-color: #F6EFD4; display: block;
} width: auto;
} }
}
&.prev, &.next { ol.vert-mod {
@include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%)); > li {
background: darken(#F6EFD4, 5%); @extend .clearfix;
border-left: 1px solid darken(#f6efd4, 20%); @extend .problem-set;
color: darken(#F6EFD4, 80%); border-bottom: 1px solid #ddd;
float: right; margin-bottom: 15px;
letter-spacing: 1px; padding: 0 0 15px;
padding: lh(.75);
text-transform: uppercase;
&:hover { &:last-child {
text-decoration: none; border-bottom: none;
color: darken(#F6EFD4, 60%); margin-bottom: 0;
text-decoration: none; padding-bottom: 0;
background: none;
}
} }
} }
} }
......
div.answer-controls {
@extend div.question-controls;
display: inline-block;
margin-top: 20px;
margin-bottom: 0;
div.answer-sort {
@extend div.question-sort;
}
div.answer-count {
@extend div.question-count;
}
}
div.answer-block {
@extend div.question-header;
border-top: #ddd 1px solid;
display: inline-block;
float: left;
margin: 20px 0;
padding-top: 20px;
width: 100%;
img.answer-img-accept {
margin: 10px 0px 10px 16px;
}
div.answer-container {
@extend div.question-container;
div.answer-content {
@extend div.question-content;
div.answer-body {
@extend div.question-body;
}
}
}
div.meta-bar {
div.answer-actions {
@extend div.question-actions;
}
}
}
...@@ -10,7 +10,7 @@ div.question-controls { ...@@ -10,7 +10,7 @@ div.question-controls {
div.question-count { div.question-count {
margin-right: flex-gutter(); margin-right: flex-gutter();
width: flex-grid(5.5,9); width: flex-grid(5,9);
h1 { h1 {
margin-top: 0; margin-top: 0;
...@@ -19,7 +19,7 @@ div.question-controls { ...@@ -19,7 +19,7 @@ div.question-controls {
div.question-sort { div.question-sort {
vertical-align: bottom; vertical-align: bottom;
width: flex-grid(3.5,9); width: flex-grid(4,9);
nav { nav {
@include border-radius(35px); @include border-radius(35px);
...@@ -28,10 +28,14 @@ div.question-controls { ...@@ -28,10 +28,14 @@ div.question-controls {
float: right; float: right;
font-size: 16px; font-size: 16px;
margin: 3px 0; margin: 3px 0;
padding: 0 20px; padding:0px 20px 5px;
a { a {
color: darken(#F6EFD4, 50%); color: darken(#F6EFD4, 50%);
&.on span{
font-weight: bold;
}
&:before { &:before {
content: '|'; content: '|';
...@@ -153,42 +157,3 @@ div.search-tips { ...@@ -153,42 +157,3 @@ div.search-tips {
.search-result-summary { .search-result-summary {
} }
div.post-update-info {
@include box-sizing(border-box);
@include border-radius(5px);
background:lighten(#F6EFD4, 5%);
padding: 10px;
a {
color:$mit-red ;
}
div.change-date {
font-size: 12px;
margin-bottom: 10px;
}
div.avatar {
display: inline-block;
float: left;
margin-right: 3px;
img.gravatar {
background: white;
border: 1px solid darken(#F6EFD4, 10%);
margin-right: 5px;
padding: 3px ;
vertical-align: bottom;
}
}
div.user-meta {
display: inline-block;
width: 60%;
span.user-badges {
display: block;
}
}
}
section.help.main-content { section.help.main-content {
padding: lh(); padding: lh();
h1 {
margin-top: 0;
margin-bottom: lh();
padding-bottom: lh();
border-bottom: 1px solid #ddd;
}
p { p {
max-width: 700px; max-width: 700px;
} }
dl { h2 {
margin-top: 0;
}
section.self-help {
margin-bottom: lh(); margin-bottom: lh();
margin-right: flex-gutter();
float: left;
width: flex-grid(6);
dd, dt { ul {
margin-bottom: lh(.5); margin-left: flex-gutter(6);
li {
margin-bottom: lh(.5);
}
} }
}
section.help-email {
float: left;
width: flex-grid(6);
dl {
margin-bottom: lh();
display: block;
dd {
margin-bottom: lh();
}
dt { dt {
font-weight: bold; font-weight: bold;
float: left;
clear: left;
width: flex-grid(2, 6);
}
} }
} }
} }
...@@ -237,6 +237,40 @@ section.index-content { ...@@ -237,6 +237,40 @@ section.index-content {
} }
} }
&.intro {
section {
margin-bottom: 0;
&.intro-text {
margin-right: flex-gutter(8);
width: flex-grid(4, 8);
p {
margin-right: 0;
width: auto;
float: none;
}
}
&.intro-video {
width: flex-grid(4, 8);
a {
display: block;
width: 100%;
img {
width: 100%;
}
span {
display: none;
}
}
}
}
}
&.features { &.features {
border-top: 1px solid #E5E5E5; border-top: 1px solid #E5E5E5;
padding-top: lh(); padding-top: lh();
......
div.info-wrapper {
@extend .table-wrapper;
section.updates {
@extend .content;
}
section.handouts {
@extend .sidebar;
@include border-radius(0px 4px 0px 4px);
border-right: 0;
border-left: 1px solid #d3d3d3;
h1 {
padding: 0 lh();
}
ol {
list-style: none;
li {
h2 {
padding: 0 lh();
}
a {
@include box-shadow(0 1px 0 #eee);
@include transition();
border-bottom: 1px solid #d3d3d3;
color: lighten($text-color, 10%);
display: block;
padding: 7px lh();
text-decoration: none;
&:hover {
@include box-shadow(0 1px 0 #fff);
background: #efefef;
}
}
}
}
}
}
...@@ -6,7 +6,7 @@ html { ...@@ -6,7 +6,7 @@ html {
font: $body-font-size $body-font-family; font: $body-font-size $body-font-family;
text-align: center; text-align: center;
margin: 0; margin: 0;
background: #f6f6f6; background: #f4f4f4; //#f3f1e5
div.header-wrapper { div.header-wrapper {
// @include linear-gradient(lighten($mit-red, 5%), darken($mit-red, 5%)); // @include linear-gradient(lighten($mit-red, 5%), darken($mit-red, 5%));
...@@ -20,48 +20,74 @@ html { ...@@ -20,48 +20,74 @@ html {
@include box-sizing(border-box); @include box-sizing(border-box);
padding: 0 $body-line-height; padding: 0 $body-line-height;
h1 { hgroup {
border-right: 1px solid darken($mit-red, 5%); @extend .clearfix;
color: #000;
display: block;
float: left; float: left;
font-size: 20px;
font-weight: 800;
margin: 0 lh() 0 0;
padding: 17px lh() 17px 0;
text-shadow: 0 1px 0 lighten($mit-red, 10%);
line-height: lh();
}
nav { h1 {
float: left; border-right: 1px solid darken($mit-red, 5%);
display: block; color: darken($mit-red, 25%);
margin: 0; font-size: 20px;
padding: 0; font-weight: 800;
text-shadow: 0 -1px 0 darken($mit-red, 10%); margin: 0 lh() 0 0;
-webkit-font-smoothing: antialiased; padding: 17px lh() 14px 0;
text-shadow: 0 1px 0 lighten($mit-red, 10%);
line-height: lh();
@include inline-block();
}
h2 { h2 {
float: left; @include inline-block();
margin: 0 lh() 0 0; margin: 0 lh() 0 0;
padding: 19px lh() 12px 0; padding: 19px lh() 9px 0;
line-height: lh(); line-height: lh();
border-right: 1px solid darken($mit-red, 5%); border-right: 1px solid darken($mit-red, 5%);
-webkit-font-smoothing: antialiased;
a { a {
color: #fff; color: #fff;
text-decoration: none;
&:hover { &:hover {
color: rgba(#fff, .7); color: rgba(#fff, .7);
text-decoration: none;
} }
} }
} }
@media screen and (max-width: 920px) {
border-bottom: 1px solid darken($mit-red, 5%);
display: block;
float: none;
h1 {
float: right;
border: 0;
margin-right: 0;
padding-right: 0;
}
h2 {
float: left;
border: 0;
margin-right: 0;
padding-right: 0;
}
}
}
nav {
float: left;
display: block;
margin: 0;
padding: 0;
text-shadow: 0 -1px 0 darken($mit-red, 10%);
-webkit-font-smoothing: antialiased;
ul { ul {
@extend .clearfix; @extend .clearfix;
display: inline-block; display: inline-block;
padding: 19px 0 12px; padding: 19px 0 9px;
margin: 0; margin: 0;
li { li {
...@@ -72,6 +98,7 @@ html { ...@@ -72,6 +98,7 @@ html {
a { a {
color: #fff; color: #fff;
text-decoration: none;
&:hover { &:hover {
color: rgba(#fff, .7); color: rgba(#fff, .7);
...@@ -88,15 +115,17 @@ html { ...@@ -88,15 +115,17 @@ html {
section.main-content { section.main-content {
@extend .clearfix; @extend .clearfix;
@extend .wrapper; @extend .wrapper;
@include box-shadow(0 0 4px #ddd);
@include box-sizing(border-box); @include box-sizing(border-box);
@include border-radius(4px);
overflow: hidden;
background: #fff; background: #fff;
border-bottom: 1px solid #bbb; border-bottom: 1px solid #bbb;
@media screen and (min-width: 1400px) { @media screen and (min-width: 1400px) {
margin-top: lh(.5); // @include border-radius(3px);
@include border-radius(3px); @include box-shadow(0 0 4px #dfdfdf);
border: 1px solid #bbb; border: 1px solid #bbb;
margin-top: lh(.5);
} }
} }
...@@ -119,6 +148,14 @@ html { ...@@ -119,6 +148,14 @@ html {
a { a {
color: #444; color: #444;
&:link, &:visited {
color: #444;
}
&:hover, &:focus {
color: #000;
}
} }
} }
...@@ -131,6 +168,14 @@ html { ...@@ -131,6 +168,14 @@ html {
a { a {
color: #444; color: #444;
&:link, &:visited {
color: #444;
}
&:hover, &:focus {
color: #000;
}
} }
} }
} }
......
...@@ -15,7 +15,6 @@ div.leanModal_box { ...@@ -15,7 +15,6 @@ div.leanModal_box {
@include box-sizing(border-box); @include box-sizing(border-box);
display: none; display: none;
border: none; border: none;
max-width: 600px;
background: #fff; background: #fff;
padding: lh(2); padding: lh(2);
...@@ -27,10 +26,45 @@ div.leanModal_box { ...@@ -27,10 +26,45 @@ div.leanModal_box {
margin-bottom: lh(); margin-bottom: lh();
} }
&#enroll {
max-width: 600px;
ol {
@extend .clearfix;
li {
&.terms, &.honor-code {
width: auto;
float: none;
}
div.tip {
display: none;
}
&:hover {
div.tip {
display: block;
line-height: lh();
position: absolute;
background: #333;
color: #fff;
width: 500px;
margin: 0 0 0 -10px;
padding: 10px;
-webkit-font-smoothing: antialiased;
font-size: 16px;
}
}
}
}
}
form { form {
text-align: left; text-align: left;
div#enroll_error, div#login_error { div#enroll_error, div#login_error, div#pwd_error {
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
background-color: #F50200; background-color: #F50200;
color: #fff; color: #fff;
...@@ -47,6 +81,7 @@ div.leanModal_box { ...@@ -47,6 +81,7 @@ div.leanModal_box {
ol { ol {
list-style: none; list-style: none;
margin-bottom: lh();
li { li {
margin-bottom: lh(.5); margin-bottom: lh(.5);
......
div.profile-wrapper { div.profile-wrapper {
@extend .table-wrapper; @extend .table-wrapper;
color: #000;
section.user-info { section.user-info {
@include box-sizing(border-box); @extend .sidebar;
margin-right: flex-gutter(); @include border-radius(0px 4px 0px 4px);
padding: $body-line-height; border-left: 1px solid #d3d3d3;
width: flex-grid(6); border-right: 0;
background: #e3e3e3;
border-right: 1px solid #d3d3d3;
text-shadow: 0 1px 0 #f6f6f6;
display: table-cell;
}
section.course-info { h1 {
@include box-sizing(border-box); padding: lh();
display: table-cell; }
padding: $body-line-height;
width: flex-grid(6);
ul { ul {
list-style: none;
li { li {
display: inline-block; @include transition();
padding-right: 1em; color: lighten($text-color, 10%);
display: block;
text-decoration: none;
@include box-shadow(0 1px 0 #eee);
padding: 7px lh();
border-bottom: 1px solid #d3d3d3;
div#location_sub, div#language_sub {
font-weight: bold;
@include inline-block();
input {
margin: lh(.5) 0;
}
&:empty {
padding: 0;
}
}
div#description {
font-size: 12px;
}
} }
} }
div#change_password_pop {
padding: 7px lh();
color: #4D4D4D;
}
}
section.course-info {
@extend .content;
ol {
list-style: none;
> li {
border-bottom: 1px solid #e3e3e3;
padding: lh() 0;
@extend .clearfix;
h2 {
float: left;
padding: 0;
margin: 0;
width: flex-grid(2, 9);
margin-right: flex-gutter(9);
}
div.scores {
float: left;
width: flex-grid(7, 9);
h3 {
color: #666;
}
ul {
list-style: none;
li {
display: inline-block;
padding-right: 1em;
}
}
}
}
}
} }
} }
...@@ -2,34 +2,40 @@ div.question-header { ...@@ -2,34 +2,40 @@ div.question-header {
div.vote-buttons { div.vote-buttons {
display: inline-block; display: inline-block;
float: left; float: left;
width: flex-grid(1,9);
margin-right: flex-gutter(9); margin-right: flex-gutter(9);
width: flex-grid(0.7,9);
ul li { ul {
background-position: center; li {
background-repeat: no-repeat; background-position: center;
cursor: pointer; background-repeat: no-repeat;
font-weight: bold; cursor: pointer;
height: 20px; font-weight: bold;
list-style: none; height: 20px;
padding: 10px; list-style: none;
text-align: center; padding: 10px;
width: 25px; text-align: center;
width: 70%;
&.question-img-upvote, &.answer-img-upvote {
background-image: url(/static/images/askbot/vote-arrow-up-new.png); &.post-vote {
background-color: #F6EFD4; @include border-radius(4px);
background-color: lighten(#F6EFD4, 3%);
&:hover, &.on { }
background-image: url(/static/images/askbot/vote-arrow-up-on-new.png);
&.question-img-upvote, &.answer-img-upvote {
background-image: url(/static/images/askbot/vote-arrow-up.png);
&:hover, &.on {
background-color:#d1e3a8;
}
} }
}
&.question-img-downvote, &.answer-img-downvote { &.question-img-downvote, &.answer-img-downvote {
background-image: url(/static/images/askbot/vote-arrow-down-new.png); background-image: url(/static/images/askbot/vote-arrow-down.png);
&:hover, &.on { &:hover, &.on {
background-image: url(/static/images/askbot/vote-arrow-down-on-new.png); background-color:#eac6ad;
}
} }
} }
} }
...@@ -38,7 +44,7 @@ div.question-header { ...@@ -38,7 +44,7 @@ div.question-header {
div.question-container { div.question-container {
display: inline-block; display: inline-block;
float: left; float: left;
width: flex-grid(8,9); width: flex-grid(8.3,9);
h1 { h1 {
margin-top: 0; margin-top: 0;
...@@ -47,9 +53,9 @@ div.question-header { ...@@ -47,9 +53,9 @@ div.question-header {
div.meta-bar { div.meta-bar {
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
display: block; display: block;
margin: 20px 0 10px; margin: 10px 0;
overflow: hidden; overflow: hidden;
padding-bottom: 15px; padding: 5px 0 10px;
div.tag-list { div.tag-list {
...@@ -89,10 +95,195 @@ div.question-header { ...@@ -89,10 +95,195 @@ div.question-header {
width: flex-grid(6.2,8); width: flex-grid(6.2,8);
} }
div.post-update-info { div.post-update-container {
display: inline-block; display: inline-block;
float: left; float: left;
width: flex-grid(1.8,8); width: flex-grid(1.8,8);
div.post-update-info {
@include box-sizing(border-box);
@include border-radius(5px);
background:lighten(#F6EFD4, 5%);
padding: 10px;
margin-bottom: 10px;
&:last-child {
margin-bottom: 0;
}
&.revision {
text-align: center;
background:lighten(#F6EFD4, 7%);
a {
color: black;
}
}
a {
color:$mit-red ;
}
div.change-date {
font-size: 12px;
margin-bottom: 10px;
}
div.avatar {
display: inline-block;
float: left;
margin-right: 3px;
img.gravatar {
background: white;
border: 1px solid darken(#F6EFD4, 10%);
margin-right: 5px;
padding: 3px ;
vertical-align: bottom;
}
}
div.user-meta {
display: inline-block;
width: 60%;
span.user-badges {
display: block;
}
}
}
}
}
div.comments-container {
@include box-sizing(border-box);
background: lighten(#efefef, 3%);
padding: 3%;
display: inline-block;
margin: 15px 0 0;
padding: 3%;
width: 100%;
div.comments-content {
font-size: 13px;
.block {
border-bottom: 1px solid #ddd;
border-top: 1px solid #fff;
padding: 15px 0;
display: block;
&:first-child {
border-top: 0;
}
// &:only-of-type {
// border: 0;
// }
}
form.post-comments {
}
div.comment {
&:first-child {
border-top: 0;
}
&:last-child {
margin-bottom: 20px;
}
aside.comment-controls {
background: none;
border: none;
display: inline-block;
margin-top: -8px;
padding:0 2% 0 0;
text-align: center;
width: 5%;
div {
background: none;
opacity: 0.6;
&:hover {
opacity: 1;
}
}
div.comment-votes {
@include transform(rotate(-90deg));
width: 16px;
a.upvote {
cursor: pointer;
font-size: 25px;
text-decoration: none;
color: green;
}
}
hr {
margin: 0;
}
div.comment-delete {
// display: inline;
color: $mit-red;
cursor: pointer;
font-size: 15px;
}
div.comment-edit {
@include transform(rotate(50deg));
cursor: pointer;
font-size: 16px;
a.edit-icon {
color: #555;
text-decoration: none;
}
}
}
div.comment-body {
display: inline-block;
width: 95%;
div.comment-meta {
text-align: right;
a.author {
font-weight: bold;
}
a.edit {
@extend .button;
font-size: 12px;
padding: 2px 10px;
// @include border-radius(2px);
// background: #eee;
// color: #555;
// cursor: pointer;
// padding: 1px 10px;
// text-decoration: none;
}
}
}
}
}
#edit-comment-form {
margin: 10px 0;
min-height: 100px;
width: 99%;
resize: vertical;
}
.counter {
color: #888;
display: block;
float: right;
margin-top: 5px;
text-align: right;
} }
} }
} }
......
...@@ -20,6 +20,8 @@ div.book-wrapper { ...@@ -20,6 +20,8 @@ div.book-wrapper {
div.hitarea { div.hitarea {
margin-left: -22px; margin-left: -22px;
background-image: url('/static/images/treeview-default.gif'); background-image: url('/static/images/treeview-default.gif');
position: relative;
top: 4px;
&:hover { &:hover {
opacity: 0.6; opacity: 0.6;
...@@ -48,6 +50,7 @@ div.book-wrapper { ...@@ -48,6 +50,7 @@ div.book-wrapper {
a { a {
@extend .block-link; @extend .block-link;
padding: 14px;
} }
ul { ul {
...@@ -74,10 +77,11 @@ div.book-wrapper { ...@@ -74,10 +77,11 @@ div.book-wrapper {
} }
section.page { section.page {
text-align: center;
img { img {
border: 1px solid $border-color; border: 1px solid $border-color;
max-width: 100%; max-width: 100%;
min-width: 100%;
} }
} }
} }
......
...@@ -37,14 +37,6 @@ h3 { ...@@ -37,14 +37,6 @@ h3 {
clear:both; clear:both;
} }
a:link, a:visited {
text-decoration:none;
}
a:hover {
text-decoration:underline;
}
#wrapper { #wrapper {
background: transparent url( images/css/page-vbg.jpg ) repeat-y scroll 50% 0px; background: transparent url( images/css/page-vbg.jpg ) repeat-y scroll 50% 0px;
margin:0 auto ; margin:0 auto ;
......
...@@ -78,6 +78,10 @@ div.wiki-wrapper { ...@@ -78,6 +78,10 @@ div.wiki-wrapper {
header { header {
@extend .topbar; @extend .topbar;
&:empty {
display: none !important;
}
a { a {
@extend .block-link; @extend .block-link;
} }
...@@ -110,7 +114,7 @@ div.wiki-wrapper { ...@@ -110,7 +114,7 @@ div.wiki-wrapper {
font-size: 12px; font-size: 12px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1px; letter-spacing: 1px;
padding: lh(.75); padding: 14px;
margin: 0; margin: 0;
&:hover { &:hover {
......
...@@ -8,14 +8,15 @@ ...@@ -8,14 +8,15 @@
@import "leanmodal"; @import "leanmodal";
// pages // pages
@import "courseware", "courseware-video"; @import "courseware", "courseware-video", "courseware-sequence-nav";
@import "textbook"; @import "textbook";
@import "info";
@import "profile"; @import "profile";
@import "wiki-basic-html", "wiki-create", "wiki"; @import "wiki-basic-html", "wiki-create", "wiki";
@import "activation"; @import "activation";
@import "help"; @import "help";
@import "askbot-original", "discussion", "discussion-questions", "discussion-tags", "question-view" ; @import "askbot-original", "discussion", "discussion-questions", "discussion-tags", "question-view" , "discussion-answers";
// left over // left over
@import "theme"; // @import "theme";
@import "local"; // @import "local";
../data/problems/schematic_tutorial.html
\ No newline at end of file
<span> <span>
<input type="hidden" class="schematic" height="${height}" width="${width}" parts="${parts}" analyses="${analyses}" name="input_${id}" id="input_${id}" value="" initial_value=""/> <input type="hidden" class="schematic" height="${height}" width="${width}" parts="${parts}" analyses="${analyses}" name="input_${id}" id="input_${id}" value="" initial_value=""/>
<div id="value_${id}" style="display:none">${value}</div>
<div id="initial_value_${id}" style="display:none">${initial_value}</div> <div id="value_${id}" style="display:none">${value}</div>
<script> <div id="initial_value_${id}" style="display:none">${initial_value}</div>
$("#input_${id}").attr("value",$("#value_${id}").text()); <div id="submit_value_${id}" style="display:none">${submit_analyses}</div>
$("#input_${id}").attr("initial_value",$("#initial_value_${id}").text());
</script> <script>
<span id="answer_${id}"></span> $("#input_${id}").attr("value",$("#value_${id}").text());
% if state == 'unsubmitted': $("#input_${id}").attr("initial_value",$("#initial_value_${id}").text());
$("#input_${id}").attr("submit_analyses",$("#submit_value_${id}").text());
</script>
<span id="answer_${id}"></span>
% if state == 'unsubmitted':
<span class="ui-icon ui-icon-bullet" style="display:inline-block;" id="status_${id}"></span> <span class="ui-icon ui-icon-bullet" style="display:inline-block;" id="status_${id}"></span>
% elif state == 'correct': % elif state == 'correct':
<span class="ui-icon ui-icon-check" style="display:inline-block;" id="status_${id}"></span> <span class="ui-icon ui-icon-check" style="display:inline-block;" id="status_${id}"></span>
% elif state == 'incorrect': % elif state == 'incorrect':
<span class="ui-icon ui-icon-close" style="display:inline-block;" id="status_${id}"></span> <span class="ui-icon ui-icon-close" style="display:inline-block;" id="status_${id}"></span>
% elif state == 'incomplete': % elif state == 'incomplete':
<span class="ui-icon ui-icon-close" style="display:inline-block;" id="status_${id}"></span> <span class="ui-icon ui-icon-close" style="display:inline-block;" id="status_${id}"></span>
% endif % endif
</span> </span>
<ol class="sequence-nav"> <nav class="sequence-nav">
<ol>
% for t in range(1,1+len(items)):
<li class="seq_inactive" id="tt_${ t }">&nbsp;</li>
% endfor
</ol>
% for t in range(1,1+len(items)): <ul>
<li class="seq_inactive" id="tt_${ t }">&nbsp;</li> <li id="${ id }prev" class="prev">Previous</li>
% endfor <li id="${ id }next" class="next">Next</li>
</ul>
<li id="${ id }next" class="next">Next</li> </nav>
<li id="${ id }prev" class="prev">Previous</li>
</ol>
<!-- <td colspan=${ len(items) }> --> <!-- <td colspan=${ len(items) }> -->
......
...@@ -73,7 +73,7 @@ ...@@ -73,7 +73,7 @@
<%block name="wiki_head"/> <%block name="wiki_head"/>
</%block> </%block>
<%include file="navigation.html" /> <%include file="navigation.html" args="active_page='wiki'" />
<section class="main-content"> <section class="main-content">
<div class="wiki-wrapper"> <div class="wiki-wrapper">
......
...@@ -34,7 +34,7 @@ function next_page() { ...@@ -34,7 +34,7 @@ function next_page() {
} }
</script> </script>
<%include file="navigation.html" /> <%include file="navigation.html" args="active_page='book'" />
<section class="main-content"> <section class="main-content">
<div class="book-wrapper"> <div class="book-wrapper">
......
<span> <section class="text-input">
<input type="text" name="input_${id}" id="input_${id}" value="${value}" /> <input type="text" name="input_${id}" id="input_${id}" value="${value}" />
<span id="answer_${id}"></span>
% if state == 'unsubmitted': <span id="answer_${id}"></span>
<span class="ui-icon ui-icon-bullet" style="display:inline-block;" id="status_${id}"></span>
% elif state == 'correct': % if state == 'unsubmitted':
<span class="ui-icon ui-icon-check" style="display:inline-block;" id="status_${id}"></span> <span class="unanswered" style="display:inline-block;" id="status_${id}"></span>
% elif state == 'incorrect': % elif state == 'correct':
<span class="ui-icon ui-icon-close" style="display:inline-block;" id="status_${id}"></span> <span class="correct" id="status_${id}"></span>
% elif state == 'incomplete': % elif state == 'incorrect':
<span class="ui-icon ui-icon-close" style="display:inline-block;" id="status_${id}"></span> <span class="incorrect" id="status_${id}"></span>
% endif % elif state == 'incomplete':
</span> <span class="incorrect" id="status_${id}"></span>
% endif
</section>
% if name != None:
<h1> ${name} </h1>
% endif
<div class="video-wrapper"> <div class="video-wrapper">
<div class="video-player"> <div class="video-player">
<div id="ytapiplayer"> <div id="ytapiplayer">
...@@ -27,7 +30,7 @@ ...@@ -27,7 +30,7 @@
</div> </div>
<ol class="subtitles"> <ol class="subtitles">
<li id="stt_n5"><div id="std_n7" onclick="title_seek(-7);"></div></li> <!-- <li id="stt_n5"><div id="std_n7" onclick="title_seek(-7);"></div></li> -->
<li id="stt_n4"><div id="std_n6" onclick="title_seek(-6);"></div></li> <li id="stt_n4"><div id="std_n6" onclick="title_seek(-6);"></div></li>
<li id="stt_n4"><div id="std_n5" onclick="title_seek(-5);"></div></li> <li id="stt_n4"><div id="std_n5" onclick="title_seek(-5);"></div></li>
<li id="stt_n4"><div id="std_n4" onclick="title_seek(-4);"></div></li> <li id="stt_n4"><div id="std_n4" onclick="title_seek(-4);"></div></li>
...@@ -42,5 +45,5 @@ ...@@ -42,5 +45,5 @@
<li id="stt_p5"><div id="std_p5" onclick="title_seek( 5);"></div></li> <li id="stt_p5"><div id="std_p5" onclick="title_seek( 5);"></div></li>
<li id="stt_p6"><div id="std_p7" onclick="title_seek( 6);"></div></li> <li id="stt_p6"><div id="std_p7" onclick="title_seek( 6);"></div></li>
<li id="stt_p6"><div id="std_p7" onclick="title_seek( 7);"></div></li> <li id="stt_p6"><div id="std_p7" onclick="title_seek( 7);"></div></li>
<li id="stt_p6"><div id="std_p7" onclick="title_seek( 8);"></div></li> <!-- <li id="stt_p6"><div id="std_p7" onclick="title_seek( 8);"></div></li> -->
</ol> </ol>
...@@ -10,14 +10,13 @@ if (swfobject.hasFlashPlayerVersion("10.1")){ ...@@ -10,14 +10,13 @@ if (swfobject.hasFlashPlayerVersion("10.1")){
} else { } else {
//end of this URL may need &origin=http://..... once pushed to production to prevent XSS //end of this URL may need &origin=http://..... once pushed to production to prevent XSS
$("#html5_player").attr("src", "http://www.youtube.com/embed/" + streams["1.0"] + "?enablejsapi=1&controls=0"); $("#html5_player").attr("src", document.location.protocol + "//www.youtube.com/embed/" + streams["1.0"] + "?enablejsapi=1&controls=0");
$("#html5_player").show(); $("#html5_player").show();
var tag = document.createElement('script'); var tag = document.createElement('script');
tag.src = "http://www.youtube.com/player_api"; tag.src = "http://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0]; var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// Make sure the callback is called once API ready, YT seems to be buggy // Make sure the callback is called once API ready, YT seems to be buggy
loadHTML5Video(); loadHTML5Video();
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment