digi-webkit-examples: add recipe for video examples

This recipe installs some videos that can be used to test the WebKit's hardware
acceleration during video decoding. Modify the landing page to be able to
access these videos.

https://jira.digi.com/browse/DEL-7314
https://jira.digi.com/browse/DEL-7339

Signed-off-by: Gabriel Valcazar <gabriel.valcazar@digi.com>

meta-digi-dey/dynamic-layers/webkit/recipes-browser/digi-webkit-examples/digi-webkit-examples.bb

@@ -16,10 +16,14 @@ require digi-webkit-examples.inc
 
 RDEPENDS_${PN} = " \
     cog \
+    video-examples \
     webglsamples \
     ${WEBSERVER_PACKAGE} \
 "
 
+VPU_NOTE = "This means that, if the video format is supported by the VPU, WebKit will use the VPU to decode the video."
+VPU_NOTE_ccimx8mn = "Since the ConnectCore 8M Nano doesn't have a VPU, WebKit will decode the videos using gstreamer software."
+
 # The package contains static webpages, no need to configure or compile
 do_configure[noexec] = "1"
 do_compile[noexec] = "1"
@@ -41,4 +45,20 @@ do_install() {
 	SAMPLE_LIST="${SAMPLE_LIST}\n"
 
 	sed -i s,##WEBGL_SAMPLE_LIST##,"${SAMPLE_LIST}",g ${D}/${WEBSERVER_ROOT}/index.html
+
+	# Add a note regarding the video decoding process, which depends on the
+	# platform.
+	sed -i s/##VPU_NOTE##/"${VPU_NOTE}"/g ${D}/${WEBSERVER_ROOT}/index.html
+
+	# Use the same method to dynamically generate the list of video
+	# examples.
+	SAMPLE_LIST=""
+	ENTRY='<li><p><a href="videos/_name_\">_name_</a></p></li>'
+	for sample in ${VIDEO_SAMPLES}; do
+		SAMPLE_LIST="${SAMPLE_LIST}\n$(echo ${ENTRY} | sed s/_name_/${sample}/g)"
+	done
+
+	SAMPLE_LIST="${SAMPLE_LIST}\n"
+
+	sed -i s,##VIDEO_SAMPLE_LIST##,"${SAMPLE_LIST}",g ${D}/${WEBSERVER_ROOT}/index.html
 }

meta-digi-dey/dynamic-layers/webkit/recipes-browser/digi-webkit-examples/digi-webkit-examples.inc

@@ -35,6 +35,12 @@ WEBGL_REQUIRED = " \
     ${WEBGL_SAMPLE_DEPS} \
 "
 
+# List of video samples
+VIDEO_SAMPLES = " \
+    big_buck_bunny.mov \
+    big_buck_bunny.webm \
+"
+
 # All packages involved in the webkit examples install their files in the
 # webserver directory
 FILES_${PN} = "/${WEBSERVER_ROOT}/*"

meta-digi-dey/dynamic-layers/webkit/recipes-browser/digi-webkit-examples/digi-webkit-examples/index.html

@@ -25,5 +25,14 @@ examples have been obtained from
 
 <ul>##WEBGL_SAMPLE_LIST##</ul>
 
+<h2>Video playback examples</h2>
+
+<p>WPE WebKit uses <strong>gstreamer</strong> for multimedia playback.
+##VPU_NOTE##</p>
+
+<p>You can test video playback with different formats using the links
+below:</p>
+
+<ul>##VIDEO_SAMPLE_LIST##</ul>
 </body>
 </html>

meta-digi-dey/dynamic-layers/webkit/recipes-browser/digi-webkit-examples/video-examples_0.1.bb

@@ -0,0 +1,28 @@
+# Copyright (C) 2020 Digi International.
+
+SUMMARY = "Short videos to demonstrate video playback on the WPE WebKit"
+DESCRIPTION = "This package contains fragments of the short film 'Big Buck Bunny', which are used to demonstrate how WebKit makes use of hardware acceleration for video decoding"
+HOMEPAGE = "https://peach.blender.org/"
+LICENSE = "CC-BY-3.0"
+LIC_FILES_CHKSUM = "file://${COMMON_LICENSE_DIR}/CC-BY-3.0;md5=dfa02b5755629022e267f10b9c0a2ab7"
+
+SRC_URI = "${DIGI_PKG_SRC}/${BPN}-${PV}.tar.gz"
+
+SRC_URI[md5sum] = "d22cc0fa20fde187455b27a799d2f9e6"
+SRC_URI[sha256sum] = "97389f33d98c52d4311117366f0aa8dc78d00f51a787697af349de4668ccdbf6"
+
+S = "${WORKDIR}/${PN}-${PV}"
+
+require digi-webkit-examples.inc
+
+# The package contains video files, no need to configure or compile
+do_configure[noexec] = "1"
+do_compile[noexec] = "1"
+
+do_install() {
+	install -d ${D}/${WEBSERVER_ROOT}/videos
+
+	for sample in ${VIDEO_SAMPLES}; do
+		install -m 644 ${S}/${sample} ${D}/${WEBSERVER_ROOT}/videos
+	done
+}