Open panels on mouse-over.

[oudstand]

@brianhuahin hey, this is my .js file. I'm also on the latest Vivaldi version and it is working without any problem

// https://forum.vivaldi.net/topic/28413/open-panels-on-mouse-over/22?_=1593504963587
function panelMouseOver(autoHide, delay_show, delay_change, delay_hide) {
    var buttons = document.getElementById('switch').getElementsByTagName('button');
    var show_token = null;
    var activeButton = null;

    /* Stop timer if mouse exits screen */
    document.addEventListener("mouseout", function (e) {
        clearTimeout(show_token);
    });

    /* Do auto-hide if applicable */
    if (autoHide) {
        var content = document.getElementById("webview-container").onmouseover = function () {
            if (!document.getElementById("panels-container").getAttribute('class').includes("icons")) {
                clearTimeout(show_token);
                setTimeout(function () {
                	activeButton = activeButton ? activeButton : getActiveButton();
                    if (activeButton && (activeButton.getAttribute('class').includes("active"))) {
                        activeButton.click();
                        activeButton = null;
                    }
                }, delay_hide);
            }
        };
    }


    function activeButtonIndex() {
        for (let i = 0; i < buttons.length - 2; i++) {
            if (buttons[i].getAttribute('class').includes('active')) {
                return i;
            }
        }
        return -1;
    }

    function getActiveButton() {
    	if(buttons[activeButtonIndex()]) {
    		return buttons[activeButtonIndex()];
    	}
    	return null;
    }

    function setActive(index, doDelay) {
        clearTimeout(show_token);
        var delay = 0;
        if (doDelay) {
            delay = (activeButtonIndex() < 0) ? delay_show : delay_change;
        }
        show_token = setTimeout(function () {
            var newButton = buttons[index];
            if (!newButton.getAttribute('class').includes('active')) {
                activeButton = newButton;
                activeButton.click();
                panel = index;
            }
        }, delay);
    }

    function setListeners() {
        for (let index = 0; index < buttons.length - 2; index++) {
            buttons[index].onmouseover = function () {
                setActive(index, true);
            };
            buttons[index].onmouseout = function () {
                clearTimeout(show_token);
            };
            buttons[index].ondragover = function () {
                setActive(index, false);
            };
        }
    }

    setListeners();
}

function addObserver() {
    const switchPanel = document.getElementById('switch');
    const config = {
        childList: true,
        subtree: true
    };
    const callback = function (mutationList, observer) {
        for (let mutation of mutationList) {
            if (mutation.type === 'childList') {
                panelMouseOver(true, 100, 50, 250);
            }
        }
    };
    const observer = new MutationObserver(callback);
    observer.observe(switchPanel, config);
};

setTimeout(function wait() {
    const browser = document.getElementById('browser');
    if (browser) {
        panelMouseOver(true, 100, 50, 250);
        addObserver();
    } else {
        setTimeout(wait, 300);
    }
}, 300);

[brianhuahin]

@oudstand
Thank you for your reply the issue I had has been solved. My fat fingers.

Regards
Brian

[oudstand]

@brianhuahin No problem I didn't noticed that there was a fourth page before I wrote my answer

[stardepp]

@oudstand Is there perhaps a way to add a feature to this mod that allows you to pin a panel when needed so that it doesn't automatically hide?

[Folgore101]

@stardepp Click on it before it opens automatically and stays open.

[stardepp]

@folgore101 said in Open panels on mouse-over.:

@stardepp Click on it before it opens automatically and stays open.

Unfortunately, this does not work for me.

[Folgore101]

@stardepp Maybe try extending the time, i put:

panelMouseOver(true, 1400, 1500, 800);

[stardepp]

@folgore101 said in Open panels on mouse-over.:

@stardepp Maybe try extending the time, i put:

panelMouseOver(true, 1400, 1500, 800);

Thanks for this tip, but where exactly do I paste this code?

[Folgore101]

@stardepp Open the js file with notepad++ or a similar program, go to the bottom of the file and find the line panelMouseOver, the 3 values are the times of the function delay_show, delay_change, delay_hide.
The defaults are 100, 50, 250, if they are too short you may not be able to click in time and the panel won't stay open, i hypothesize that it is the problem.

