Adobe XDのWebSocket機能をNode-RED経由で試すメモ

[{"id":"e6d3dba.6ff6128","type":"websocket in","z":"dcac63b0.a8ba1","name":"","server":"53b10c13.d87304","client":"","x":430,"y":280,"wires":[["ae1382fb.2b4d2"]]},{"id":"e82747d3.b7bd38","type":"websocket out","z":"dcac63b0.a8ba1","name":"","server":"53b10c13.d87304","client":"","x":740,"y":340,"wires":[]},{"id":"ae1382fb.2b4d2","type":"debug","z":"dcac63b0.a8ba1","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":730,"y":280,"wires":[]},{"id":"ef2fe0e2.ab759","type":"inject","z":"dcac63b0.a8ba1","name":"","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":440,"y":340,"wires":[["e82747d3.b7bd38"]]},{"id":"e83ffb68.b74588","type":"comment","z":"dcac63b0.a8ba1","name":"外部サーバー","info":"","x":430,"y":220,"wires":[]},{"id":"53b10c13.d87304","type":"websocket-listener","z":"","path":"/adobexd","wholemsg":"false"}]

{
    "id": "NODE_RED_WEBSOCKET",
    "name": "Adobe XD WebSocket Node-RED plugin",
    "host": {
        "app": "XD",
        "minVersion": "13.0.0"
    },
    "version": "1.0.0",
    "uiEntryPoints": [
        {
            "type": "menu",
            "label": "WebSocket Send Select Text",
            "commandId": "wsSendCommand"
        }
        ,
        {
            "type": "menu",
            "label": "WebSocket Open",
            "commandId": "wsOpenCommand"
        }
        ,
        {
            "type": "menu",
            "label": "WebSocket Close",
            "commandId": "wsCloseCommand"
        }
    ]
}

const { Text, Color } = require("scenegraph"); // XD拡張APIのクラスをインポート

// Adobe XDがNode-REDの該当URLにアクセスする
const wsurl = "ws://WEBSOCKET_SERVER_URL/adobexd";

let socket;

async function wsOpenFunction(selection) {
  // WebSocket.send でデータ取得
  // WebSocket 接続を作成する

  if( socket ){
    // 多重起動を防ぐ
    console.log("WebSocket opened already!!!");
  } else {
    socket = new WebSocket(wsurl);

    // WebSocket 接続をはじめる
    socket.addEventListener('open', function (event) {
        socket.send('Hello Server!');
        console.log("WebSocket started");
    });
  
    // メッセージを待ち受ける
    socket.addEventListener('message', function (event) {
      console.log('Message from server ', event.data);
    });
  
    // WebSocket 接続を終了を検知
    socket.addEventListener('close', function (event) {
      console.log("WebSocket closed");
      // WebSocketを消す
      socket = null;
      // 丁寧にremoveEventListenerすべき？？
    });
  }

}

async function wsCloseFunction(selection) {
  console.log("WebSocket close...");
  socket.close();
}

async function wsHandlerFunction(selection) {
  console.log("wsHandlerFunction was called!"); // Developer Consoleに出力

  // 選択オブジェクトの取得
  console.log(selection.items.length + " items are selected");
  // selectList
  const selectList = [];
  // 選択したテキストを取得
  for(let i = 0 ; i < selection.items.length ; i++ ){
    const item = selection.items[i];
    // 全テキストデータを順番に突っ込んでおく
    selectList.push(item.text);
  }
  // WebSocket送信
  socket.send(selectList);
}

module.exports = {
  commands: {
    wsSendCommand: wsHandlerFunction,
    wsOpenCommand: wsOpenFunction,
    wsCloseCommand: wsCloseFunction,
  }
};