Page 1 of 1
Problem with the width of the Forecast and Countdown LCDs
Posted: Tue 05 Mar 2013 1:41 am
by gpercival
I have just upgraded to version 2.2.2 from 2.0.1. After some fiddling I have everything working (i really like the new Wind Rose by the way).
My problem is that I can't control the width and height of the Forecast and Countdown LCDs in my webpage. This used to be done through the gauges.js file. I note in release 2.2.0, control was moved to the html template. I already had these parameters set in the template but it now makes no difference. I have tried changing the parameters but nothing changes.
This may be an HTML problem rather than a Steel Series problem but I have run out of options.
http://www.rhumbline.com.au/weather
Thanks in advance.
Geoff
Re: Problem with the width of the Forecast and Countdown LCD
Posted: Tue 05 Mar 2013 2:09 am
by gemini06720
Geoff, looking at the source code of your page, I notice the following:
Code: Select all
<td ...>
On-line Status:
<canvas id="canvas_led" width="25" height="25"></canvas>
<canvas id="canvas_status" width="50" height="25"></canvas>
Next update in:
<canvas id="canvas_timer" width="70" height="25"></canvas>
</td>
You might want to give a bit more width to the 'canvas_status' than the 50 pixels you have assigned it - start with 300 pixels and move up until you are satisfied with the width of the forecast/status gauge.
Re: Problem with the width of the Forecast and Countdown LCD
Posted: Tue 05 Mar 2013 2:27 am
by gpercival
You might want to give a bit more width to the 'canvas_status' than the 50 pixels you have assigned it - start with 300 pixels and move up until you are satisfied with the width of the forecast/status gauge.
Sorry Ray,
The 50 pixel is a hangover from my testing. I have set it back to 550 px and it makes not difference.
Geoff
Re: Problem with the width of the Forecast and Countdown LCD
Posted: Tue 05 Mar 2013 2:49 am
by gemini06720
Geoff, I looked at both cascading style sheets (weatherstyle.css and gauges-ss.css) and did not find any properties that could/should affect that particular 'td' tag.
If you do not mind making some modifications to your 'gauges.js' script...
As I do not like using the standard HTML 'width/height' tags (I prefer using the CSS 'width/height' properties), I have added two lines to the 'canvas_status' code allowing for full flexibility into the selection of the width/height of the forecast/status gauge - here is my modified code:
Code: Select all
drawStatus = function () {
// create forecast display
if ($('#canvas_status').length) {
_gaugeStatus = new steelseries.DisplaySingle(
'canvas_status', {
width : $('#canvas_status').width(), //Set the gauge size according to the canvas CSS 'width:' in the HTML
height : $('#canvas_status').height(), //Set the gauge size according to the canvas CSS 'height:' in the HTML
lcdColor : gauge.lcdColour,
unitStringVisible : false,
value : _statusStr,
digitalFont : config.digitalForecast,
valuesNumeric : false,
autoScroll : true,
alwaysScroll : true
});
}
},
It is probably worth a try ... that is until Mark wakes up and is able to offer you a better solution...
Re: Problem with the width of the Forecast and Countdown LCD
Posted: Tue 05 Mar 2013 3:00 am
by gpercival
Thanks Ray,
That has certainly fixed the problem but it will break the next time I upgrade.
We will see what Mark has to say.
Geoff
Re: Problem with the width of the Forecast and Countdown LCD
Posted: Tue 05 Mar 2013 7:43 am
by gemini06720
Indeed, the modifications would prevent easy update to the next releases...
...but that might be the 'inconvenience' to live with to get the desired flexibility...
But I think those two lines should be part of all the gauges, including the 'led', 'status' and 'timer' to provide full flexibility, more so evident when one want to go/use the incredibly nice looking linear gauges instead of the 'more standard looking' radial gauges:
Code: Select all
params.width = Math.ceil($('#canvas_xxxxx').width() * config.gaugeScaling);
params.height = Math.ceil($('#canvas_xxxxx').height() * config.gaugeScaling);
Re: Problem with the width of the Forecast and Countdown LCD
Posted: Tue 05 Mar 2013 9:49 am
by mcrossley
It was version 2.2.0 that introduced the change from setting the size in the script to using the element size (set using width/height attributes or CSS is doesn't matter). The release notes also say the SteelSeries library was updated...
* Updated steelseries.js, steelseries.min.js, steelseries_tween.min.js
- Now up to SS v 0.13.0
You are still running version SS v 0.11.14. If you upgrade this library to the required version or later, then the sizing will work as expected.
Re: Problem with the width of the Forecast and Countdown LCD
Posted: Tue 05 Mar 2013 10:46 pm
by gpercival
Thanks Mark,
I will check that.
I am a little confused though. When I upgraded to v2.2.2 I replaced all the associated files. How did I miss the latest version of the library?
Geoff
Re: Problem with the width of the Forecast and Countdown LCD
Posted: Tue 05 Mar 2013 10:54 pm
by mcrossley
I think it may be because your page is picking up scripts/steelseries.min.js
Later releases changed this to scripts/steelseries_tween.min.js
Re: Problem with the width of the Forecast and Countdown LCD
Posted: Wed 06 Mar 2013 7:43 am
by gpercival
Fixed and upgradable.
Thanks for the help.
Geoff
http://www.rhumbline.com.au/weather