Trixology

WeatherCat => WeatherCat Web Templates => Topic started by: Steve on April 19, 2012, 03:55:08 AM

Title: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: Steve on April 19, 2012, 03:55:08 AM
On the MacWeather forum, Edouard and I updated and modified Todd's (tigers') ipwx_Cam mobile web page template. This included updating the javascript the template pointed to, revising how a webcam image was displayed, and revising the script that detected the iPod or iPhone. I have now revised this template to reflect the change to WeatherCat, and tried writing some documentation.

This template should work with any web template you are using, as long as you are uploading via the Custom Web tab. If there are any suggestions for improving the documentation, let me know.

A zipped archive is attached to this post, below.
Steve

Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: JosBaz on April 19, 2012, 12:56:38 PM
Wow! Thanks Steve...

Looks excellent and I'll work on implementing this tonight.

I trust there should be no issues with ?F versus ?C and such right?

Thanks,

Jos
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: Steve on April 19, 2012, 01:42:07 PM
Thanks Jos,

I'm assuming it should work with whatever units you have set. Sorry it took so long to get to this. I know I promised it some time back...

Steve
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: jace on April 19, 2012, 05:46:27 PM
Hi Steve and Edouard

First of all many thanks to both of you for working on this, looks great.

If anybody was going to have problems it's me. I was using seamonkey to edit the index.html file. It would not save the edit, so tried Microsoft word, it looked as if it had let me paste the mobile script ok, but corrupted the index.html file. Eventually had to load a new web browser editor, although that isn't happy either  ???

My iphone can see the script, as it's trying to load the Mobile edition, my iPad (ver 1) will only load up my normal web page, it is not re-directing with the ipwx.html file  but if I then direct my browser to the ipwx.html file it loads great and seems to work ok. Still can't get my phone to load the page although it is looking at the mobile edition.  [banghead], just sits and reloads constantly until the phone shuts down to save power  [sleep]

Other thing I can't see is the " arrow in a box icon at the bottom of the browser, and select ?Add to Home Screen?. It don't appear to be there.  :'(

It works on the units set in weather cat by the way, so modern countries that use metric units are ok  [bounce]

JC

Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: Steve on April 19, 2012, 06:40:03 PM
I'm glad you got it mostly working, John!

When we modified the LWC version, we decided that it wasn't as beneficial on the iPad as it was on the iPod and iPhone. The normal web page looked much better on the iPad. If you want to force the iPad to load the mobile version, I'm guessing Edouard could recommend a tweak to do so. My solution was to put a link at the bottom of each web page to go to the mobile version if desired. That's how Android and Windows phone users would have to access it, anyway.

