Weather widget TODO list (JavaScript) #755
valinet
announced in
Announcements
Replies: 4 comments 31 replies
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
-
|
I've just opened Google Search with a modern browser in dark theme, and it displayed in dark theme respectively, without changing any preferences or accepting cookies - I'm pretty sure it relies on With recent WebView2 versions, it is possible to use developer tools protocol. Methods parameters are in JSON. |
Beta Was this translation helpful? Give feedback.
24 replies
-
|
|
Beta Was this translation helpful? Give feedback.
-
|
When URL parameter |
Beta Was this translation helpful? Give feedback.
-
|
I know that the user is disconnected, that's why I said to try in InPrivate. When in InPrivate in Edge, no |
Beta Was this translation helpful? Give feedback.
-
|
Gave up on using an iframe, I now display the page directly and adjust the bounds of the
Thanks @krlvm for the input, we can check this one off the list. |
Beta Was this translation helpful? Give feedback.
-
|
I'm glad I could help! |
Beta Was this translation helpful? Give feedback.
-
|
List of Google<->Microsoft icon mappings: List of addresses for Microsoft icons: 64px 128px The icons can be obtained by inspecting the element of this feature from Microsoft Edge:
|
Beta Was this translation helpful? Give feedback.
1 reply
-
|
Mappings for new images (from |
Beta Was this translation helpful? Give feedback.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Current status:
✔️ Dark mode support
✔️ Better support for icons on light backgrounds
✔️ Support some night time icons
✔️ Determine sunset and sunrise times
❌ Support Bing as provider
❌ Multiple locations
I consider this ready to ship as a stable version, once the code base stabilizes a bit; functionality for v1 is implemented.
Hi
As some of you may be aware, a new feature has been recently been implemented in ExplorerPatcher for the Windows 10 taskbar: a weather widget. The implementation leverages Microsoft's WebView2 component to scrape and display the weather widget from Google Search. For interacting with the web page, client-side JavaScript is executed, performing a host of tasks, like extracting, scaling and converting the weather icon from the web page to an array of bytes and much more.
Taking this into consideration, there is now this opportunity to write code in JavaScript for ExplorerPatcher as well. Thus, I launch an invitation for interested parties in contributing towards the following objectives, with JavaScript code. These kind of have to make their way into the code anyway before the weather widget ships in a release, so eventually I ought to work on them myself, but I was thinking maybe some of you are interested in contributing and helping accelerate development on this. So, specifically:
✔️ Dark mode support
Implemented as of 42.4, see #755 (comment)
There are 2 parts to it:
This means supporting dark mode on the Google search web page. Again, there are 2 aspects when it comes to this:
So yeah, contributions of some JavaScript that does something about this after the content has loaded would be good.
✔️ Better support for icons on light backgrounds
Implemented as of 42.30. Added an option to use the stock Microsoft icons which have better contrast with the light taskbar.
Currently, the weather icons Google serves are not really optimized for light backgrounds. You can see that by switching the Windows theme to light for the taskbar. One solution I was thinking about is to run a flood fill on the image to identify the transparent area around the icon, and then draw a border around the middle area where the icon actually is. Idk how good that will look in practice, but it is worth a try, I think. Alternatively, idk, the icon could have a backplate, although it would be pretty ugly. Else, idk, maybe replace the icons altogether with others from some other place that serves more contrasty ones for light backgrounds... I generally want to avoid introducing dependencies on other services since those may come with quotas or generally might have less availability than Google does.
Again, suggestions are welcome.
✔️ Support some night time icons
Implemented as of 42.30. Microsoft's icons support daytime and nighttime icons, so I mapped Google's ones to those based on the current time and the sunrise/sunset times at the chosen location.
Weirdly enough, Google has the same set of icons for both day time and night time. That's a pretty weird omission from their side. It's especially weird when at night the sky's clear, so a big yellow circle displays on the taskbar. Anyway, for the time being, I'd start changing that - idk if replacing with icons from some other place would work. For that case, I was also thinking of cropping out some pixels from the circle until I get the shape of a moon. That just equates to turning the right pixels from yellow to transparent to get that. After we get that done for the "sun" icon, maybe apply the same to the few other icons that display a sun with some clouds around it...? This is in strong connection with the next one:
✔️ Determine sunset and sunrise times
Implemented as of 42.30. The application uses https://github.com/Triggertrap/sun-js to determine the sunset and sunrise times for the particular location.
So yeah, after/before the above, determine how we define day/night time. Hardcode it from 7pm to 7am? Google's widget doesn't seem to have a clue about that, and I don't really like hardcoding. Instead, something like this could be used: https://github.com/Triggertrap/sun-js, which implements some algorithm to tell us the sunrise and sunset times based on geographic coordinates and a date, so basically for any place on Earth on any day, which sounds pretty good. Only thing, the user inputs a string corresponding to a name in ExplorerPatcher, how to get geographic coordinates from that? Fortunately, if we look at the "weather.com" hyperlink in the footer of the widget (that's hidden in the flyout by EP, so check in Google search manually), the URL of that contains the geographic coordinates, so we can extract those from there and we're good to go. This might actually be a solution.
❌ Support Bing as provider
Bing features another weather widget, which is interesting as well: it has an animation showing the weather conditions, plus some monochrome icons (white) icons which I think can be easily converted back and forth to obtain dark/light variants. It could make for a rather nice alternative to the Google widget. The program already supports multiple provider implementations, one just needs to write a proper script to be run after the page is loaded in order to grab the data.
❌ Multiple locations
Offer the possibility to set a list of locations and design some UI (???) to cycle through them once you open the widget. This one's a bit more involved, it has to be discussed more in-depth first.
So yeah, these are the plans/ideas/tasks for the moment, if anyone's willing to pick something up, shout out here as well so I do not start work on that and duplicate the implementation. As I said, all of the above have to be implemented in JavaScript, they will probably go in this file: https://github.com/valinet/ExplorerPatcher/blob/master/ep_weather_host/ep_weather_provider_google_script.h as that contains the scripts that run when the weather widget has loaded and that scrapes all the data required off of it.
Thanks.
Beta Was this translation helpful? Give feedback.
All reactions