Welcome to the Cumulus Support forum.

Latest Cumulus MX release 3.11.4 (build 3133) - 25 May 2021 (please see announcement regarding releases since 3.5.0)
Legacy Cumulus 1 release v1.9.4 (build 1099) - 28 November 2014 (a patch is available for 1.9.4 build 1099 that extends the date range of drop-down menus to 2030)

Download the Software (Cumulus MX / Cumulus 1 and other related items) from the Wiki

Re-Editing Template files.

Share your Cumulus MX user interface here

Moderator: mcrossley

Post Reply
Phil23
Posts: 643
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis Vantage Pro2 Plus
Operating System: Win10 Pro
Location: Australia

Re-Editing Template files.

Post by Phil23 »

Hi All,

In the process of editing the 3.9.2 template files to get them back like what I currently have.

Can anyone point out what I've missed with the Trends.htm
My old one was wider, but it's not centering ATM. Also button sizes are different.....

Old & new version here.... http://weather.inverellit.com/graphs.htm & http://weather.inverellit.com/trends.htm

Also have NOT uploaded the new cumuluscharts.js to my site yet as mine contains changes to the zoom buttons to accommodate my 7 day graph data & make it default to 48 hours.
So AirQual won't be expected to work yet, but the JS will be next on the list.

My HTML skills aren't brilliant.

Thanks

Phil

User avatar
beteljuice
Posts: 3212
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: W10 - Threadripper 16core, etc
Location: Dudley, West Midlands, UK

Re: Re-Editing Template files.

Post by beteljuice »

The input sections below

<!-- End of navigation menus at the top -->

Are being handled differently (in the html)

trends is just a <div>, graphs is using a <table> construct ;)
Image
......................Imagine, what you will KNOW tomorrow !

Phil23
Posts: 643
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis Vantage Pro2 Plus
Operating System: Win10 Pro
Location: Australia

Re: Re-Editing Template files.

Post by Phil23 »

So for a mug like me, It might be best to just try and add AirQual to my existing Graphs template.

But having said that, the buttons on trends is central on the page, it's the wider chart container that's not.

Code: Select all

			<div style="text-align:center;">
				<input name="btnTemp" class="button" tabindex="1" type="button" value="Temperature" onclick="changeGraph('temp');">
				<input name="btnDailyTemp" class="button" tabindex="2" type="button" value="Daily Temp" onclick="changeGraph('dailytemp');">
				<input name="btnPress" class="button" tabindex="3" type="button" value="Pressure" onclick="changeGraph('press');">
				<input name="btnWind" class="button" tabindex="4" type="button" value="Wind Speed" onclick="changeGraph('wind');">
				<input name="btnWindDir" class="button" tabindex="5" type="button" value="Wind Dir." onclick="changeGraph('windDir');">
				<input name="btnHum" class="button" tabindex="6" type="button" value="Humidity" onclick="changeGraph('humidity');">
				<input name="btnRain" class="button" tabindex="7" type="button" value="Rainfall" onclick="changeGraph('rain');">
				<input name="btnDailyRain" class="button" tabindex="8" type="button" value="Daily Rain" onclick="changeGraph('dailyrain');">
				<input name="btnSolar" class="button" tabindex="9" type="button" value="Solar" onclick="changeGraph('solar');">
				<input name="btnSunHours" class="button" tabindex="10" type="button" value="Sun Hours" onclick="changeGraph('sunhours');">
				<input name="btnAirQuality" class="button" tabindex="11" type="button" value="Air Quality" onclick="changeGraph('airquality');">
			</div>
I assume the entire chart container is just handled by this.

Code: Select all

		<div id="widecontent">
			<div id="chartcontainer">
			</div>
		</div>

Thanks.

User avatar
beteljuice
Posts: 3212
Joined: Tue 09 Dec 2008 1:37 pm
Weather Station: None !
Operating System: W10 - Threadripper 16core, etc
Location: Dudley, West Midlands, UK

Re: Re-Editing Template files.

Post by beteljuice »

In 'graphs' ...

<div id="widecontent"> is in between TWO <div id="content">

You've manged to get away with a duplicate id because there is no js involved and they are both obeying the css rule.
In 'trends' <div id="widecontent"> is in the middle of a single <div id="content">

I don't know if you are using the 'distribution' css for the buttons (the stuff that's actually in the page) or not, is the actual buttons code from a new 'distro' template ? - if so I would expect the css to give correct vertical separation (which is not happening in 'trends')
Image
......................Imagine, what you will KNOW tomorrow !

Phil23
Posts: 643
Joined: Sat 16 Jul 2016 11:59 pm
Weather Station: Davis Vantage Pro2 Plus
Operating System: Win10 Pro
Location: Australia

Re: Re-Editing Template files.

Post by Phil23 »

My CSS would be older, but with a few sections added.

From memory a section for the watch, wider graphs & some other bits for the AirQual in the table in index.

Might need to do a bit more comparing.

Code: Select all

#content {
	margin: auto;
	width: 800px; /* whatever working width you like */
}
#wcontent {
	margin-top: 0%;
	margin-right: 0%;
	margin-bottom: 0%;
	margin-left: 0%;
	width: 360px; /* whatever working width you like. This bit for Galaxy Watch */
}
#widecontent {
	margin: auto;
	width: 1200px; /* whatever working width you like. This bit for Wider Graphs  */
}

Post Reply