Here's the icon to click to get an app icon on your home screen.
(https://img.skitch.com/20120419-kau43a1g5nh4kanyxfg17tetg1.jpg)

I'm not sure why the mobile version works on your iPad but not the iPhone. Are they the same OS version? You added the script before </head> right? Not after? Maybe it is because you are opening it with Word? If you'd like, zip the index.html file and send it to me in a PM and I'll take a look at it.

Steve

[EDIT] Your site works for me on my iMAc. I'll try the iPhone. http://www.john-carty.com/weather/ipwx.html

[EDIT 2] Found it! You need to move the script up before the </head> tag.

(https://img.skitch.com/20120419-18pbrny7ctqiarefpxk2f2gcah.jpg)

I've modified the instructions in the original post to make this more clear, and included the image of the button for creating the Home Screen icon.
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: JosBaz on April 19, 2012, 07:30:21 PM
Hi Steve,

Works perfectly for me [tup] and nicely showing the right units.

Many thanks!

Jos
Title: Thanks Steve!! (Re: WeatherCat ipwx Mobile web template)
Post by: elagache on April 20, 2012, 12:50:05 AM
Howdy Steve and WeatherCat fans,  [cat]

I just got around to installing everything and testing it out.  Works Great!!  [tup]

Thanks Steve for taking the time to get this done! (http://www.canebas.org/Weather/LWC_forum/Custom_emoticons/thankyou.gif)

Cheers, Edouard  [cheers1]

P.S. Now if I could only find some time to do the things I've promised!! (http://www.canebas.org/Weather/LWC_forum/Custom_emoticons/sad-smiley.png)
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: tigers on April 20, 2012, 01:35:52 AM
Glad yall got this working. I still have the original on my website that I modified to account for ios 5. I'm working a new one to incorporate in my ajax template. Once that project is done, I'll see about splitting off the new version for standalone use if it's desired.

The newer libraries for jqtouch are a bit smaller and should make things load a little faster.
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: Steve on April 20, 2012, 01:56:30 AM
Todd,

Take a look at these two thread on the MacWeather forum. One was a fix to Max/Min flipped on the wxi template, and the other was the changes to the mobile template. Edouard accepted for some jqtouch changes.

http://macweather.net/viewtopic.php?f=12&t=395

http://macweather.net/viewtopic.php?f=12&t=269
Title: Thanks Todd! (Re: Atkins ipwx Mobile web template)
Post by: elagache on April 20, 2012, 02:50:23 AM
Hi Todd and WeatherCat fans,

Glad yall got this working. I still have the original on my website that I modified to account for ios 5. I'm working a new one to incorporate in my ajax template. Once that project is done, I'll see about splitting off the new version for standalone use if it's desired.

Thanks Todd for taking a look at this too!  [tup]

Sure is amazing, all this work we humans are doing just for a . . . . cat!!  [cat]

Cheers, Edouard  [cheers1]

P.S. Ya' think that Stu is just an Internet pseudonym for Meg?  [lol2]
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: xtommo on April 20, 2012, 07:19:00 AM
That would be awesome to incorporate a flashy looking mobile version into the new AJAX templates.

the IPWX was very easy to set up and so is AJAXLINE so you've done well to keep it simple but impressive looking.



Glad yall got this working. I still have the original on my website that I modified to account for ios 5. I'm working a new one to incorporate in my ajax template. Once that project is done, I'll see about splitting off the new version for standalone use if it's desired.

The newer libraries for jqtouch are a bit smaller and should make things load a little faster.
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: WCDev on April 22, 2012, 11:30:57 AM
Sorry chaps, haven't been keeping up with the templates threads.

When a template is 'complete', I'm 'stickying' them to make them easy to find - is this one suitable for stickying now Steve?

Cheers,
Stu.

Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: Steve on April 22, 2012, 01:13:52 PM
Hi Stu,

It sounds like it works well for most folks. I don't have the documentation mojo that Edouard has, but it seems to be adequate.

Steve
Title: Ya' know . . . . (Re: Atkins ipwx Mobile web template)
Post by: elagache on April 22, 2012, 03:14:31 PM
Howdy Steve, Stu, and WeatherCat fans,

I don't have the documentation mojo that Edouard has . . . .

 ;) Ya' know . . . . that just might be a good thing!!  [lol2]

Cheers, Edouard  [cheers1]
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: WCDev on April 22, 2012, 03:34:29 PM
Ta, stickied.
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: jace on April 22, 2012, 06:13:16 PM
Hi Steve

 [woohoo] Finally, after much trials and tribulation, nashing of teeth, throwing ashes over my head, wailing, flogging myself with a birch branch (voted No:1 by sadiomachists monthly mag), it's not only working on my iPad but also on my iPhone.

I decided after everything else I'd tried, to delete the copy of ipwx.html that was in my Web folder and also the on-line copy and replaced the web folder copy with a fresh copy. Working !  [computer]

Oh I've got a copy of PageSpinner like you suggested, better than the other editors I've tried. Thanks  [cheers1]

JC
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: wurzelmac on April 22, 2012, 06:20:02 PM
Just downloaded & installed it. After translating the corresponding words to german in the "ipwx_Cam.html" it works fine and smooth. I used the "original LWC"-Template till now with no problems, but I thought I might replace it with the newer one. As I said above, it is working well!
 :)
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: Steve on April 22, 2012, 08:18:21 PM
I'm glad to hear that it works for you now, John. I can't help but think that trying to open in it three different text editors might have had something to do with it.
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: homerc on May 07, 2012, 12:30:11 AM
I must be missing something but I can not find the index.html file referenced in the instructions.  Do you mean the ipwx.html file?? [banghead]
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: Steve on May 07, 2012, 02:20:39 AM
Hi Homer, and welcome to the WeatherCat forum!

I'm sorry for any confusion with the index file. Let me see if I can clarify what is needed. The mobile web template described in this thread is meant to be used in conjunction with WeatherCat's Custom Web function. (WeatherCat Preferences --> On-Line tab --> Custom Web) If you are using Simple Web or are not using any web page design, it will not work.

Custom Web templates for WeatherCat use an HTML file called index.html as the default home page. To use the mobile web template, the index.html file needs to be modified. The index.html file is not included in this template, as it should already be in your WeatherCat Custom Web folder.

So, for starters, do you already have a custom web page set up and working with WeatherCat? If so, did you use one of the templates included with WeatherCat?

Steve


[EDIT] Ah, I see in another thread, you are trying to use the AJAXeline PHP template. The AJAXeline and Ken's Saratoga PHP templates were designed after the mobile template was created, so I didn't take them into account in my documentation. I think the mobile template will work with PHP, but have not tested it. You would follow the instructions as before, but instead of editing the index.html file, you would make the exact same edit to the index.php file.

Make sense now? Note that you will have to have the AJAXeline web template up and working before the mobile version will function.
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: homerc on May 07, 2012, 02:53:33 PM
Thanks for your reply.  First off I do not have a 'WeatherCat Custom Web folder', it was not in the package that contained WeatherCat Version 1.0. Second no I don't have a custom web page working with WeatherCat.  Trying to set up the AJAXeline page I seem to be missing several jpg files as show up as missing in the Safari activity page.  So are the packages complete or do I need to download some more files?
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: N8NOE on October 14, 2012, 05:06:59 PM
Just Trying this out here, And Find I KNOW ZERO to less than that of Webpages..
Trying to get the Humidor Information on this to show and looking for INSIDE Temp/Humidity.
THINK I Got the Right Tags now, but this is a PLUSS along with the iOS app..
Great Stuff..
THANKS..
YOU can look at my Info see if it works on the Phone, just click the GRAPH on my Home page..
Jeff-N8NOE
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: sbolch on January 07, 2013, 04:49:26 AM
Forgive me, but I am new to this software and new to the Mac (though not inexperienced in web authoring and have used other weather station software for some time). I have followed the instructions in the supplied documentation, the redirect is clearly working (the iPhone sends me to a page that looks like your template), but there is no data, only tags as shown in the attached screen grab - eg. STAT$RAIN:TOTAL:RAINUNITS$

I suspect there is something fairly simple and fundamental I have done wrong or not done (there appears to be no file uploaded to my webserver containing realtime data, for example) but I cannot see what it is.

Help appreciated...
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: Steve on January 07, 2013, 02:44:18 PM
Hi sbolch, and welcome to the WeatherCat forum!

It looks like you've got it started correctly, so let's verify some things:

1 - ipwx folder is on your web space at the same level as the index.html
2 - ipwx contains extensions, jqtouch, themes folders and apple-touch-icon.png
3 - You have enabled Custom Web Pages and entered your FTP settings correctly in the WeatherCat Preferences -->On-Line --> Custom Web tab.
4 - The ipwx.html (or ipwx_Cam.html) template is in your local WeatherCat Custom Web Templates folder (or whatever HTML source target you have set)

If all of the above is correct, you should have good info on your mobile web page. If not, take a look at your WeatherCat Custom Web folder (or wherever you've set as your Set Save Path) Is the ipwx.html (or ipwx_Cam.html) file there? If so, open in in Safari and see if the data has been populated by WeatherCat.

Let us know what you find and we can try to figure out what's going on.

Good luck, and again, welcome!
Steve
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: sbolch on January 08, 2013, 10:44:10 PM
Thank you for the welcome and for the advice!

I've used a few different open-source and licensed weather station packages over the years, but I'm particularly impressed by the user and developer community here and the willingness to help. It is appreciated!

I had missed Step 4 in your instructions and have rectified this, but still no joy with live data unfortunately - same error as previously. The local file seems to be being created, but no live data is uploaded. Possibly and FTP addressing error at my end - I also had difficulty with the FTP upload crashing issue reported in other places on this forum - but so far this seems to be fixed with the 1.13 build 101 development patch...

[EDIT] Aha, development build seems to have fixed it! Thanks for the help!  [bounce]
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: petter on February 27, 2013, 05:45:11 PM
First post after installing the WMR200 for my mother. :)

After a few attempts I finally managed to get the ipwx template working on the iphone together with the Simple Web for web clients.
I edited the ipwx.html and saw it was coded as UTF-8 so I went a head and localized it to Swedish.
But after a few updates the localized ??? characters was over written like this:

? = ??
? = ??
? = ??

Which files do I need to change to get the localized text to stay?

Encoded it. All solved :)


