summaryrefslogtreecommitdiffhomepage
path: root/vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.ndoc
diff options
context:
space:
mode:
authornsfisis <nsfisis@gmail.com>2023-09-20 19:56:52 +0900
committernsfisis <nsfisis@gmail.com>2023-09-20 19:56:57 +0900
commita84908b7e8a0e2423afd6b836eccf27a420270b4 (patch)
tree00204b62358f8c57fcb36f601db360626484cc1a /vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.ndoc
parent0b488f85380f964c40b0b9aae69c6611bc7978bc (diff)
downloadnsfisis.dev-a84908b7e8a0e2423afd6b836eccf27a420270b4.tar.gz
nsfisis.dev-a84908b7e8a0e2423afd6b836eccf27a420270b4.tar.zst
nsfisis.dev-a84908b7e8a0e2423afd6b836eccf27a420270b4.zip
feat(blog/nuldoc): change content format from DocBook to NulDoc
Diffstat (limited to 'vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.ndoc')
-rw-r--r--vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.ndoc122
1 files changed, 122 insertions, 0 deletions
diff --git a/vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.ndoc b/vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.ndoc
new file mode 100644
index 00000000..e2fd65cb
--- /dev/null
+++ b/vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.ndoc
@@ -0,0 +1,122 @@
+---
+[article]
+title = "term-banner: ターミナルにバナーを表示するツールを書いた"
+description = "ターミナルに任意の文字のバナーを表示するためのツールを Go で書いた。"
+tags = []
+
+[[article.revisions]]
+date = "2022-04-24"
+remark = "公開"
+
+[[article.revisions]]
+date = "2022-04-27"
+remark = "-f オプションについて追記"
+---
+<article>
+ <section id="intro">
+ <h>はじめに</h>
+ <p>
+ こんなものを作った。
+ </p>
+ <codeblock>
+ <![CDATA[
+ $ term-banner 'Hello, World!' 'こんにちは、' '世界!'
+ ]]>
+ </codeblock>
+ <p>
+ image::https://raw.githubusercontent.com/nsfisis/term-banner/main/screenshot.png[term-banner
+ のスクリーンショット]
+ </p>
+ <p>
+ コマンドライン引数として渡した文字列をターミナルに大きく表示する。
+ </p>
+ <p>
+ リポジトリはこちら: <a href="https://github.com/nsfisis/term-banner">https://github.com/nsfisis/term-banner</a>
+ </p>
+ </section>
+ <section id="motivation">
+ <h>Motivation</h>
+ <p>
+ 以前、https://github.com/nsfisis/big-clock-mode[big-clock-mode]
+ という似たようなプログラムを書いた。 これは tmux の <code>:clock-mode</code>
+ コマンドに着想を得たもので、<code>:clock-mode</code>
+ よりも大きく現在時刻を表示する。
+ </p>
+ <p>
+ <code>big-clock-mode</code>
+ を開発したのは、次のようなシチュエーションで使うためである。
+ 弊社では現在リモートワークが基本だが、web
+ 会議などで画面共有しているときに、休憩を挟んで特定の時刻から再開する、ということがある。
+ こういったケースで、画面上に現在の時刻を大きめに表示しておくと、モニタから離れても遠くから時刻がわかるので便利である。
+ </p>
+ <p>
+ それこそタイマアプリか何かを使えばいいのだが、ターミナルに棲むいきものとしては、住処から離れたくないわけだ。
+ </p>
+ <p>
+ しばらく便利に使っていたのだが、ひとつ不満点が出てきた。それは、再開する時刻がいつだったかを覚えておかなければならないということだ。
+ どこかにメモしておいてもいいが、せっかくなら現在時刻とともに表示させておきたい。
+ </p>
+ <p>
+ そんなわけで、「任意の文字列をターミナルに表示する」プログラムを書く運びとなった。
+ まあ、作らなくても探せばあると思うが、作りたいものは作りたいので知ったことではない。
+ </p>
+ </section>
+ <section id="program">
+ <h>プログラム</h>
+ <p>
+ 全体の流れは次のようになっている。
+ </p>
+ <ol numeration="arabic">
+ <li>フォントファイルを読み込む</li>
+ <li>コマンドライン引数を Shift-JIS に変換する (フォントが Shift-JIS 基準で並んでいるため)</li>
+ <li>1文字ずつレンダリングしていく</li>
+ </ol>
+ <p>
+ <code>big-clock-mode</code> が Go 製なので、今回も Go で書いた。 PNG
+ が標準ライブラリにあったり、Shift-JIS
+ のエンコーディングが準標準ライブラリにあったりしたのは助かった。
+ </p>
+ <p>
+ フォントファイルは <code>go:embed</code>
+ で実行ファイルに埋め込んでいるので、ビルド後はワンバイナリで動く。
+ 仕事ではスクリプト言語ばかり書いているが、やはりコンパイル言語はいい。
+ </p>
+ </section>
+ <section id="font">
+ <h>フォント</h>
+ <p>
+ フリーの 8x8
+ ビットマップフォントである、https://littlelimit.net/misaki.htm[美咲フォント
+ 2021-05-05a 版] を使わせていただいた。
+ </p>
+ <p>
+ はじめは自分でポチポチ打っていたのだが、「き」くらいまでやって挫折した。
+ 同じく 8x8
+ で作っていたのだが、平仮名でさえも、この小さなキャンバスにはとても収められない。
+ </p>
+ <p>
+ 美咲フォントは、平仮名・片仮名に留まらず、JIS
+ 第一・第二水準の漢字までサポートしている。
+ 第二水準ともなると一生お目にかかることのない字の方が多いくらいだが、これをこの大きさで書くというのは、もはや芸術の域である。
+ </p>
+ <p>
+ さらに言うと、実のところ美咲フォントは実サイズ 7x7
+ で作られており、余白が設けられている。
+ これは、単純にそのまま並べても字間・行間を確保できるようにという配慮である。
+ おかげでコーディングまで楽になった。
+ </p>
+ <p>
+ ゴシック体と明朝体があったが、私の好みで明朝体の方にした。
+ ただ、ゴシック体の方が見やすい気がするので、フォントを選べるように後ほど拡張するかもしれない。
+ </p>
+ <p>
+ 2022-04-27 追記: <code>-f</code> オプションで選べるようにした。
+ </p>
+ </section>
+ <section id="outro">
+ <h>おわりに</h>
+ <p>
+ あなたもターミナルに住んでみませんか?
+ </p>
+ </section>
+</article>