見出し画像

TWSNMPのUI部品

twsnmp

UIのための部品

ユーザーが操作する部分でちょっとした工夫をすると格段に使いやすくなる場合があります。オリジナルのTWSNMPは、WindowsのアプリケーションだったのでWindowsが提供している機能に制限されていました。でも今開発しているTWSNMPでは、画面の表示を

の上で実現できるので、最近の Webページで使われいるライブラリを利用できます。その中で、これまで紹介した以外の便利なライブラリを記載しておきます。

 誰もが知っているJavaScriptのライブラリです。最近は、シングルページアプリケーションのフレームワークが流行っているので、人気が下がっているかもしれませんが、TWSNMPでは、便利なので使っています。ただし、ELECTRONの環境だと使うのに、

  <script>
   window.jQuery = window.$ = require('./js/jquery-3.4.1.js');
 </script>

のように、ひと工夫しています。

JavaScriptで、日時のデータを扱う場合の定番です。表示する時にフォーマットしたり、時刻の差分を計算したり、いろいろな場面で、活躍します。TWSNMPでは、ログなどの日時表示に使っています。

何文字か入力すると、選択項目を表示してくれるタイプアヘッド、または、オートコンプリートを実現するためのライブラリです。TWSNMPでは、MIBブラウザーでMIBの名前を選択する場合やログの検索で履歴から選択するために利用しています。ライブラリ自体は、ちょっと古いですが、他のライブラリに比べて扱いやすく、表示をTWSNMPにフィットさせるのも簡単にできたので、採用しています。下の画像のifTableと入力している部分です。

画像1

Tweakpane

この記事の最初の投稿以降にみつけたライブラリ

https://cocopon.github.io/tweakpane/

は、マップや通知の設定、ノードの作成などに大活躍しています。ありがとう。

つづく

開発のための諸経費（機材、Appleの開発者、サーバー運用）に利用します。 ソフトウェアのマニュアルをnoteの記事で提供しています。 サポートによりnoteの運営にも貢献できるのでよろしくお願います。