Code: [Select]
? = &#227;
? = &#228;
? = &#246;
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: TechnoMonkey on December 17, 2015, 02:33:32 AM
I finally got the template working on my iPhone locally.  My station name is 'TechnoMonkeys' but it shows as 'Technomonk...',  I am sure it is a CSS tweak to fix, but being less than fluent in CSS, I have been unable to make it happen.
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: TechnoMonkey on December 24, 2015, 09:04:31 PM
I have added the moon to the ipwx template.

www.technomonkeys.com/Weather/WCFILES/ipwx.php (http://www.technomonkeys.com/Weather/WCFILES/ipwx.php)
Title: Call Desktop Version | Links
Post by: dfw_pilot on January 29, 2016, 12:33:04 AM
Technomonkey, I see you fixed your css issues on the width of the site title. I too had to make an adjustment to get my title to fit, via theme.css | .toolbar > h1 adjusting | "margin: 1px 0 0 -125px;" and "width: 250px;" BTW, nice job adding the extra pages into your mobile site; it looks great!

To Steve, Edouard, and everyone smarter than me: there are two issues with the ipwx.html file that I can't seem to understand. For the time being, I've commented out the script to load the mobile site until I might be able to find a fix.

1) Is there a way to call the desktop version once in the mobile site? The latest versions of iOS allow an option to "Request Desktop Site" which is fantastic, except the ipwx.html file doesn't allow that iOS option to work.

