Using a knob widget for setting a timer

Apps & Services HABPanel
1

Hello,
I would like to use a knob widget to set a timer.
But unfortunately I do not manage to set the format to a duration like H:mm:ss.
It would be also great if the scale could be set logarithmic.
Is the a solution for the two points?
Regards

2

You could make the knob widget just to set the seconds or minutes in a day.
A day has 1440 minutes (0 to 1439) You set the minute and with a script
you can transform it to time.

This is my num2time.js

(function(i) {
  if (input >= 0 && input <= 1439) {
    var hr = Math.floor(input / 60);
    var min = input - hr * 60;

    return (hr < 10 ? "0" : "") + hr + ":" + (min < 10 ? "0" : "") + min;
  } else {
    return input;
  }
})(input);
3

Thank you @Charley.
But the Value in the middle of the knob would be then not the timer setting. Right?

1 Like
4

No it will show the minute of the day like 17:49 = 1069
I use it in rules that run a lot

5

You can use a dummy below/above the knob to show the Time value

6

@Charley Thank you for your ideas. That way I will make it work even though having the set time in the middle of the knob would be even better.

But now I am struggling with using the knob in a costume widget. It just does not want to work:

<div ng-init="knobmodel1=
                    {
                        "name": "Timerxy",
                        "sizeX": 3,
                        "sizeY": 3,
                        "item": "timer1",
                        "type": "knob",
                        "row": 1,
                        "col": 0,
                        "floor": 0,
                        "ceil": 180,
                        "step": 1,
                        "unit": "",
                        "format": "",
                        "useserverformat": false,
                        "barWidth": 30,
                        "trackWidth": 30,
                        "scaleEnabled": true,
                        "scaleType": "dots",
                        "scaleSpaceWidth": null,
                        "skinType": "tron",
                        "ranges": [
                            {
                                "min": 0,
                                "max": 60,
                                "barColor": "#66FFFF"
                            },
                            {
                                "min": 60,
                                "max": 120,
                                "barColor": "#33CCFF"
                            },
                            {
                                "min": 120,
                                "max": 180,
                                "barColor": "#0099FF"
                            }
                        ],
                        "scaleColor": "#66FFFF",
                        "scaleQuantity": 18,
                        "rangesEnabled": true,
                        "rangesTextColorMatching": true,
                        "readOnly": false
                    }">
     <widget-knob ng-model="knobmodel1"></widget-knob>