Files
edx-platform/lms/templates/help_modal.html
2013-06-10 18:01:44 -04:00

202 lines
7.1 KiB
HTML

<%namespace name='static' file='static_content.html'/>
<%! from datetime import datetime %>
<%! import pytz %>
<%! from django.conf import settings %>
<%! from courseware.tabs import get_discussion_link %>
% if settings.MITX_FEATURES.get('ENABLE_FEEDBACK_SUBMISSION', False):
<div class="help-tab">
<a href="#help-modal" rel="leanModal">Help</a>
</div>
<section id="help-modal" class="modal">
<div class="inner-wrapper" id="help_wrapper">
<header>
<h2><span class="edx">edX</span> Help</h2>
<hr>
</header>
<%
discussion_link = get_discussion_link(course) if course else None
%>
% if discussion_link:
<p>For <strong>questions on course lectures, homework, tools, or materials for this course</strong>, post in the
<a href="${discussion_link}" target="_blank"/>course discussion forum</a>.
</p>
% endif
<p>Have <strong>general questions about edX</strong>? You can find lots of helpful information in the edX
<a href="/help" target="_blank">FAQ</a>.</p>
<p>Have a <strong>question about something specific</strong>? You can contact the edX general
support team directly:</p>
<hr>
<div class="help-buttons">
<a href="#" id="feedback_link_problem">Report a problem</a>
<a href="#" id="feedback_link_suggestion">Make a suggestion</a>
<a href="#" id="feedback_link_question">Ask a question</a>
</div>
## TODO: find a way to refactor this
<div class="close-modal">
<div class="inner">
<p>&#10005;</p>
</div>
</div>
</div>
<div class="inner-wrapper" id="feedback_form_wrapper">
<header></header>
<form id="feedback_form" class="feedback_form" method="post" data-remote="true" action="/submit_feedback">
<div id="feedback_error" class="modal-form-error"></div>
% if not user.is_authenticated():
<label data-field="name">Name*</label>
<input name="name" type="text">
<label data-field="email">E-mail*</label>
<input name="email" type="text">
% endif
<label data-field="subject">Briefly describe your issue*</label>
<input name="subject" type="text">
<label data-field="details">Tell us the details*
<span class="tip">Include error messages, steps which lead to the issue, etc</span></label>
<textarea name="details"></textarea>
<input name="issue_type" type="hidden">
% if course:
<input name="course_id" type="hidden" value="${course.id | h}">
% endif
<div class="submit">
<input name="submit" type="submit" value="Submit">
</div>
</form>
<div class="close-modal">
<div class="inner">
<p>&#10005;</p>
</div>
</div>
</div>
<div class="inner-wrapper" id="feedback_success_wrapper">
<header>
<h2>Thank You!</h2>
<hr>
</header>
<%
dst = datetime.now(pytz.utc).astimezone(pytz.timezone("America/New_York")).dst()
business_hours = "13:00 UTC to 21:00 UTC" if dst else "14:00 UTC to 22:00 UTC"
%>
<p>
Thank you for your inquiry or feedback. We typically respond to a
request within one business day (Monday to Friday,
${business_hours}.) In the meantime, please review our
<a href="/help" target="_blank">detailed FAQs</a>
where most questions have already been answered.
</p>
<div class="close-modal">
<div class="inner">
<p>&#10005;</p>
</div>
</div>
</div>
</section>
<script type="text/javascript">
(function() {
$(".help-tab").click(function() {
$(".field-error").removeClass("field-error");
$("#feedback_form")[0].reset();
$("#feedback_form input[type='submit']").removeAttr("disabled");
$("#feedback_form_wrapper").css("display", "none");
$("#feedback_error").css("display", "none");
$("#feedback_success_wrapper").css("display", "none");
$("#help_wrapper").css("display", "block");
});
showFeedback = function(event, issue_type, title, subject_label, details_label) {
$("#help_wrapper").css("display", "none");
$("#feedback_form input[name='issue_type']").val(issue_type);
$("#feedback_form_wrapper").css("display", "block");
$("#feedback_form_wrapper header").html("<h2>" + title + "</h2><hr>");
$("#feedback_form_wrapper label[data-field='subject']").html(subject_label);
$("#feedback_form_wrapper label[data-field='details']").html(details_label);
event.preventDefault();
};
$("#feedback_link_problem").click(function(event) {
showFeedback(
event,
"problem",
"Report a Problem",
"Brief description of the problem*",
"Details of the problem you are encountering* <span class='tip'>Include error messages, steps which lead to the issue, etc.</span>"
);
});
$("#feedback_link_suggestion").click(function(event) {
showFeedback(
event,
"suggestion",
"Make a Suggestion",
"Brief description of your suggestion*",
"Details*"
);
});
$("#feedback_link_question").click(function(event) {
showFeedback(
event,
"question",
"Ask a Question",
"Brief summary of your question*",
"Details*"
);
});
$("#feedback_form").submit(function() {
$("input[type='submit']", this).attr("disabled", "disabled");
});
$("#feedback_form").on("ajax:complete", function() {
$("input[type='submit']", this).removeAttr("disabled");
});
$("#feedback_form").on("ajax:success", function(event, data, status, xhr) {
$("#feedback_form_wrapper").css("display", "none");
$("#feedback_success_wrapper").css("display", "block");
});
$("#feedback_form").on("ajax:error", function(event, xhr, status, error) {
$(".field-error").removeClass("field-error");
var responseData;
try {
responseData = jQuery.parseJSON(xhr.responseText);
} catch(err) {
}
if (responseData) {
$("[data-field='"+responseData.field+"']").addClass("field-error");
$("#feedback_error").html(responseData.error).stop().css("display", "block");
} else {
// If no data (or malformed data) is returned, a server error occurred
htmlStr = "An error has occurred.";
% if settings.FEEDBACK_SUBMISSION_EMAIL:
htmlStr += " Please <a href='#' id='feedback_email'>send us e-mail</a>.";
% else:
// If no email is configured, we can't do much other than
// ask the user to try again later
htmlStr += " Please try again later.";
% endif
$("#feedback_error").html(htmlStr).stop().css("display", "block");
% if settings.FEEDBACK_SUBMISSION_EMAIL:
$("#feedback_email").click(function(e) {
mailto = "mailto:" + "${settings.FEEDBACK_SUBMISSION_EMAIL}" +
"?subject=" + $("#feedback_form input[name='subject']").val() +
"&body=" + $("#feedback_form textarea[name='details']").val();
window.open(mailto);
e.preventDefault();
});
%endif
}
});
})(this)
</script>
%endif