2) I tried to add a link in the footer to "Go back to the main site" but unless a target="_blank" is placed in the link, the links don't work. Examples of footer links not working are at technomonkey's mobile site  (http://67.222.96.12/~technomo/Weather/WCFILES/ipwx.php#page0), canebas's mobile site (http://www.canebas.org/Weather/ipwx_Cam.html#page1), and avon-wx's mobile site (http://www.avon-weather.com/ipwx_Cam.html#page1). Even stranger? The links work in the Desktop Safari browser, but not in the Safari iOS browser. Strange!
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: xairbusdriver on January 29, 2016, 01:29:28 AM
CSS can help you avoid two (or more) different versions of a site for different platforms/browsers/devices. Really handy! And no javascript required, either! [cheer]
Title: JavaScript probably overrides (Re: Call Desktop Version | Links)
Post by: elagache on January 29, 2016, 11:41:44 PM
Dear Toby, X-Air, and WeatherCat web spinners,

1) Is there a way to call the desktop version once in the mobile site? The latest versions of iOS allow an option to "Request Desktop Site" which is fantastic, except the ipwx.html file doesn't allow that iOS option to work.

I don't know what the other problem is since I didn't write that template, but I think I can explain this problem.  The mechanism to select which website is this snippet of JavaScript:

Code: [Select]
    <!-- *** Begin Script to redirect iPhone to ipwx.html remove if not desired *** -->
    <script type="text/javascript">
(function(){var c=navigator.userAgent,a=window.location,d=document.cookie,b=a.href;
if(c.match(/iP(od|hone)/i)||c.match(/Android/i))if(d.indexOf("iphone_redirect=false")<0)a.href="ipwx_Cam.html";
})();
</script><!-- *** End Script to redirect iPhone *** -->

I suspect that this is antiquated and should be replaced with something else to work properly with iOS 9.  Since it is running in the main index.html file, when you attempt to load the desktop site, it automatically goes back to the mobile site - thus causing your problem.

Since you seem to be full of clever HTML tricks, would you know by chance what is the modern replacement so this behavior doesn't occur?

Cheers, Edouard  [cheers1]
Title: Sorry, No
Post by: dfw_pilot on January 29, 2016, 11:50:46 PM
Sorry, no I don't. That's why I brought it up. I'll Google some more.

