Category: Code

Client didn’t pay? Make their website go away.

Something I need to test still, but adding it here for later use, maybe. If you find a bug, please let me know! And I’m halfways sure that the author shown in this link does  it less complicated, but it’s fun to learn and play around with code. https://github.com/kleampa/not-paid

GOAL: Let the website fade away, one step per day.

Define the initial opacity as 1 (fully opaque).

<style>
    body {
        opacity: 1; /* Initial opacity */
        transition: opacity 1s ease; /* Smooth transition */
    }
</style>

Modify the function to decrement the opacity by a step (e.g., 0.1).

<script>
    function decreaseOpacity() {
        let body = document.body;
        let currentOpacity = parseFloat(window.getComputedStyle(body).opacity);
        if (currentOpacity > 0) {
            body.style.opacity = (currentOpacity - 0.1).toFixed(1);
        }
    }
</script>

Adjust the local storage logic accordingly.

<script>
    document.addEventListener("DOMContentLoaded", function() {
        let storedOpacity = localStorage.getItem('bodyOpacity');
        if (storedOpacity) {
            document.body.style.opacity = storedOpacity;
        } else {
            localStorage.setItem('bodyOpacity', '1');
        }
    });

    function decreaseOpacity() {
        let body = document.body;
        let currentOpacity = parseFloat(window.getComputedStyle(body).opacity);
        if (currentOpacity > 0) {
            let newOpacity = (currentOpacity - 0.1).toFixed(1);
            body.style.opacity = newOpacity;
            localStorage.setItem('bodyOpacity', newOpacity);
        }
    }
</script>

Modify the date-checking logic to call the decreaseOpacity function.

<script>
    document.addEventListener("DOMContentLoaded", function() {
        let storedOpacity = localStorage.getItem('bodyOpacity');
        let lastIncrementDate = localStorage.getItem('lastIncrementDate');
        let today = new Date().toDateString();

        if (storedOpacity) {
            document.body.style.opacity = storedOpacity;
        } else {
            localStorage.setItem('bodyOpacity', '1');
            localStorage.setItem('lastIncrementDate', today);
        }

        if (lastIncrementDate !== today) {
            decreaseOpacity();
            localStorage.setItem('lastIncrementDate', today);
        }
    });

    function decreaseOpacity() {
        let body = document.body;
        let currentOpacity = parseFloat(window.getComputedStyle(body).opacity);
        if (currentOpacity > 0) {
            let newOpacity = (currentOpacity - 0.1).toFixed(1);
            body.style.opacity = newOpacity;
            localStorage.setItem('bodyOpacity', newOpacity);
        }
    }
</script>

Here is how the complete HTML file might look for the fading away effect:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Decrease Opacity</title>
    <style>
        body {
            opacity: 1; /* Initial opacity */
            transition: opacity 1s ease; /* Smooth transition */
        }
    </style>
</head>
<body>
    <h1>Hello, World!</h1>

    <script>
        document.addEventListener("DOMContentLoaded", function() {
            let storedOpacity = localStorage.getItem('bodyOpacity');
            let lastIncrementDate = localStorage.getItem('lastIncrementDate');
            let today = new Date().toDateString();

            if (storedOpacity) {
                document.body.style.opacity = storedOpacity;
            } else {
                localStorage.setItem('bodyOpacity', '1');
                localStorage.setItem('lastIncrementDate', today);
            }

            if (lastIncrementDate !== today) {
                decreaseOpacity();
                localStorage.setItem('lastIncrementDate', today);
            }
        });

        function decreaseOpacity() {
            let body = document.body;
            let currentOpacity = parseFloat(window.getComputedStyle(body).opacity);
            if (currentOpacity > 0) {
                let newOpacity = (currentOpacity - 0.1).toFixed(1);
                body.style.opacity = newOpacity;
                localStorage.setItem('bodyOpacity', newOpacity);
            }
        }
    </script>
</body>
</html>

So with this setup, the opacity of the body tag will start at 1 (fully opaque) and decrease by 0.1 each day until it reaches 0 (fully transparent). The localStorage ensures that the opacity persists across browser sessions and days.

Have you tried it? Let me know!

Loading

Side-project: I’ll just build my own dashcam.

While I am trying to repair the Koonlung K1S Dashcam, I am going to build my own dashcam. Sure, I can buy one and pay a ridiculous amount of money for a half-way decent one, but I paid € 230 for the K1S which I assumed did not turn out to be trash.

And so, I am going to build one myself and learn from it in the process. The project was first going to be a pwnagotchi, but I think building a dashcam is more useful. For now @_@

