TwoDials

<script src="js/jquery.knob.min.js"></script>
 
<script>
    var sc;
    var msgOut = false;
    (function(scope) {
        scope.$watch('msg.payload', function(data) {
            msgOut = false;
            if (String(data).slice(1,2) == "-") {
                dialIndex = String(data).slice(0,1);
                dialValue = String(data).slice(2);
                //console.log(dialIndex + ":" + dialValue);
            }
            else {
                dialIndex = "1";
                dialValue = data;
            }
            switch (dialIndex) {
                case "1":
                    $("#idDial1").val(dialValue);
                    $("#idDial1").change();
                    break;
                case "2":
                    $("#idDial2").val(dialValue);
                    $("#idDial2").change();
            }
        });
        sc = scope;
        })(scope);

        var sendData = function(data){
        sc.send({payload:data});
    }

    $(".cDial1").knob({
        change : function (value) {
            msgOut = true;
            //console.log("change : " + value);
        },
        release : function (value) {
            //console.log("release : "+value+"  msgOut : "+msgOut);
            if (msgOut == true) {
                sendData("1-" + value);
                //msgOut = true;
            }
            //console.log(this.$.attr('value'));
        },
        cancel : function () {
            // console.log("cancel : ", this);
        },
        /*format : function (value) {
            return value + '%';
            },*/
        draw : function () { }
    });

    $(".cDial2").knob({
        change : function (value) {
            msgOut = true;
            //console.log("change : " + value);
        },
        release : function (value) {
            //console.log("release : "+value+"  msgOut : "+msgOut);
            if (msgOut == true) {
                sendData("2-" + value);
                //msgOut = true;
            }
            //console.log(this.$.attr('value'));
        },
        cancel : function () {
            // console.log("cancel : ", this);
        },
        /*format : function (value) {
            return value + '%';
            },*/
        draw : function () { }
    });
</script>

<input class="cDial1" id="idDial1" data-angleOffset=-90 data-angleArc=180 data-width="120" data-cursor=true data-fgColor="#222222" data-thickness=.3 value="0">

<input class="cDial2" id="idDial2" data-angleOffset=-90 data-angleArc=180 data-width="120" data-cursor=true data-fgColor="#444444" data-thickness=.3 value="0">