5,838
edits
Category:Cumulus MX: Difference between revisions
→Editing the User Interface
|
== Editing the User Interface ==
Remember, if you decide to download a new release to not overwrite any file(s) that you have edited, or your edit will be lost. It is
=== Removing Solar Figures ===
If your weather station does not have solar instrumentation you might wish to remove some of the display elements that relate to that.
# Navigate to '''\CumulusMX\interface''' folder.
# Open the file '''now.html''' in an editor designed for code (e.g. Notepad++ for Windows)
# Near the bottom of the file edit it by inserting HTML comment delimiters (opening after </thead>, closing before </table>) so it looks like this:
<pre><table id="SolarTable" style="width:100%">
<tr>
<td>Solar Radiation</td>
<td><span id="SolarRad">--</span></td>
<td>W/m<sup>2</sup></td>
</tr>
<tr>
<td>Sunshine Today</td>
<td><span id="SunshineHours">--</span></td>
<td>hrs</td>
</tr>
<tr>
<td>UV</td>
<td><span id="UVindex">--</span></td>
<td></td>
</tr>
-->
</table> </pre>
=== Adding derivatives not shown on the existing interface page ===
It is a JavaScript file '''\CumulusMX\interface\js\dashboard.js'''that reads the standard web tags and inserts their content into position indicated by values of the HTML attribute "id" on the interface screens. The standard '''\CumulusMX\interface\now.html''' does not include temperature trend for example, but because there is a '''temptrend: inp.TempTrend.toString()''' defined in the JavaScript file, you can easily add it to the "now" page by a simple insert of the middle row here:
<pre><tr>
<td>Outdoor Temperature</td>
<td><span id="OutdoorTemp">--</span></td>
<td><span class="TempUnit">--</span></td>
</tr>
<tr>
<td>Trend</td>
<td><span id="TempTrend">--</span></td>
<td><span class="TempUnit">--</span> hour<sup>-1</sup></td>
</tr>
<tr>
<td>Dew Point</td>
<td><span id="OutdoorDewpoint">--</span></td>
<td><span class="TempUnit">--</span></td>
</tr></pre>
The Beaufort force wind description is not mentioned in the "dashboard.js", but there is a web tag <#beaudesc> for ''The current wind speed Beaufort description (e.g. "Gale")''. So we can edit
'''dashboard.js''' to add this:
<pre>
wlatest: inp.WindLatest.toString(),
beaudesc: inp.Beaufort.toString(),
wspeed: inp.WindAverage.toString(),</pre>
and then we can edit '''now.html''' to include it:
<pre>
</thead>
<tr>
<td>
<td><span id="
<td>
</tr>
<tr>
<td>
<td><span id="
<td>
</tr>
<tr>
<td>
<td><span id="
<td></td>
</tr>
<tr>
<td>Average Speed</td>
<td><span id="WindAverage">--</span></td>
<td><span class="WindUnit">--</span></td>
</tr>
<
<td><span id="Avgbearing">--</span></td>
<td><span id="AvgbearingCP">°</span></td>
▲Remember, if you decide to download a new release to not overwrite any file that you have edited, or your edit will be lost. It is unlikely that a new release will change this file, but it will contain another copy of the original file.
</tr>
<tr>
<td>Peak Gust</td>
<td><span id="Recentmaxgust">--</span></td>
<td><span class="WindUnit">--</span></td>
</tr>
</table></pre>
=== Changing Look ===
You need some understanding of Cascading Style Sheets (CSS) to do this, but all you need to do is to edit the relevant style sheet in '''\CumulusMX\interface\css'''.
= Updating to a new MX release =
| |||