[Feature Request] day forward and back buttons

[zunami]

Hello!

I have to go through each day one by one. it is very inefficient to enter each day individually.
It would be helpful if there was a back and forth button to jump through each individual day.

[kbekus]

Please please please if this is a possibility can we get this? It's really cumbersome moving back and forth a single day.

[Sauws]

Hi there, new user who is migrating from Google Timeline. I use location tracking for my mileage expenses. Usually once a month I go back in time and click through every day to see how much kilometers I have driven to expense them. I would concur with this feature request that clicking through individual dates would be much better with a '<' and a '>' around the current date.

[skotti71]

Additionally to the buttons "Yesterday", "Last 7 days" and "Last month", I would also like to have buttons for:

• "Today"
• "1 day Forward"
• "1 day Backward"

[burgerga]

TADA!

See below a TamperMonkey script that adds these buttons, I'm sure there are some edge cases I don't cover (e.g., I think this will also shift a multi-day window backward and forward), but it covers my needs.
Don't forget to change the IP address / URL in @match when you test it.

// ==UserScript==
// @name         Single date in dawarich
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Add buttons to manipulate date parameters in the URL to go back/forward a single day
// @author       Gerhard Burger
// @match        http://192.168.2.41:3000/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    //Format the date to a accepted local timestamp format, e.g. "2025-05-11 00:00:00 +0200"
    function toLocalISO8601(date = new Date()) {
        const tzOffset = -date.getTimezoneOffset();
        const sign = tzOffset >= 0 ? '+' : '-';
        const pad = (n) => String(Math.floor(Math.abs(n))).padStart(2, '0');
        const offsetH = pad(tzOffset / 60);
        const offsetM = pad(tzOffset % 60);

        const local = new Date(date.getTime() - (date.getTimezoneOffset() * 60000))
        .toISOString()
        .slice(0, -1)
        .replace(/\.\d+/, "")
        .replace('T', ' ');
        return `${local} ${sign}${offsetH}${offsetM}`;
    }

    //Make the buttons match style with the other buttons
    function wrapButton(button) {
        const outsideButtonContainer = document.createElement('div');
        outsideButtonContainer.classList.add(
            'w-auto'
        );
        const insideButtonContainer = document.createElement('div');
        insideButtonContainer.classList.add(
            "flex",
            "flex-col",
            "space-y-2"
        );
        insideButtonContainer.appendChild(button);
        outsideButtonContainer.appendChild(insideButtonContainer);
        return outsideButtonContainer
    }

    // Example usage in your buttons
    const params = new URLSearchParams(window.location.search);
    const startParam = 'start_at'; // Replace with the actual parameter name
    const endParam = 'end_at'; // Replace with the actual parameter name

    // Button for previous day
    const prevDayButton = document.createElement('button');
    prevDayButton.textContent = '<';
    prevDayButton.className = 'btn btn-primary hover:btn-info';
    prevDayButton.onclick = () => {
        if (params.has(startParam) && params.has(endParam)) {
            const startDate = new Date(params.get(startParam));
            const endDate = new Date(params.get(endParam));
            startDate.setDate(startDate.getDate() - 1);
            endDate.setDate(endDate.getDate() - 1);

            const url = new URL(window.location.href);
            url.searchParams.set(startParam, toLocalISO8601(startDate));
            url.searchParams.set(endParam, toLocalISO8601(endDate));
            window.location = url.toString();
        }
    };
    // Button for next day
    const nextDayButton = document.createElement('button');
    nextDayButton.textContent = '>';
    nextDayButton.className = 'btn btn-primary hover:btn-info';
    nextDayButton.onclick = () => {
        if (params.has(startParam) && params.has(endParam)) {
            const startDate = new Date(params.get(startParam));
            const endDate = new Date(params.get(endParam));
            startDate.setDate(startDate.getDate() + 1);
            endDate.setDate(endDate.getDate() + 1);

            const url = new URL(window.location.href);
            url.searchParams.set(startParam, toLocalISO8601(startDate));
            url.searchParams.set(endParam, toLocalISO8601(endDate));
            window.location = url.toString();
        }
    };

    // Find the current button row
    const formDiv = document.querySelector('form[action="/map"] > div');

    //Insert at the start
    formDiv.insertBefore(wrapButton(nextDayButton), formDiv.firstChild);
    formDiv.insertBefore(wrapButton(prevDayButton), formDiv.firstChild);
})();