Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: allow to view in CMS #25

Merged
merged 5 commits into from
Dec 8, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 2 additions & 7 deletions h5pxblock/h5pxblock.py
Original file line number Diff line number Diff line change
Expand Up @@ -170,7 +170,6 @@ class H5PPlayerXBlock(XBlock, CompletableXBlockMixin):
)

h5p_content_meta = Dict(scope=Scope.content)
has_author_view = True

def resource_string(self, path):
"""Handy helper for getting resources from our kit."""
Expand Down Expand Up @@ -241,16 +240,12 @@ def get_context_studio(self):
"h5p_xblock": self,
}

def author_view(self, context=None):
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are removing author_view we should remove author_view.html and also relevant translations in *.po files of all supported languages.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done

html = self.render_template("static/html/author_view.html", context)
frag = Fragment(html)
return frag

def studio_view(self, context=None):
context = self.get_context_studio()
template = self.render_template("static/html/studio.html", context)
frag = Fragment(template)
frag.add_css(self.resource_string("static/css/studio.css"))
frag.add_javascript(self.resource_string("static/js/src/installRequired.js"))
frag.add_javascript(self.resource_string("static/js/src/studio.js"))
frag.initialize_js(
"H5PStudioXBlock",
Expand All @@ -273,7 +268,7 @@ def student_view(self, context=None):
template = self.render_template("static/html/h5pxblock.html", context)
frag = Fragment(template)
frag.add_css(self.resource_string("static/css/student_view.css"))
frag.add_javascript_url('https://cdn.jsdelivr.net/npm/h5p-standalone@3.6.0/dist/main.bundle.js')
frag.add_javascript(self.resource_string("static/js/src/installRequired.js"))
frag.add_javascript(self.resource_string("static/js/src/h5pxblock.js"))
user_service = self.runtime.service(self, 'user')
user = user_service.get_current_user()
Expand Down
Binary file modified h5pxblock/locale/ar/LC_MESSAGES/text.mo
Binary file not shown.
10 changes: 0 additions & 10 deletions h5pxblock/locale/ar/LC_MESSAGES/text.po
Original file line number Diff line number Diff line change
Expand Up @@ -105,16 +105,6 @@ msgstr "تم الرفع"
msgid "Extracting"
msgstr "جاري الاستخلاص"

#: static/html/author_view.html:3
msgid "Content can be previewed inside LMS only"
msgstr "يمكن معاينة المحتوى داخل نظام إدارة التعلم (LMS ) فقط"

#: static/html/author_view.html:4
msgid ""
"Please upload H5P content by clicking the \"Edit\" button if you have not "
"already uploaded it."
msgstr "يرجى رفع محتوى H5P بالنقر فوق الزر \"تحرير\" إذا لم تقم بتحميله بالفعل."

#: static/html/h5pxblock.html:7
msgid "Loading..."
msgstr "جاري التحميل ..."
Expand Down
10 changes: 0 additions & 10 deletions h5pxblock/locale/en/LC_MESSAGES/text.po
Original file line number Diff line number Diff line change
Expand Up @@ -125,16 +125,6 @@ msgstr ""
msgid "Extracting"
msgstr ""

#: static/html/author_view.html:3
msgid "Content can be previewed inside LMS only"
msgstr ""

#: static/html/author_view.html:4
msgid ""
"Please upload H5P content by clicking the \"Edit\" button if you have not "
"already uploaded it."
msgstr ""

#: static/html/h5pxblock.html:7
msgid "Loading..."
msgstr ""
Expand Down
Binary file modified h5pxblock/locale/es_419/LC_MESSAGES/text.mo
Binary file not shown.
12 changes: 0 additions & 12 deletions h5pxblock/locale/es_419/LC_MESSAGES/text.po
Original file line number Diff line number Diff line change
Expand Up @@ -130,18 +130,6 @@ msgstr "Subido"
msgid "Extracting"
msgstr "Extrayendo"

#: static/html/author_view.html:3
msgid "Content can be previewed inside LMS only"
msgstr "El contenido solo se puede previsualizar dentro del LMS"

#: static/html/author_view.html:4
msgid ""
"Please upload H5P content by clicking the \"Edit\" button if you have not "
"already uploaded it."
msgstr ""
"Por favor, si aún no lo ha hecho, cargue el contenido H5P haciendo clic en "
"el botón \"Editar\"."

#: static/html/h5pxblock.html:7
msgid "Loading..."
msgstr "Cargando..."
Expand Down
Binary file modified h5pxblock/locale/es_ES/LC_MESSAGES/text.mo
Binary file not shown.
12 changes: 0 additions & 12 deletions h5pxblock/locale/es_ES/LC_MESSAGES/text.po
Original file line number Diff line number Diff line change
Expand Up @@ -130,18 +130,6 @@ msgstr "Subido"
msgid "Extracting"
msgstr "Extrayendo"

#: static/html/author_view.html:3
msgid "Content can be previewed inside LMS only"
msgstr "El contenido solo se puede previsualizar dentro del LMS"

#: static/html/author_view.html:4
msgid ""
"Please upload H5P content by clicking the \"Edit\" button if you have not "
"already uploaded it."
msgstr ""
"Por favor, si aún no lo ha hecho, cargue el contenido H5P haciendo clic en "
"el botón \"Editar\"."

#: static/html/h5pxblock.html:7
msgid "Loading..."
msgstr "Cargando..."
Expand Down
5 changes: 0 additions & 5 deletions h5pxblock/static/html/author_view.html

This file was deleted.

182 changes: 114 additions & 68 deletions h5pxblock/static/js/src/h5pxblock.js
Original file line number Diff line number Diff line change
@@ -1,85 +1,131 @@
/* Javascript for H5PPlayerXBlock. */
function H5PPlayerXBlock(runtime, element, args) {

function initH5P(H5PStandalone, service) {
if (!window.H5PPlayerXBlockPromises) {
window.H5PPlayerXBlockPromises = [];
window.H5PPlayerXBlockPromises = [];
}
const contentUserDataUrl = runtime.handlerUrl(element, 'user_interaction_data');
const contentxResultSaveUrl = runtime.handlerUrl(element, 'result_handler');
const contentUserDataUrl = runtime.handlerUrl(
element,
"user_interaction_data"
);
const contentxResultSaveUrl = runtime.handlerUrl(element, "result_handler");

const playerPromise = async function edXH5PPlayer(el) {
if (el && $(el).children(".h5p-iframe-wrapper").length == 0) {
Ian2012 marked this conversation as resolved.
Show resolved Hide resolved
const userObj = { name: args.user_full_name, mail: args.user_email };
const options = {
h5pJsonPath: args.h5pJsonPath,
frameJs:
"https://cdn.jsdelivr.net/npm/h5p-standalone@3.6.0/dist/frame.bundle.js",
frameCss:
"https://cdn.jsdelivr.net/npm/h5p-standalone@3.6.0/dist/styles/h5p.css",
frame: args.frame,
copyright: args.copyright,
icon: args.icon,
fullScreen: args.fullScreen,
user: userObj,
saveFreq: args.saveFreq,
customJs: args.customJsPath,
contentUserData: [
{
state: args.userData,
},
],
ajax: {
contentUserDataUrl: contentUserDataUrl,
},
};

const playerPromise = function edXH5PPlayer(el) {
if (el && $(el).children('.h5p-iframe-wrapper').length == 0) {
const userObj = { 'name': args.user_full_name, 'mail': args.user_email };
const options = {
h5pJsonPath: args.h5pJsonPath,
frameJs: 'https://cdn.jsdelivr.net/npm/h5p-standalone@3.6.0/dist/frame.bundle.js',
frameCss: 'https://cdn.jsdelivr.net/npm/h5p-standalone@3.6.0/dist/styles/h5p.css',
frame: args.frame,
copyright: args.copyright,
icon: args.icon,
fullScreen: args.fullScreen,
user: userObj,
saveFreq: args.saveFreq,
customJs: args.customJsPath,
contentUserData: [{
state: args.userData
}],
ajax: {
contentUserDataUrl: contentUserDataUrl
}
try {
await new H5PStandalone.H5P(el, options);
$(el).siblings(".spinner-container").find(".spinner-border").hide();
$(el).show();

H5P.externalDispatcher.on("xAPI", (event) => {
let hasStatement = event && event.data && event.data.statement;
if (!hasStatement) {
return;
}

return new H5PStandalone.H5P(el, options).then(function(){
$(el).siblings('.spinner-container').find('.spinner-border').hide();
$(el).show();
H5P.externalDispatcher.on("xAPI", (event) => {
let statement = event.data.statement;
let validVerb =
statement.verb &&
statement.verb.display &&
statement.verb.display["en-US"];
if (!validVerb) {
return;
}

let isCompleted =
statement.verb.display["en-US"] === "answered" ||
statement.verb.display["en-US"] === "completed";
let isChild =
statement.context &&
statement.context.contextActivities &&
statement.context.contextActivities.parent &&
statement.context.contextActivities.parent[0] &&
statement.context.contextActivities.parent[0].id;

// Store only completed root events.
if (isCompleted && !isChild) {
$.ajax({
type: "POST",
url: contentxResultSaveUrl,
data: JSON.stringify(event.data.statement),
})
.done(function () {
// handle fine request here
})
.fail(function () {
// handle fails request here
Ian2012 marked this conversation as resolved.
Show resolved Hide resolved
});
}
});

let hasStatement = event && event.data && event.data.statement;
if (!hasStatement) {
return;
}

let statement = event.data.statement;
let validVerb = statement.verb && statement.verb.display && statement.verb.display['en-US'];
if (!validVerb) {
return;
}

let isCompleted = statement.verb.display['en-US'] === 'answered' ||
statement.verb.display['en-US'] === 'completed';
let isChild = statement.context && statement.context.contextActivities &&
statement.context.contextActivities.parent &&
statement.context.contextActivities.parent[0] &&
statement.context.contextActivities.parent[0].id;

// Store only completed root events.
if (isCompleted && !isChild) {
$.ajax({
type: "POST",
url: contentxResultSaveUrl,
data: JSON.stringify(event.data.statement)
});
}
// uncomment to see all xAPI events triggered by H5P content
//console.log("xAPI event: ", event);
});

});
return Promise.resolve("Result successfully");
} catch (error) {
return Promise.reject(error.message);
}
}
};

const h5pel = document.getElementById('h5p-' + args.player_id);
const h5pel = document.getElementById("h5p-" + args.player_id);
window.H5PPlayerXBlockPromises.push(playerPromise(h5pel));
window.H5PXBlockPlayersInitlized = false;

$(function ($) {
if (!H5PXBlockPlayersInitlized) {
window.H5PXBlockPlayersInitlized = true;
window.H5PPlayerXBlockPromises.reduce(
function(prevPromise, curPromise) {
return prevPromise.then(curPromise);
}, Promise.resolve()
);
}
if (!H5PXBlockPlayersInitlized) {
window.H5PXBlockPlayersInitlized = true;
Promise.all(window.H5PPlayerXBlockPromises).then((_) => {});
}
});
}

if (typeof require === "function") {
require(["h5p"], function (H5PStandalone) {
initH5P(H5PStandalone, "cms");
});
} else {
loadJS(function () {
initH5P(window.H5PStandalone, "lms");
});
}
}

function loadJS(callback) {
if (window.H5PStandalone) {
callback();
} else {
// Load jsMind dynamically using $.getScript
$.getScript(
"https://cdn.jsdelivr.net/npm/h5p-standalone@3.6.0/dist/main.bundle.js"
)
.done(function () {
window.H5PStandalone = H5PStandalone;
callback();
})
.fail(function () {
console.error("Error loading H5PStandalone.");
});
}
}
11 changes: 11 additions & 0 deletions h5pxblock/static/js/src/installRequired.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
try {
(function (require) {
require.config({
paths: {
h5p: "https://cdn.jsdelivr.net/npm/h5p-standalone@3.5.1/dist/main.bundle",
},
});
}).call(this, require || RequireJS.require);
} catch (e) {
console.log("Unable to load h5p-standalone via requirejs");
}
Loading