Visual Studio Live Share の活用

Visual Studio Code Advent Calendar 2018 の 16日目です。 🙂

今年もいろいろな分野で活躍してくれた VS Code でしたが、拡張として提供されている Visual Studio Live Share にもずいぶん助けられました。

Visual Studio Live Share は自分の Visual Studio から他の Visual Studio に接続してコード編集することを基本とするコラボレーション用の拡張です。ソースコード以外にも相手ホストのいろいろな機能に接続することができます。

  • ランゲージサーバーへの接続(相手の環境を使ってコード補完ができる)
  • プロジェクトファイル全体の grep 検索
  • 任意のポートにブラウザで接続
  • ターミナルに接続
  • デバッグ実行

自分の環境にソースコードや実行環境を持っていない状態でも、相手の環境を使って簡単にプログラミングを開始することが可能で、相手の環境で発生している不具合を手元で再現させながら修正するといったことが数分の準備で簡単に行えます。

接続はインターネット上に配置された Micsoroft の Live Share サーバーを介して行いますので、残念ながらクローズドな LAN 環境では使うことができませんが、代わりにルーターのポート開放など難しい設定なしに、どんな場所にいても機能を使うことが出来ます。

またクロスプラットフォームにも対応していますので、Windows から macOS に接続して動作させるようなことも可能です。ということで、いくつかの例を紹介してみたいと思います。

ランゲージサーバーとコンソール接続

Rust を編集している Linux をホストに Windows ゲストから接続して、Linux 上にあるソースコードと Rust Language Server に接続してみたところです。

補完も定義表示も相手の環境のものを使っていい感じに動作します。

Windows から Linux への bash の接続も OK で、ショートカットキーや Powerline の制御文字などもそのまま転送してくれます。相手の環境のコマンドがそのまま打てますので、Windows 側からビルドなんかもすることができます。すごい。

デバッガーへのアタッチ

ホスト側で起動したデバッガーにアタッチして、ゲストからステップオーバーやウォッチなどの操作をすることができます。 Linux / Rust / LLDB ホスト環境に Windows ゲストからアタッチした図です。

デバッグコンソールなども転送されてきます。

たとえば、Windows で動く LLDB を準備するのはちょっと大変ですが、このように Linux に接続できると簡単に環境を揃えることができます。(残念ながらゲスト側からデバッグの実行構成を起動することができませんでした。”The host doesn’t allow starting the debugger.” と言われてしまうので何かできそうな気がするのですが、引き続き調査してみます)

任意のポートにブラウザから接続

ウェブ開発をしている時に大きな力を発揮するのが、サーバーへのポート開放です。

今度は Windows で動作している Java ウェブアプリ環境に、macOS から接続してみます。Windows ホストに macOS ゲストから接続した上で、Live Share の Share Server を選択して、開けるポートを “localhost:8080” のように指定します。(この例は SpringBoot アプリケーションなので 8080 で起動します)

あとは macOS ゲスト側のブラウザから http://localhost:8080/ にアクセスするだけです。(localhost なのが不思議な感じですが VS Code がプロキシーして、ホストに接続してくれます)

macOS から Windows のターミナル(Powershell)に接続することもできますので、gradle を動かしてアプリケーションの起動停止をするようなこともでき、ソースコードを編集しながら、ブラウザで動作確認といったことがリモートで簡単にできるようになっています。

今年はお隣におられる方の環境につないでプログラムを修正したり、一番遠くは北海道・福岡間でプログラムの修正を行ったりしました。

