Andal.LND/edx-platform
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove old program detail page and Waffle switch gating the new page

Browse Source 
The new page is released and stable. The switch and old code are no longer necessary.

ECOM-7482
This commit is contained in:
Matthew Piatetsky
2017-05-09 16:23:18 -04:00
committed by Renzo Lucioni
parent 21a5a42571
commit 131cc0bdbb
37 changed files with 318 additions and 1300 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
lms/templates/learner_dashboard/certificate_status.underscore
View File

@@ -1,12 +1,5 @@
<div class="message col-12 md-col-8">
<% // safe-lint: disable=underscore-not-escaped %>
<span class="certificate-icon green-icon" aria-hidden="true"><%= certificateSvg %></span>
<span class="card-msg"><%- gettext('Congratulations! You have earned a certificate for this course.') %></span>
</div>
<div class="action col-12 md-col-4">
<a href="<%- certificate_url %>" class="btn-brand cta-secondary">
<% // safe-lint: disable=underscore-not-escaped %>
<span class="certificate-icon blue-icon" aria-hidden="true"><%= certificateSvg %></span>
<%- gettext('View Certificate') %>
</a>
</div>
<p class="certificate-status col-12 md-col-8">
<span class="card-msg"><%- gettext('Certificate Status:') %></span>
<span class="fa fa-check-circle" aria-hidden="true"></span>
<span class="certificate-status-msg"><%- gettext('Certificate Purchased') %></span>
</p>

5
lms/templates/learner_dashboard/certificate_status_2017.underscore
View File

@@ -1,5 +0,0 @@
<p class="certificate-status col-12 md-col-8">
<span class="card-msg"><%- gettext('Certificate Status:') %></span>
<span class="fa fa-check-circle" aria-hidden="true"></span>
<span class="certificate-status-msg"><%- gettext('Certificate Purchased') %></span>
</p>

33
lms/templates/learner_dashboard/course_card.underscore
View File

