Page 5 of 7

Re: All the help you can give me pt 3 html css

Posted: Mon 01 Nov 2010 9:25 pm
by pacificblue03
Wow so many replies since i slept :)

Um do i really need to change the coding since if you go there now arrows are doing what they should?

Antonio.

Re: All the help you can give me pt 3 html css

Posted: Mon 01 Nov 2010 9:32 pm
by Synewave
You don't have to, but the following code for pressure would be much simpler:

Code: Select all

<td><#press>&nbsp;<#pressunit><script type="text/javascript">
var temp = <#presstrendval>;
if (temp==0){var imagen = "steady.bmp";}
if (temp>0){var imagen = "up.bmp";}
if (temp<0){var imagen = "down.bmp";}
document.write('<img src="images/'+imagen+'"/>');
</script></td>
As mcrossley (Mark) pointed out, you seem to have hard-coded the pressure trend value, so currently your pressure is rising but the arrow is a downwards pointing one. Use the above code please, it will work.

Also, as Beteljuice has pointed out, you shouldn't use .bmp images as they are large files. Use .jpg preferably.

Re: All the help you can give me pt 3 html css

Posted: Mon 01 Nov 2010 9:44 pm
by pacificblue03
Synewave wrote:You don't have to, but the following code for pressure would be much simpler:

Code: Select all

<td><#press>&nbsp;<#pressunit><script type="text/javascript">
var temp = <#presstrendval>;
if (temp==0){var imagen = "steady.bmp";}
if (temp>0){var imagen = "up.bmp";}
if (temp<0){var imagen = "down.bmp";}
document.write('<img src="images/'+imagen+'"/>');
</script></td>
As mcrossley (Mark) pointed out, you seem to have hard-coded the pressure trend value, so currently your pressure is rising but the arrow is a downwards pointing one. Use the above code please, it will work.

Also, as Beteljuice has pointed out, you shouldn't use .bmp images as they are large files. Use .jpg preferably.
Ok i shall try this code now i didnt realise it was rising :)

Antonio.

Re: All the help you can give me pt 3 html css

Posted: Mon 01 Nov 2010 9:47 pm
by pacificblue03
Ok now ere are cooking ( with canola oil )

the arrow is now rising

this is such a helpful forum i swear

So now i want to use this image

Image

using photoshop i will break it down and size it down accordingly and i want to use them to replace where it says the wind in words like F2 light breeze will be the 3rd image down, do you catch me?

Antonio.

Re: All the help you can give me pt 3 html css

Posted: Mon 01 Nov 2010 10:13 pm
by pacificblue03
OK have redone the above image into little images and this is how each would appear.

F0
Image
F1
Image
F2
Image
F3
Image
F4
Image
F5
Image
F6
Image
F7
Image
F8
Image
F9
Image
F10
Image
F11
Image
F12
Image

So once i work out the coding thats what will replace <#beaudesc>

Antonio.

Re: All the help you can give me pt 3 html css

Posted: Mon 01 Nov 2010 10:23 pm
by pacificblue03
Ok so might i be using this code?

<td>Beaufort&nbsp;<#beaufort></td>
<td><#beaudesc><script type="text/javascript">
var windscale ="<#beaufort>";
if (windscale=="F0") {var imagen = "F0.jpg";}
if (windscale=="F1") {var imagen = "F1.jpg";}
if (windscale=="F2") {var imagen = "F2.jpg";}
if (windscale=="F3") {var imagen = "F3.jpg";}
if (windscale=="F4") {var imagen = "F4.jpg";}
if (windscale=="F5") {var imagen = "F5.jpg";}
if (windscale=="F6") {var imagen = "F6.jpg";}
if (windscale=="F7") {var imagen = "F7.jpg";}
if (windscale=="F8") {var imagen = "F8.jpg";}
if (windscale=="F9") {var imagen = "F9.jpg";}
if (windscale=="F10") {var imagen = "F10.jpg";}
if (windscale=="F11") {var imagen = "F11.jpg";}
if (windscale=="F12") {var imagen = "F12.jpg";}
document.write('<img src="images/'+imagen+'"/>');
</script></td>

