feat: add share link button when hide from toc is enabled in sections (#34043)
* feat: add share link modal when hide from toc is enabled Adds a new button in the child subsections of sections with Hide From TOC enabled. This button displays a new modal with two tabs. The first tab displays a button that allows you to copy the link of that subsection to the clipboard. The second tab displays a button that allows you to copy the embedded link of the same subsection to the clipboard. Ref: https://openedx.atlassian.net/wiki/spaces/OEPM/pages/3853975595/Feature+Enhancement+Proposal+Hide+Sections+from+course+outline
This commit is contained in:
committed by
GitHub
parent
c848767369
commit
19bc5c802c
@@ -419,8 +419,15 @@ if (is_proctored_exam) {
|
||||
<div class="status-messages">
|
||||
<% for (var i=0; i<statusMessages.length; i++) { %>
|
||||
<div class="status-message">
|
||||
<span class="icon fa <%- statusMessages[i].iconClass %>" aria-hidden="true"></span>
|
||||
<p class="status-message-copy"><%- statusMessages[i].text %></p>
|
||||
<div>
|
||||
<span class="icon fa <%- statusMessages[i].iconClass %>" aria-hidden="true"></span>
|
||||
<p class="status-message-copy"><%- statusMessages[i].text %></p>
|
||||
</div>
|
||||
<% if (enableHideFromTOC && xblockInfo.isSequential()) { %>
|
||||
<button type="button" class="button btn-primary subsection-share-link-button">
|
||||
<span class="icon fa fa-link icon-share-link"></span><%- gettext('Share') %>
|
||||
</button>
|
||||
<% } %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
|
||||
20
cms/templates/js/embed-link-share-link-editor.underscore
Normal file
20
cms/templates/js/embed-link-share-link-editor.underscore
Normal file
@@ -0,0 +1,20 @@
|
||||
<div class="modal-section-content">
|
||||
<div class="subsection-share-link-container">
|
||||
<div>
|
||||
<p>
|
||||
<%- gettext('Embed your subsection content directly on a page using an iframe, and view it withput the LMS header and footer.') %>
|
||||
</p>
|
||||
<button
|
||||
type="button"
|
||||
id="embed-link-button"
|
||||
data-clipboard-text="<%- embedLmsUrl %>"
|
||||
title="<%- gettext('Click to copy link to clipboard') %>"
|
||||
class="button btn-primary copy-link-button"
|
||||
>
|
||||
<span class="icon fa fa-clipboard icon-copy-clipboard"></span>
|
||||
<span class="copy-link-button-text"><%- gettext('Copy link') %></span>
|
||||
</button>
|
||||
</div>
|
||||
<img class="share-link-animated-svg" src="/static/studio/images/subsection-embed.svg">
|
||||
</div>
|
||||
</div>
|
||||
20
cms/templates/js/full-page-share-link-editor.underscore
Normal file
20
cms/templates/js/full-page-share-link-editor.underscore
Normal file
@@ -0,0 +1,20 @@
|
||||
<div class="modal-section-content">
|
||||
<div class="subsection-share-link-container">
|
||||
<div>
|
||||
<p>
|
||||
<%- gettext('When sharing this link with your learners, they will see the content of the subsection along with the header and footer of your LMS.') %>
|
||||
</p>
|
||||
<button
|
||||
type="button"
|
||||
id="full-page-link-button"
|
||||
data-clipboard-text="<%- lmsUrl %>"
|
||||
title="<%- gettext('Click to copy link to clipboard') %>"
|
||||
class="button btn-primary copy-link-button"
|
||||
>
|
||||
<span class="icon fa fa-clipboard icon-copy-clipboard"></span>
|
||||
<span class="copy-link-button-text"><%- gettext('Copy link') %></span>
|
||||
</button>
|
||||
</div>
|
||||
<img class="share-link-animated-svg" src="/static/studio/images/subsection-full-page.svg">
|
||||
</div>
|
||||
</div>
|
||||
10
cms/templates/js/subsection-share-link-modal-tabs.underscore
Normal file
10
cms/templates/js/subsection-share-link-modal-tabs.underscore
Normal file
@@ -0,0 +1,10 @@
|
||||
<ul class="subsection-share-link-tabs-header">
|
||||
<% _.each(tabs, function(tab) { %>
|
||||
<li class="subsection-share-link-tab-buttons">
|
||||
<button type="button" class="subsection-share-link-tab-button" data-tab="<%- tab.name %>"><%- tab.displayName %></button>
|
||||
</li>
|
||||
<% }); %>
|
||||
</ul>
|
||||
<% _.each(tabs, function(tab) { %>
|
||||
<div class='subsection-share-link-tab <%- tab.name %>'></div>
|
||||
<% }); %>
|
||||
Reference in New Issue
Block a user