Zoom, Find in Page & other actions in Web Panels
-
@belh4wk No, unfortunately setting the "default" (the zoom level the page initially loads with) is very tricky. There's not any pre-existing code in the mod that can be used for that.
It might be possible to write some, but I never got around to it. It would involve having to listen to the webview to see whenever it loads a page, or maybe just continually setting the zoom on a timer - but neither of those are pleasant to write.
-
@LonM cool, i'll look into what i can sort out then
thanks for your time Lon, and again, really appreciate your efforts!
-
got it to work, using info found here:
https://stackoverflow.com/questions/17253997/how-to-detect-in-javascript-if-a-page-was-loaded-in-a-chrome-webview/** * upgrade a web panel by adding controls, listeners, etc. * @param panel dom node */ function upgradePanel(panel){ addPanelControls(panel); const webview = panel.querySelector("webview"); webview.addEventListener("zoomchange", () => { updateZoomLabel(webview); }); webview.addEventListener("loadcommit", () => { updateZoomLabel(webview); }); /** *the 3 lines below did the trick */ webview.addEventListener("loadstop", () => { changeZoom(webview, 0.7); <<< same as you instructed, change 0.7 to 1 to change to 100% }); }
if anyone's interested in adding that functionality
edit: tested with a number of sites, seems to work like a charm too, so it's actually useful
@LonM feel free to add it to your full script
-
@belh4wk Good find. I added it to the main file.
-
@LonM said in Zoom, Find in Page & other actions in Web Panels:
@belh4wk Good find. I added it to the main file.
thanks bud
just had a look at it, i see you cleaned it up a bit, mine was a bit quick and dirty indeed
i'll look into adding an additional field to set the default value (for ease of access purposes)i've updated the code a bit again and added a DEFAULT_ZOOM_LBL constant, just below the DEFAULT_ZOOM constant, like so:
const ZOOM_STEP = 0.05; /*Step amount. 0.1 is 10%*/ const DEFAULT_ZOOM = 0.7; /* what should the default zoom be for panels */ const DEFAULT_ZOOM_LBL = DEFAULT_ZOOM * 100 ; /* calculates the value for the label based on the setting for the DEFAULT_ZOOM */
and then used that constant for the zoom reset as well, like so:
zoom_reset: { title: "Reset zoom to default %", script: function(target, webview){ changeZoom(webview, DEFAULT_ZOOM); }, display: DEFAULT_ZOOM_LBL, <<< here display_class: "zoom-reset"
i'll get to work on the additional control to set it through the GUI and keep you posted
-
@belh4wk If you want to work on adding changes, feel free to fork and make pull requests for the mod on github: https://github.com/LonMcGregor/VivaldiMods/blob/master/mods/panel_actions.js
That would make it easier to merge suggested changes.
-
@Gwen-Dragon
Thanks so much! you where rigth!
The only thing i am missmatching is how to add or install this MOD into Vivaldi! If you can help me, thanks in advance! -
Set it all up manually:
Save the text on page 1 of this thread as a .js file and give it a recognizable name such as WebPanelZoom.js, for instance.
Then save that .js file in the "C:\users\YOURUSERNAME\AppData\Local\Vivaldi\Application\VERSIONNUMBER\resources\vivaldi" folder
(note: you can easily get to the local AppData folder by pressing the windows key+R and entering "%localappdata%" - without the quotes - and then pressing enter)In that folder you should see a browser.html file.
Create a copy of it (for backup reasons, should anything go wrong) in your documents folder.
Edit the original browser.html file with Notepad.Next you need to add the mod to the browser.html file so Vivaldi knows you want to use it.
You'll see a bunch of lines below the opening html-tag for the <body></body> element, similar to the line below:<script src="custom.js"></script>
add another line for the mod, like so (note that the line contains the name of the file you saved to that vivaldi resources folder earlier):
<script src="WebPanelZoom.js"></script>
Save the browser.html file and close it
Restart Vivaldi and when you open a webpanel, it should show the controls at the bottom
Set it up semi-automatically:
Download both my copies of the files:
(note: these versions have a 5% granularity for the zoom, a 70% default zoom setting and a dynamic zoom-label assignment)
browser.html: https://drive.google.com/file/d/1XNzDwtqT_bentt0mvZrlPpI8Lp-HFJwM/view?usp=sharing
WebPanelZoom.js: https://drive.google.com/file/d/13o5nqreT48gy4iMEnMXQF4dQ_nFG5hUl/view?usp=sharing(use this button on the top right of the pages: )
Then save (copy them) those in "C:\users\YOURUSERNAME\AppData\Local\Vivaldi\Application\VERSIONNUMBER\resources\vivaldi".
If it asks to overwrite the browser.html file, do so.
(note: you can easily get to the local AppData folder by pressing the windows key+R and entering "%localappdata%" - without the quotes - and then pressing enter)Restart Vivaldi and when you open a webpanel, it should show the controls at the bottom
On a final note, to change the default zoom setting, change the following line:
const DEFAULT_ZOOM = 0.7; /* what should the default zoom be for panels; 0.7 equates to 70%, 1 to 100% */
-
@LonM said in Zoom, Find in Page & other actions in Web Panels:
@belh4wk If you want to work on adding changes, feel free to fork and make pull requests for the mod on github: https://github.com/LonMcGregor/VivaldiMods/blob/master/mods/panel_actions.js
That would make it easier to merge suggested changes.
i've created the pull request, then did a branch merge
while i've heard of github before, i've never really used it yet so i'm not entirely up to speed on how it all works, so let me know if i missed anything or did anything wrong :face_with_stuck-out_tongue: -
@belh4wk Thanks. I merged the changes.
-
@LonM said in Zoom, Find in Page & other actions in Web Panels:
@belh4wk Thanks. I merged the changes.
Awesome! Thanks man!
(you'll still need to update the textbox on the OP too though if you want others to benefit from it as well )
-
Thanks for this mod! I use Tweetdeck as a web panel and Twitter made all the buttons bigger a few months ago, and it reduced the number of column buttons I can see on the left bar at once without scrolling. Being able to zoom out the panel by 10% lets more buttons fit
-
Hi all. Is there any new mod for allowing more panels when you reach max screen size allowed? the add button disappears when i have 16 webpanels added. There was a scroll mod but the add button box stayed on the vertical bar so you couldnt see it fully...
-
@joao-rossa As a workaround, you can zoom out the UI in
Settings/Appearance/Window Appearance/User Interface Zoom
. -
@hlehyaric Thanks for the tip. Lets hope they add a vertical scrollable element to fix this soon.
-
Hi! Thanks for your work! Is it possible autoclose webpanel on terminate and reload page when web-panel opens next time?
-
@molex I've updated the main post with the ability to close the panel automatically after terminating a panel. Unfortunately, it would be more difficult to figure out when to reload the panel on opening, so I haven't implemented the 2nd part of your request.
-
-
Is it possible to add keyboard shortcuts for these actions?
-
@molex I wouldn't want the panel to reload when I open it again. My panels are social media and messaging sites and I kill them when I don't want to be distracted.