Mike, WOW! Thanks so much! This is TOTALLY the kind of thing I was looking for. Thanks for taking the time to do such a thorough mock-up! You ROCK, dude!
Thanks... can't wait to go try this out! - John On Sep 8, 10:18 am, "Michael Geary" <[EMAIL PROTECTED]> wrote: > Brad has a great idea there. > > To really protect your page, you need to take one more step. (I assume you > have other content on the page, right?) > > If ibegin.com is down in a way that results in a slow timeout instead of an > immediate "unavailable" response, it will delay loading the rest of your > page until the browser times out. > > To fix this, move the weather gadget out of your page and into an IFRAME. > That way, no matter what goes wrong at ibegin.com, it will never affect the > rest of your page. > > Inside the IFRAME, you can use code similar to Brad's. > > Here's a working test page: > > <http://mg.to/test/ibegin/ibegin.html>http://mg.to/test/ibegin/ibegin.html > > The iframe for this page is in: > > <http://mg.to/test/ibegin/weatherframe.html>http://mg.to/test/ibegin/weatherframe.html > > And here's a "broken" test page. It's the same code with a deliberate error > in the ibegin URL: > > <http://mg.to/test/ibegin/wunder.html>http://mg.to/test/ibegin/wunder.html > > That deliberate error is actually in the iframe code, so it uses a different > copy of the iframe just for testing: > > <http://mg.to/test/ibegin/weatherframe1.html>http://mg.to/test/ibegin/weatherframe1.html > > You'll notice it loads a Weather Underground gadget instead of just a static > image. That seems more useful than a static image, and the chances of both > weather services being down seems pretty low. (And in that case the rest of > your page would still load fine because of the iframe.) > > For reference, here's the <iframe> tag in ibegin.html: > > <iframe frameborder="0" style="width:220px; height:320px; > overflow:hidden;" src="weatherframe.html"> > </iframe> > > And here's the complete HTML for the iframe (weatherframe.html): > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> > <html lang="en"> > <head> > <title></title> > </head> > <body scroll="no" style="margin:0; padding:0;"> > > <script type="text/javascript" > src="http://weather.ibegin.com/js/us/ak/ninilchik/0/0/1/1/0/custom.js > <http://weather.ibegin.com/js/us/ak/ninilchik/0/0/1/1/0/custom.js&back... > _color=transparent&color=093384&width=200&padding=0&border_width=0&border_c o > lor=transparent&font_size=18&font_family=inherit&showicons=1> > &background_color=transparent&color=093384&width=200&padding=0&border_width = > 0&border_color=transparent&font_size=18&font_family=inherit&showicons=1"> > </script> > > <script type="text/javascript"> > if( ! document.getElementsByTagName('div').length ) > document.write( > '<div style="text-align:center;">', > '<a > href="http://www.wunderground.com/US/AK/Ninilchik.html?bannertypeclick=infob > ox" > <http://www.wunderground.com/US/AK/Ninilchik.html?bannertypeclick=infobox>>', > > '<img > src="http://banners.wunderground.com/weathersticker/infobox/language/www/US/ > AK/Ninilchik.gif" border=0 alt="Click for Ninilchik, Alaska Forecast" > height=108 width=144>', > '</a>', > '</div>' > ); > </script> > > </body> > </html> > > As you can see, the code doesn't use jQuery, and it doesn't use a 2 second > timeout either. There's no need for any of that, and you wouldn't want the > overhead of loading jQuery in this little iframe anyway. > > Script tags are executed in the order in which they appear in the source. > When the second script tag is run, the first one (loaded from ibegin.com) > has already completed execution and created its DIV elements - or failed to > execute, whichever the case may be. > > So the second script tag can immediately test for the <div> that the first > one creates, and if it's not there it does a document.write to add the > Weather Undergound gadget instead. > > -Mike > > > > > From: bcbounders > > > Brad, > > > Interesting approach... I like it! Now I'll see if I can get > > this to work on the site... like replacing the missing widget > > with a static image or something... so the page doesn't have > > a gaping hole where the weather's supposed to be (which is > > what was happening when iBegin was down and the widget > > wouldn't load, on-and-off all day a few days ago). > > > Thanks a lot!!! > > > - John > > > On Sep 7, 6:22 pm, Brad <[EMAIL PROTECTED]> wrote: > > > Here is a different approach. Include the javascript source for the > > > weather.ibegin.com in the body of your page. On load run a delayed > > > function to see if it has written its forecast to your page. I ran > > > this on a test page and it worked. I could never get the > > ibegin source > > > to fail, therefore I had to change the script source to > > something else > > > likehttp://foo.weather.ibegin.com/... to simulate failure. > > BTW, I was > > > playing with the widget, so my example gets a different > > forecast than > > > yours. > > > > <script> > > > > var ibeginHTML; > > > function ibeginLoaded() { > > > ibeginHTML = $("#ibegin div").html(); > > > if (ibeginHTML == null) { > > > alert('Widget not loaded'); > > > // You'd do something useful here > > like insert > > > your missing widget image > > > } > > > } > > > > function ibeginTest() { > > > // Give the widget a few seconds to load > > > setTimeout('ibeginLoaded();',2000); > > > } > > > > $().ready(function(){ > > > ibeginTest(); > > > }); > > > > </script> > > > </head> > > > <body> > > > ... other content ... > > > <div id="ibegin"> > > > <script type="text/javascript" > > src=" <http://foo.weather.ibegin.com/js/> > > http://foo.weather.ibegin.com/js/> > us/nm/santa+fe/1/1/1/1/1/ > > > custom.js&background_color=ffffff&color=000000&width=175&padding=10&bo > > > rder_ > > > width=1&border_color=000000&font_size=11&font_family=Tahoma&showicons= > > > 1"></ > > > script><noscript><a href=" <http://weather.ibegin.com/> > > http://weather.ibegin.com/";>Weather > > > > Information by iBegin</a></noscript> > > > </div> > > > ... more content ... > > > </body> > > > </html> > > > > On Sep 7, 3:55 pm, bcbounders <[EMAIL PROTECTED]> wrote: > > > > > OK... so here's what I've got so far. I'm trying to work out the > > > > jQuery so that if the iBegin weather widget is > > successfully loaded, > > > > then the <div id="weather"> is shown... otherwise, it's hidden. > > > > > <script type="text/javascript"> > > > > jQuery.ready(function(){ > > > > jQuery("#weather").replaceWith({ > > > > jQuery.ajax({ > > > > type: "GET", > > > > dataType: "script", > > > > url: > > > > " <http://weather.ibegin.com/js/us/ak/ninilchik/0/0/1/1/0/> > > http://weather.ibegin.com/js/us/ak/ninilchik/0/0/1/1/0/ > > > > > custom.js&background_color=transparent&color=093384&width=200&paddin > > > > g=0&bor > > > der_width=0&border_color=transparent&font_size=18&font_family=inheri > > > > t&showi cons=1", > > > > success: function(){ > > > > > jQuery("#weather").show() > > > > }, > > > > error: function(){ > > > > > jQuery("#weather").hide() > > > > } > > > > }); > > > > }); > > > > }); > > > > </script> > > > > > But... what I've got isn't working. And, being new to > > jQuery (and > > > > Javascript), I'm not sure why it's not working... or even > > if this is > > > > the best route to try and achieve what I want. > > > > > Can someone take a look and provide some feedback? I'd really > > > > appreciate it! > > > > > Thanks a lot! > > > > > - John > > > > > On Sep 6, 10:49 am, bcbounders <[EMAIL PROTECTED]> wrote: > > > > > > Rene, > > > > > > Thanks so much for posting. > > > > > > I got the site up, using the iBegin weather widget on > > it's own. > > > > > If it helps, here's a link: <http://tinyurl.com/5n8mco> > > http://tinyurl.com/5n8mco > > > > > > > > I'll take a stab at doing what you suggest... wish me > > luck! :D But... > > > > > expect to hear more questions from me soon. > > > > > > - John
