TWSNMP FC:PWA版にノードリストとポーリングリストを追加

今朝は４時前から開発開始です。PWA版の開発が軌道に乗って楽しくなってきたので早く目が覚めました。
まずは、マップとイベントログの表示を１分間隔で更新する機能とログアウトした後に再度ログインした時にマップだけ表示されない問題を解決しました。
マップを表示しているp5.jsのキャンバスの再作成が関係していました。
マップの表示を切り替えた時にキャンバスを削除する必要がありましたが、その方法がやっとわかりました。

reference | p5.js

p5.jsのremoveを実施しれば良かったようです。

let map;

export const showMAP = (div) => {
  mapRedraw = true
  if (map) {
    map.remove();
    map = undefined;
  }
  map = new P5(mapMain, div)
}

TWSNMP　FCの本体でも同じような問題がありましたが、キャンバスは維持して対策していました。同じ方法で対策できそうですが、今はやめておきます。
マップ画面ができたので、次はノードやポーリングなどのリスト画面を追加することにしました。表示方法はイベントログと同じ方法でできます。
画面の切り替えはTWLogAIANのレポート画面の切り替えと同じ様に右上のコンボボックスで出来ました。

画面の切り替え

ノードリストは、

ノードリスト

のような感じです。
ポーリングリストは、

ポーリングリスト

のような感じです。ポーリングリストを追加する開発は

PWA版にポーリングリストを追加 · twsnmp/twsnmpfc@ed00420

のような感じです。
リストで表示するものは同じパターンで追加できそうです。他の画面も簡単に追加できそうでますます楽しくなってきましたが今日は時間切れになりました。

明日に続く