如何使用套接字中的变量.io功能



我想我已经在代码中游泳太久了。我是新来的。Io, node和express。现在我有一个电位器在服务器端发出消息,在客户端,我在javascript控制台接收它们(我使用Chrome)。我的目标是有一个电位器改变滑块在HTML页面上的位置,这反过来将改变振荡器的频率使用tone.js库。

我设置的上限是200,超过这个上限打印任何东西。下面是服务器端的代码片段,我的app.js

cylon.robot({
    connections: {
        edison: {
            adaptor: 'intel-iot'
        }
    },
    devices: {
        button: {
            driver: 'button',
            pin: 2
        },
        sensor: {
            driver: 'analogSensor',
            pin: 0,
            upperLimit: 200,
            lowerLimit: 0
        }
    }
}).on('ready', cylonReady);
cylon.start()
// this will be called each time a socket is opened, so each client will receive their own events when buttons are pushed.
var registerSocketHandlers = function (my, socket) {
    my.button.on('push', function () {
        socket.emit('button', 'push')
    })
    my.button.on('release', function () {
        socket.emit('button', 'release')
    })
    my.sensor.on('upperLimit', function (val) {
        //console.log("Upper limit reached ===> " + val);
        socket.emit('analogSensor', val)
    });
}

客户端的一个片段,index.HTML:

var potVal = 0;
socket.on('analogSensor', function (analogVal) {
    potVal = analogVal;
    console.log('sensor value', potVal)
});
new Interface.Slider({
    drag: function (value) {
        frequency.rampTo(value, 0.1);
    },
    start: function () {
        Tone.Master.mute = false;
    },
    end: function () {
        Tone.Master.mute = true;
    },
    name: "frequency",
    min: 0,
    max: 1,
    exp: .5,
    value: potVal / 10, //original value is .5
    position: 5
});

我在网上看过问答。大多数都是无果而终。我仍然尝试了它们,并尝试在客户端设置一个全局变量,如上面的代码所示,并在滑块中交换出值。它要么导致滑块根本不显示,要么对它没有影响。欢迎提出任何建议。谢谢你!

这个问题与SocketIo本身无关。您应该在收到消息时更新滑块,如下面的代码所示:

var potVal = 0; // this is useless actually 
//socket.on('analogSensor', function (analogVal) {
function dummy_socket_on_analogSensor (analogVal) {
    potVal = analogVal;
    console.log('sensor value', potVal); 
    $('#chance_slider').val(potVal);
};
// when a value is got from socket.io, this will happen: 
var i = 0; 
function simulateSocketIoMessages () {
    dummy_socket_on_analogSensor(i); 
    i += 5; 
    setTimeout(simulateSocketIoMessages, 1000); 
}
simulateSocketIoMessages(); 

这里是工作的jsFiddle: http://jsfiddle.net/sRbHZ/74/

最新更新