Any idea for placing my videofile on speeddial page background?

LonM

@Hadden89
I needed to put it on a localhost webserver.

I would suggest using that if possible rather than a web-accessible resource, because you never know if someone might maliciously swap it out for something unpleasant, or if the videofile disappears one day

LonM

@Kunsite If you can, try using a localhost webserver. If your machine has python installed you can start a very simple one using the command python -m http.server in the directory where your videofile is stored.

Kunsite

@LonM said in Any idea for placing my videofile on speeddial page background?:

@Kunsite If you can, try using a localhost webserver. If your machine has python installed you can start a very simple one using the command python -m http.server in the directory where your videofile is stored.

Thanks. But why vivaldi is not working with local file? Wokring only if I will up http server. Very sad, for only one feature I must hold http server :(((((

LonM

@Kunsite It is kind of annoying. I have the same problem loading some custom rss feeds stored on a file://. It should work regardless, but something is broken with how the browser accesses certain files.

tam710562

@Kunsite You can put the file in vivaldi's installation folder and you can use the host that vivaldi creates

Example
C:\Users\{User}\AppData\Local\Vivaldi\Application\7.4.3682.3\resources\vivaldi\sample.mp4
and the path will be
chrome-extension://mpognobbkildjkofajifpdfhcoklimli/sample.mp4

Note: Vivaldi will delete this folder every time it updates, so you must copy the file again every time you update to a new version.

Or you can change the code of @LonM like below to load local files

(async function videobg() {
  'use strict';

  const VIDEOFILE = 'D:/sample.mp4'; /*path to video*/
  const arrayBuffer = await vivaldi.mailPrivate.readFileToBuffer(VIDEOFILE);
  const blob = new Blob([arrayBuffer]);
  const videoUrl = URL.createObjectURL(blob);

  /**
   * Initialise the mod
   * Create the html and place it before the header div so that it appears "behind" the UI
   */
  function initMod() {
    const browser = document.getElementById('header');
    if (browser) {
      browser.insertAdjacentHTML('beforebegin', `<video
        src="${videoUrl}"
        autoplay loop muted disablepictureinpicture disableremoteplayback
        style="height: 100vh; width: 100vw; position: absolute; object-fit: fill;">
        </video>`)
    } else { setTimeout(initMod, 500); }
  }

  /* Start 500ms after the browser is opened */
  setTimeout(initMod, 500);
})();

Kunsite

@tam710562 said in Any idea for placing my videofile on speeddial page background?:

@Kunsite You can put the file in vivaldi's installation folder and you can use the host that vivaldi creates

Example
C:\Users{User}\AppData\Local\Vivaldi\Application\7.4.3682.3\resources\vivaldi\sample.mp4
and the path will be
chrome-extension://mpognobbkildjkofajifpdfhcoklimli/sample.mp4

Note: Vivaldi will delete this folder every time it updates, so you must copy the file again every time you update to a new version.

Or you can change the code of @LonM like below to load local files

(async function videobg() {
'use strict';

const VIDEOFILE = 'D:/sample.mp4'; /path to video/
const arrayBuffer = await vivaldi.mailPrivate.readFileToBuffer(VIDEOFILE);
const blob = new Blob([arrayBuffer]);
const videoUrl = URL.createObjectURL(blob);

/**

Initialise the mod

Create the html and place it before the header div so that it appears "behind" the UI
*/
function initMod() {
const browser = document.getElementById('header');
if (browser) {
browser.insertAdjacentHTML('beforebegin', <video src="${videoUrl}" autoplay loop muted disablepictureinpicture disableremoteplayback style="height: 100vh; width: 100vw; position: absolute; object-fit: fill;"> </video>)
} else { setTimeout(initMod, 500); }
}

/* Start 500ms after the browser is opened */
setTimeout(initMod, 500);
})();

I will write to myself for the future. But for now (it is very strange) I will not start any http server, but working first custom.js on this theme with string like

const VIDEOFILE = "http://localhost:8000/20240627_085425.mp4"; /*path to video*/

I do not know, how, but it is working! Thanks for another method also.