Advanced Panels Mod (with Sessions Panel)

LonM

@stardepp use de

stardepp

@LonM Thanks for your quick help.

boroda74

@stardepp said in Advanced Panels Mod (with Sessions Panel):

I like this modification very much, but what do you specify here for the German language?

const LANGUAGE = 'en_gb'; // en_gb or ko

const LANGUAGE = 'de';

Or use my variant of this mod (you can change language in UI):
https://forum.vivaldi.net/topic/61132/autosave-sessions-and-sessions-panel-mods

puppyeyes

Hey, I'm not sure why this mod doesn't work for me. I installed it with Vivaldi Mod Manager and it doesn't work. Any help?

schreck

.. doesnt work anymore in vivaldi 5.0
(icons for opening dont do anything..)
could you please update this?
thx a lot

guigirl

@schreck Seems fine still here in my Vivaldi 5.1.2514.11 / Chrome 96.0.4664.97.

schreck

to specify, in the sessions panel, when i click on open in new/current window, nothing happens. the delete session button works..

guigirl

@schreck Works fine here, eg:

I trust you are using the updated version?

schreck

@guigirl said in Advanced Panels Mod (with Sessions Panel):

I trust you are using the updated version?

weeeell, obviously missed that. thanks for paying attention!

puppyeyes

This post is deleted!

yaha12

@lonm As of about January 26, 2022 this mod no longer works. I am not sure what caused it, but it must be some kind of an update. It is so on Ubuntu and macOS for me.

This is what the panel looks like for me. alt text

guigirl

@yaha12 Still fine here.

Spoiler

yaha12

@guigirl What version are you on? What OS?

For me, both the macOS and Linux version stopped working at about the same date. Hence, I assumed that it was an issue with an update. macOS - 21st of January, Linux - 26th of January.

guigirl

@yaha12 Current V-Snapshot.
OS is ...

yaha12

@guigirl Strange. I do not see what could have possibly broken this mod on two separate machines and OSs within the same week other than an update of some sort. Coincidences are possible, but one seems improbable here.

yaha12

@guigirl if you visit vivaldi://sessions in the address bar, what happens for you? I get the following error, as if that page has been discontinued or something.

This site can’t be reached. The webpage at chrome://sessions/ might be temporarily down or it may have moved permanently to a new web address. ERR_INVALID_URL

guigirl

@yaha12 My original post was merely to indicate to you that the scripts are not generically broken, qed, but ofc that did not give you any specific info to troubleshoot.

So, for that, as a starting point to ensure we're comparing apples with apples, fwiw here's the verbatim contents of my two files.

advancedPanels.css

/*
* Advanced Panels (a mod for Vivaldi)
* Written by LonM
* No Copyright Reserved
* https://forum.vivaldi.net/post/217005
*/
.panel[advancedpanel="true"] header .toolbar .back, /* hide the web panel back/reload buttons */
.panel[advancedpanel="true"] header .toolbar .forward,
.panel[advancedpanel="true"] header .toolbar .reload,
.panel[advancedpanel="true"] header .toolbar .home,
.panel[advancedpanel="true"] footer /* this last one is to prevent collision with panel actions mod */ {
    display: none !important;
}

.panel[advancedpanel="true"] > div {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.panel[advancedpanel="true"] button {
    background: var(--colorBg);
}


/*
* CSS For Sessions Panel
*/
#sessions_lonm .sessionslist li {
    display: flex;
    flex-direction: row;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 8px
}

#sessions_lonm .sessionslist li div {
    flex-grow: 1;
    padding-right: 4px;
}

#sessions_lonm .sessionslist li button {
    width: 24px;
    height: 24px;
}

#sessions_lonm .sessionslist li span {
    font-size: smaller;
}

#sessions_lonm li h3 , #sessions_lonm li div {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

#sessions_lonm li:hover {
    background: var(--colorHighlightBgAlpha);
}
#sessions_lonm li.selected {
    background: var(--colorHighlightBg);
    color: var(--colorHighlightFg);
}

#sessions_lonm li button {
    display: none;
}
#sessions_lonm li.selected button {
    display: block;
}

#sessions_lonm .sortselector-button {
    display: none;
}
#sessions_lonm .sortselector-button.selected {
    display: block;
}

#sessions_lonm .open_current svg {
    width: 16px;
    left: -3.5px;
    position: relative;
}

#sessions_lonm .open_new svg {
    width: 20px;
    position: relative;
    left: -5.5px;
}
#sessions_lonm .modal-container{
    display: none;
}

#sessions_lonm .show.modal-container {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

#sessions_lonm .confirm {
    width: 90%;
    height: 130px;
    background: var(--colorBg);
    color: var(--colorFg);
    background-color: var(--colorBgLight);
    box-shadow: var(--shadowOverlay);
    border-radius: var(--radiusHalf);
}

