CODEWITHSUNDEEP
javascriptjquerysocket.io
tree em
tree em

Reputation: 21721

How could I update message from difference socket.io event?

I am using the api with difference event channelName1 and channelName2

//...this the realtime record
socket.on(channelName1, message => {
      console.log(channelName1, message1);
      //this return single item list in realtime`[{"price":100,"size":0.001}]`
 });

//realtime snapshot collection of records
socket.on(channelName2, message => {
   console.log(channelName2, message2);
   //this return the collection `[{"price":100,"size":0.01}, {"price":200,"size":0.02} ]`
   $('#live').text(message2)
});

I want to want to update size of message2 if I found the price":100 is present in the collection message2, so the after update message2 will

[{"price":100,"size":0.001}, {"price":200,"size":0.002} ]

anyone could you guide me how I can do this update from channelName1 to ChannelName2 data?

Upvotes: 4

Views: 312

Answers (4)

code_monk
code_monk

Reputation: 10130

it is a matter of saving the websocket payloads to objects created in a more "global" scope.

// since these are defined outside of the websocket event handlers
// they are available to each
var payload1 = [];
var payload2 = [];

const combinePayloads = () => {
    if (payload1[0].price === payload2[0].price) {
        // merge values if prices are the same
        let combinedArray = payload1.concat(payload2);
        console.log(combinedArray);
    }
};

socket.on(channelName1, message => {
    payload1 = message;
    combinePayloads();
});
socket.on(channelName2, message => {
    payload2 = message;
    combinePayloads();
});

Upvotes: 1

Ilijanovic
Ilijanovic

Reputation: 14914

socket.on(channelName1, message => {
  console.log(channelName1, message1);
  //this return single item list in realtime`[{"price":100,"size":0.001}]`
  var t = $('#live').text(message2)
  var text = JSON.parse(t)
  text[1].price = message[0].price
  $('#live').text(JSON.stringify(text))
  });

Upvotes: 3

Abhishek
Abhishek

Reputation: 1332

you can store channel1's data in hashMap and loop over channel2's data to check if there is an entry in the hashmap and return the item according to that.

const channel1HashMap = {};

//...this the realtime record
socket.on(channelName1, message => {
   console.log(channelName1, message1);
   dataHandler(message1, null);
});

//realtime snapshot collection of records
socket.on(channelName2, message => {
   console.log(channelName2, message2);
   const data = dataHandler(null, message2);
   updateView(data);
});

dataHandler = (message1, message2) => {
  const channel2Data = [];
  if(Array.isArray(message1)) {
    message1.forEach((message)=> {
       channel1HashMap[message.price] = message;
    });
  } else if(Array.isArray(message2)) {
    message2.forEach((message)=> {
      if(Object.prototype.hasOwnProperty.call(channel1HashMap, message.price)){
        channel2Data.push(channel1HashMap[message.price]);
      } else {
        channel2Data.push(message);
      }
    });
  }
  return channel2Data;
}

updateView = (data) => {
  $('#live').text(data)
}

Upvotes: 4

Todd Chaffee
Todd Chaffee

Reputation: 6824

You have to store the single items somewhere and when the collection arrives you need to:

  1. Process each item of the collection using map.
  2. For each item, try to find it in the stored single items.
  3. If found, change the size.

I have also included a record in the collection that cannot be found so you can see what happens there: it remains unchanged.

Ignore the small changes I made to simulate the sockets. Hopefully you can see the big picture of what I'm doing.

Hope this helps and happy coding.

// Stores each single item that arrives.
let singleItems = [];

// ...this is the realtime record.
function socketOn1(channelName1, message1) {
  console.log(channelName1, message1);

  // Store each single item as it arrives.
  singleItems.push(message1[0]);
};

// realtime snapshot collection of records
function socketOn2(channelName2, message2) {
  console.log(channelName2, message2);

  // For each element in the collection, find
  // the same record in the single items and
  // if found, update the price.
  results = message2.map((elem) => {
    found = singleItems.find(
      (single) => single.price === elem.price
    )
    if (found) {
      elem.size = found.size
    }
    return elem
  })

  console.log('results:')
  console.log(results)
};


// This stuff just simulates stuff arriving to sockets.
// You can ignore it if you want. But look at the order
// in which they are called.

let singleItemsMock = [{
    "price": 100,
    "size": 0.01
  },
  {
    "price": 50,
    "size": 0.02
  },
  {
    "price": 25,
    "size": 0.03
  },
  {
    "price": 10,
    "size": 0.04
  }
]

let collectionMock = [{
    "price": 100,
    "size": 0.001
  },
  {
    "price": 50,
    "size": 0.002
  },
  {
    "price": 13,
    "size": 0.005
  }
]

socketOn1(null, [singleItemsMock[0]])
socketOn1(null, [singleItemsMock[1]])
socketOn1(null, [singleItemsMock[2]])
socketOn1(null, [singleItemsMock[3]])

socketOn2(null, collectionMock)

Upvotes: 4

Related Questions