EDUCATIC
/
h5p-php-library
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'master' into upgrade-speed

semantics-font
Frode Petterson 2015-03-04 10:21:29 +01:00
parent 3463a3c671 96b1014f80
commit 812c3b5e7c
15 changed files with 223 additions and 353 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
embed.php Normal file
View File

@ -0,0 +1,22 @@
<!doctype html>
<html lang="<?php print $lang; ?>" class="h5p-iframe">
<head>
<meta charset="utf-8">
<title><?php print $content['title']; ?></title>
<?php for ($i = 0, $s = count($scripts); $i < $s; $i++): ?>
<script src="<?php print $scripts[$i]; ?>"></script>
<?php endfor; ?>
<?php for ($i = 0, $s = count($styles); $i < $s; $i++): ?>
<link rel="stylesheet" href="<?php print $styles[$i]; ?>">
<?php endfor; ?>
</head>
<body>
<div class="h5p-content" data-content-id="<?php print $content['id']; ?>"></div>
<script>
H5PIntegration = <?php print json_encode($integration); ?>;
H5P.jQuery(document).ready(function () {
H5P.init();
});
</script>
</body>
</html>

BIN
fonts/h5p.eot
View File

Binary file not shown.

26
fonts/h5p.svg
View File

@ -1,31 +1,13 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
<json>
{
"fontFamily": "h5p-core-fonts",
"majorVersion": 1,
"minorVersion": 0,
"fontURL": "http://h5p.org",
"license": "MIT license",
"licenseURL": "http://opensource.org/licenses/MIT",
"designer": "Magnus Vik Magnussen",
"designerURL": "",
"version": "Version 1.0",
"fontId": "h5p-core-fonts",
"psName": "h5p-core-fonts",
"subFamily": "Regular",
"fullName": "h5p-core-fonts",
"description": "Generated by IcoMoon"
}
</json>
</metadata>
<metadata>Generated by IcoMoon</metadata>
<defs>
<font id="h5p-core-fonts" horiz-adv-x="1024">
<font id="h5p" horiz-adv-x="1024">
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" d="" horiz-adv-x="512" />
<glyph unicode="&#xe600;" d="M454.299 416.588l-116.917 116.917-84.781-84.707 201.696-201.697 317.097 317.097-84.781 84.706z" />
<glyph unicode="&#xe888;" d="M660.48 703.59c-140.288 0-253.952-113.664-253.952-253.952 0-122.47 86.63-224.666 202.138-248.627v206.234h-86.835c-11.264 0-14.541 7.168-7.373 16.179l133.12 164.659c7.168 9.011 18.842 9.011 26.010 0l133.12-164.659c7.373-8.602 3.686-16.179-7.373-16.179h-86.835v-206.234c115.507 23.962 202.138 126.157 202.138 248.627-0.205 140.288-113.869 253.952-254.157 253.952z" horiz-adv-x="1321" />
<glyph unicode="&#xe889;" d="M662.118 701.952c-140.288 0-253.952-113.664-253.952-253.952s113.664-253.952 253.952-253.952 253.952 113.664 253.952 253.952-113.664 253.952-253.952 253.952zM621.773 652.8h83.763v-65.946h-83.763v65.946zM748.749 273.92h-173.67v50.995h49.562v159.13h-49.562v50.995h133.53v-210.125h40.346v-50.995z" horiz-adv-x="1321" />
<glyph unicode="&#xe88a;" d="M925.491 236.646l-114.688 114.688c27.238 37.888 43.213 84.378 43.213 134.554 0 127.59-103.834 231.424-231.424 231.424s-231.424-103.834-231.424-231.424c0-127.59 103.834-231.424 231.424-231.424 50.176 0 96.666 15.974 134.554 43.213l114.688-114.688c5.325-5.325 13.926-5.325 19.251 0l34.406 34.406c5.325 5.12 5.325 13.926 0 19.251zM622.797 318.566c-92.365 0-167.117 74.752-167.117 167.117s74.752 167.117 167.117 167.117c92.365 0 167.117-74.752 167.117-167.117s-74.752-167.117-167.117-167.117z" horiz-adv-x="1321" />
@ -37,6 +19,6 @@
<glyph unicode="&#xe890;" d="M660.48 701.952c-140.288 0-253.952-113.664-253.952-253.952s113.664-253.952 253.952-253.952 253.952 113.664 253.952 253.952-113.664 253.952-253.952 253.952zM796.058 371.2c6.963-6.963 6.963-18.022 0-24.986l-33.997-33.997c-6.963-6.963-18.022-6.963-24.986 0l-76.8 76.8-76.595-76.595c-6.963-6.963-18.022-6.963-24.986 0l-33.997 33.997c-6.963 6.963-6.963 18.022 0 24.986l76.8 76.8-76.8 76.8c-6.963 6.963-6.963 18.022 0 24.986l33.997 33.997c6.963 6.963 18.022 6.963 24.986 0l76.8-76.8 76.8 76.8c6.963 6.963 18.022 6.963 24.986 0l33.997-33.997c6.963-6.963 6.963-18.022 0-24.986l-77.005-77.005 76.8-76.8z" horiz-adv-x="1321" />
<glyph unicode="&#xe891;" d="M324.468 566.591c-4.186-4.186-2.79-8.372 3.255-8.835l111.615-11.86c6.046-0.697 10.464 3.721 9.766 9.766l-11.86 111.615c-0.697 6.046-4.65 7.441-8.835 3.255l-103.942-103.942zM399.112 634.259l-64.644 64.876c-4.186 4.186-11.161 4.186-15.581 0l-23.254-23.254c-4.186-4.186-4.186-11.161 0-15.581l64.876-64.876zM896.497 670.533c-4.186 4.186-8.372 2.79-8.835-3.255l-11.86-111.615c-0.697-6.046 3.721-10.464 9.766-9.766l111.615 11.86c6.046 0.697 7.441 4.65 3.255 8.835l-103.942 103.942zM964.165 595.657l64.876 64.876c4.186 4.186 4.186 11.161 0 15.581l-23.254 23.254c-4.186 4.186-11.161 4.186-15.581 0l-64.876-64.876zM1000.44 320.34c4.186 4.186 2.79 8.372-3.255 8.835l-111.615 11.86c-6.046 0.697-10.464-3.721-9.766-9.766l11.86-111.615c0.697-6.046 4.65-7.441 8.835-3.255l103.942 103.942zM925.564 252.441l64.876-64.876c4.186-4.186 11.161-4.186 15.581 0l23.254 23.254c4.186 4.186 4.186 11.161 0 15.581l-64.876 64.876zM428.41 216.398c4.186-4.186 8.372-2.79 8.835 3.255l11.86 111.615c0.697 6.046-3.721 10.464-9.766 9.766l-111.615-11.86c-6.046-0.697-7.441-4.65-3.255-8.835l103.942-103.942zM360.51 291.273l-64.876-64.876c-4.186-4.186-4.186-11.161 0-15.581l23.254-23.254c4.186-4.186 11.161-4.186 15.581 0l64.876 64.876zM477.939 572.404v-248.809h365.076v248.809h-365.076zM797.905 368.707h-274.854v158.355h274.621v-158.355z" horiz-adv-x="1321" />
<glyph unicode="&#xe892;" d="M599.553 337.314c4.419-3.023 8.138-9.998 8.138-15.581v-58.599c0-5.348-3.721-7.441-8.138-4.419l-220.906 148.123c-4.419 3.023-8.138 9.998-8.138 15.348v50.228c0 5.348 3.721 12.323 8.138 15.581l220.906 149.517c4.419 3.023 8.138 1.162 8.138-4.419v-58.599c0-5.348-3.721-12.556-8.138-15.581l-152.773-106.731c-4.419-3.023-4.419-8.138 0-11.161l152.773-103.71zM874.175 440.559c4.419 3.023 4.65 8.138 0 11.161l-152.773 106.731c-4.419 3.023-8.138 10.232-8.138 15.581v58.599c0 5.348 3.721 7.441 8.138 4.419l220.906-149.517c4.419-3.023 8.138-9.998 8.138-15.581v-50.228c0-5.348-3.721-12.323-8.138-15.348l-220.906-148.123c-4.419-3.023-8.138-1.162-8.138 4.419v58.599c0 5.348 3.721 12.323 8.138 15.581l152.773 103.71z" horiz-adv-x="1321" />
<glyph unicode="&#xe893;" d="M502.17 522.957c-12.902 0-16.998-8.192-8.806-18.227l152.166-188.006c8.192-10.035 21.504-10.035 29.696 0l152.166 188.006c8.192 10.035 4.301 18.227-8.806 18.227h-316.416zM719.462 512.512v139.878c0 12.902-10.65 23.552-23.552 23.552h-70.656c-12.902 0-23.552-10.65-23.552-23.552v-139.878zM798.106 375.91c-8.602 0-20.070-5.53-25.6-12.288l-75.162-92.979c-5.325-6.758-15.36-16.589-22.118-21.914 0 0-4.506-3.686-14.746-3.686s-14.746 3.686-14.746 3.686c-6.758 5.325-16.589 15.36-22.118 21.914l-75.162 92.979c-5.325 6.758-16.998 12.288-25.6 12.288h-130.253c-8.602 0-15.77-6.963-15.77-15.77v-141.722c0-8.602 6.963-15.77 15.77-15.77h535.962c8.602 0 15.77 6.963 15.77 15.77v141.722c0 8.602-6.963 15.77-15.77 15.77h-130.458zM448.102 261.018c-15.565 0-28.262 12.698-28.262 28.262 0 15.565 12.698 28.262 28.262 28.262s28.262-12.698 28.262-28.262c-0.205-15.565-12.698-28.262-28.262-28.262z" horiz-adv-x="1321" />
<glyph unicode="&#xe893;" d="M502.17 522.957c-12.902 0-16.998-8.192-8.806-18.227l152.166-188.006c8.192-10.035 21.504-10.035 29.696 0l152.166 188.006c8.192 10.035 4.301 18.227-8.806 18.227h-316.416zM719.462 512.512v139.878c0 12.902-10.65 23.552-23.552 23.552h-70.656c-12.902 0-23.552-10.65-23.552-23.552v-139.878zM798.106 375.91c-8.602 0-20.070-5.53-25.6-12.288l-75.162-92.979c-5.325-6.758-15.36-16.589-22.118-21.914 0 0-4.506-3.686-14.746-3.686s-14.746 3.686-14.746 3.686c-6.758 5.325-16.589 15.36-22.118 21.914l-75.162 92.979c-5.325 6.758-16.998 12.288-25.6 12.288h-130.253c-8.602 0-15.77-6.963-15.77-15.77v-141.722c0-8.602 6.963-15.77 15.77-15.77h535.962c8.602 0 15.77 6.963 15.77 15.77v141.722c0 8.602-6.963 15.77-15.77 15.77h-130.458zM448.102 261.018c-15.565 0-28.262 12.698-28.262 28.262s12.698 28.262 28.262 28.262 28.262-12.698 28.262-28.262c-0.205-15.565-12.698-28.262-28.262-28.262z" horiz-adv-x="1321" />
<glyph unicode="&#xe894;" d="M742.605 448l107.11 107.11c9.626 9.626 9.626 25.19 0 34.816l-47.309 47.309c-9.626 9.626-25.19 9.626-34.816 0l-107.11-107.11-107.11 107.11c-9.626 9.626-25.19 9.626-34.816 0l-47.309-47.309c-9.626-9.626-9.626-25.19 0-34.816l107.11-107.11-107.11-107.11c-9.626-9.626-9.626-25.19 0-34.816l47.309-47.309c9.626-9.626 25.19-9.626 34.816 0l107.11 107.11 107.11-107.11c9.626-9.626 25.19-9.626 34.816 0l47.309 47.309c9.626 9.626 9.626 25.19 0 34.816l-107.11 107.11z" horiz-adv-x="1321" />
</font></defs></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