#sessions_lonm .confirm p:nth-of-type(1) {
    margin: 20px;
}

#sessions_lonm .confirm p:nth-of-type(2) {
    margin-left: 20px;
}

#sessions_lonm .confirm button {
    margin: 20px;
    border: 1px solid var(--colorBorder);
    height: 28px;
    padding: 0 18px;
    -webkit-user-select: none;
    color: var(--colorFg);
    background-image: linear-gradient(var(--colorBgLightIntense) 0%, var(--colorBg) 100%);
}

#sessions_lonm .confirm button:hover {
    background-image: linear-gradient(var(--colorBg), var(--colorBg));
}


#sessions_lonm .newSession {
    padding: 4px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 6px;
    grid-row-gap: 6px;
}

#sessions_lonm .newSession h2,
#sessions_lonm .newSession input[type="text"]{
    grid-column: 1/3;
}

#sessions_lonm .newSession label input + span {
    margin-left: 10px;
}

custom.js [at least, the extract from it specific to this mod]

/*
guigirl 25/9/20: File holds these mods:

1. https://forum.vivaldi.net/topic/26623/zoom-find-in-page-other-actions-in-web-panels?page=1
    --> 1/1/21: i updated this code with @LonM's latest version. 

2. https://forum.vivaldi.net/topic/33047/autosave-sessions-mod?page=1
    --> 1/1/21: i confirmed this code still matches @LonM's latest version.
    --> 5/1/21: i updated to @LonM's latest version; 4.1.
    --> 2/3/21: The 27 lines beginning `function init()` replaced @LonM's original 22 lines, per @luetage's improvement in https://forum.vivaldi.net/post/451999

3. https://forum.vivaldi.net/topic/33154/import-and-export-themes
    --> 30/9/21: Egads, how come i'd overlooked this cool mod til now?
    --> 13/11/21: I've disabled it coz today's new Snappie 4.4.2482.13 now includes native theme exporting.

4. https://forum.vivaldi.net/post/483429 [open-panels-on-mouse-over]
    --> 10/11/21: Kindly referred here via https://forum.vivaldi.net/post/531000

###################################################################### */

 
/*


/* guigirl 25/9/20, per https://forum.vivaldi.net/topic/33047/autosave-sessions-mod?page=1 */

/*
* Autosave Sessions (a mod for Vivaldi)
* Written by LonM
* guigirl 2/3/21: The 27 lines beginning `function init()` replaced @LonM's original 22 lines, per @luetage's improvement in https://forum.vivaldi.net/post/451999
* V4.1: Attempt to retry if settings is not ready
* v4 : Localise to current timezone, l10n
* v3 : Has own settings section & support private windows again
* v2 : Better handling of multiple windows
*/

