From 00990497857e5ec27405e2b795310fa0dc925545 Mon Sep 17 00:00:00 2001
From: Florian Larysch
Date: Tue, 3 Jan 2017 01:43:04 +0100
Subject: relive: add scrubbing thumbnail support

When the Relive manifest contains preview thumbnails for scrubbing,
display them to the user.
---
 assets/js/lustiges-script.js            | 15 +++++++++++++++
 template/assemblies/player/relive.phtml |  6 ++++++
 template/page.phtml                     |  1 +
 3 files changed, 22 insertions(+)

diff --git a/assets/js/lustiges-script.js b/assets/js/lustiges-script.js
index 81db426..e949c6e 100644
--- a/assets/js/lustiges-script.js
+++ b/assets/js/lustiges-script.js
@@ -23,10 +23,25 @@ $(function() {
 	if($relivePlayer.length > 0) {
 		var player = new Clappr.Player({
 			baseUrl: 'assets/clapprio/',
+			plugins: {
+				core: [ClapprThumbnailsPlugin]
+			},
+
 			source: $relivePlayer.data('m3u8'),
 			height: $relivePlayer.data('height'),
 			width: $relivePlayer.data('width'),
 			autoPlay: true,
+			scrubThumbnails: {
+				backdropHeight: 64,
+				spotlightHeight: 84,
+				thumbs: ClapprThumbnailsPlugin.buildSpriteConfig(
+					$relivePlayer.data("sprites"),
+					$relivePlayer.data("sprites-n"),
+					160, 90,
+					$relivePlayer.data("sprites-cols"),
+					$relivePlayer.data("sprites-interval")
+				),
+			},
 			events: {
 				onReady: function() {
 					var playback = player.getPlugin('hls');
diff --git a/template/assemblies/player/relive.phtml b/template/assemblies/player/relive.phtml
index 93b6c95..361e1bb 100644
--- a/template/assemblies/player/relive.phtml
+++ b/template/assemblies/player/relive.phtml
@@ -4,5 +4,11 @@
 	data-width="<?=h($width)?>"
 	data-height="<?=h($height)?>"
 	data-m3u8="<?=h(forceproto($talk['playlist']))?>"
+	<? if(array_key_exists('sprites', $talk)): ?>
+	data-sprites="<?= h($talk['sprites']['url']) ?>"
+	data-sprites-n="<?= h($talk['sprites']['n']) ?>"
+	data-sprites-cols="<?= h($talk['sprites']['cols']) ?>"
+	data-sprites-interval="<?= h($talk['sprites']['interval']) ?>"
+	<? endif ?>
 >
 </div>
diff --git a/template/page.phtml b/template/page.phtml
index 508b271..016debf 100644
--- a/template/page.phtml
+++ b/template/page.phtml
@@ -56,6 +56,7 @@
 
 		<script type="text/javascript" src="<?=h($assets)?>mejs/mediaelement-and-player.min.js"></script>
 		<script type="text/javascript" src="<?=h($assets)?>clapprio/clappr.min.js"></script>
+		<script type="text/javascript" src="<?=h($assets)?>clapprio/clappr-thumbnails-plugin.js"></script>
 		<script type="text/javascript" src="<?=h($assets)?>js/lustiges-script.js"></script>
 
 		<? if(isset($subtitles) && $subtitles->isEnabled()): ?>
-- 
cgit v1.2.3