Antonio.

Re: All the help you can give me pt 3 html css

Posted: Mon 01 Nov 2010 10:26 pm
by pacificblue03
Yep that seems to work

Antonio.

Re: All the help you can give me pt 3 html css

Posted: Mon 01 Nov 2010 11:09 pm
by mcrossley
So would (no Javascript all all)...

Code: Select all

<td>Beaufort&nbsp;<#beaufort></td>
<td><#beaudesc><img src="images/<#beaufort>.jpg"/></td>

Re: All the help you can give me pt 3 html css

Posted: Mon 01 Nov 2010 11:25 pm
by pacificblue03
mcrossley wrote:So would (no Javascript all all)...

Code: Select all

<td>Beaufort&nbsp;<#beaufort></td>
<td><#beaudesc><img src="images/<#beaufort>.jpg"/></td>
um im sorry but i tried that and it didnt work so i reverted it.


I have a added weather icon per forecast it took me a while to work out what i wanted but here it is and it does work too

____________________________________________________________

<script type="text/javascript">
var forecast ="<#forecast>";
if (forecast=="Exceptional Weather") {var imagen = "Exceptional Weather.png";}
if (forecast=="Settled finer") {var imagen = "Settled fine.png";}
if (forecast=="Fine weather") {var imagen = "Fine weather.png";}
if (forecast=="Becoming fine") {var imagen = "Becoming fine.png";}
if (forecast=="Fine, becoming less settled") {var imagen = "Fine, becoming less settled.png";}
if (forecast=="Fine, possible showers") {var imagen = "Fine, possible showers.png";}
if (forecast=="Fairly fine, improving") {var imagen = "Fairly fine, improving.png";}
if (forecast=="Fairly fine, possible showers early") {var imagen = "Fairly fine, possible showers early.png";}
if (forecast=="Fairly fine, showery later") {var imagen = "Fairly fine, showery later.png";}
if (forecast=="Showery early, improving") {var imagen = "Showery early, improving.png";}
if (forecast=="Changeable, mending") {var imagen = "Changeable, mending.png";}
if (forecast=="Fairly fine, showers likely") {var imagen = "Fairly fine, showers likely.png";}
if (forecast=="Rather unsettled clearing later") {var imagen = "Rather unsettled clearing later.png";}
if (forecast=="Unsettled, probably improving") {var imagen = "Unsettled, probably improving.png";}
if (forecast=="Showery, bright intervals") {var imagen = "Showery, bright intervals.png";}
if (forecast=="Showery, becoming less settled") {var imagen = "Showery, becoming less settled.png";}
if (forecast=="Changeable, some precipitation") {var imagen = "Changeable, some precipitation.png";}
if (forecast=="Unsettled, short fine intervals") {var imagen = "Unsettled, short fine intervals.png";}
if (forecast=="Unsettled, precipitation later") {var imagen = "Unsettled, precipitation later.png";}
if (forecast=="Unsettled, some precipitation") {var imagen = "Unsettled, some precipitation.png";}
if (forecast=="Mostly very unsettled") {var imagen = "Mostly very unsettled.png";}
if (forecast=="Occasional precipitation, worsening") {var imagen = "Occasional precipitation, worsening.png";}
if (forecast=="Precipitation at times, very unsettled") {var imagen = "Precipitation at times, very unsettled.png";}
if (forecast=="Precipitation at frequent intervals") {var imagen = "Precipitation at frequent intervals.png";}
if (forecast=="Precipitation, very unsettled") {var imagen = "Precipitation, very unsettled.png";}
if (forecast=="Stormy, may improve") {var imagen = "Stormy, may improve.png";}
if (forecast=="Stormy, much precipitation") {var imagen = "Stormy, much precipitation.png";}
if (forecast=="Not available") {var imagen = "Not available.png";}
document.write('<img src="images/'+imagen+'"/>');
</script>

Antonio.

Re: All the help you can give me pt 3 html css