特に不具合の修正では、それを手元で再現させる環境をつくるまでに時間がかかるものですが、VS Live Share を使えば不具合が起きている環境に接続してすぐ修正を開始することができます。(これができなかったら修正箇所が分らなかったのではないかということもありました。

VS Code はそれ自体の導入も手軽ですので、そのようなシチュエーションに出会ったら試してみてはいかがでしょうか。

あ、ひとつまえのポストも VS Code ネタですのでよければご一緒にどうぞ。。

AsciidoctorとGradleでつくる文書執筆環境

技術文書を書く環境が欲しくなり、VS Code と Gradle を使って Asciidoc 文書を執筆する環境を整えてみました。 お手軽に構成できて、300ペジくらいの文書でも耐えられそうです。

てなわけでまた来年もよろしくお願いいたします。。 🙂

AsciidoctorとGradleでつくる文書執筆環境

技術文書を書く環境が欲しくなり、VS Code と Gradle を使って Asciidoc 文書を執筆する環境を整えてみました。 お手軽に構成できて、300ページくらいの文書でも耐えられそうです。 🙂

VS Code でリアルタイムプレビューしながら Asciidoc 文書を執筆し、最後に HTML/PDF 文書にすることができように仕込んだ Gradle ビルド、フォントや CJK パッチ、.vscode 設定などをパッケージして github で公開しています。

https://h1romas4.github.io/asciidoctor-gradle-template/index.html

本文書は Asciidoc とその Ruby による実装である Asciidoctor を用いて Asciidoc 文書を執筆する環境を構築する手順を示します。実行環境は Windows、Linux、macOS の各 OS に対応しています。

上記のサイト(Asciidoc 文書のサンプルになっています)で詳しく手順を書いていますが、基本的にリポジトリを取得し、文書を書いて、 ./gradlew docs するだけでいい感じに Asciidoc を HTML/PDF 文書に変換して公開できるようになっています。

PDF 文書は次のようなものが出力されます。

AsciidoctorとGradleでつくる文書執筆環境(PDF版)

https://h1romas4.github.io/asciidoctor-gradle-template/index.pdf

PDF に関しては本文フォントを明朝体にできるとより技術書らしくなると思うのですが、残念ながら prawnpdf ライブラリが OpenType に対応していないため導入を断念しました。しかし、対応は進んでいるようなので期待します。

https://github.com/prawnpdf/ttfunk/issues/53

Hey there maintainers! I’ve been working for the last several months on supporting OpenType fonts, which really just means supporting the CFF font table.

さて、今回このプロジェクトを作成するにあたり初めて Asciidoc の書式を全て確認しましたが、表現力が高く、思ったことは思った通り書けばよい感じなのでお気に入りました。 😀

リポジトリを github に置けば Github Pages ですぐ綺麗な文書を公開できるようになりますので、良ければお試しください!

PocketStation(ポケステ) 開発 2018年版

初代プレイステーションと連携して動く 1999年発売の携帯ゲーム機 PocketStation(ポケステ) をお友達が発掘してお借りすることができたので、当時流行っていた、ポケステをゲーム機として使わずに ARM マイコンとして遊ぶプレイを蘇らせてみました。 😛

さすがにこれだけ年数が経過すると解説しているサイトさんも消え始めていていますので、2018 年版ポケステ・Hello World の手順を書いてみたいと思います。

ポケステメモリの読み書き

ポケステはプレイステーションのメモリーカードとしても動作し、ポケステ用として目印がついているメモリー領域が、ポケステ上でプログラムとして動作する構造になっています。

ということで、まずはプレステ用のメモリーカードリーダーを Arduino マイコンで製作しました。

ポケステが刺さるカードエッジコネクターの入手が難関ですが、昔使っていたパラレル接続のプレステメモリーカードリーダーが宝箱入れから発掘されたので、基板からコネクターだけ拝借しました。(コネクターがない方で Arduino を使いたい方は、8本ですのでなんとか足を引っ張りだしてください)

発掘されたもの(オリジナルの商品名は失念…)

分解してはんだ吸いですっぽんしたら割と簡単に抜けました。この機械は、セントロニクスパラレルポートで SPI を制御、PS/2 の端子から 5V を取っていたようです。

外からは見えませんでしたが、密かにコントローラーの端子もついていました。

カードエッジコネクターが入手できたら、これを Arduino に接続していきます。

資料と Arduino のファームは MemCARDuino を使わせていただきました。

https://github.com/ShendoXT/memcarduino

Arduino PlayStation 1 Memory Card reader

Looking at the Memory Card:
_________________
|_ _|_ _ _|_ _ _|
 1 2 3 4 5 6 7 8

1. DATA - Pin 12 on Arduino
2. CMND - Pin 11 on Arduino
3. 7.6V - External 7.6V power (only required for 3rd party cards and knockoffs)
4. GND - GND Pin on Arduino
5. 3.6V - 5V pin with a voltage divider to 3.6V
6. ATT - Pin 10 on Arduino
7. CLK - Pin 13 on Arduino
8. ACK - Pin 2 on Arduino

ポケステに関しては、3pin は結線不要。 5pin は 5V を入れても動作するようです。(3.3V だと動きませんでした)

クロック制御に Arduino の SPI を使っているため、Arduino “UNO” 以外の方は接続するピンが違いますので注意してください。 Arduino “MEGA” だと SPI は 50pin あたりからです。Arduino “Nano” は Arduino language が SPI 非対応のため使えません。

シールドに乗る大きさだったので、Arduino UNO の上に載せました。 🙂

配線できたら、PC に接続し MemCARDuino.ino をコンパイルして Arduino に転送します。

次に MemCARDuino のファームに対応した memcardrex クライアントを使わせていただき、メモリー吸い出しをして動作確認してみます。(一番下のリンクにコンパイル済みのバイナリがあります)

https://github.com/ShendoXT/memcardrex

Advanced PlayStation 1 Memory Card editor

Shendo’s software

MemcardRex 1.8 released

MemcardRex は Windows 用 C#.NET のデスクトップクライアントですので、他の OS をお使いの方は MemCARDuino に付属の Python2 スクリプトを使うと良いと思います。( Linux で動作することを確認しました。機械の動作がおかしい場合のデバッグにも使えます)

MemcardRex を起動し Option から接続した Arduino の COM ポートを選択、Hardware から read -> MemCARDuino あたりで吸い出しが開始されます。もし進捗メーターが進まなければ、配線がおかしいので確認してみてください。

読み出したら内容をバックアップしておきましょう。

MemcardRex は .mcs のメモリーカード形式をインポートして書き込むことができます。というわけで次からは、ポケステ用のソースをコンパイルしてバイナリを作成し、 .mcs に変換して書き込んであげるという手順になります。

ポケステ用開発環境とひな形のダウンロード

ポケステの CPU は ARM7 だということで、本家 ARM さんのページから GNU Arm Toolchain をダウンロードします。 今回は Windows を使っていたので、 gcc-arm-none-eabi-7-2017-q4-major-win32.zip をダウンロードして展開します。

https://developer.arm.com/open-source/gnu-toolchain/gnu-rm/downloads

The GNU Embedded Toolchain for Arm is a ready-to-use, open source suite of tools for C, C++ and Assembly programming targeting Arm Cortex-M and Cortex-R family of processors.

次に、ポケステ開発のひな形とライブラリ、ビットマップや bin2mcs などの周辺ツールを公開されている方がいらっしゃいますので、ありがたくダウンロードさせていただきます。(左フレーム PocketStation です)

http://onorisoft.free.fr/retro.htm

PocketStation DevKit, Lib & Tools v3.4

This is my complete devkit for the PocketStation, I used it to make PKBIOSTool and the NyanCat.
Full source and tools included !
Please give credits if you use it ! and drop me a mail if you make PocketStation stuff 🙂

psdevkit.zip を展開すると tools と Example がありますので、この手順では Example の中のプログラムをコンパイルして動作させてみたいと思います。

psdevkit Example のコンパイル

Example のコンパイルでは make コマンドを使っていますので、OS に導入されていない場合はインストールします。今回は Windows を使いましたので Windows 10 の bash on Windows(WLS)上の Ubuntu の make を使いました。(Cygwin でも良いと思います)

bash を起動し、試しに make と入力し “コマンドが見つかりません” なら表示された apt の手順で導入します。

次に、Makefile から呼び出される GNU Arm Toolchain の arm-none-eabi-gcc.exe などが入っている bin ディレクトリと、psdevkit 同梱の tools の mcpad.exe への PATH を bash に次のような感じで設定します。(相対パスで指定した例)

export PATH=../../gcc-arm-none-eabi/bin:../tools/mcpad/:$PATH

bash on Windows は bash 内から .exe ファイルを実行することができますが、.exe 拡張子がついていないと Linux のコマンドと混乱するため Makefile を次のように変更してコマンド名に .exe をつけてあげます。

CC	= arm-none-eabi-gcc.exe
LD	= arm-none-eabi-ld.exe
AS	= arm-none-eabi-as.exe
OBJCOPY	= arm-none-eabi-objcopy.exe
OBJDUMP	= arm-none-eabi-objdump.exe
...(略)
${PROG}.bin: ${PROG}
	${OBJCOPY} -O binary ${PROG} ${PROG}.bin
	mcpad.exe ${PROG}.bin

これにて make を実行してあげると ARM バイナリの test.bin ができるハズです。

なお、tools に入っている mcpad.exe や次で使う bin2mcs.exe などはソースファイルが同梱されていますので、Windows 以外の方は事前にコンパイルして実行可能な状態にしておいてください。

バイナリをポケステに転送する

最後に出来上がった .bin バイナリを tools に入っている bin2msc.exe で memcardrex で import できる .mcs に変換します。

../tools/bin2mcs.exe BESNESP00000GAMETEST test.bin test.mcs

第一引数の文字列指定の詳細は bin2msc.exe のヘルプから参照できます。

test.mcs が出来上がったら MemcardRex を起動し、メモリーを読み込み後、未使用スロットの上で右クリックし test.mcs を import して Hardware -> Write してあげれば…

めでたい 😀

Example で使われている pocketlib.h (& header.S) はポケステ用のライブラリです。初期化・終了処理、スプライト、vsync 割り込み、オーディオ用の割込み処理などなど大変便利なものです。

また pocketlib.h と合わせて次の資料も大変参考になりました。(ありがとうございます!)

DEEPER THAN POCKETS

本ページはPocketStationの情報を後世に残すことを目的としています。

POCKETSTATION GENERATION

ポケットステーション対応ソフトの開発資料や関連資料を掲載したサイトを紹介します。

ポケステは 32×32 液晶と LED と IrDA と 10bit DAC がメモリマップドI/O でコントロールでき、プログラミングはアセンブラが必要な部分があったりちょっとプロフェッショナルですが、それも含めて楽しめるのではないかと思います。

お店で見かけましたら、1台ぜひ。 😀