Here's to hoping I'm not the only one submitting to the HTML tricks post :)
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: xairbusdriver on January 29, 2016, 11:55:08 PM
Not specific to javascript at all, but one "modern" solution is to design with CSS. Many suggest starting with a small screen (mobile) first and adjust placement and object size as space increases. That's one of the reasons I stopped using the "templates". They all seems to have fixed size objects designed for more than 1000 pixel windows. I've created (I really can't say I "designed" them, that implies the possession of at least minimal artistic skills! [blush] ) my two sites in the opposite direction, large to small. But hey are more than able to be used/viewed on mobile devices and 5K screens. It's called "build once, view anywhere".
Title: Intrigued
Post by: dfw_pilot on January 29, 2016, 11:59:03 PM
I'm intrigued!
Title: Modern doesn't code itself . . . (Re: Atkins ipwx Mobile web template)
Post by: elagache on January 30, 2016, 12:11:51 AM
Dear Toby, X-Air, and WeatherCat extremely busy types,

Not specific to javascript at all, but one "modern" solution is to design with CSS.

Yes, X-Air you are correct, but I don't have the time to learn the modern version of HTML  There was a time when HTML was in the range of amateurs, but it has become a very complex and powerful environment intended for the web development professionals who have create websites like Amazon's.

To me, the evolution of the web has been a real disservice to the "man in the street."  When it started out, it was simple because nobody was sure what it was good for.  As it evolved, it was clear it could be used for many things, but HTML didn't evolve into multiple environments for the various needs.  Instead of recognizing that we needed an "every-person's" HTML as well an industrial strength version - the needs of people to express themselves on the web was basically tossed aside in favor of business.  Because of that business focus at the expense of the netizens of the Internet, we have no voice unless either we work very hard or give in to services like Facebook.  It isn't like Facebook really provides a versatile creative environment that allows for a wide variety of individual expression.

I'm not sure how much effort to invest trying to keep up with web applications, but unless you make a living at it, eventually you will be drowned in details.  Even those in the business I suspect have a lot of on the job training to keep up with all the innovations.  Unless you have tonnes of time on your hands and want spend that time in front of a computer screen, this is a battle you will lose sooner or later.

Edouard
Title: WordPress
Post by: dfw_pilot on January 30, 2016, 12:19:51 AM
Because of that business focus at the expense of the netizens of the Internet, we have no voice unless either we work very hard or give in to services like Facebook.

I have to disagree with this one point. I don't care much for Facebook because I want to own the content. An easy, simple, elegant, modern, secure way for "everyman on the street" to have a nice looking voice on the internet can be found here:

WordPress (http://wordpress.org)

All the best,

dfw
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: xairbusdriver on January 30, 2016, 12:47:12 AM
Quote
I'm intrigued!
If you're talking about CSS, it's called "media queries". You first need to understand that all styling is done with CSS, not with html. You then have CSS note how many pixels wide any 'screen' may be and then have any needed classes/ID's set new values for that size. A 'screen' could even be a printer.

Unlike javascript, very few people know CSS can be blocked or removed, at least temporarily. Lots of sites discussing/using this idea. Here's a rather old page describing "media queries (https://www.smashingmagazine.com/2010/07/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-website/)".
Title: Re: WeatherCat version of the Atkins ipwx Mobile web template for iPod/iPhone
Post by: xairbusdriver on January 30, 2016, 01:06:55 AM
To each his own. :) HTML has finally become highly useful with version 5. At first there were lots of browser maker pre-fixes that had to be included so it worked on those browsers that supported HTML5. Now, most of those browser builders are just dropping their proprietary names and building in support for most of the web-kit functions. It's one case where Apple has dominated an industry. HTML (and CSS), of course, are not languages. You don't 'program' in HTML (or CSS). They are still absolutely nothing but plain text files that the browser parses into what you see. They are both really just a (slowly growing) collection tags and key words.

I was never able to create anything in AppleScript (or Automator, for that matter) that didn't require a UNIX reference! ;) Like Apple itself, it's demise has been forecast for the last 20 years! [lol]

HTML and CSS have a very healthy, non-commercial, support group. But I find it much simpler than any other real programming language I've attempted to learn. However, I have no desire to ever make any income by building anything with these very powerful tools. I am free to try anything I can think of. I may not succeed, but I enjoy the process and usually learn something along the way. I suspect that those last two sentences apply equally to you, Edouard!

Frankly, I'm too stubborn [I should probably just end this sentence right here! [blush] ] to work with what some 'client' wants instead of what I want! I'm retired, I don't have any boss/client/manager! At least for the next week or so while my wife is busy in DC...  [rolleyes2] [rockon]