[stardepp]

[Folgore101]

@stardepp It doesn't work for you even if you increase the time?

[stardepp]

@folgore101

This is how it looks to me. I want the panel to stay open when I write or select something on the web page or scroll the web page.

[dude99]

@stardepp try deactivate this option:

Then setup a shortcut for Open Next Panel

Now you can open the panel with shortcuts & keep it open as long as you don't mouseover the panel's switch button.

It also works with other open panel shortcut like bookmarks & notes.

---

EDIt: another method is Ctrl-Click on the Toggle Panel button in statusbar to disabled floating panel (which will also disabled auto-close panel function), then use keyboard shortcut to evoke the panel. This way you can keep auto-close function enabled, & then pin the panel temporary when you need to drag & drop stuff into panel, then Ctrl Click the same button to unpin the panel.

[stardepp]

@dude99 Finally...and many many thanks for your help now it works as it should

I never get tired of telling you this...I am very grateful that there are such good and professional programmers and helpers here in the Vivaldi community. It is very good to know that.

[oudstand]

@stardepp I made a little modification for myself that wont hide the panel when you're not using floating panels. If you're interested, let me know

[stardepp]

@oudstand said in Open panels on mouse-over.:

@stardepp I made a little modification for myself that wont hide the panel when you're not using floating panels. If you're interested, let me know

Yes, yes, I would be interested in that.

[oudstand]

I just can't post my code. Every time I try I get the message error but I don't know whats wrong... -.-

[stardepp]

@oudstand Does it help maybe to reload the Vivaldin forum website, and maybe delete the cookies only for the Vivaldi forum page.

[oudstand]

https://forum.vivaldi.net/topic/60862/new-forum-version-blocks-posting-of-js-code/15?_=1621580453456

It seems like the forum has problems posting code.

EDIT: I've even tried a different browser.

[Folgore101]

@oudstand Hi, i don't encounter any problems if you enter it with the "Code" function.

function panelMouseOver(autoHide, delay_show, delay_change, delay_hide)
{
    var buttons = document.getElementById('switch').getElementsByTagName('button');
    var show_token   = null;
    var activeButton = null;

    /* Stop timer if mouse exits screen */
    document.addEventListener("mouseout", function(e) {
        clearTimeout(show_token);
    });

    /* Do auto-hide if applicable */
    if (autoHide)
    {
        var content = document.getElementById("webview-container").onmouseover = function()
        {
            if (!document.getElementById("panels-container").getAttribute('class').includes("icons"))
            {
                clearTimeout(show_token);
                setTimeout(function() {
                    if (activeButton && (activeButton.getAttribute('class').includes("active")))
                    {
                        activeButton.click();
                        activeButton = null;
                    }
                }, delay_hide);
            }
        };
    }


    function activeButtonIndex()
    {
        for (let i = 0; i < buttons.length - 2; i++)
        {
            if (buttons[i].getAttribute('class').includes('active'))
            {
                return i;
            }
        }
        return -1;
    }

    function setActive(index, doDelay)
    {
        clearTimeout(show_token);
        var delay = 0;
        if (doDelay)
        {
            delay = (activeButtonIndex() < 0) ? delay_show : delay_change;
        }
        show_token = setTimeout(function() {
            var newButton = buttons[index];
            if (!newButton.getAttribute('class').includes('active'))
            {
                activeButton = newButton;
                activeButton.click();
                panel = index;
            }
        }, delay);
    }

    function setListeners()
    {
        for (let index = 0; index < buttons.length - 2; index++) 
        {
            buttons[index].onmouseover = function() {setActive(index, true);};
            buttons[index].onmouseout  = function() {clearTimeout(show_token);};
            buttons[index].ondragover  = function() {setActive(index, false);};
        }
    }

    setListeners();
}

setTimeout(function wait() 
{
    var adr = document.querySelector("#browser");
    if (adr != null) 
    {
        panelMouseOver(true, 1400, 1500, 800);
    }
    else
    {
        setTimeout(wait, 300);
    }
}, 300);