PluginWebView - Make skin using web technology

[Yincognito]

Hello @ all!

Maybe can someone help me...
my english is not really good, but i understand more as i can say or write.

I´m using Win7 64bit, have installed the MS Edge and the Webview components but all tries to use this shown only empty borders.
no content.

1´ve tested all files from the "PluginWebViewExample" folder but nothing...

the Plugin seems installed: %MYPATH%\Rainmeter\Skins\@Vault\Plugins\WebView\0.1.0\... 32 & 64 bit, all files exist.
the about rainmeter shows in the plugin tab the "WebView.dll 0.1.0 too...

i tried a simple Twitch-Chat to show:
[...]
maybe is it only a little mistaky by me, or something what easy to solve

Thanks and happy hollidays!!

First of all, your skin doesn't show anything for me either - frankly, I have no idea what it's supposed to show since in the browser, the page apparently only displays some chat room connection. Some pages are just not designed to show in such a skin (for example, tried some actual Twitch channel too, and it didn't show anything either). Maybe its related to the fact that even the Youtube skin variant uses the embedded system / link, I don't know.

Secondly, not showing anything (or anything concerning the webpage link you use) has nothing to do with the update rate - in fact, I strongly suggest you set it back to what it was (yeah, I know, that high number which made no sense) or to set it to -1 if all you want to display is a webpage. Only set it to a regular (e.g. 1000) rate if you have some other things in the skin itself (i.e. the .ini file) that need such an update rate to work (like the CPU stuff at the end of your code), because that's the only thing it's useful for. The webpage part only needs a single update to be created, hence the strange update rate number.

That being said, if the webpage is suited to be shown, it will. Both the Minecraft skin and the Youtube variants from the "PluginWebViewExample" folder (variants that use external webpages, and not local) work for me, so you should first try to make those work, and only after succeeding try other things (knowing that this part does its job). To make them work, you should properly permit the msedge.exe and msedgewebview2.exe executables (and the node.exe executable, if you create a server for some local webpages on your computer) to connect to the internet via your firewall. This, of course, assumes that you correctly installed the Edge and WebView requirements beforehand.

So, good luck on the last part. Feel free to ask again if you don't manage to make at least the Youtube variant to work.

[balala]

First of all, your skin doesn't show anything for me either - frankly, I have no idea what it's supposed to show since in the browser, the page apparently only displays some chat room connection.

Both the Minecraft skin and the Youtube variants from the "PluginWebViewExample" folder (variants that use external webpages, and not local) work for me,

Completely the same here. Those skins are indeed working for me too.
The only thing I can think to is that maybe Windows 7 is not supported? I can't try this now, but I'm gonna try Monday morning, when I get to work, where I have access to a computer using this OS.

Secondly, not showing anything (or anything concerning the webpage link you use) has nothing to do with the update rate - in fact, I strongly suggest you set it back to what it was (yeah, I know, that high number which made no sense) or to set it to -1 if all you want to display is a webpage. Only set it to a regular (e.g. 1000) rate if you have some other things in the skin itself (i.e. the .ini file) that need such an update rate to work (like the CPU stuff at the end of your code), because that's the only thing it's useful for. The webpage part only needs a single update to be created, hence the strange update rate number.

Right, in this case this is right . For instance the Weather skin of the example uses an Update set to Update=100000, so 100 seconds. But this is weird, skins using WebParser measures (so skins acuaring online information) can say almost by definition have to have the Update set to the default value (please don't argue, I know they can work well with other Update values as well, but having the default value makes most easier to be used). When posted my reply I didn't check, this is why I recommended setting the Update to the default value.

[Yincognito]

Completely the same here. Those skins are indeed working for me too.
The only thing I can think to is that maybe Windows 7 is not supported? I can't try this now, but I'm gonna try Monday morning, when I get to work, where I have access to a computer using this OS.

Right, in this case this is right . For instance the Weather skin of the example uses an Update set to Update=100000, so 100 seconds. But this is weird, skins using WebParser measures (so skins acuaring online information) can say almost by definition have to have the Update set to the default value (please don't argue, I know they can work well with other Update values as well, but having the default value makes most easier to be used). When posted my reply I didn't check, this is why I recommended setting the Update to the default value.

Yep, I don't have access to a Win7 computer to test, but it could be the culprit indeed. I think I tried a couple of months ago to "resurrect" my old laptop (the Intel i3 one, now I'm on the Ryzen 5 boat with the new one) to test how much CPU my WebView Earth skin was using, and besides the laptop being half dead anyway, I believe I had some message popping up regarding WebView2 needing a newer OS - hope I'm remembering this correctly, but I'm not 100% sure.

No worries, I don't argue on that, lol. The difference between WebParser featured skins and WebView2 ones is that the former parse the text on already existing webpages, while the latter create the "layout" / "overlay" for the skin to "embed" an existing (local or not) webpage. That's why this is needed only once, because the process (albeit more complicated) is basically similar to creating a static background for a normal skin (which some skin designers also set to UpdateDivider=-1).

Even if you need a dynamic layout (like, for example, if you want to make the skin + webpage combo resizable or scalable in realtime) or you need to "update" stuff regularly in the webpage, you don't need the Rainmeter (i.e. .ini) part to update more than once, because you do both from within the webpage itself and its Javascript code. In fact - and this was tested by me, since my WebView2 skin is also resizable - if you try to display the resizing of the skin + webpage combo using the Rainmeter update rate it will only result in higher CPU usage since the webpage will be recreated again every time you resize (since the layout / overlay is also recreated), which is especially problematic if the webpage itself is already dynamic or has some animation in it. Which is why I personally came up with a "trick" to do the resizing, by redimensioning the (HTML <div>) container where the contents of the webpage is shown from Javascript, and even though the size of the skin itself remained the monitor resolution values, Rainmeter automatically considers only the webpage part (which just happens to be the size of the already redimensioned webpage <div> container) as the skin, via DynamicWindowSize=1. Much faster, no CPU overload, and only some minor side effects when resizing. I already mentioned this particularity of the plugin here, by the way.

[balala]

Even if you need a dynamic layout (like, for example, if you want to make the skin + webpage combo resizable or scalable in realtime) or you need to "update" stuff regularly in the webpage, you don't need the Rainmeter (i.e. .ini) part to update more than once, because you do both from within the webpage itself and its Javascript code. In fact - and this was tested by me, since my WebView2 skin is also resizable - if you try to display the resizing of the skin + webpage combo using the Rainmeter update rate it will only result in higher CPU usage since the webpage will be recreated again every time you resize (since the layout / overlay is also recreated), which is especially problematic if the webpage itself is already dynamic or has some animation in it. Which is why I personally came up with a "trick" to do the resizing, by redimensioning the (HTML <div>) container where the contents of the webpage is shown from Javascript, and even though the size of the skin itself remained the monitor resolution values, Rainmeter automatically considers only the webpage part (which just happens to be the size of the already redimensioned webpage <div> container) as the skin, via DynamicWindowSize=1. Much faster, no CPU overload, and only some minor side effects when resizing. I already mentioned this particularity of the plugin here, by the way.

Interesting things, good to be known. Thanks for the details. My question is if this plugin can parse sites using Javascripts? Because as we know, the WebParser measures don't deal with these scripts, so if this plugin does, it's something fenomenal.

[Yincognito]

Interesting things, good to be known. Thanks for the details. My question is if this plugin can parse sites using Javascripts? Because as we know, the WebParser measures don't deal with these scripts, so if this plugin does, it's something fenomenal.

Hmm... I didn't thought of that, to be honest - but it's an excellent question.

While technically you can indeed parse a webpage using an XMLHttpRequest in Javascript (and the result will include the outcome of whatever Javascripts on the page you query), in practice you'd have some "complications" along the way, like doing it for different web domains (which would need a server side script, as far as I know, or other ways to bypass CORS) and so on. I actually do something quite similar in the Javascript of my (unreleased / private) Chrome extension, where I'm web scraping for images instead, but then running as a Chrome extension has a couple advantages compared to a "normal" webpage, so things might not be precisely the same. I didn't try to do it from a WebView2 featured Rainmeter skin... yet.

It's something that's worth investigating though...

P.S. I'm pretty sure that WebParser doesn't do this not because it couldn't, but because of security concerns. This is also something to consider when attempting that.

[balala]

It's something that's worth investigating though...

Definitely agree...

P.S. I'm pretty sure that WebParser doesn't do this not because it couldn't, but because of security concerns. This is also something to consider when attempting that.

As far as I know, it can't. A dev should definitely say more, but this is what me at least know.

[Yincognito]

As far as I know, it can't. A dev should definitely say more, but this is what me at least know.

No, I meant the reason why "it can't". Some things are done intentionally, you know...
By the way, now that I think about it, the WebNowPlaying plugin (and probably the extension as well) could be doing something similar, in order to get music info from sites like Youtube and such.

[RonXTCdaBass]

Hello again! First of all thanks for so many replies!

Thanks also to SilverAzide for correcting it!
THX to Yincognito - Yes, it only shows my channel's chat, no write function.
I wanted to run this on my second computer to have an eye on the chat without much load on the CPU, like a browser with a thousand background services. I chosed this type of display the chat because the background can be made transparent.

I'm trying to work my way through the many answers and tips. and because I write so much I'm using a translator right now. I hope the translation isn't too wrong

Now I also understand the long refresh time.
I have also repeatedly tested the variants from the original package.
Unfortunately, I can't remember what was different, but i think in my very first test, the Youtube skin played music once, but no image... and some menu was presented to me when I clicked in the skin window. That's why I installed the Edge.

@Yincognito - none of the files mentioned are blocked in the firewall.

I had already uninstalled the edge again, but after reinstalling the WebView with the official "Evergreen Bootstrapper" it was back.

In the Control Panel under "Programs" there are "Microsoft Edge" and "Microsoft Edge WebView2 Runtime". Both with version 108.0.1462.54
I read somewhere on Github that the 64-bit version of WebView overwrites the x86 version and then something about a white screen... but I can't remember where and if that might be related to my problem.

I have already tried the trick with the HTML <div> container in a local file. Unfortunately, nothing is displayed there either. But I don't need to change the size because I can and want to assign a fixed size to the window.

I´ll try as next uninstall the 64bit version and try the x86 version of the WebView2.
But for now, it is night here in germany and i need sleep.

[Yincognito]

In the Control Panel under "Programs" there are "Microsoft Edge" and "Microsoft Edge WebView2 Runtime". Both with version 108.0.1462.54
I read somewhere on Github that the 64-bit version of WebView overwrites the x86 version and then something about a white screen... but I can't remember where and if that might be related to my problem.

I´ll try as next uninstall the 64bit version and try the x86 version of the WebView2.
But for now, it is night here in germany and i need sleep.

Well, let's hope balala will be able to test if the sample skins (e.g. the Youtube one, or others) work on Win7 on Monday, but it appears that they should, according to here, albeit the support for the OS will be soon removed as explained here. There were some other issues on that OS like here or here, but I'm not sure they are relevant enough for your case, given the different circumstances.

I remember that for some things on Win7 (not WebView2 though) there were additional requirements to be installed, so on that field you might want to check that you have installed the appropriate MS Visual C++ Redistributables, MS .NET Frameworks, Java SE Runtime Environments (I also included the DirectX June 2010 Redistributable or the Adobe Flash Player / Adobe Shockwave Player when I was on Win7 but I don't think they're needed in this scenario) because sometimes they help - you get the idea.

Anyway, keep us posted on how things go, or if something changes in the meantime. In cases like these, when things don't work, some error messages should be displayed, but if they don't, then sometimes it's about other OS dependencies like above.

[balala]

Well, let's hope balala will be able to test if the sample skins (e.g. the Youtube one, or others) work on Win7 on Monday, but it appears that they should, according to here,

Well, tested and it seems it doesn't really work. In fact to be precise, it doesn't work at all, I couldn1t even activate none of the skins included into the PluginWebViewExample package. What was extremely weird was that when tried to activate a skin, after a few seconds I got the following message on the screen:

Message.png

Don't really know what does this mean. It's quite weird in my opinion and have no idea what to do with this. Has anyone an idea?