search

cheesecakeufo / komorebi

A beautiful and customizable wallpapers manager for Linux
GNU General Public License v3.0
3.35k stars 235 forks source link

Komorebi javascript Date issue #176

Open Oreoezi opened 5 years ago

Oreoezi commented 5 years ago

I wanted to make a macOS mojave like animated background which does work on a browser but won't work as well if I create a wallpaper with a webpage. If I change system time it won't update on the wallpaper.

<html>
    <body>
        <style>
            html,body{
                margin:0;
            }
            img{
                display:block;
                object-fit: cover;
                position: absolute;
            }
        </style>
        <img id="background">
        <script>
            var paper = document.getElementById("background");
            paper.style.width = window.innerWidth;
            paper.style.height = window.innerHeight;
            function bgcheck() {
                    var dat = new Date();
                    paper.src="mojave_dynamic/mojave_dynamic_" + (1+Math.floor(dat.getHours() * 16 / 24)) + ".jpeg";

            }
            bgcheck();
            setInterval(bgcheck, 1000); 
        </script>
</html>
Oreoezi commented 5 years ago

nvm I found a solution, for anyone wondering here it's a working version


    <body>
        <style>
            html,body{
                margin:0;
            }
            img{
                display:block;
                object-fit: cover;
                position: absolute;
            }
        </style>
        <img id="background">

        <script>
            var paper = document.getElementById("background");
            paper.style.width = window.innerWidth;
            paper.style.height = window.innerHeight;
            function bgcheck() {
                    var dat = new Date();
                    paper.src="mojave_dynamic/mojave_dynamic_" + (1+Math.floor(dat.getHours() * 16 / 24)) + ".jpeg";
                    setTimeout(bgcheck, 1000);

            }
            bgcheck();

        </script>
</html>```