Steelseries Gauges for 1-wire

that tip has been mentioned a number of times on the forum :wink:

I have look on this forum but nothing to find

I have edit the customclientrawlocal.txt file and that’s works
,“temp”:“%temp%”,“temp1”:“%extratemp1%”,“temp2”:“%dallasextratemp2%”,“temp3”:“%dallasextratemp3%”,“temp4”:“%dallasextratemp4%”,“temp5”:“%dallasextratemp5%”,“temp6”:“%dallasextratemp6%”,

Now I try to find for made a temp1 till temp6 working but can not find what to do :?

Some have a example ?
greetings Gert

what you want to do is copy the code that is used for the current outdoor temperature gauge
into a new file name, and change it to use the new data in the customclientraw
and add that new gauge to the html code etc

hi Brain
Into the file gauges.js I see this
// Weather Display
realtimeVer = 12; //minimum version of the realtime JSON file required
config.realTimeURL = config.longPoll ? config.realTimeUrlLongPoll : config.realTimeUrlWD;
config.tipImgs = [ // config.tipImgs for Weather Display users with wxgraph
[‘temp+hum_24hr.php’, ‘indoor_temp_24hr.php’], // Temperature: outdoor, indoor

The line : [‘temp+hum_24hr.php’, ‘indoor_temp_24hr.php’], // Temperature: outdoor, indoor
And I try this new line : [‘temp+hum_24hr.php’, dallasextratemp3_24hr.php’], // Temperature: outdoor, indoor

And also into the gauges-ss-basic…htm

Outside Inside To Inside

But this is not working
What do I wrong ??

greetings Gert

those are just line for the tip images for that first part…that is not really needed
there is much more to copy that just that second part
you need to add in code to read the extra temp data from the customclientraw , etc

when I get a chance I will see about making an extra temp sensor gauge myself to show it is possible
(but I am helping with a school camp all this week , so not much spare time this week)

ok thanks Brain
I see it is not so easy as I thought
I hope you can made the time into the end of next week
have a nice day
greetings Gert

Hi Brain
Are you already busy for try to made the Gauges working with the extra temperature 1 till 6
I have try but I can still not find it
I hope you can ?

Greetings Gert

always busy
never enough spare time

spent all day cooking sausages for a fundraiser today

I will see about getting a gauge to work for an extra temp sensor today…and let you know…

Thanks Brain that will by great

have a nice Christmas

greetings Gert

I am struggling to get it to show
might needs Marks help

actually I have got it to work
http://www.weather-display.com/windy/gb/gauges-ss.html

bottom right hand corner gauge is my soil temp :slight_smile:

very nice Brain
I see its works
but it was not that easy

once you get your head around it
and you dont make any spelling mistakes, its OK
also you need to use Ctrl F5 to force a reload of the changes you make

I can step you through how to do achieve the result

hi Brain
if you have a example for what to do I can try it
the changes files is I think gauges.js and gauges-ss.html
the customclientraw.txt is working ok
http://www.weerstation-woerden.nl/WDL/customclientraw.txt

I do notice that I have a couple of minor problems with what I have done…changing to show indoor, that value shows up on my soil gauge, lol
also I need to remove the max/min markers for the soil gauge

anyway, the first thing you need to do is to add in the extra temp data to your customclientraw

you can add it anywhere…I just added it to the end
i.e my CCR looks like this at the end
“build”:“36”,“ver”:“12”,“soiltemp”:“19”}
i.e so I added
“soiltemp”:%soiltemp%
to the customclientrawlocal.txt file