(function autoSaveSessionsMod(){
    "use strict";

    const LANGUAGE = 'en_gb'; // en_gb or ko

    const l10n = {
        en_gb: {
            delay: 'Period (minutes)',
            restart: 'This setting requires a restart to take full effect.',
            maxoldsessions: 'Old Sessions Count',
            prefix: 'Prefix',
            prefixdesc: 'A unique prefix made up of the following characters: A-Z 0-9 _',
            saveprivate: 'Save Private Windows'
        },
    }[LANGUAGE];

    let CURRENT_SETTINGS = {};

    /**
     * Copied from bundle.js © Vivaldi - Check if a filename is valid
     * @param {string} s
     */
    function isValidName(e){
        return /^[^\\/:\*\?"<>\|]+$/.test(e) && !/^\./.test(e) && !/^(nul|prn|con|lpt[0-9]|com[0-9])(\.|$)/i.test(e);
    }

    /**
     * Turns a date into a string that can be used in a file name
     * Locale string seems to be the best at getting the correct time for any given timezone
     * @param {Date} date object
     */
    function dateToFileSafeString(date){
        const badChars = /[\\/:\*\?"<>\|]/gi;
        return date.toLocaleString().replace(badChars, '.');
    }

    /**
     * Enable Autosaving sessions
     */
    function autoSaveSession(isPrivate){
        vivaldi.sessionsPrivate.getAll(allSessions => {
            const priv = isPrivate ? "PRIV" : "";
            const prefix = CURRENT_SETTINGS["LONM_SESSION_AUTOSAVE_PREFIX"] + priv;
            const maxOld = CURRENT_SETTINGS["LONM_SESSION_AUTOSAVE_MAX_OLD_SESSIONS"];
            const now = new Date();
            const autosavesOnly = allSessions.filter(x => x.name.indexOf(prefix)===0);
            const oldestFirst = autosavesOnly.sort((a,b) => {return a.createDateJS - b.createDateJS;});

            /* create the new session */
            const name = prefix + dateToFileSafeString(now);
            /* final sanity check */
            if (!isValidName(name)){
                throw new Error("[Autosave Sessions] Cannot name a session as " + name);
            }
            const options = {
                saveOnlyWindowId: 0
            };
            vivaldi.sessionsPrivate.saveOpenTabs(name, options, () => {}); /* there is no way to tell if it failed */

            /* delete older sessions */
            let numberOfSessions = oldestFirst.length + 1; /* length + 1 as we have just added a new one */
            let oldestIndex = 0;
            while(numberOfSessions > maxOld){
                vivaldi.sessionsPrivate.delete(oldestFirst[oldestIndex].name,() => {});
                oldestIndex++;
                numberOfSessions--;
            }
        });
    }

    /**
     * Check if this is the most recent window, and if the most recent window is still open
     * if not, then stop saving the sessions
     */
    function triggerAutosave(){
        chrome.storage.local.get("LONM_SESSION_AUTOSAVE_LAST_WINDOW", data => {
            const lastOpenedWindow = data["LONM_SESSION_AUTOSAVE_LAST_WINDOW"];
            if(window.vivaldiWindowId===lastOpenedWindow){
                /* We know this window is correct, skip the checks */
                autoSaveSession();
                return;
            }
            chrome.windows.getAll(openWindows => {
                const foundLastOpen = openWindows.find(window => window.id===lastOpenedWindow);
                if(foundLastOpen){
                    /*Most recent window still active, use that one instead*/
                } else {
                    /*Most recent window was closed, revert to this one*/
                    chrome.storage.local.set({
                        "LONM_SESSION_AUTOSAVE_LAST_WINDOW": window.vivaldiWindowId
                    }, () => {
                        autoSaveSession();
                    });
                }
            });
        });
    }
    function triggerAutosavePrivate(){
        chrome.storage.local.get("LONM_SESSION_AUTOSAVE_LAST_PRIV_WINDOW", data => {
            const lastOpenedWindow = data["LONM_SESSION_AUTOSAVE_LAST_PRIV_WINDOW"];
            if(window.vivaldiWindowId===lastOpenedWindow){
                /* We know this window is correct, skip the checks */
                autoSaveSession(true);
                return;
            }
            chrome.windows.getAll(openWindows => {
                const foundLastOpen = openWindows.find(window => window.id===lastOpenedWindow);
                if(foundLastOpen){
                    /*Most recent window still active, use that one instead*/
                } else {
                    /*Most recent window was closed, revert to this one*/
                    chrome.storage.local.set({
                        "LONM_SESSION_AUTOSAVE_LAST_PRIV_WINDOW": window.vivaldiWindowId
                    }, () => {
                        autoSaveSession(true);
                    });
                }
            });
        });
    }

    /**
     * Mod the settings page to show settings there
     * Wait a little bit after a settings page has been opened and add settings in
     */
    const SETTINGSPAGE = "chrome-extension://mpognobbkildjkofajifpdfhcoklimli/components/settings/settings.html?path=general";
    function modSettingsPageListener(newTab){
        if(newTab.url === SETTINGSPAGE || newTab.pendingUrl === SETTINGSPAGE){
            setTimeout(modSettingsPage, 1000);
        }
    }
    function modSettingsPage(){
        const settingSection = document.querySelector(".vivaldi-settings .settings-content section");
        if(!settingSection){
            setTimeout(modSettingsPage, 1000);
            return;
        }
        const settingsHTML = document.createElement("section");
        settingsHTML.className = "setting-section";
        settingsHTML.id = "lonmAutosaveSessionsSettings";
        const settingsDiv = document.createElement("div");
        settingsDiv.insertAdjacentHTML("beforeend", "<h2>Autosave Sessions Mod</h2>");
        MOD_SETTINGS.forEach(setting => {
            settingsDiv.appendChild(makeSettingElement(setting));
        });
        settingsHTML.appendChild(settingsDiv);
        settingSection.insertAdjacentElement("afterbegin", settingsHTML);
    }

    /**
     * For a mod setting you need:
     *
     * A) Load it when the mod starts
     * B) Make an option for it when settings is opened
     * C) Change the saved and current state with new value when setting is changed
     *
     * Mod setting has:
     * Key: string
     * Default Value: string|int
     * Description: string
     */
    const MOD_SETTINGS = [
        {
            id: "LONM_SESSION_AUTOSAVE_DELAY_MINUTES",
            type: Number,
            min: 1,
            max: undefined,
            default: 5,
            title: l10n.delay,
            description: l10n.restart
        },
        {
            id: "LONM_SESSION_AUTOSAVE_MAX_OLD_SESSIONS",
            type: Number,
            min: 1,
            max: undefined,
            default: 5,
            title: l10n.maxoldsessions
        },
        {
            id: "LONM_SESSION_AUTOSAVE_PREFIX",
            type: String,
            pattern: "[\\w_]{0,20}",
            default: "VSESAUTOSAVE_",
            title: l10n.prefix,
            description: l10n.prefixdesc
        },
        {
            id: "LONM_SESSION_SAVE_PRIVATE_WINDOWS",
            type: Boolean,
            default: false,
            title: l10n.saveprivate,
            description: l10n.restart
        }
    ];

    /**
     * Handle a change to a setting input
     *   Should be bound in a listener to the setting object
     * @param {InputEvent} input
     */
    function settingUpdated(input){
        if(input.target.type === "checkbox"){
            CURRENT_SETTINGS[this.id] = input.target.checked;
        } else {
            input.target.checkValidity();
            if(input.target.reportValidity() && input.target.value !== ""){
                CURRENT_SETTINGS[this.id] = input.target.value;
            }
        }
        chrome.storage.local.set(CURRENT_SETTINGS);
    }

    /**
     * Create an element for the current setting
     * @param modSetting
     */
    function makeSettingElement(modSetting) {
        const currentSettingValue = CURRENT_SETTINGS[modSetting.id];
        const div = document.createElement("div");
        div.className = "setting-single";
        const title = document.createElement("h3");
        title.innerText = modSetting.title;
        div.appendChild(title);
        if(modSetting.description){
            const info = document.createElement("p");
            info.className = "info";
            info.innerText = modSetting.description;
            div.appendChild(info);
        }
        const input = document.createElement("input");
        input.id = modSetting.id;
        input.value = currentSettingValue;
        input.autocomplete = "off";
        input.autocapitalize = "off";
        input.autocorrect = "off";
        input.spellcheck = "off";
        switch (modSetting.type) {
        case Number:
            input.type = "number";
            break;
        case String:
            input.type = "text";
            break;
        case Boolean:
            input.type = "checkbox";
            if(currentSettingValue){input.checked = "checked";}
            break;
        default:
            throw Error("Unknown setting type!");
        }
        if(modSetting.max){input.max = modSetting.max;}
        if(modSetting.min){input.min = modSetting.min;}
        if(modSetting.pattern){input.pattern = modSetting.pattern;}
        input.addEventListener("input", settingUpdated.bind(modSetting));
        div.appendChild(input);
        return div;
    }

    /**
     * Init the mod, but only if we are not incognito, to maintain privacy.
     * Save the window id in storage, and only use the most recent window to save sessions
     */
    /**
    guigirl 2/3/21: The following 27 lines replaced @LonM's original 22 lines, per @luetage's improvement in https://forum.vivaldi.net/post/451999
    */
    function init(){
        if(window.vivaldiWindowId){
            chrome.windows.getCurrent(window => {
                if(!window.incognito){
                    chrome.storage.local.set({
                        "LONM_SESSION_AUTOSAVE_LAST_WINDOW": window.vivaldiWindowId
                    }, () => {
                        setInterval(triggerAutosave, CURRENT_SETTINGS["LONM_SESSION_AUTOSAVE_DELAY_MINUTES"]*60*1000);
                    });
                }
                if(CURRENT_SETTINGS["LONM_SESSION_SAVE_PRIVATE_WINDOWS"] && window.incognito){
                    chrome.storage.local.set({
                        "LONM_SESSION_AUTOSAVE_LAST_PRIV_WINDOW": window.vivaldiWindowId
                    }, () => {
                        setInterval(triggerAutosavePrivate, CURRENT_SETTINGS["LONM_SESSION_AUTOSAVE_DELAY_MINUTES"]*60*1000);
                    });
                }
                chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
                    if (changeInfo.url === SETTINGSPAGE) {
                        modSettingsPage();
                    }
                })
            });
        } else {
            setTimeout(init, 500);
        }
    }

    /**
     * Load the settings and call the initialiser function
     */
    function loadSettingsAndInit(){
        const keys = MOD_SETTINGS.reduce((prev, current) => {
            prev[current.id] = current.default;
            return prev;
        }, {});
        chrome.storage.local.get(keys, value => {
            CURRENT_SETTINGS = value;
            setTimeout(init, 500);
        });
    }

    loadSettingsAndInit();
})();

guigirl

@yaha12 said in Advanced Panels Mod (with Sessions Panel):

if you visit vivaldi://sessions in the address bar, what happens for you? I

Yeah it doesn't work, but so what, who cares? Per the mod, i access this via the custom web panel, not the address bar.

yaha12

@guigirl Because I get the same error in the custom panel window when I try to access the mod. Hence, I concluded that it was caused by the same issue.

yaha12

@guigirl One thing that did go wrong for sure was that the browser.html file was somehow overridden. It didn't contain references to the mods. Since I didn't do it, I can only assume that an update of some sort did that.

Also, after adding the mod style and js files back to browser.html, I am still getting the original error.