So how can you sex it up ?
.. here is a DIY Javascript lesson so that you could add (icon) graphics to your text
Working for the moment Example
First of all this is designed for working in Templates. ie. processed by Cumulus.
Somewhere to suit in your xxxxT.htm you need something like:
Code: Select all
<p>Observations <script>parse_cond();</script></p>
Code: Select all
<p>Observations <#currcond></p>
In the <HEAD> section of xxxxT.htm lets set up some variable and start defining the function:
Code: Select all
<script type="text/javascript" language="JavaScript">
cond_pic_dir = "curr_weather/icons/"
// cond_time = (<#isdaylight> ? "day_" : "night_");
// if you only want day icons use cond_time = "day_";
cond_time = "day_";
curr_cond = "<#currcond>";
function parse_cond() {
if(curr_cond) {
// replace any icon 'commands' eg. :FINE:
// :FINE:
curr_cond = curr_cond.replace( /:FINE:/g, "<img src = \"" + cond_pic_dir + cond_time + "clear.png\" />");
We have given the capability of day / night icons (but this has been over ridden to only show day icons)(day icons are prefixed day_ and night icons night_, some icons [fog] have no prefix)
Code: Select all
// :FINE:
curr_cond = curr_cond.replace( /:FINE:/g, "<img src = \"" + cond_pic_dir + cond_time + "clear.png\" />");
In this case to use the graphic you would type in your Cumulus conditions box eg. Today has been mostly fine :FINE:
The format of the 'instruction' is :instruction:, you call them anything you want and associate any icon you want.
The code has been written to ensure multiple duplicate icons can be handled.
For a full explanation of replace [RegExp] see http://www.w3schools.com/jsref/jsref_replace.asp
Put in all the 'instructions' you want, then we need to tidy up and finish the function:
Code: Select all
// :SNOW:
curr_cond = curr_cond.replace(/:SNOW:/g, "<img src = \"" + cond_pic_dir + cond_time + "snow.png\" />");
} else { // NO current conditions found
curr_cond = "N/A";
} // END if curr_cond
document.write(curr_cond);
} // END function parse_cond()
</script>
... and that's it - you're a coder
OK, OK here's a zip file with some icons and a chunk of script for insertion in the <HEAD> of your xxxxT.htm, don't forget the html line <p>Observations <script>parse_cond();</script></p>
After that, you're on your own Please note, because we are processing this with JavaScript do NOT use " (quotes) in your text