Pimped Penguin Pages

Thursday, January 31, 2019

Weather Clock HTML

Ever since I cut the cord, and hooked up a PC to my TV, I've always liked a nice Weather Clock display for those times I'm not watching TV and am listening to the radio (I like 181.fm by the way).

If you've been a Chrome user you might have seen some of the "New Tab" Clock and weather gadgets that have been built over the past couple of years.  A popular one E Clock, I think it was, worked really well and it had the coolness of offering up quite a few nice backgrounds to go with it.  But as of the 1st of this year it quit loading the weather. There is also Currently, and it's working at the moment.  But it has stopped from time to time. 

I grew tired of relying on someone else's tool, and I knew it shouldn't be toooo hard to make a web page to show the time and weather, right? I mean, I messed around with web pages back when there was a Netscape editor for them, and Front Page was destroying everything that you opened up to edit, so you ended up editing things with a text editor and holding your breath that FP wasn't going to destroy your pages. It was sorta ok if you only used it.  It's such garbage, that there is even a tool to remove it's bloat. BLECH!

So far this little HTML page that I created seems to work. The Weather Widget gets it's info from DarkSky.  But if you want to use another widget you can.  So even if this one breaks or whatever, there's more weather widgets out there to fiddle with I suppose.   In any case, this mostly your own code to fiddle with as you see fit.  If you come up with some snazzy new things to do to it, or have better code, please share.  I in no way see myself as some well informed web page developer, rather I've got limited knowledge to get me just this far.  I'm just fair  enough to fiddle with some things here and there and get them to work.

In any case, I've got the orginal code for this saved on the TryIt editor.  I have saved it here:  I have also saved it to my Google Drive here.


If you DL the HTML code, just save it on your PC  \home\weather_clock\clock.html or someplace like that.  You'll need to go to weatherwidget.io to get the code for your area and replace my widget code with your favorite Text Editor. This code should work with anyone's PC and any modern browser.

There's still a few things that I'm not exactly "happy" with this. As of the moment, I have to ZOOM in the page to 200 - 250%  to get it to fill the page up the way I want to.  I'm sure there's a way to fix this, but it's not really a huge problem, but I'm not exactly sure how to address it at this time. 

I Have also made some changes to the mentioned code so that I can have a nicer background, but  again, I have to ZOOM in and the background image also zooms.  Not sure that I really like that.


I'm sure some of this code could be cleaned up, but hey, not bad for amature. IMHO.  

R_ 


No comments:

Post a Comment

Thanks for the Comments.