User Story for EJSS App.
"As a user, I want to be able to click on a button in the EJSS app to copy the embed link. In order to do so, SLS must give the clipboard-write permission to the iframe holding the EJSS app."
Script already added to allow EJSS copying of text in the SLS pop up-iframe
{{!
@template enrol_lti/content_show
Template which displays a list of published courses and activities.
Classes required for JS:
* none
Data attributes required for JS:
* none
Variable required for this template:
* courses
}}
<div id="lti_content_select">
<h1>{{#str}}publishedcontent, enrol_lti{{/str}}</h1>
<!-- <p><b>Deployment ID:</b>{{deploymentid}}</p> -->
<table class="table" aria-label="{{#str}}publishedcontent, enrol_lti{{/str}}">
<colgroup>
<col class="w-40">
<col class="w-50">
<col class="w-10">
</colgroup>
<thead>
<tr>
<th class="header" scope="col"></th>
<th class="header" scope="col">Resource URL</th>
<th class="header" scope="col"></th>
</tr>
</thead>
<tbody>
{{#courses}}
<tr>
<td>
<b>{{fullname}}</b>
</td>
<td></td>
<td></td>
</tr>
{{#modules}}
<tr>
<td>{{name}}</td>
<td><textarea id="{{id}}" rows="3" cols="50" readonly>{{url}}</textarea></td>
<td><button onclick="copy({{id}})">Select URL</button></td>
</tr>
{{/modules}}
{{/courses}}
</tbody>
</table>
</div>
<script>
var shouldTryCopy = false;
const permissions = navigator.permissions;
if (permissions) {
permissions.query({name: "clipboard-write"}).then((result) => {
if (result.state === "granted") {
// Can copy
shouldTryCopy = true;
replaceButtonText();
} else if (result.state === "prompt") {
// Can copy with prompt
console.warn("clipboard-write permission will prompt");
shouldTryCopy = true;
} else if (result.state === "denied") {
// Cannot copy
console.warn("clipboard-write permission denied");
}
}).catch((error) => {
console.warn("Could not query permissions; copy-text might not work properly");
shouldTryCopy = true;
});
} else {
// Might not work
console.warn("Permissions API not available; copy-text might not work");
shouldTryCopy = true;
}
function replaceButtonText() {
const buttons = document.getElementsByClassName("copy-button");
for (var i = 0; i < buttons.length; i++) {
buttons[i].innerText = "Copy URL";
}
}
function copy(id) {
const input = document.getElementById(id);
// input.focus();
input.select();
input.setSelectionRange(0, 99999);
if (shouldTryCopy) {
navigator.clipboard.writeText(input.value).then(
() => {
console.info("Copied");
},
() => {
shouldTryCopy = false;
console.warn("Failed to copy URL; will not try again this session");
}
);
}
}
</script>
Reference:
How to find the string "Deployment ID:"
on terminal run:
Last login: Mon Jun 26 14:13:28 on console
lookang@Opens-MacBook-Pro ~ % grep -Rnw /Users/lookang/Desktop/moodle30.542_61559.2023-06-16_10-07-10/ -e 'Deployment ID'
/Users/lookang/Desktop/moodle30.542_61559.2023-06-16_10-07-10//enrol/lti/templates/local/ltiadvantage/content_show.mustache:18: <p><b>Deployment ID:</b>{{deploymentid}}</p>
No comments:
Post a Comment