@@ -1,21 +1,7 @@
<div class="section">
<div class="course-meta-container col-12 md-col-8 sm-col-12">
<div class="course-image-container">
<% if ( marketing_url || course_url ) { %>
<a href="<%- marketing_url || course_url %>" class="course-image-link">
<img
class="header-img"
src="<%- course_image_url %>"
<% // safe-lint: disable=underscore-not-escaped %>
alt="<%= interpolate(gettext('%(courseName)s Home Page.'), {courseName: title}, true) %>"/>
</a>
<% } else { %>
<img class="header-img" src="<%- course_image_url %>" alt=""/>
<% } %>
</div>
<div class="course-details">
<h3 class="course-title">
<h5 class="course-title">
<% if ( marketing_url || course_url ) { %>
<a href="<%- marketing_url || course_url %>" class="course-title-link">
<%- title %>
@@ -23,19 +9,20 @@
<% } else { %>
<%- title %>
<% } %>
</h3>
</h5>
<div class="course-text">
<% if (start_date && end_date) { %>
<span class="run-period"><%- start_date %> - <%- end_date %></span>
-
<% if (enrolled) { %>
<span class="enrolled"><%- enrolled %>: </span>
<% } %>
<% if (dateString) { %>
<span class="run-period"><%- dateString %></span>
<% } %>
<span class="course-key"><%- course_key %></span>
</div>
</div>
</div>
<div class="course-actions col-12 md-col-4 sm-col-12">
<div class="course-actions col-12 md-col-4 sm-col-12"></div>
<div class="course-certificate certificate-status"></div>
</div>
</div>
<div class="section action-msg-view"></div>
<div class="section upgrade-message"></div>
<div class="section certificate-status"></div>
<div class="section expired-notification"></div>

28
lms/templates/learner_dashboard/course_card_2017.underscore
View File

@@ -1,28 +0,0 @@
<div class="section">
<div class="course-meta-container col-12 md-col-8 sm-col-12">
<div class="course-details">
<h5 class="course-title">
<% if ( marketing_url || course_url ) { %>
<a href="<%- marketing_url || course_url %>" class="course-title-link">
<%- title %>
</a>
<% } else { %>
<%- title %>
<% } %>
</h5>
<div class="course-text">
<% if (enrolled) { %>
<span class='enrolled'><%- enrolled %>: </span>
<% } %>
<% if (dateString) { %>
<span class="run-period"><%- dateString %></span>
<% } %>
</div>
</div>
<div class="course-actions col-12 md-col-4 sm-col-12"></div>
<div class="course-certificate certificate-status"></div>
</div>
</div>
<div class="section action-msg-view"></div>
<div class="section upgrade-message"></div>
<div class="section expired-notification"></div>

46
lms/templates/learner_dashboard/course_enroll.underscore
View File

@@ -1,29 +1,19 @@
<% if (is_enrolled) { %>
<div class="enrollment-info"><%- gettext('enrolled') %></div>
<% if (is_enrollment_open || is_course_ended) { %>
<a href="<%- course_url %>" class="btn view-course-link">
<% if (is_enrollment_open) { %>
<%- gettext('View Course') %>
<% } else if (is_course_ended) { %>
<%- gettext('View Archived Course') %>
<% } %>
</a>
<% } %>
<% if (is_enrolled && (typeof expired === 'undefined' || expired === false)) { %>
<a href="<%- course_url %>" class="view-course-button btn-brand btn cta-primary">
<% if (is_course_ended) { %>
<%- gettext('View Archived Course') %>
<% } else { %>
<%- gettext('View Course') %>
<% } %>
</a>
<% } else { %>
<% if (enrollable_course_runs.length > 0) { %>
<div class="enrollment-info"><%- gettext('Not Enrolled') %></div>
<% if (enrollable_course_runs.length > 1) { %>
<div class="run-select-container">
<div class="select-error">
<%- gettext('Please select a course date') %>
</div>
<label class="sr-only" for="select-<%- course_key %>-run">
<%- gettext('Select Course Run') %>
<label class="select-choice" for="select-<%- course_key %>-run">
<%- gettext('Choose a course run:') %>
</label>
<select id="select-<%- course_key %>-run" class="run-select" autocomplete="off">
<option value="" selected="selected">
<%- gettext('Choose Course Date') %>
</option>
<select id="select-<%- course_key %>-run" class="run-select field-input input-select" autocomplete="off">
<% _.each (enrollable_course_runs, function(courseRun) { %>
<option
value="<%- courseRun.key %>"
@@ -31,19 +21,17 @@
selected="selected"
<% }%>
>
<%= interpolate(
gettext('Starts %(start)s'),
{ start: courseRun.start_date },
true)
%>
<%- courseRun.dateString %>
</option>
<% }); %>
</select>
</div>
<% } %>
<button type="button" class="btn-brand btn cta-primary enroll-button">
<%- gettext('Enroll Now') %>
</button>
<div class="enroll-button">
<button type="button" class="btn-brand btn cta-primary">
<%- gettext('Enroll Now') %>
</button>
</div>
<% } else if (upcoming_course_runs.length > 0) {%>
<div class="no-action-message">
<%- gettext('Coming Soon') %>

50
lms/templates/learner_dashboard/course_enroll_2017.underscore
View File

@@ -1,50 +0,0 @@
<% if (is_enrolled && (typeof expired === 'undefined' || expired === false)) { %>
<a href="<%- course_url %>" class="view-course-button btn-brand btn cta-primary">
<% if (is_course_ended) { %>
<%- gettext('View Archived Course') %>
<% } else { %>
<%- gettext('View Course') %>
<% } %>
</a>
<% } else { %>
<% if (enrollable_course_runs.length > 0) { %>
<% if (enrollable_course_runs.length > 1) { %>
<div class="run-select-container">
<label class="select-choice" for="select-<%- course_key %>-run">
<%- gettext('Choose a course run:') %>
</label>
<select id="select-<%- course_key %>-run" class="run-select field-input input-select" autocomplete="off">
<% _.each (enrollable_course_runs, function(courseRun) { %>
<option
value="<%- courseRun.key %>"
<% if (key === courseRun.key) { %>
selected="selected"
<% }%>
>
<%- courseRun.dateString %>
</option>
<% }); %>
</select>
</div>
<% } %>
<div class="enroll-button">
<button type="button" class="btn-brand btn cta-primary">
<%- gettext('Enroll Now') %>
</button>
</div>
<% } else if (upcoming_course_runs.length > 0) {%>
<div class="no-action-message">
<%- gettext('Coming Soon') %>
</div>
<div class="enrollment-opens">
<%- gettext('Enrollment Opens on') %>
<span class="enrollment-open-date">
<%- upcoming_course_runs[0].enrollment_open_date %>
</span>
</div>
<% } else { %>
<div class="no-action-message">
<%- gettext('Not Currently Available') %>
</div>
<% } %>
<% } %>

6
lms/templates/learner_dashboard/program_details.html
View File

@@ -15,6 +15,8 @@ from openedx.core.djangolib.js_utils import (
<%static:require_module module_name="js/learner_dashboard/program_details_factory" class_name="ProgramDetailsFactory">
ProgramDetailsFactory({
programData: ${program_data | n, dump_js_escaped_json},
courseData: ${course_data | n, dump_js_escaped_json},
certificateData: ${certificate_data | n, dump_js_escaped_json},
urls: ${urls | n, dump_js_escaped_json},
userPreferences: ${user_preferences | n, dump_js_escaped_json},
});
@@ -24,8 +26,6 @@ ProgramDetailsFactory({
<%block name="pagetitle">${_("Program Details")}</%block>
<%block name="bodyclass">program-details</%block>
<%include file="_dashboard_navigation_programs.html"/>
<main id="main" aria-label="Content" tabindex="-1">
<div class="js-program-details-wrapper"></div>
<div class="js-program-details-wrapper program-details-wrapper"></div>
</main>

31
lms/templates/learner_dashboard/program_details_2017.html
View File

@@ -1,31 +0,0 @@
## Override the default styles_version to the Pattern Library version (version 2)
<%! main_css = "style-learner-dashboard" %>
<%page expression_filter="h"/>
<%inherit file="../main.html" />
<%namespace name='static' file='../static_content.html'/>
<%!
from django.utils.translation import ugettext as _
from openedx.core.djangolib.js_utils import (
dump_js_escaped_json, js_escaped_string
)
%>
<%block name="js_extra">
<%static:require_module module_name="js/learner_dashboard/program_details_factory_2017" class_name="ProgramDetailsFactory2017">
ProgramDetailsFactory2017({
programData: ${program_data | n, dump_js_escaped_json},
courseData: ${course_data | n, dump_js_escaped_json},
certificateData: ${certificate_data | n, dump_js_escaped_json},
urls: ${urls | n, dump_js_escaped_json},
userPreferences: ${user_preferences | n, dump_js_escaped_json},
});
</%static:require_module>
</%block>
<%block name="pagetitle">${_("Program Details")}</%block>
<%block name="bodyclass">program-details</%block>
<main id="main" aria-label="Content" tabindex="-1">
<div class="js-program-details-wrapper program-details-wrapper"></div>
</main>

63
lms/templates/learner_dashboard/program_details_view.underscore
View File

@@ -1,6 +1,59 @@
<header class="js-program-header program-header full-width-banner"></header>
<div class="program-details-content grid-container">
<div class="js-program-progress-view"></div>
<div class="js-course-list row"></div>
<aside class="js-course-sidebar"></aside>
</div>
<section class="program-details-content">
<div class="program-heading">
<% if (inProgressCount === totalCount) { %>
<h3 class="program-heading-title"><%- gettext('Congratulations!') %></h3>
<div class="program-heading-message">
<div><%- interpolate(gettext(
'You have successfully completed all the requirements for the %(title)s %(type)s.'),
{ title: title, type: type }, true) %>
</div>
</div>
<% } else { %>
<h3 class="program-heading-title"><%- gettext('Your Program Journey') %></h3>
<div class="program-heading-message">
<div>
<%- interpolate(gettext(
'Track and plan your progress through the %(count)s courses in this program.'),
{ count: totalCount }, true) %>
</div>
<div><%- gettext('To complete the program, you must earn a verified certificate for each course.') %></div>
</div>
<% } %>
</div>
<div class="course-list-headings">
<% if (inProgressCount) { %>
<div class="in-progress-group">
<h4 class="course-list-heading">
<span class="status"><%- gettext('COURSES IN PROGRESS') %></span>
<span class="count"><%- inProgressCount %></span>
</h4>
<div class="course-list js-course-list-in-progress row"></div>
</div>
<% } %>
<% if (remainingCount) { %>
<div class="remaining-group">
<h4 class="course-list-heading">
<span class="status"><%- gettext('REMAINING COURSES') %></span>
<span class="count"><%- remainingCount %></span>
</h4>
<div class="course-list js-course-list-remaining row"></div>
</div>
<% } %>
<div class="completed-group">
<h4 class="course-list-heading">
<span class="status"><%- gettext('COMPLETED COURSES') %></span>
<span class="count"><%- completedCount %></span>
</h4>
<% if (completedCount) { %>
<div class="course-list js-course-list-completed row"></div>
<% } else { %>
<div class="motivating-section">
<p class='motivating-heading'><%- gettext("As you complete courses, you will see them listed here.") %></p>
<p class='motivating-message'><%- gettext('Complete courses on your schedule to ensure you stand out in your field!') %></p>
</div>
<% } %>
</div>
</div>
</section>
<aside class="js-program-sidebar program-sidebar"></aside>

59
lms/templates/learner_dashboard/program_details_view_2017.underscore
View File

@@ -1,59 +0,0 @@
<header class="js-program-header program-header full-width-banner"></header>
<section class="program-details-content">
<div class="program-heading">
<% if (inProgressCount === totalCount) { %>
<h3 class="program-heading-title"><%- gettext('Congratulations!') %></h3>
<div class="program-heading-message">
<div><%- interpolate(gettext(
'You have successfully completed all the requirements for the %(title)s %(type)s.'),
{ title: title, type: type }, true) %>
</div>
</div>
<% } else { %>
<h3 class="program-heading-title"><%- gettext('Your Program Journey') %></h3>
<div class="program-heading-message">
<div>
<%- interpolate(gettext(
'Track and plan your progress through the %(count)s courses in this program.'),
{ count: totalCount }, true) %>
</div>
<div><%- gettext('To complete the program, you must earn a verified certificate for each course.') %></div>
</div>
<% } %>
</div>
<div class="course-list-headings">
<% if (inProgressCount) { %>
<div class="in-progress-group">
<h4 class="course-list-heading">
<span class="status"><%- gettext('COURSES IN PROGRESS') %></span>
<span class="count"><%- inProgressCount %></span>
</h4>
<div class="course-list js-course-list-in-progress row"></div>
</div>
<% } %>
<% if (remainingCount) { %>
<div class="remaining-group">
<h4 class="course-list-heading">
<span class="status"><%- gettext('REMAINING COURSES') %></span>
<span class="count"><%- remainingCount %></span>
</h4>
<div class="course-list js-course-list-remaining row"></div>
</div>
<% } %>
<div class="completed-group">
<h4 class="course-list-heading">
<span class="status"><%- gettext('COMPLETED COURSES') %></span>
<span class="count"><%- completedCount %></span>
</h4>
<% if (completedCount) { %>
<div class="course-list js-course-list-completed row"></div>
<% } else { %>
<div class="motivating-section">
<p class='motivating-heading'><%- gettext("As you complete courses, you will see them listed here.") %></p>
<p class='motivating-message'><%- gettext('Complete courses on your schedule to ensure you stand out in your field!') %></p>
</div>
<% } %>
</div>
</div>
</section>
<aside class="js-program-sidebar program-sidebar"></aside>

38
lms/templates/learner_dashboard/program_header_view.underscore
View File

@@ -1,15 +1,14 @@
<div class="banner-background-wrapper">
<picture>
<source srcset="<%- programData.banner_image.large.url %>" media="(min-width: <%- breakpoints.min.large %>)">
<source srcset="<%- programData.banner_image.medium.url %>" media="(min-width: <%- breakpoints.min.medium %>)">
<img class="banner-background-image" srcset="<%- programData.banner_image['x-small'].url %>" alt="">
</picture>
<div class="banner-content grid-container">
<h2 class="hd-1 title row"><%- programData.title %></h2>
<p class="hd-4 subtitle row"><%- programData.subtitle %></p>
<div class="program-details-header">
<div class="meta-info grid-container">
<% if (logo) { %>
<span aria-label="<%- gettext(programData.type) %>" class="<%- programData.type.toLowerCase() %> program-details-icon"><%= logo %></span>
<% } %>
<h2 class="hd-1 program-title"><%- programData.title %></h2>
</div>
<div class='authoring-organizations'>
<h2 class="heading">Institutions</h2>
<% if (programData.authoring_organizations.length) { %>
<div class="org-wrapper">
<div class="orgs">
<% _.each(programData.authoring_organizations, function(org) { %>
<img src="<%- org.certificate_logo_image_url || org.logo_image_url %>" class="org-logo" alt="<%- StringUtils.interpolate(
gettext('{organization}\'s logo'),
@@ -20,20 +19,3 @@
<% } %>
</div>
</div>
<nav class="breadcrumb-wrapper grid-container" aria-label="breadcrumb" role="navigation">
<h3 class="sr-only"><%- gettext('You are here') %></h2>
<ol class="breadcrumb-list">
<li class="crumb">
<a href="/" class="crumb-link"><%- gettext('Dashboard') %></a>
<span class="crumb-separator fa fa-chevron-right" aria-hidden="true"></span>
</li>
<li class="crumb">
<a href="<%- urls.program_listing_url %>" class="crumb-link"><%- gettext('Programs') %></a>
<span class="crumb-separator fa fa-chevron-right" aria-hidden="true"></span>
</li>
<li class="crumb active">
<%- programData.title %>
</li>
</ol>
</nav>

21
lms/templates/learner_dashboard/program_header_view_2017.underscore
View File

@@ -1,21 +0,0 @@
<div class="program-details-header">
<div class="meta-info grid-container">
<% if (logo) { %>
<span aria-label="<%- gettext(programData.type) %>" class="<%- programData.type.toLowerCase() %> program-details-icon"><%= logo %></span>
<% } %>
<h2 class="hd-1 program-title"><%- programData.title %></h2>
</div>
<div class='authoring-organizations'>
<h2 class="heading">Institutions</h2>
<% if (programData.authoring_organizations.length) { %>
<div class="orgs">
<% _.each(programData.authoring_organizations, function(org) { %>
<img src="<%- org.certificate_logo_image_url || org.logo_image_url %>" class="org-logo" alt="<%- StringUtils.interpolate(
gettext('{organization}\'s logo'),
{organization: org.name}
) %>">
<% }) %>
</div>
<% } %>
</div>
</div>

16
lms/templates/learner_dashboard/upgrade_message.underscore
View File

@@ -1,12 +1,10 @@
<div class="message col-12 md-col-8">
<% // safe-lint: disable=underscore-not-escaped %>
<span class="certificate-icon green-icon" aria-hidden="true"><%= certificateSvg %></span>
<span class="card-msg"><%- gettext('You need a certificate in this course to be eligible for a program certificate.') %></span>
<div class="message certificate-status col-12 md-col-8">
<span class="card-msg"><%- gettext('Certificate Status:') %></span>
<span><%- gettext('Needs verified certificate ') %></span>
<span class="price"> <%- price %></span>
</div>
<div class="action col-12 md-col-4">
<a href="<%- upgrade_url %>" class="btn-brand cta-primary">
<% // safe-lint: disable=underscore-not-escaped %>
<span class="certificate-icon green-icon" aria-hidden="true"><%= certificateSvg %></span>
<%- gettext('Upgrade Now') %>
</a>
<a href="<%- upgrade_url %>" class="btn-brand btn cta-primary upgrade-button">
<%- gettext('Buy Certificate') %>
<a>
</div>

10
lms/templates/learner_dashboard/upgrade_message_2017.underscore
View File

@@ -1,10 +0,0 @@
<div class="message certificate-status col-12 md-col-8">
<span class="card-msg"><%- gettext('Certificate Status:') %></span>
<span><%- gettext('Needs verified certificate ') %></span>
<span class="price"> <%- price %></span>
</div>
<div class="action col-12 md-col-4">
<a href="<%- upgrade_url %>" class="btn-brand btn cta-primary upgrade-button">
<%- gettext('Buy Certificate') %>
<a>
</div>