While I am waiting for the auxiliary battery, I will have to start with soldering the 40-pin header onto the board. And if you wonder why I didn;t buy one with a header soldered on it already, my answer is: “I had no idea that this was an option!!1 D: ”

A box of parts that will become a dashcam at some point. There is a raspberri Pi Zero board, a E-Inkt screen, a clock timer, a camera and some wiring
The box of stuff!

Loading

Function to change ownership of the www folder

Just another snippet of code that can be implemented somewhere:

set-perms.sh
#!/bin/bash

# Function to change ownership of the www folder
change_ownership() {
    sudo chown -R "$1":www-data /var/www
    echo "Ownership of the www folder has been set to $1:www-data."
}

# Loop until a valid username is provided
while true; do
    # Prompt the user to enter the desired username
    read -p "Enter the username for permissions: " username

    # Check if the username provided exists
    if id "$username" &>/dev/null; then
        change_ownership "$username"
        break  # Exit the loop if a valid username is provided
    else
        echo "Error: User $username does not exist."
    fi
done

echo "done!"

To make the script executable:

sudo chmod +x set-perms.sh

and run it with

sudo ./set-perms.sh

Loading

Script Dump: Live Epoch Time QR Code

This is a script that I needed to investigate a certain security method. Not needed any more, so here ya go!

<!DOCTYPE html>
<html>
<head>
    <title>Live Epoch Time QR Code</title>
    <style>
        .qr-code {
            display: inline-block;
            width: 128px;
            height: 128px;
            border: 1px solid #000;
        }
    </style>
</head>
<body>
    <h1>Live Epoch Time QR Code</h1>
    <div id="epochTime"></div>
    <div id="qrcode" class="qr-code"></div>

    <script>
        // Function to update the epoch time and QR code
        function updateTimeAndQRCode() {
            var epochTime = Math.floor(Date.now() / 1000); // Current epoch time in seconds
            document.getElementById('epochTime').innerHTML = 'Epoch Time: ' + epochTime;

            // Generate QR code using CSS
            var qrCodeElement = document.getElementById("qrcode");
            qrCodeElement.style.backgroundImage = "url('https://api.qrserver.com/v1/create-qr-code/?data=" + epochTime + "&size=128x128')";
        }

        // Update the time and QR code every second
        setInterval(updateTimeAndQRCode, 1000);

        // Initial call to display time and QR code
        updateTimeAndQRCode();
    </script>
</body>
</html>

 

Loading

Script Dump: Bogosort Musical Notes

I’m done playing with this so grab some notes in MP3 format and run the script. Do adapt it to your own likings and have fun!

<html>
<head>
    <title>Music Bogosort</title>
    <script>
        function bogosortAndPlay() {
            var notes = ["C", "D", "E", "F", "G", "A", "B"];
            var sortedNotes = [];
            while (sortedNotes.length < 6) {
                var randomIndex = Math.floor(Math.random() * notes.length);
                var randomNote = notes[randomIndex];
                if (!sortedNotes.includes(randomNote)) {
                    sortedNotes.push(randomNote);
                }
            }
            document.getElementById("unsorted_notes").innerHTML = "Unsorted notes: " + sortedNotes.join(", ");

            // Bogosort (this is extremely inefficient)
            while (!isSorted(sortedNotes)) {
                shuffleArray(sortedNotes);
            }

            document.getElementById("sorted_notes").innerHTML = "Sorted notes: " + sortedNotes.join(", ");
            playNotes(sortedNotes);
        }

        function isSorted(array) {
            for (var i = 0; i < array.length - 1; i++) {
                if (array[i] > array[i + 1]) {
                    return false;
                }
            }
            return true;
        }

        function shuffleArray(array) {
            for (var i = array.length - 1; i > 0; i--) {
                var j = Math.floor(Math.random() * (i + 1));
                var temp = array[i];
                array[i] = array[j];
                array[j] = temp;
            }
        }

        function playNotes(notes) {
            var index = 0;
            function playNextNote() {
                if (index < notes.length) {
                    var audio = new Audio("notes/" + notes[index] + ".mp3");
                    audio.play();
                    index++;
                    // Delay between notes (adjust as needed)
                    setTimeout(playNextNote, 1000); // Delay of 1 second between notes
                }
            }
            playNextNote();
        }
    </script>
</head>
<body>
    <h1>Music Bogosort</h1>
    <button onclick="bogosortAndPlay()">Sort and Play</button>
    <p id="unsorted_notes"></p>
    <p id="sorted_notes"></p>
</body>
</html>

 

Loading