BIN
fonts/h5p.ttf
View File

Binary file not shown.

BIN
fonts/h5p.woff Normal file
View File

Binary file not shown.

2
js/h5p-content-upgrade.js
View File

@ -6,7 +6,7 @@
// Initialize
$(document).ready(function () {
// Get library info
info = H5PIntegration.getLibraryInfo();
info = H5PAdminIntegration.libraryInfo;
// Get and reset container
$container = $('#h5p-admin-container').html('<p>' + info.message + '</p>');

251
js/h5p-embed.js
View File

@ -1,69 +1,27 @@
/*jshint multistr: true */
/**
*
* Converts old script tag embed to iframe
*/
var H5P = H5P || (function () {
var H5POldEmbed = H5POldEmbed || (function () {
var head = document.getElementsByTagName('head')[0];
var contentId = 0;
var contents = {};
var resizer = false;
/**
* Wraps multiple content between a prefix and a suffix.
* Loads the resizing script
*/
var wrap = function (prefix, content, suffix) {
var result = '';
for (var i = 0; i < content.length; i++) {
result += prefix + content[i] + suffix;
}
return result;
};
/**
*
*/
var loadContent = function (id, script) {
var url = script.getAttribute('data-h5p');
var data, callback = 'H5P' + id;
// Prevent duplicate loading.
script.removeAttribute('data-h5p');
var loadResizer = function (url) {
var data, callback = 'H5POldEmbed';
resizer = true;
// Callback for when content data is loaded.
window[callback] = function (content) {
contents[id] = content;
var iframe = document.createElement('iframe');
var parent = script.parentNode;
parent.insertBefore(iframe, script);
iframe.id = 'h5p-iframe-' + id;
iframe.style.display = 'block';
iframe.style.width = '100%';
iframe.style.height = '1px';
iframe.style.border = 'none';
iframe.style.zIndex = 101;
iframe.style.top = 0;
iframe.style.left = 0;
iframe.className = 'h5p-iframe';
iframe.setAttribute('frameBorder', '0');
iframe.contentDocument.open();
iframe.contentDocument.write('\
<!doctype html><html class="h5p-iframe">\
<head>\
<script>\
var H5PIntegration = window.parent.H5P.getIntegration(' + id + ');\
</script>\
' + wrap('<link rel="stylesheet" href="', content.styles, '">') + '\
' + wrap('<script src="', content.scripts, '"></script>') + '\
</head><body>\
<div class="h5p-content" data-class="' + content.library + '" data-content-id="' + id + '"/>\
</body></html>');
iframe.contentDocument.close();
iframe.contentDocument.documentElement.style.overflow = 'hidden';
// Add resizing script to head
var resizer = document.createElement('script');
resizer.src = content;
head.appendChild(resizer);
// Clean up
parent.removeChild(script);
head.removeChild(data);
delete window[callback];
};
@ -74,183 +32,44 @@ var H5P = H5P || (function () {
head.appendChild(data);
};
/**
* Replaced script tag with iframe
*/
var addIframe = function (script) {
// Add iframe
var iframe = document.createElement('iframe');
iframe.src = script.getAttribute('data-h5p');
iframe.frameBorder = false;
iframe.allowFullscreen = true;
var parent = script.parentNode;
parent.insertBefore(iframe, script);
parent.removeChild(script);
};
/**
* Go throught all script tags with the data-h5p attribute and load content.
*/
function H5P() {
function H5POldEmbed() {
var scripts = document.getElementsByTagName('script');
var h5ps = []; // Use seperate array since scripts grow in size.
for (var i = 0; i < scripts.length; i++) {
var script = scripts[i];
if (script.hasAttribute('data-h5p')) {
if (script.src.indexOf('/h5p-resizer.js') !== -1) {
resizer = true;
}
else if (script.hasAttribute('data-h5p')) {
h5ps.push(script);
}
}
for (i = 0; i < h5ps.length; i++) {
loadContent(contentId, h5ps[i]);
contentId++;
}
}
/**
* Return integration object
*/
H5P.getIntegration = function (id) {
var content = contents[id];
return {
getJsonContent: function () {
return content.params;
},
getContentPath: function () {
return content.path + 'content/' + content.id + '/';
},
getFullscreen: function () {
return content.fullscreen;
},
getLibraryPath: function (library) {
return content.path + 'libraries/' + library;
},
getContentData: function () {
return {
library: content.library,
jsonContent: content.params,
fullScreen: content.fullscreen,
exportUrl: content.exportUrl,
embedCode: content.embedCode
};
},
i18n: content.i18n,
showH5PIconInActionBar: function () {
// Always show H5P-icon when embedding
return true;
if (!resizer) {
loadResizer(h5ps[i].getAttribute('data-h5p'));
}
};
};
// Detect if we support fullscreen, and what prefix to use.
var fullScreenBrowserPrefix, safariBrowser;
if (document.documentElement.requestFullScreen) {
fullScreenBrowserPrefix = '';
}
else if (document.documentElement.webkitRequestFullScreen &&
navigator.userAgent.indexOf('Android') === -1 // Skip Android
) {
safariBrowser = navigator.userAgent.match(/Version\/(\d)/);
safariBrowser = (safariBrowser === null ? 0 : parseInt(safariBrowser[1]));
// Do not allow fullscreen for safari < 7.
if (safariBrowser === 0 || safariBrowser > 6) {
fullScreenBrowserPrefix = 'webkit';
addIframe(h5ps[i]);
}
}
else if (document.documentElement.mozRequestFullScreen) {
fullScreenBrowserPrefix = 'moz';
}
else if (document.documentElement.msRequestFullscreen) {
fullScreenBrowserPrefix = 'ms';
}
/**
* Enter fullscreen mode.
*/
H5P.fullScreen = function ($element, instance, exitCallback, body) {
var iframe = document.getElementById('h5p-iframe-' + $element.parent().data('content-id'));
var $classes = $element.add(body);
var $body = $classes.eq(1);
/**
* Prepare for resize by setting the correct styles.
*
* @param {String} classes CSS
*/
var before = function (classes) {
$classes.addClass(classes);
iframe.style.height = '100%';
};
/**
* Gets called when fullscreen mode has been entered.
* Resizes and sets focus on content.
*/
var entered = function () {
// Do not rely on window resize events.
instance.$.trigger('resize');
instance.$.trigger('focus');
};
/**
* Gets called when fullscreen mode has been exited.
* Resizes and sets focus on content.
*
* @param {String} classes CSS
*/
var done = function (classes) {
H5P.isFullscreen = false;
$classes.removeClass(classes);
// Do not rely on window resize events.
instance.$.trigger('resize');
instance.$.trigger('focus');
if (exitCallback !== undefined) {
exitCallback();
}
};
H5P.isFullscreen = true;
if (fullScreenBrowserPrefix === undefined) {
// Create semi fullscreen.
before('h5p-semi-fullscreen');
iframe.style.position = 'fixed';
var $disable = $element.prepend('<a href="#" class="h5p-disable-fullscreen" title="Disable fullscreen"></a>').children(':first');
var keyup, disableSemiFullscreen = function () {
$disable.remove();
$body.unbind('keyup', keyup);
iframe.style.position = 'static';
done('h5p-semi-fullscreen');
return false;
};
keyup = function (event) {
if (event.keyCode === 27) {
disableSemiFullscreen();
}
};
$disable.click(disableSemiFullscreen);
$body.keyup(keyup); // TODO: Does not work with iframe's $!
entered();
}
else {
// Create real fullscreen.
before('h5p-fullscreen');
var first, eventName = (fullScreenBrowserPrefix === 'ms' ? 'MSFullscreenChange' : fullScreenBrowserPrefix + 'fullscreenchange');
document.addEventListener(eventName, function () {
if (first === undefined) {
// We are entering fullscreen mode
first = false;
entered();
return;
}
// We are exiting fullscreen
done('h5p-fullscreen');
document.removeEventListener(eventName, arguments.callee, false);
});
if (fullScreenBrowserPrefix === '') {
iframe.requestFullScreen();
}
else {
var method = (fullScreenBrowserPrefix === 'ms' ? 'msRequestFullscreen' : fullScreenBrowserPrefix + 'RequestFullScreen');
var params = (fullScreenBrowserPrefix === 'webkit' && safariBrowser === 0 ? Element.ALLOW_KEYBOARD_INPUT : undefined);
iframe[method](params);
}
}
};
return H5P;
return H5POldEmbed;
})();
new H5P();
new H5POldEmbed();

8
js/h5p-event-dispatcher.js
View File

@ -36,7 +36,7 @@ H5P.EventDispatcher = (function () {
* @param {Function} listener - Event listener
* @param {Function} thisArg - Optionally specify the this value when calling listener.
*/
self.on = function (type, listener, thisArg) {
this.on = function (type, listener, thisArg) {
if (thisArg === undefined) {
thisArg = self;
}
@ -66,7 +66,7 @@ H5P.EventDispatcher = (function () {
* @param {Function} listener - Event listener
* @param {Function} thisArg - Optionally specify the this value when calling listener.
*/
self.once = function (type, listener, thisArg) {
this.once = function (type, listener, thisArg) {
if (thisArg === undefined) {
thisArg = self;
}
@ -91,7 +91,7 @@ H5P.EventDispatcher = (function () {
* @param {String} type - Event type
* @param {Function} listener - Event listener
*/
self.off = function (type, listener) {
this.off = function (type, listener) {
if (listener !== undefined && !(listener instanceof Function)) {
throw TypeError('listener must be a function');
}
@ -131,7 +131,7 @@ H5P.EventDispatcher = (function () {
* Custom event data(used when event type as string is used as first
* argument
*/
self.trigger = function (event, eventData) {
this.trigger = function (event, eventData) {
if (event === undefined) {
return;
}

4
js/h5p-library-details.js
View File

@ -7,8 +7,8 @@ var H5PLibraryDetails= H5PLibraryDetails || {};
* Initializing
*/
H5PLibraryDetails.init = function () {
H5PLibraryDetails.$adminContainer = H5PIntegration.getAdminContainer();
H5PLibraryDetails.library = H5PIntegration.getLibraryInfo();
H5PLibraryDetails.$adminContainer = H5P.jQuery(H5PAdminIntegration.containerSelector);
H5PLibraryDetails.library = H5PAdminIntegration.libraryInfo;
// currentContent holds the current list if data (relevant for filtering)
H5PLibraryDetails.currentContent = H5PLibraryDetails.library.content;

8
js/h5p-library-list.js
View File

@ -7,15 +7,15 @@ var H5PLibraryList = H5PLibraryList || {};
* Initializing
*/
H5PLibraryList.init = function () {
var $adminContainer = H5PIntegration.getAdminContainer();
var $adminContainer = H5P.jQuery(H5PAdminIntegration.containerSelector).html('');
var libraryList = H5PIntegration.getLibraryList();
var libraryList = H5PAdminIntegration.libraryList;
if (libraryList.notCached) {
$adminContainer.append(H5PUtils.getRebuildCache(libraryList.notCached));
}
// Create library list
$adminContainer.append(H5PLibraryList.createLibraryList(H5PIntegration.getLibraryList()));
$adminContainer.append(H5PLibraryList.createLibraryList(H5PAdminIntegration.libraryList));
};
/**
@ -24,7 +24,7 @@ var H5PLibraryList = H5PLibraryList || {};
* @param {object} libraries List of libraries and headers
*/
H5PLibraryList.createLibraryList = function (libraries) {
var t = H5PIntegration.i18n.H5P;
var t = H5PAdminIntegration.l10n;
if(libraries.listData === undefined || libraries.listData.length === 0) {
return $('<div>' + t.NA + '</div>');
}

61
js/h5p-resizer.js
View File

@ -47,14 +47,10 @@
actionHandlers.prepareResize = function (iframe, data, respond) {
responseData = {};
// Retain parent size to avoid jumping/scrolling
responseData.parentHeight = iframe.parentElement.style.height;
//iframe.parentElement.style.height = iframe.parentElement.clientHeight + 'px';
// Reset iframe height, in case content has shrinked.
iframe.style.height = '1px';
respond('resizePrepared', responseData);
respond('resizePrepared');
};
/**
@ -68,9 +64,6 @@
actionHandlers.resize = function (iframe, data, respond) {
// Resize iframe so all content is visible.
iframe.style.height = data.height + 'px';
// Free parent
//iframe.parentElement.style.height = data.parentHeight;
};
/**
@ -84,43 +77,6 @@
}
};
// /**
// * Enter semi full screen.
// * Expands the iframe so that it covers the whole page.
// *
// * @private
// * @param {Object} iframe Element
// * @param {Object} data Payload
// * @param {Function} respond Send a response to the iframe
// */
// actionHandlers.fullScreen = function (iframe, data, respond) {
// iframe.style.position = 'fixed';
// iframe.style.top = iframe.style.left = 0;
// iframe.style.zIndex = 101;
// iframe.style.width = iframe.style.height = '100%';
// document.body.addEventListener('keyup', escape, false);
// respond('fullScreen');
// };
//
// /**
// * Exit semi full screen.
// *
// * @private
// * @param {Object} iframe Element
// * @param {Object} data Payload
// * @param {Function} respond Send a response to the iframe
// */
// actionHandlers.exitFullScreen = function (iframe, data, respond) {
// iframe.style.position = '';
// iframe.style.top = iframe.style.left = '';
// iframe.style.zIndex = '';
// iframe.style.width = '100%';
// iframe.style.height = '';
// document.body.removeEventListener('keyup', escape, false);
// respond('exitFullScreen');
// };
// Listen for messages from iframes
window.addEventListener('message', function receiveMessage(event) {
if (event.data.context !== 'h5p') {
@ -142,7 +98,7 @@
// Find action handler handler
if (actionHandlers[event.data.action]) {
actionHandlers[event.data.action](iframe, event.data, function (action, data) {
actionHandlers[event.data.action](iframe, event.data, function respond(action, data) {
if (data === undefined) {
data = {};
}
@ -152,4 +108,17 @@
});
}
}, false);
// Let h5p iframes know we're ready!
var iframes = document.getElementsByTagName('iframe');
var ready = {
context: 'h5p',
action: 'ready'
};
for (var i = 0; i < iframes.length; i++) {
if (iframes[i].src.indexOf('h5p') !== -1) {
iframes[i].contentWindow.postMessage(ready, '*');
}
}
})();

2
js/h5p-utils.js
View File

@ -7,7 +7,7 @@ var H5PUtils = H5PUtils || {};
* @param {array} headers List of headers
*/
H5PUtils.createTable = function (headers) {
var $table = $('<table class="h5p-admin-table' + (H5PIntegration.extraTableClasses !== undefined ? ' ' + H5PIntegration.extraTableClasses : '') + '"></table>');
var $table = $('<table class="h5p-admin-table' + (H5PAdminIntegration.extraTableClasses !== undefined ? ' ' + H5PAdminIntegration.extraTableClasses : '') + '"></table>');
if(headers) {
var $thead = $('<thead></thead>');

34
js/h5p-x-api-event.js
View File

@ -79,7 +79,7 @@ H5P.XAPIEvent.prototype.getVerb = function(full) {
H5P.XAPIEvent.prototype.setObject = function(instance) {
if (instance.contentId) {
this.data.statement.object = {
'id': H5P.contentDatas['cid-' + instance.contentId].url,
'id': H5PIntegration.contents['cid-' + instance.contentId].url,
'objectType': 'Activity',
'extensions': {
'http://h5p.org/x-api/h5p-local-content-id': instance.contentId
@ -98,11 +98,33 @@ H5P.XAPIEvent.prototype.setObject = function(instance) {
* Helper function to set the actor, email and name will be added automatically
*/
H5P.XAPIEvent.prototype.setActor = function() {
this.data.statement.actor = {
'name': H5P.user.name,
'mbox': 'mailto:' + H5P.user.mail,
'objectType': 'Agent'
};
if (H5PIntegration.user !== undefined) {
this.data.statement.actor = {
'name': H5PIntegration.user.name,
'mbox': 'mailto:' + H5PIntegration.user.mail,
'objectType': 'Agent'
};
}
else {
var uuid;
if (localStorage.H5PUserUUID) {
uuid = localStorage.H5PUserUUID;
}
else {
uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(char) {
var random = Math.random()*16|0, newChar = char === 'x' ? random : (random&0x3|0x8);
return newChar.toString(16);
});
localStorage.H5PUserUUID = uuid;
}
this.data.statement.actor = {
'account': {
'name': uuid,
'homePage': window.location.origin + H5PIntegration.basePath
},
'objectType': 'Agent'
};
}
};
/**

139
js/h5p.js
View File

@ -48,7 +48,7 @@ H5P.init = function () {
var $element = H5P.jQuery(this);
var $container = H5P.jQuery('<div class="h5p-container"></div>').appendTo($element);
var contentId = $element.data('content-id');
var contentData = H5P.contentDatas['cid-' + contentId];
var contentData = H5PIntegration.contents['cid-' + contentId];
if (contentData === undefined) {
return H5P.error('No data for content id ' + contentId + '. Perhaps the library is gone?');
}
@ -108,8 +108,8 @@ H5P.init = function () {
H5P.on(instance, 'xAPI', H5P.xAPICompletedListener);
H5P.on(instance, 'xAPI', H5P.externalDispatcher.trigger);
if (H5P.isFramed)
var resizeDelay;{
if (H5P.isFramed) {
var resizeDelay;
if (H5P.externalEmbed === false) {
// Internal embed
// Make it possible to resize the iframe when the content changes size. This way we get no scrollbars.
@ -145,6 +145,11 @@ H5P.init = function () {
// External embed
var parentIsFriendly = false;
// Handle that the resizer is loaded after the iframe
H5P.communicator.on('ready', function () {
H5P.communicator.send('hello');
});
// Handle hello message from our parent window
H5P.communicator.on('hello', function () {
// Initial setup/handshake is done
@ -153,14 +158,14 @@ H5P.init = function () {
// Hide scrollbars for correct size
document.body.style.overflow = 'hidden';
H5P.communicator.send('prepareResize');
// Content need to be resized to fit the new iframe size
H5P.trigger(instance, 'resize');
});
// When resize has been prepared tell parent window to resize
H5P.communicator.on('resizePrepared', function (data) {
H5P.communicator.send('resize', {
height: document.body.scrollHeight,
parentHeight: data.parentHeight
height: document.body.scrollHeight
});
});
@ -193,15 +198,16 @@ H5P.init = function () {
H5P.jQuery(window.top).resize(function () {
if (window.parent.H5P.isFullscreen) {
// Use timeout to avoid bug in certain browsers when exiting fullscreen. Some browser will trigger resize before the fullscreenchange event.
H5P.trigger(instance, 'resize');
H5P.trigger(instance, 'resize');
}
else {
H5P.trigger(instance, 'resize');
}
});
H5P.instances.push(instance);
}
H5P.instances.push(instance);
// Resize content.
H5P.trigger(instance, 'resize');
});
@ -218,6 +224,47 @@ H5P.init = function () {
});
};
/**
* Loop through assets for iframe content and create a set of tags for head.
*
* @private
* @param {number} contentId
* @returns {string} HTML
*/
H5P.getHeadTags = function (contentId) {
var basePath = window.location.protocol + '//' + window.location.host + H5PIntegration.basePath;
var createUrl = function (path) {
if (path.substring(0,7) !== 'http://' && path.substring(0,8) !== 'https://') {
// Not external, add base path.
path = basePath + path;
}
return path;
};
var createStyleTags = function (styles) {
var tags = '';
for (var i = 0; i < styles.length; i++) {
tags += '<link rel="stylesheet" href="' + createUrl(styles[i]) + '">';
}
return tags;
};
var createScriptTags = function (scripts) {
var tags = '';
for (var i = 0; i < scripts.length; i++) {
tags += '<script src="' + createUrl(scripts[i]) + '"></script>';
}
return tags;
};
return createStyleTags(H5PIntegration.core.styles) +
createStyleTags(H5PIntegration.contents['cid-' + contentId].styles) +
createScriptTags(H5PIntegration.core.scripts) +
createScriptTags(H5PIntegration.contents['cid-' + contentId].scripts) +
'<script>H5PIntegration = window.top.H5PIntegration; H5P.jQuery(document).ready(function () { H5P.init(); });</script>';
};
H5P.communicator = (function () {
/**
* @class
@ -450,7 +497,7 @@ H5P.getPath = function (path, contentId) {
}
if (contentId !== undefined) {
prefix = H5P.url + '/content/' + contentId;
prefix = H5PIntegration.url + '/content/' + contentId;
}
else if (window.H5PEditor !== undefined) {
prefix = H5PEditor.filesPath;
@ -460,7 +507,8 @@ H5P.getPath = function (path, contentId) {
}
if (!hasProtocol(prefix)) {
prefix = window.parent.location.protocol + "//" + window.parent.location.host + prefix;
// Use absolute urls
prefix = window.location.protocol + "//" + window.location.host + prefix;
}
return prefix + '/' + path;
@ -571,15 +619,15 @@ H5P.t = function (key, vars, ns) {
ns = 'H5P';
}
if (H5P.l10n[ns] === undefined) {
if (H5PIntegration.l10n[ns] === undefined) {
return '[Missing translation namespace "' + ns + '"]';
}
if (H5P.l10n[ns][key] === undefined) {
if (H5PIntegration.l10n[ns][key] === undefined) {
return '[Missing translation "' + key + '" in "' + ns + '"]';
}
var translation = H5P.l10n[ns][key];
var translation = H5PIntegration.l10n[ns][key];
if (vars !== undefined) {
// Replace placeholder with variables.
@ -717,18 +765,24 @@ H5P.findCopyrights = function (info, parameters, contentId) {
* @returns {undefined}
*/
H5P.openEmbedDialog = function ($element, embedCode, resizeCode, size) {
var fullEmbedCode = embedCode + resizeCode;
var dialog = new H5P.Dialog('embed', H5P.t('embed'), '<textarea class="h5p-embed-code-container" autocorrect="off" autocapitalize="off" spellcheck="false"></textarea>' + H5P.t('size') + ': <input type="text" value="' + size.width + '" class="h5p-embed-size"/> × <input type="text" value="' + size.height + '" class="h5p-embed-size"/> px<div role="button" tabindex="0" class="h5p-expander">' + H5P.t('showAdvanced') + '</div><div class="h5p-expander-content"><p>' + H5P.t('advancedHelp') + '</p><textarea class="h5p-embed-code-container" autocorrect="off" autocapitalize="off" spellcheck="false">' + resizeCode + '</textarea></div>', $element);
// Selecting embed code when dialog is opened
H5P.jQuery(dialog).on('dialog-opened', function (event, $dialog) {
var $inner = $dialog.find('.h5p-inner');
var $scroll = $inner.find('.h5p-scroll-content');
var diff = $scroll.outerHeight() - $scroll.innerHeight();
var positionInner = function () {
$inner.css('height', '');
var h = $inner.height();
if (Math.floor($dialog.height()) === h) {
$inner.css('height', '100%');
var height = $inner.height();
if ($scroll[0].scrollHeight + diff > height) {
$inner.css('height', ''); // 100%
}
$inner.css('marginTop', '-' + (h / 2) + 'px');
else {
$inner.css('height', 'auto');
height = $inner.height();
}
$inner.css('marginTop', '-' + (height / 2) + 'px');
};
// Handle changing of width/height
@ -742,31 +796,24 @@ H5P.openEmbedDialog = function ($element, embedCode, resizeCode, size) {
return Math.ceil(num);
};
var updateEmbed = function () {
$dialog.find('.h5p-embed-code-container:first').val(embedCode.replace(':w', getNum($w, size.width)).replace(':h', getNum($h, size.height)));
$dialog.find('.h5p-embed-code-container:first').val(fullEmbedCode.replace(':w', getNum($w, size.width)).replace(':h', getNum($h, size.height)));
};
var w = size.width;
$w.change(function () {
// Keep aspect ratio when changing width
var newW = getNum($w, size.width);
$h.val(Math.ceil(newW * (getNum($h, size.height) / w)));
w = newW;
updateEmbed();
});
$w.change(updateEmbed);
$h.change(updateEmbed);
updateEmbed();
// Select text and expand textareas
$dialog.find('.h5p-embed-code-container').focus(function () {
H5P.jQuery(this).select().css('height', this.scrollHeight + 'px');
positionInner();
}).blur(function () {
H5P.jQuery(this).css('height', '');
positionInner();
}).select();
$dialog.find('.h5p-embed-code-container').each(function(index, value) {
H5P.jQuery(this).css('height', this.scrollHeight + 'px').focus(function() {
H5P.jQuery(this).select();
});
});
$dialog.find('.h5p-embed-code-container').eq(0).select();
positionInner();
// Expand advanced embed
$dialog.find('.h5p-expander').click(function () {
var expand = function () {
var $expander = H5P.jQuery(this);
var $content = $expander.next();
if ($content.is(':visible')) {
@ -777,7 +824,15 @@ H5P.openEmbedDialog = function ($element, embedCode, resizeCode, size) {
$expander.addClass('h5p-open').text(H5P.t('hideAdvanced'));
$content.show();
}
$dialog.find('.h5p-embed-code-container').each(function(index, value) {
H5P.jQuery(this).css('height', this.scrollHeight + 'px');
});
positionInner();
};
$dialog.find('.h5p-expander').click(expand).keypress(function (event) {
if (event.keyCode === 32) {
expand.apply(this);
}
});
});
@ -1146,7 +1201,7 @@ H5P.libraryFromString = function (library) {
* @returns {String} The full path to the library.
*/
H5P.getLibraryPath = function (library) {
return H5P.url + '/libraries/' + library;
return H5PIntegration.url + '/libraries/' + library;
};
/**
@ -1194,8 +1249,8 @@ H5P.trim = function (value) {
* @returns {Boolean}
*/
H5P.jsLoaded = function (path) {
H5P.loadedJs = H5P.loadedJs || [];
return H5P.jQuery.inArray(path, H5P.loadedJs) !== -1;
H5PIntegration.loadedJs = H5PIntegration.loadedJs || [];
return H5P.jQuery.inArray(path, H5PIntegration.loadedJs) !== -1;
};
/**
@ -1205,8 +1260,8 @@ H5P.jsLoaded = function (path) {
* @returns {Boolean}
*/
H5P.cssLoaded = function (path) {
H5P.loadedCss = H5P.loadedCss || [];
return H5P.jQuery.inArray(path, H5P.loadedCss) !== -1;
H5PIntegration.loadedCss = H5PIntegration.loadedCss || [];
return H5P.jQuery.inArray(path, H5PIntegration.loadedCss) !== -1;
};
/**
@ -1245,7 +1300,7 @@ H5P.shuffleArray = function (array) {
* @param {Number} time optional reported time usage
*/
H5P.setFinished = function (contentId, score, maxScore, time) {
if (H5P.postUserStatistics === true) {
if (H5PIntegration.postUserStatistics === true) {
/**
* Return unix timestamp for the given JS Date.
*
@ -1258,7 +1313,7 @@ H5P.setFinished = function (contentId, score, maxScore, time) {
// Post the results
// TODO: Should we use a variable with the complete path?
H5P.jQuery.post(H5P.ajaxPath + 'setFinished', {
H5P.jQuery.post(H5PIntegration.ajaxPath + 'setFinished', {
contentId: contentId,
score: score,
maxScore: maxScore,

17
styles/h5p.css
View File

File diff suppressed because one or more lines are too long