• Browser
  • Mail
  • News
  • Community
  • About
Register Login
HomeBlogsForumThemesContributeSocial

Vivaldi

  • Browser
  • Mail
  • News
  • Community
  • About

Navigation

    • Home
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    1. Home
    2. Desktop
    3. Customizations & Extensions
    4. Modifications
    5. Any idea for placing my videofile on speeddial page background?

    Any idea for placing my videofile on speeddial page background?

    Modifications
    8
    26
    502
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • LonM
      L
      LonM Soprano Patron Moderator
      last edited by LonM

      @Kunsite

      You will need a javascript mod for this. Learn how to use these

      The following code will work:

      (function videobg(){
          "use strict";
      
          const VIDEOFILE = "http://localhost:8000/test.mp4"; /*path to video*/
      
          /**
           * 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="${VIDEOFILE}"
                      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);
      })();
      
      

      💻 Windows 10 64-bit Sopranos Builds • en-GB • 🗳 vote for features • 🕵️‍♀️ Code of Conduct • 🐞 Report bugs

      K
      Hadden89
      H
      2 Replies Last reply
      Reply Quote 6
      • LonM
        L
        LonM moved this topic from Vivaldi for Windows
      • K
        Kunsite @LonM
        last edited by Kunsite

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

        You will need a javascript mod for this. Learn how to use these

        The following code will work:

        I tried, but it did not work. May be it is not work with local file? Local path to video works in html, in js tried to put https direct link, it is not working also.
        In html video working (if I will spicify page in homepage settings).
        How can I did it in windows.html? With you js (putting source = js in window .html) is not working 😞

        LonM
        L
        1 Reply Last reply
        Reply Quote 0
        • Hadden89
          H
          Hadden89 @LonM
          last edited by Hadden89

          @LonM cool , would be perfect if titlebar/horizontal tabs animation would be opt-out, as it doesn't blend well with luminous videos, but I am aware these are part of the header 🙂

          a4fabcd8-ba04-42ce-866d-205e40c1767f-image.png

          (didn't manage to make it work with file:// ... so I used the simplest big buck sample on the net)

          https://www.sample-videos.com/video321/mp4/720/big_buck_bunny_720p_1mb.mp4

          Vivaldi Stable+Snap | Patience Is The Key To Get The Vivaldi Spree | Unsupported Extensions | Github | windows 11 | Manjaro KDE | Q4OS Trinity | Android 13

          LonM
          L
          1 Reply Last reply
          Reply Quote 0
          • sgunhouse
            S
            sgunhouse
            last edited by

            For the record, the majority of Opera's animated themes are in webm format. Beyond that, I can't help.

            K
            1 Reply Last reply
            Reply Quote 1
            • K
              Kunsite @sgunhouse
              last edited by

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

              For the record, the majority of Opera's animated themes are in webm format. Beyond that, I can't help.

              If Vivaldi can play webm - I can convert video to it and in any video format needed. Tell me, how I can make vivaldi play webm in background of speeddial?

              1 Reply Last reply Reply Quote 0
              • LonM
                L
                LonM Soprano Patron Moderator @Hadden89
                last edited by

                @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

                💻 Windows 10 64-bit Sopranos Builds • en-GB • 🗳 vote for features • 🕵️‍♀️ Code of Conduct • 🐞 Report bugs

                1 Reply Last reply Reply Quote 1
                • LonM
                  L
                  LonM Soprano Patron Moderator @Kunsite
                  last edited by

                  @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.

                  💻 Windows 10 64-bit Sopranos Builds • en-GB • 🗳 vote for features • 🕵️‍♀️ Code of Conduct • 🐞 Report bugs

                  K
                  1 Reply Last reply
                  Reply Quote 0
                  • K
                    Kunsite @LonM
                    last edited by

                    @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
                    L
                    tam710562
                    T
                    2 Replies Last reply
                    Reply Quote 2
                    • LonM
                      L
                      LonM Soprano Patron Moderator @Kunsite
                      last edited by

                      @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.

                      💻 Windows 10 64-bit Sopranos Builds • en-GB • 🗳 vote for features • 🕵️‍♀️ Code of Conduct • 🐞 Report bugs

                      1 Reply Last reply Reply Quote 1
                      • tam710562
                        T
                        tam710562 @Kunsite
                        last edited by

                        @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);
                        })();
                        
                        K
                        1 Reply Last reply
                        Reply Quote 6
                        • K
                          Kunsite @tam710562
                          last edited by 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.

                          1 Reply Last reply Reply Quote 0
                          Loading More Posts
                          • Oldest to Newest
                          • Newest to Oldest
                          • Most Votes
                          Reply
                          • Reply as topic
                          Log in to reply
                          • 1
                          • 2
                          • 2 / 2
                          • First post
                            Last post

                          Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.

                          Copyright © Vivaldi Technologies™ — All rights reserved. Privacy Policy | Code of conduct | Terms of use | Vivaldi Status