the key is the name you give it (not the tag…you could use a extra temp sensor custom tag and a name like extratemp1

the next thing to do is change the guages-ss.html file to show the new gauge

I simply added

after

be carefull to not delete and existing tags
the important thing hwere is the id name…I used canvas_extratemp

use that…as that ties into the code you add to the gauges.js file

so in the gauges.js file, in the scripts folder, you need to create a new gauge variable:
use notepad++

you will find a list of declared variables at line 178 or so

ledIndicator, statusScroller, statusTimer,

    gaugeTemp,gaugeextraTemp, gaugeDew, gaugeRain, gaugeRRate,
    gaugeHum, gaugeBaro, gaugeWind, gaugeDir,
    gaugeUV, gaugeSolar, gaugeCloud, gaugeRose,

i.e I added in gaugeextraTemp

then at line 445 or so
find
gaugeTemp = singleTemp.getInstance();
if (gaugeTemp) { gauges.doTemp = gaugeTemp.update; }

then add
gaugeextraTemp = singleextraTemp.getInstance();
if (gaugeextraTemp) { gauges.doTemp = gaugeextraTemp.update; }

then you need to add in code where the units are switched
at line 3800 or so

i.e it starts with
switch (sel) {
// == Temperature ==
case ‘C’:

so after
if (gaugeTemp) { gaugeTemp.update(); }
I added
if (gaugeextraTemp) { gaugeextraTemp.update(); }

do the same for the F section below that too

then further down the code, line 3900 or so
find
setTempUnits = function (celsius) {
if (celsius) {

and after
if (gaugeTemp) {
gaugeTemp.data.sections = createTempSections(true);
gaugeTemp.data.minValue = gaugeGlobals.tempScaleDefMinC;
gaugeTemp.data.maxValue = gaugeGlobals.tempScaleDefMaxC;
}

I added
if (gaugeextraTemp) {
gaugeextraTemp.data.sections = createTempSections(true);
gaugeextraTemp.data.minValue = gaugeGlobals.tempScaleDefMinC;
gaugeextraTemp.data.maxValue = gaugeGlobals.tempScaleDefMaxC;
}

and then also add
if (gaugeextraTemp) {
gaugeextraTemp.data.sections = createTempSections(false);
gaugeextraTemp.data.minValue = gaugeGlobals.tempScaleDefMinF;
gaugeextraTemp.data.maxValue = gaugeGlobals.tempScaleDefMaxF;
}

to the F section below that (slight difference in the code)

and then below that again I added
if (gaugeextraTemp) {
gaugeextraTemp.gauge.setUnitString(data.tempunit);
gaugeextraTemp.gauge.setSection(gaugeTemp.data.sections);
}
after
if (gaugeTemp) {
gaugeTemp.gauge.setUnitString(data.tempunit);
gaugeTemp.gauge.setSection(gaugeTemp.data.sections);
}

then at line 4100 or so
find
setLang = function (newLang) {
// reset to the new language
strings = newLang;

I added
if (gaugeextraTemp) {
{
gaugeextraTemp.data.title = ‘Soil Temp’;
}
gaugeextraTemp.gauge.setTitleString(gaugeextraTemp.data.title);
if (data.ver) { gaugeextraTemp.update(); }
}

ater the section

if (gaugeTemp) {
if ($(‘#rad_temp1’).is(‘:checked’)) {
gaugeTemp.data.title = strings.temp_title_out;
} else {
gaugeTemp.data.title = strings.temp_title_in;
}
gaugeTemp.gauge.setTitleString(gaugeTemp.data.title);
if (data.ver) { gaugeTemp.update(); }
}

you can change the title in the code (instead of soil temp)

then the last thing to do is

find singleTemp = (function () {

at around line number 700

then after that whole section, that ends with line
})(), // End singleTemp()
i,e around line number 900

I added

//
// Singleton for the extra Temperature Gauge
//
singleextraTemp = (function () {
var instance; // Stores a reference to the Singleton
var ssGauge; // Stores a reference to the SS Gauge
var cache = {}; // Stores various config values and parameters

        function init() {
            var params = $.extend(true, {}, commonParams);

            // define temperature gauge start values
            cache.sections = createTempSections(true);
            cache.areas = [];
            cache.minValue = gaugeGlobals.tempScaleDefMinC;
            cache.maxValue = gaugeGlobals.tempScaleDefMaxC;
            cache.title = strings.temp_title_out;
            cache.value = gaugeGlobals.tempScaleDefMinC + 0.0001;
            cache.maxMinVisible = false;
            cache.selected = 'out';

            // create temperature radial gauge
            if ($('#canvas_extratemp').length) {
                params.size = Math.ceil($('#canvas_extratemp').width() * config.gaugeScaling);
                params.section = cache.sections;
                params.area = cache.areas;
                params.minValue = cache.minValue;
                params.maxValue = cache.maxValue;
                params.thresholdVisible = false;
                params.minMeasuredValueVisible = cache.maxMinVisible;
                params.maxMeasuredValueVisible = cache.maxMinVisible;
                params.titleString = 'Soil Temp';
                params.unitString = data.tempunit;
                params.trendVisible = gaugeGlobals.tempTrendVisible;
                //params.customLayer = _imgBackground;      // uncomment to add a background image - See Logo Images above

                ssGauge = new steelseries.Radial('canvas_extratemp', params);
                ssGauge.setValue(cache.value);

                // over-ride CSS applied size?
                if (config.gaugeScaling !== 1) {
                    $('#canvas_extratemp').css({'width': params.size + 'px', 'height': params.size + 'px'});
                }

                // add a shadow to the gauge
                if (config.showGaugeShadow) {
                    $('#canvas_extratemp').css(gaugeShadow(params.size));
                }

                // remove indoor temperature/humidity options?
                if (!config.showIndoorTempHum) {
                    $('#rad_temp1').remove();
                    $('#lab_temp1').remove();
                    $('#rad_temp2').remove();
                    $('#lab_temp2').remove();
                    $('#rad_hum1').remove();
                    $('#lab_hum1').remove();
                    $('#rad_hum2').remove();
                    $('#lab_hum2').remove();
                }

                // subcribe to data updates
                $.subscribe('gauges.dataUpdated', update);
                $.subscribe('gauges.graphUpdate', updateGraph);
            } else {
                // cannot draw gauge, return null
                return null;
            }


            function update() {
                var sel = cache.selected;


                // Argument length === 1 when called from radio input
                // Argument length === 2 when called from event handler
                if (arguments.length === 1) {
                    sel = arguments[0].value;
                }

                // if rad isn't specified, just use existing value
                var t1, scaleStep, tip;

                cache.minValue = data.tempunit[1] === 'C' ? gaugeGlobals.tempScaleDefMinC : gaugeGlobals.tempScaleDefMinF;
                cache.maxValue = data.tempunit[1] === 'C' ? gaugeGlobals.tempScaleDefMaxC : gaugeGlobals.tempScaleDefMaxF;

                if (sel === 'out') {
                    cache.low = extractDecimal(data.tempTL);
                    cache.high = extractDecimal(data.tempTH);
                    cache.lowScale = getMinTemp(cache.minValue);
                    cache.highScale = getMaxTemp(cache.maxValue);
                    cache.value = extractDecimal(data.soiltemp);
                    cache.title = 'Soil Temp';
                    cache.loc = strings.temp_out_info;
                    cache.trendVal =  extractDecimal(data.temptrend);
                    cache.popupImg = 0;
                    if (gaugeGlobals.tempTrendVisible) {
                        t1 = tempTrend(+cache.trendVal, data.tempunit, false);
                        if (t1 === -9999) {
                            // trend value isn't currently available
                            cache.trend = steelseries.TrendState.OFF;
                        } else if (t1 > 0) {
                            cache.trend = steelseries.TrendState.UP;
                        } else if (t1 < 0) {
                            cache.trend = steelseries.TrendState.DOWN;
                        } else {
                            cache.trend = steelseries.TrendState.STEADY;
                        }
                    }
                } else {
                    cache.low = extractDecimal(data.intemp);
                    cache.lowScale = cache.low;
                    cache.high = cache.low;
                    cache.highScale = cache.low;
                    cache.value = cache.low;
                    cache.title = strings.temp_title_in;
                    cache.loc = strings.temp_in_info;
                    cache.maxMinVisible = false;
                    cache.popupImg = 1;
                    if (gaugeGlobals.tempTrendVisible) {
                        cache.trend = steelseries.TrendState.OFF;
                    }
                }

                // has the gauge type changed?
                if (cache.selected !== sel) {
                    cache.selected = sel;
                    //Change gauge title
                    ssGauge.setTitleString(cache.title);
                    ssGauge.setMaxMeasuredValueVisible(cache.maxMinVisible);
                    ssGauge.setMinMeasuredValueVisible(cache.maxMinVisible);
                    if (config.showPopupGraphs && config.tipImgs[0][cache.popupImg] !== null) {
                        var cacheDefeat = '?' + $('#imgtip0_img').attr('src').split('?')[1];
                        $('#imgtip0_img').attr('src', config.imgPathURL + config.tipImgs[0][cache.popupImg] + cacheDefeat);
                    }
                }

                //auto scale the ranges
                scaleStep = data.tempunit[1] === 'C' ? 10 : 20;
                while (cache.lowScale < cache.minValue) {
                    cache.minValue -= scaleStep;
                    if (cache.highScale <= cache.maxValue - scaleStep) {
                        cache.maxValue -= scaleStep;
                    }
                }
                while (cache.highScale > cache.maxValue) {
                    cache.maxValue += scaleStep;
                    if (cache.minValue >= cache.minValue + scaleStep) {
                        cache.minValue += scaleStep;
                    }
                }

                if (cache.minValue !== ssGauge.getMinValue() || cache.maxValue !== ssGauge.getMaxValue()) {
                    ssGauge.setMinValue(cache.minValue);
                    ssGauge.setMaxValue(cache.maxValue);
                    ssGauge.setValue(cache.minValue);
                }
                if (cache.selected === 'out') {
                    cache.areas = [steelseries.Section(+cache.low, +cache.high, gaugeGlobals.minMaxArea)];
                } else {
                    cache.areas = [];
                }

                if (gaugeGlobals.tempTrendVisible) {
                    ssGauge.setTrend(cache.trend);
                }
                ssGauge.setArea(cache.areas);
                ssGauge.setValueAnimated(+cache.value);

                if (ddimgtooltip.showTips) {
                    // update tooltip
                    if (cache.selected === 'out') {
                        tip = cache.loc + ' - ' + strings.lowestF_info + ': ' + cache.low + data.tempunit + ' ' + strings.at + ' ' + data.TtempTL +
                             ' | ' +
                             strings.highestF_info + ': ' + cache.high + data.tempunit + ' ' + strings.at + ' ' + data.TtempTH;
                        if (cache.trendVal !== -9999) {
                            tip += '

’ +
strings.temp_trend_info + ‘: ’ + tempTrend(cache.trendVal, data.tempunit, true) + ’ ’ + cache.trendVal + data.tempunit + ‘/h’;
}
} else {
tip = cache.loc + ‘: ’ + data.intemp + data.tempunit;
}
$(’#imgtip0_txt’).html(tip);
}
} // End of update()

            function updateGraph(evnt, cacheDefeat) {
                if (config.tipImgs[0][cache.popupImg] !== null) {
                    $('#imgtip0_img').attr('src', config.imgPathURL + config.tipImgs[0][cache.popupImg] + cacheDefeat);
                }
            }

            return {
                data: cache,
                update: update,
                gauge: ssGauge
            };
        } // End of init()

        return {
            // Get the Singleton instance if one exists
            // or create one if it doesn't
            getInstance: function () {
                if (!instance) {
                    instance = init();
                }
                return instance;
            }
        };
    })(), // End singleTemp()

now the key line to change in the above code is

params.titleString = ‘Soil Temp’;

and

cache.title = ‘Soil Temp’;

and
cache.value = extractDecimal(data.soiltemp);

that last one…the data.soiltemp is the name of the ID name that you have in the customclientraw.txt file

the final thing to add is
data.soiltemp = convFunc(data.soiltemp);
(and change that name to suit)
add around line 3650
after
data.temp = convFunc(data.temp);

now you can customise the creation of the singleton code , i.e to not show or create the max/min shaded area I would suggest…unless you add in the custom tags to the customclientraw.txt file for the max/min temp for the extra sensor temp and change in the create the singleton code to use those custom tags id

maybe a Moderator could make this a sticky?

also after uploading the changed guages.js file, , to the scripts folder,(back it up first before changing it)
make sure to use ctrl F5 to reload the web page
good luck!

Many thanks Brain
Wow that

good work!
I think what I have posted needs to be made into a FAQ , for others to use as a basis :slight_smile:

Good work from you
I had this never managed this

I have already managed to put the 1 wire into the dashboard from Saratoga only the bottom ( 0CM) and the 10CM Davis ( also the others works but I have disable it )
you will see the on the index page from my site
but to make Gauges for 1-wire was for my not possible what a work !!
again very happy with you

FAQ
yes that will by nice now its almost easy for made this :wink:

tomorrow I will try to put it all into 1 folder but I think it will not work that’s way I have made 7 folders into the webserver for now

greetings Gert