Posted: Mon 01 Nov 2010 11:58 pm
by mcrossley
Hmm, not sure why that wouldn't work. What did the generated HTML look like?

For your forecast, it may have been simplier to use the forecast number = <#forecastnumber> rather than the text, and again it should work without any code if you named the forecast images say forecast1.png through forecast26.png
Then, this *should* work...

Code: Select all

<img src="images/forecast<#forecastnumber>.png" />
Though I'm not sure what Cumulus does with #forecastnumber for the two 'exceptions' = "Not available" and "Exceptional Weather", so maybe this would be better...

Code: Select all

<script type="text/javascript">
var forecast ="<#forecast>";
var imagen = "forecast<#forecastnumber>.png";
if (forecast=="Not available") imagen = "Not available.png";
else if (forecast=="Exceptional Weather") imagen = "Exceptional Weather.png";
document.write('<img src="images/'+imagen+'"/>');
</script>

Re: All the help you can give me pt 3 html css

Posted: Tue 02 Nov 2010 12:03 am
by pacificblue03
mcrossley wrote:Hmm, not sure why that wouldn't work. What did the generated HTML look like?

For your forecast, it may have been simplier to use the forecast number = <#forecastnumber> rather than the text, and again it should work without any code if you named the forecast images say forecast1.png through forecast26.png
Then, this *should* work...

Code: Select all

<img src="images/forecast<#forecastnumber>.png" />
Though I'm not sure what Cumulus does with #forecastnumber for the two 'exceptions' = "Not available" and "Exceptional Weather", so maybe this would be better...

Code: Select all

<script type="text/javascript">
var forecast ="<#forecast>";
var imagen = "forecast<#forecastnumber>.png";
if (forecast=="Not available") imagen = "Not available.png";
else if (forecast=="Exceptional Weather") imagen = "Exceptional Weather.png";
document.write('<img src="images/'+imagen+'"/>');
</script>
ok lets go and try it Under my current forecast to see if the same thing happens.

Re: All the help you can give me pt 3 html css

Posted: Tue 02 Nov 2010 12:06 am
by pacificblue03
Ok so i went and used the code next to the one i made and this is result

Image

no image :( i made mine like i did for this reason.

Re: All the help you can give me pt 3 html css

Posted: Tue 02 Nov 2010 12:07 am
by beteljuice
Why are you comparing strings (which may alter) ? - use forecast number instead. There is a thread or two somewhere on how to do it.

Code: Select all

var forecast ="<#forecast>";
if (forecast=="Exceptional Weather") {var imagen = "Exceptional Weather.png";}
Two things ...
no need to declare a var forecast, just use

if (<#forecast> ==

You should NOT have server (web) files with spaces in the names !!!!! - can cause all sorts of problems.

eg. Exceptional Weather.png

Plus the mix of upper and lower case can sometimes play tricks on (your) memory.

Better something like exceptional_weather.png - BUT there is no such forecast !!!
again see the threads or the wiki - it is a PREFIX to to Fine or Stormy when the 'normal' range boundaries have been exceeded.

[crossed post with above]

Re: All the help you can give me pt 3 html css

Posted: Tue 02 Nov 2010 12:15 am
by mcrossley
I just looked at your page, the code worked fine. You ended up with..

<img src="images/forecast5.png" />

But you haven't created the images forecast1.png, forecast2.png,... etc It can't display them if they aren't there :(

Thanks for the reminder beteljuice on "Exceptional Weather".

The code should then be...

Code: Select all

<script type="text/javascript">
var forecast ="<#forecast>";
var imagen = "forecast<#forecastnumber>.png";
if (forecast.toLowerCase()=="not available") imagen = "not_available.png";
document.write('<img src="images/'+imagen+'"/>');
</script>
It would be handy if Cumulus set the forecast number to 0 for 'unavailable' - or maybe it already does?

Re: All the help you can give me pt 3 html css

Posted: Tue 02 Nov 2010 12:22 am
by beteljuice
If using forecast number:

-1 (neg 1) = Exceptional Fine
0 (zero) = unavailable
-26 (neg 26) = Exceptional Bad