Files
edx-platform/lms/templates/dashboard.html
2012-10-12 14:31:20 -04:00

284 lines
9.3 KiB
HTML

<%!
from django.core.urlresolvers import reverse
from courseware.courses import course_image_url, get_course_about_section
from courseware.access import has_access
%>
<%inherit file="main.html" />
<%namespace name='static' file='static_content.html'/>
<%block name="title"><title>Dashboard</title></%block>
<%block name="js_extra">
<script type="text/javascript">
(function() {
$(".unenroll").click(function(event) {
$("#unenroll_course_id").val( $(event.target).data("course-id") );
$("#unenroll_course_number").text( $(event.target).data("course-number") );
});
$(document).delegate('#unenroll_form', 'ajax:success', function(data, json, xhr) {
if(json.success) {
location.href="${reverse('dashboard')}";
} else {
if($('#unenroll_error').length == 0) {
$('#unenroll_form').prepend('<div id="unenroll_error" class="modal-form-error"></div>');
}
$('#unenroll_error').text(json.error).stop().css("display", "block");
}
});
$('#pwd_reset_button').click(function() {
$.post('${reverse("password_reset")}',
{"email" : $('#id_email').val()},
function(data){
$("#password_reset_complete_link").click();
});
});
$("#change_email_form").submit(function(){
var new_email = $('#new_email_field').val();
var new_password = $('#new_email_password').val();
$.post('${reverse("change_email")}',
{"new_email" : new_email, "password" : new_password},
function(data) {
if (data.success) {
$("#change_email_title").html("Please verify your new email");
$("#change_email_form").html("<p>You'll receive a confirmation in your " +
"in-box. Please click the link in the " +
"email to confirm the email change.</p>");
} else {
$("#change_email_error").html(data.error).stop().css("display", "block");
}
});
return false;
});
$("#change_name_form").submit(function(){
var new_name = $('#new_name_field').val();
var rationale = $('#name_rationale_field').val();
$.post('${reverse("change_name")}',
{"new_name":new_name, "rationale":rationale},
function(data) {
if(data.success) {
location.reload();
// $("#change_name_body").html("<p>Name changed.</p>");
} else {
$("#change_name_error").html(data.error).stop().css("display", "block");
}
});
return false;
});
})(this)
</script>
</%block>
<section class="container dashboard">
%if message:
<section class="dashboard-banner">
${message}
</section>
%endif
<section class="profile-sidebar">
<header class="profile">
<h1 class="user-name">${ user.username }</h1>
</header>
<section class="user-info">
<ul>
<li>
<span class="title"><div class="icon name-icon"></div>Full Name (<a href="#apply_name_change" rel="leanModal" class="edit-name">edit</a>)</span> <span class="data">${ user.profile.name | h }</span>
</li>
<li>
<span class="title"><div class="icon email-icon"></div>Email (<a href="#change_email" rel="leanModal" class="edit-email">edit</a>)</span> <span class="data">${ user.email | h }</span>
</li>
<li>
<span class="title"><a href="#password_reset_complete" rel="leanModal" id="pwd_reset_button">Reset Password</a></span>
<form id="password_reset_form" method="post" data-remote="true" action="${reverse('password_reset')}">
<input id="id_email" type="hidden" name="email" maxlength="75" value="${user.email}" />
<!-- <input type="submit" id="pwd_reset_button" value="Reset Password" /> -->
</form>
</li>
</ul>
</section>
</section>
<section class="my-courses">
<header>
<h2>Current Courses</h2>
</header>
% if len(courses) > 0:
% for course in courses:
<article class="my-course">
<%
if has_access(user, course, 'load'):
course_target = reverse('info', args=[course.id])
else:
course_target = reverse('about_course', args=[course.id])
%>
<a href="${course_target}">
<section class="cover" style="background-image: url('${course_image_url(course)}')">
<div class="shade"></div>
<div class="arrow">&#10095;</div>
</section>
<section class="info">
<hgroup>
<h2 class="university">${get_course_about_section(course, 'university')}</h2>
<h3>${course.number} ${course.title}</h3>
</hgroup>
<section class="course-status">
<p>Class Starts - <span>${course.start_date_text}</span></p>
</section>
% if course.id in show_courseware_links_for:
<p class="enter-course">View Courseware</p>
% endif
</section>
</a>
</article>
<a href="#unenroll-modal" class="unenroll" rel="leanModal" data-course-id="${course.id}" data-course-number="${course.number}">Unregister</a>
% endfor
% else:
<section class="empty-dashboard-message">
<p>Looks like you haven't registered for any courses yet.</p>
<a href="${reverse('courses')}">Find courses now!</a>
</section>
% endif
% if staff_access and len(errored_courses) > 0:
<div id="course-errors">
<h2>Course-loading errors</h2>
% for course_dir, errors in errored_courses.items():
<h3>${course_dir | h}</h3>
<ul>
% for (msg, err) in errors:
<li>${msg}
<ul><li><pre>${err}</pre></li></ul>
</li>
% endfor
</ul>
% endfor
% endif
</section>
</section>
<section id="unenroll-modal" class="modal unenroll-modal">
<div class="inner-wrapper">
<header>
<h2>Are you sure you want to unregister from <span id="unenroll_course_number"></span>?</h2>
<hr/>
</header>
<form id="unenroll_form" method="post" data-remote="true" action="${reverse('change_enrollment')}">
<input name="course_id" id="unenroll_course_id" type="hidden" />
<input name="enrollment_action" type="hidden" value="unenroll" />
<div class="submit">
<input name="submit" type="submit" value="Unregister" />
</div>
</form>
<div class="close-modal">
<div class="inner">
<p>&#10005;</p>
</div>
</div>
</div>
</section>
<section id="password_reset_complete" class="modal">
<div class="inner-wrapper">
<header>
<h2>Password Reset Email Sent</h2>
<hr/>
</header>
<div>
<form> <!-- Here for styling reasons -->
<section>
<p>An email has been sent to ${user.email}. Follow the link in the email to change your password.</p>
</section>
</form>
</div>
<div class="close-modal">
<div class="inner">
<p>&#10005;</p>
</div>
</div>
</div>
</section>
<section id="change_email" class="modal">
<div class="inner-wrapper">
<header>
<h2><span id="change_email_title">Change Email</span></h2>
<hr/>
</header>
<div id="change_email_body">
<form id="change_email_form">
<div id="change_email_error" class="modal-form-error"> </div>
<fieldset>
<div class="input-group">
<label>Please enter your new email address:</label>
<input id="new_email_field" type="email" value="" />
<label>Please confirm your password:</label>
<input id="new_email_password" value="" type="password" />
</div>
<section>
<p>We will send a confirmation to both ${user.email} and your new email as part of the process.</p>
</section>
<div class="submit">
<input type="submit" id="submit_email_change" value="Change Email"/>
</div>
</fieldset>
</form>
</div>
<div class="close-modal">
<div class="inner">
<p>&#10005;</p>
</div>
</div>
</div>
</section>
<section id="apply_name_change" class="modal">
<div class="inner-wrapper">
<header>
<h2>Change your name</h2>
<hr/>
</header>
<div id="change_name_body">
<form id="change_name_form">
<div id="change_name_error" class="modal-form-error"> </div>
<p>To uphold the credibility of edX certificates, all name changes will be logged and recorded.</p>
<br/>
<fieldset>
<div class="input-group">
<label>Enter your desired full name, as it will appear on the edX certificates: </label>
<input id="new_name_field" value="" type="text" />
<label>Reason for name change:</label>
<textarea id="name_rationale_field" value=""></textarea>
</div>
<div class="submit">
<input type="submit" id="submit" value="Change My Name">
</div>
</fieldset>
</form>
</div>
<div class="close-modal">
<div class="inner">
<p>&#10005;</p>
</div>
</div>
</div>
</section>