start embedding the podlove web player

This commit is contained in:
Astro 2016-01-12 23:27:29 +01:00
parent d9c45eae39
commit 0e20d7cf7a
12 changed files with 96 additions and 251 deletions

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,4 @@
/**
* @preserve HTML5 Shiv 3.7.3 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed
*/
!function(a,b){function c(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function d(){var a=t.elements;return"string"==typeof a?a.split(" "):a}function e(a,b){var c=t.elements;"string"!=typeof c&&(c=c.join(" ")),"string"!=typeof a&&(a=a.join(" ")),t.elements=c+" "+a,j(b)}function f(a){var b=s[a[q]];return b||(b={},r++,a[q]=r,s[r]=b),b}function g(a,c,d){if(c||(c=b),l)return c.createElement(a);d||(d=f(c));var e;return e=d.cache[a]?d.cache[a].cloneNode():p.test(a)?(d.cache[a]=d.createElem(a)).cloneNode():d.createElem(a),!e.canHaveChildren||o.test(a)||e.tagUrn?e:d.frag.appendChild(e)}function h(a,c){if(a||(a=b),l)return a.createDocumentFragment();c=c||f(a);for(var e=c.frag.cloneNode(),g=0,h=d(),i=h.length;i>g;g++)e.createElement(h[g]);return e}function i(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return t.shivMethods?g(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+d().join().replace(/[\w\-:]+/g,function(a){return b.createElem(a),b.frag.createElement(a),'c("'+a+'")'})+");return n}")(t,b.frag)}function j(a){a||(a=b);var d=f(a);return!t.shivCSS||k||d.hasCSS||(d.hasCSS=!!c(a,"article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}")),l||i(a,d),a}var k,l,m="3.7.3",n=a.html5||{},o=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,p=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,q="_html5shiv",r=0,s={};!function(){try{var a=b.createElement("a");a.innerHTML="<xyz></xyz>",k="hidden"in a,l=1==a.childNodes.length||function(){b.createElement("a");var a=b.createDocumentFragment();return"undefined"==typeof a.cloneNode||"undefined"==typeof a.createDocumentFragment||"undefined"==typeof a.createElement}()}catch(c){k=!0,l=!0}}();var t={elements:n.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output picture progress section summary template time video",version:m,shivCSS:n.shivCSS!==!1,supportsUnknownElements:l,shivMethods:n.shivMethods!==!1,type:"default",shivDocument:j,createElement:g,createDocumentFragment:h,addElements:e};a.html5=t,j(b),"object"==typeof module&&module.exports&&(module.exports=t)}("undefined"!=typeof window?window:this,document);

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,167 +0,0 @@
/// jquery.dataset v0.1.0 -- HTML5 dataset jQuery plugin
/// http://orangesoda.net/jquery.dataset.html
/// Copyright (c) 2009, Ben Weaver. All rights reserved.
/// This software is issued "as is" under a BSD license
/// <http://orangesoda.net/license.html>. All warrenties disclaimed.
/// The HTML5 specification allows elements to have custom data
/// attributes that are prefixed with `data-'. They may be
/// conveniently accessed through an element's `dataset' property.
/// This plugin provides similar functionality.
///
/// The methods in the plugin are designed to be similar to the
/// built-in `attr' and `data' methods. All names are without the
/// `data-' prefix.
//
/// These methods are defined:
///
/// dataset()
/// Return an object with all custom attribute (name, value) items.
///
/// dataset(name)
/// Return the value of the attribute `data-NAME'.
///
/// dataset(name, value)
/// Set the value of attribtue `data-NAME' to VALUE.
///
/// dataset({...})
/// Set many custom attributes at once.
///
/// removeDataset(name)
/// Remove the attribute `data-NAME'.
///
/// removeDataset([n1, n2, ...])
/// Remove the attributes `data-N1', `data-N2', ...
(function($) {
var PREFIX = 'data-',
PATTERN = /^data\-(.*)$/;
function dataset(name, value) {
if (value !== undefined) {
// dataset(name, value): set the NAME attribute to VALUE.
return this.attr(PREFIX + name, value);
}
switch (typeof name) {
case 'string':
// dataset(name): get the value of the NAME attribute.
return this.attr(PREFIX + name);
case 'object':
// dataset(items): set the values of all (name, value) items.
return set_items.call(this, name);
case 'undefined':
// dataset(): return a mapping of (name, value) items for the
// first element.
return get_items.call(this);
default:
throw 'dataset: invalid argument ' + name;
}
}
function get_items() {
return this.foldAttr(function(index, attr, result) {
var match = PATTERN.exec(this.name);
if (match) result[match[1]] = this.value;
});
}
function set_items(items) {
for (var key in items) {
this.attr(PREFIX + key, items[key]);
}
return this;
}
function remove(name) {
if (typeof name == 'string') {
// Remove a single attribute;
return this.removeAttr(PREFIX + name);
}
return remove_names(name);
}
function remove_names(obj) {
var idx, length = obj && obj.length;
// For any object, remove attributes named by the keys.
if (length === undefined) {
for (idx in obj) {
this.removeAttr(PREFIX + idx);
}
}
// For an array, remove attributes named by the values.
else {
for (idx = 0; idx < length; idx++) {
this.removeAttr(PREFIX + obj[idx]);
}
}
return this;
}
$.fn.dataset = dataset;
$.fn.removeDataset = remove_names;
})(jQuery);
(function($) {
function each_attr(proc) {
if (this.length > 0) {
$.each(this[0].attributes, proc);
}
return this;
}
function fold_attr(proc, acc) {
return fold((this.length > 0) && this[0].attributes, proc, acc);
}
/*
* A left-fold operator. The behavior is the same as $.each(),
* but the callback is called with the accumulator as the third
* argument. The default accumulator is an empty object.
*/
function fold(object, proc, acc) {
var length = object && object.length;
// The default accumulator is an empty object.
if (acc === undefined) acc = {};
// Returning an empty accumulator when OBJECT is "false"
// makes FOLD more composable.
if (!object) return acc;
// Check to see if OBJECT is an array.
if (length !== undefined) {
for (var i = 0, value = object[i];
(i < length) && (proc.call(value, i, value, acc) !== false);
value = object[++i])
{ }
}
// Object is a map of (name, value) items.
else {
for (var name in object) {
if (proc.call(object[name], name, object[name], acc) === false) break;
}
}
return acc;
}
function fold_jquery(proc, acc) {
if (acc === undefined) acc = [];
return fold(this, proc, acc);
}
$.fn.eachAttr = each_attr;
$.fn.foldAttr = fold_attr;
$.fn.fold = fold_jquery;
$.fold = fold;
})(jQuery);

View File

@ -31,41 +31,6 @@ function arrayForEach(array, iter) {
}
}
function addButton(container, res, chapters) {
var button = $('<a class="play" title="Abspielen"><span class="postercaption">▶ Play</span></a>');
if (res.poster) {
var img = $('<img class="poster"/>');
img.attr('src', res.poster);
if (res.preview) {
button.mouseover(function() {
img.attr('src', res.preview);
});
button.mouseout(function() {
img.attr('src', res.poster);
});
}
button.append(img);
} else {
/* No poster */
button.text('▶ Play');
button.addClass('no-poster');
}
button.click(function() {
button.remove();
addPlayer(container, res, chapters);
var section = container.parents().
filter(function() {
return $(this).hasClass('video-resource');
})[0];
if (section)
$(section).addClass("playing");
});
container.append(button);
}
function parseTime(time) {
var parts = time.split(":"), part;
var r = 0;
@ -178,13 +143,15 @@ $(document).ready(function() {
try {
/* Iterate over all resources in HTML output */
$('.resource').each(function() {
var els = [this];
var resource = { href: $(this).find('a').attr('href'),
type: $(this).find('a').attr('type') };
var poster = $(this).dataset('poster');
var preview = $(this).dataset('preview');
var poster = $(this).data('poster');
var preview = $(this).data('preview');
/* Get all associated alternatives */
var alternativeEls = $(this).nextUntil('.resource');
els = els.concat(alternativeEls.toArray());
var alternatives = alternativeEls.find('a').
map(function() {
return { href: $(this).attr('href'),
@ -202,9 +169,32 @@ $(document).ready(function() {
if (arraySome(arrayMap(res, function(r) {
return r.type;
}), canPlay)) {
var liEl = $('<li class="play-resource"></li>');
var liEl = $('<li></li>');
$(this).before(liEl);
var player = addButton(liEl, res, $(this).find('chapters'));
console.log('h4', $(this).parents('h4'));
var mediaElName = $(this).find('.video-resource').length > 0 ? 'video' : 'audio';
var mediaEl = $("<" + mediaElName + " controls></" + mediaElName + ">");
res.forEach(function(r) {
var sourceEl = $("<source>");
sourceEl.attr('src', r.href);
sourceEl.attr('type', r.type);
mediaEl.append(sourceEl);
});
liEl.append(mediaEl);
var player = mediaEl.podlovewebplayer({
features: ["current", "progress", "duration", "tracks", "fullscreen", "volume"],
show: {
}
// , res, $(this).find('chapters'));
});
console.log("player", player);
// TODO: FIXME for .video-resource
console.log("els", els);
$(els).remove();
}
});
} catch (x) {
@ -244,19 +234,3 @@ function canFallback(type) {
return type === 'audio/mpeg' ||
type === 'video/x-flv';
}
function loadFlowplayer(cb) {
if (window.flowplayer)
cb();
else {
var playerScript = $('<script type="text/javascript" src="/script/flowplayer-3.2.4.min.js"></script>');
$(document).append(playerScript);
/* Cannot use load event because it won't work if when cached */
var interval = window.setInterval(function() {
if (window.flowplayer) {
window.clearInterval(interval);
cb();
}
}, 100);
}
}

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,47 @@
progress[role] {
display: inline-block;
position: relative;
width: 10em;
height: 1em;
vertical-align: -.2em;
background-image: url('data:image/gif;base64,R0lGODlhIAAQAIAAAP///////yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJBwABACwAAAAAIAAQAAACLISPF8vtkWJ8lMlrasVXb554FBiKDomYJ5qpFgu4LysvcFzfNQTvet4D0hgFACH5BAkHAAEALAAAAAAgABAAAAIshH+hyx0Io3F0yTsrxVdvHnkOGIoMCZknmqgWC7gvKytwXN/1A+963gPSKAUAIfkECQcAAQAsAAAAACAAEAAAAi2EHanLcQ9hmyraR+ndee7bNZ8VMmNULqeUJivWOi8Sz3RrA7E77/LrswV7oQIAIfkECQcAAQAsAAAAACAAEAAAAixEjqkB7Q/bmijaR+ndee7bLZ8VKmNUJieUVqvTHi8cz1Jtx0yOz7pt6L10BQAh+QQJBwABACwAAAAAIAAQAAACLIyPB8vtkGJ8lMlrasVXb554FBiKDomYJ5qpFhu4LysvcFzfNQTvet4D0hgFACH5BAkHAAEALAAAAAAgABAAAAIsjH+gyw0Io3F0yTsrxVdvHnkOGIoMCZknmqgWG7gvKytwXN/1A+963gPSKAUAIfkECQcAAQAsAAAAACAAEAAAAi2MDanLcA9hmyraR+ndee7bNZ8VMmNULqeUJivWOi8Sz3RrB7E77/LrswV7oQIAIfkEAQcAAQAsAAAAACAAEAAAAiwMjqkQ7Q/bmijaR+ndee7bLZ8VKmNUJieUVqvTHi8cz1Jtx0yOz7pt6L10BQA7');
-moz-box-sizing: border-box;
box-sizing: border-box;
}
progress[role],
progress[aria-valuenow]:before {
background-color: #5af;
}
progress[role],
progress[role]:after {
background-repeat:repeat-x;
background-position: 0 0;
-moz-background-size: auto 100%;
-webkit-background-size: auto 100%;
background-size: auto 100%;
}
/* Determinate only overrides */
progress[aria-valuenow] {
background: #eee;
}
progress[aria-valuenow]:before {
content: "";
display: block;
height: 100%;
}
/* Overlay */
progress[role]:after {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAQBAMAAAAlsQiEAAAABGdBTUEAALGPC/xhBQAAAC1QTFRF////////gYGA+/v7////3NzcQUFCkZGQWFlZAAAAAAAA////WFhY////r6+w5vktvgAAAA90Uk5TZB4sW3ZODgMEJgBVHDY+cmAeZAAAACZJREFUeNpjmMBQwHCBAQQMGAIYHjAoMBxgSGBoYFjAIMCwgcEBAGgwBpG64ZoMAAAAAElFTkSuQmCC');
}

File diff suppressed because one or more lines are too long

View File

@ -12,6 +12,8 @@
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="{$baseurl}news-rss.xml" />
<link rel="alternate" type="application/atom+xml" title="Atom 1.0" href="{$baseurl}news-atom.xml" />
<link rel="stylesheet" title="Default" type="text/css" href="{$baseurl}style/default.css" />
<link href="{$baseurl}style/pwp-creamy.min.css" rel="stylesheet" media="screen" type="text/css" />
<link href="{$baseurl}style/vendor/progress-polyfill.css" rel="stylesheet" media="screen" type="text/css" />
<link rel="space-api" title="Hackerspace API Endpoint" type="application/json"
href="http://www.hq.c3d2.de/spaceapi.json"/>
</xsl:template>
@ -49,17 +51,20 @@
</xsl:call-template>
</xsl:if>
<xsl:call-template name="make-script-tag">
<xsl:with-param name="name" select="'jquery-1.8.3.min'"/>
<xsl:with-param name="name" select="'jquery-2.1.4.min'"/>
</xsl:call-template>
<xsl:call-template name="make-script-tag">
<xsl:with-param name="name" select="'jquery.dataset'"/>
<xsl:with-param name="name" select="'html5shiv.min'"/>
</xsl:call-template>
<xsl:call-template name="make-script-tag">
<xsl:with-param name="name" select="'pentamedia-comments'"/>
<xsl:with-param name="name" select="'podlove-web-player.min'"/>
</xsl:call-template>
<xsl:call-template name="make-script-tag">
<xsl:with-param name="name" select="'play-resources'"/>
</xsl:call-template>
<xsl:call-template name="make-script-tag">
<xsl:with-param name="name" select="'pentamedia-comments'"/>
</xsl:call-template>
<xsl:call-template name="make-script-tag">
<xsl:with-param name="name" select="'bitlove-enclosures'"/>
</xsl:call-template>