Using a DAKboard OS device, it is possible to include a video stored on the device to play on your DAKboard screen on the device by leveraging the web server installed on the device.  In this article, we will discuss how to accomplish this setup with single or multiple videos.  This is intended for advanced users and not all video file formats may be supported.  This feature is only available in DAKboard OS Legacy versions



Add Videos to DAKboard OS Device


We will need to transfer our video files to the DAKboard OS Raspberry Pi.  This can be done via the GUI of the DAKboard OS device by downloading them from an internet source or via a USB flash drive with a file manager, or via SCP command from another device with the SSH credentials.  If you have not changed or updated the SSH credentials you may contact DAKboard Support for them.


Video files will need to be placed in the following directory:
/var/www/html/


We would recommend creating a subfolder named Video if you are using multiple videos so that the files are not confused with other web server files in the directory.



Single Video Loops


Single videos can be posted in a Custom Screen in the Video URL block.  Add a new screen or edit an existing in the screens page, then click the green Add button and search for the video URL block:



Next, add your formatted URL to point to the DAKboard OS device (localhost) and to the subdirectory of /var/www/html and click SAVE CHANGES.  In the following case, the video file is named 3.mp4 and it resides in the /var/www/html/ top directory, so the URL is http://localhost/3.mp4.  If you created a Video subfolder, then the address would be http://localhost/Video/3.mp4 respectively:


Note: This video will only show on the DAKboard OS device with the video locally stored on it.  Preview functions on dakboard.com and other devices will not display the video.



Multiple Video Loops


Multiple video loops are possible at this time by using the widget block and HTML code, which will loop in order.  Start by adding a new screen or edit an existing in the screens page, then click the green Add button and search for the Widget block:


In the Widget Block, insert the following HTML, and edit the video sources shown in bold with the locations of the video files added to the DAKboard OS device into the /var/www/html/ directory discussed at the beginning of the article.  In the following example, the videos 3.mp4 and 5.mp4 are present in the directory, if you created a Video subfolder then the addresses would be http://localhost/Video/(filename).  Additional files can be added via comma-separated URLs in quotation marks:


=============================BEGIN===================================


<html>

<head>

    <title>Video Loop</title>

 

    <link rel="stylesheet" type="text/css" href="main.css" />

</head>

<body onload="onload();">

    <video id="idle_video" width="100%" height="100%" onended="onVideoEnded();"></video>

    <script>

        var video_list      = ["http://localhost/3.mp4",

                                "http://localhost/5.mp4",

                            ];

        var video_index     = 0;

        var video_player    = null;

 

        function onload(){

            console.log("body loaded");

            video_player        = document.getElementById("idle_video");

             video_player.setAttribute("src", video_list[video_index]);

            video_player.play();

        }

 

        function onVideoEnded(){

            console.log("video ended");

            if(video_index < video_list.length - 1){

                video_index++;

            }

            else{

                video_index = 0;

            }

             video_player.setAttribute("src", video_list[video_index]);

            video_player.play();

        }

    </script>

</body>



=============================END===================================


Note: This video will only show on the DAKboard OS device with the video locally stored on it.  Preview functions on dakboard.com and other devices will not display the video.



Having Trouble?

- Create a Support Ticket