MENU

RestHouse

音楽サイト「Little Mustapha's Black-hole」の音楽ブログということになっているはずです。

Recent Articles

Category

Monthly Archive

創作日誌 Vol.3

こんなんだったけ?

完成間近と思ってたけど色々とやることが残っている新しいRestHouseナントカ応援団データベースターズ・アプリ風のアレですが。

そろそろ今シーズンの日程等のデータを登録しようということになって、せっかくなので登録用のPerlスクリプトもバージョンアップ。

バージョンアップというか、毎年変更部分だけスクリプト内のデータを書き換えて使っていたのを、書換が必要な部分を外部のJSONで管理すれば、JavaScriptの方と共有できるので、そうなるように書き換えてみたのです。

それほど難しいことではないと思ったのですが、PerlでJSONを読み込んでデータを取り出そうとしたらなかなか上手くいかなくて。
keys %{$$json_data{members}}というややこしいやり方でやっと上手くできました。

Perlは久々なので、他にもっと簡単なやり方があったかどうかも思い出せませんけど。動いているのでこれであってるに違いないのです。

JavaScriptの方は世の中の需要もあったりして、常に進化しているのでついていくのが大変という感じはありますが、こういうことがあると、JavaScriptの方は今風という気もしてきます。

<!-- 関係ないですがPerlを書く時にはコード内のコメントなどに良く曽古野貴美が登場します。なぜかは知りません。-->

一つだけど大量

RestHouseナントカ応援団のデーターベースターズのアレはかなり出来上がってきました。
あとは今年用の写真とかも用意しないといけなかったりするので、調整しながら準備ということになりそうです。

それとは関係なく、古いバージョンで使われていたHTMLのclass名に"cel"というのがあって、今回もそのまま使っているのですが。
数年前に考えたclass名なのでどういう意味か覚えてないのですけど、使われている場所からすると、もしかすると"Select"の"sel"を間違えて"cel"にしてしまって、それがそのままという気もするのです。

データを入力するものなので、相手チームを"select"とか、球場を"select"とか使う場面がたくさんあるのですけど、いちいち間違っているかも知れないということで、気になってしまうのです。

といっても、実際に使う時には見えない場所だから良いのですけどね。

ついでに、昨日の風邪の状態で作ったところは一番複雑なところだったのですが、ボーッとしていたのでどうやって書いたのか覚えてなかったり。
最近は飲みながらコードを書くことはなくなったのですが、同じ理由で風邪の時もコードを書いてはいけないということのようです。
<!-- 酒を飲みながらだとミョーな集中力で捗ることもあるのですが、捗っても何を書いたのか覚えていないコードが大量になるだけなのでアレなのです。(というか、最近は飲みながらそういうことをする体力があまりないですけど。)-->

カィセキチュ...

ということで、ナントカ応援団のデーターベースターズ・ウェブアプリ風のアップデート作業の続きですが。

昨日の記事を書いている時に気づいたダブルヘッダー対策として一時しのぎの機能を追加。
追加というか、コレまでのに似ているのですが、カレンダーだとダブルヘッダーが表示されるかビミョーなので、試合一覧のリストを表示できるようにしてみたり。

これはついでに作った感じで、見た目はビミョーなので、今日はスクショはないのですけど。

それとは関係なく、sqlite3のデータベースとやり取りをするのに使っているPerlの方でエラーが出たりして。
Perlは久々なので、何を間違えたのか解らなかったのですけど。
実はPerlの書き方じゃなくてデータベースのカラム名が違っていただけでした。

<!-- ホントは"id"で良かったのに、"game_id"に設定しているので、たまにいじると必ず間違えます。-->

というか、またタイトルについて書き忘れてますが。
データを読み込むまでのあいだ、コルタナ団員の「解析中...」という台詞が表示される機能も作ったのです。
なのですが、ネット上のサーバじゃなくて自分のパソコンのデータベースからの読み込みなので、一瞬で終了してしまって、読み込み中の解析中画面も一瞬しか表示されないのです。

ということで、こっちもスクショなしですけど。

今日は苦労したワリにはスクショチャンスはゼロでしたね。

新機能は難しい

ということで、新バージョンにするのはけっこう大変なRestHouseナントカ応援団のデータベースターズにカレンダーなんだし!
240227_01.jpg

最近ではめったに使わなくなってしまったTableタグを使ったりしたので、この状態にするまでにかなり時間がかかりました。
しかもNPB仕様ということで、月曜始まりだったりするのも少しややこしい感じでしたが。

ついでに書くとHTMLで"colspan"と書くところをJavaScriptでやる時はなぜか"colSpan"という罠もあったり。
CSSの"font-size"みたいなのはJavaScriptで"-"が引き算になってしまうので"fontSize"というのはあるのですが、"colspan"がそうなる理由は謎です。

画像では今月のカレンダーですが、試しに去年のデータを使って試合のあった月を表示させたらちゃんとデータも表示できましたし。
これまで過去のデータを呼び出す時に、どれがどの試合だったか?とか探すのが大変だったので、カレンダー形式では楽になるに違いありません。

そして、せっかく作っても使うのは私だけで誰も見ることが出来ないというのはアレなので、積極的にスクショは載せていくのです。


<!-- もしかしてTauriでカレンダーアプリとか作れるんじゃないか?とちょっと思ったのですが、すでに世の中に大量にあるカレンダーアプリなので、そういうのは作る気にならないとかも。-->

<!-- 今思い出しましたが、まだダブルヘッダーには対応していないデータベースターズなのですが、対応させるべきか、どうかなのか。-->

けっこう大掛かり

春も近いので始まったRestHouseナントカ応援団のデータベースターズの新バージョン作りですけど。

以前のコードを流用できると思ってたら、思った以上に柔軟性がないというか。
流用するほうが面倒なので、結局新しく書いてたりするのです。

前に作った時には非同期処理みたいなのはワケが解ってなかったですし。
さらにデータベースターズの膨大な120KBものデータベース(?)を全部読み込んだりして大丈夫なのか?とか思ってたこともあったりで。
<!-- 実際に全部読み込む必要はないのですが、多分余裕で読み込めるはず。-->

なんだかミョーに時間がかかる感じがしてきましたが、次はさらに新機能が追加されるので、ややこしいことになるに違いありません。

バージョンアップするんだし

また寒くなってますが、もうすぐ春ってことでRestHouseナントカ応援団のデータベースターズ編集ページを大幅リニューアルできるのか?!

ということで、始めたのです。
240224_02.jpg
まだ何もない感じですが。

最初に作ったのが3年ぐらい前でしたけど。
その時もまあまあ出来ているつもりでしたが、去年から始めたTauriのアレでJavaScriptが色々と解ってきたので、もっとちゃんとした感じにしたかったのです。

とりあえず、形の出来たHTMLを使うのではなくて、パーツをJavaScriptで書き出すようにして、色々と柔軟に表示できる感じで。
ということでさっきの画像ですが。
夜になってやっとここまで書き出せるようになりました。
240224_03.jpg
手書きのHTMLだと簡単なのですが、JavaScriptでやると結構ややこしいのです。
その代わり、ここから先は色々とアレンジできてしまうはずなのですけど。

とりあえず一つ書き出せるようになったのですが、タブ風表示で4つのコーナーがあるので、さらに3つやらないといけませんが。
それはどうでもイイのですが、オリジナルのJavaScriptは謎のオブジェクト指向の部分があったり。
どうしてそうしたのか?という感じです。
とりあえず、新しいバージョンでは意味がなさそうなので、普通の書き方でやるようにしています。

バージョン管理

TauriでMecoressを作ったりするようになってから、バージョン管理をすべきかどうか考えていたのですが。

でも調べるとGitみたいな大掛かりなのばかりな感じだったり。
でも、その中でFossilというのが丁度良さそうということで、使い方とかを調べていたのです。

そうしたら、バージョン管理のソフトって私の思ってたのとかなり違う、という事になってきて結局これまでどおりのバックアップで良いという事になっているのです。

私のイメージではMacのバックアップのTime Machineみたいに、変更を常に監視しているとか、そんなのがバージョン管理だったのですけど。
そうではなくて、ある程度新しいコードが書けたら自分で新しいのをcommitするという感じでした。

やらないよりはやった方が良いかも知れないのですけど、途中からやるのも面倒な感じもあったりするので、使うとしたら次の何かからになるでしょう。

それとは関係なく、commitってカタカナで書くと違う意味になってしまいそうなのですけど、こういう時のcommitって日本語ではなんて言うのか?とかも。

バグではなくて技術部ソコノです

Mecoressはインターナショナルなアプリなので、Googleの翻訳なども活用して表示されるメッセージなどは英語で頑張っているのですが、この前コードを確認してたら曽古野貴美発見。

実行するとこんなことになります。
240218_10.jpg

どうしてプログラム中にこんなキャラが出てくるのか?という感じでもありますが、こういうことをしていると上手くいかなくてイライラしがちな時にちょっと落ち着けるので、LMB技術部の存在は重要なのです。

というか、後で直す予定がそのままになっているという事でもあるのですが。
ここを作っていた時にはやることが多すぎて、なんだかワケが解らない状態だったので、こういうのが沢山あるかも知れないです。

とりあえず書く

ということでMecoressの続きもやっていたりするのですが。
Tauriの仕様上不可能だと思っていたウィンドウ間でのファイルのやり取りが出来るようになって、まるで本物のアプリみたいになっているのです。

なにがスゴいか、あるいは実はスゴくないのかという感じでもありますけど。
基本的にTauriのドラッグ・アンド・ドロップはファイルを読み込む時に使う感じなので、一つのウィンドウから別のウィンドウにドラッグ・アンド・ドロップしても何も起きないのですが、一応ドロップされた側はドロップされたという反応があって、元のウィンドウではドラッグしている途中にウィンドウの外にカーソルが移動すると"Cancel"が返ってくるということで。

その辺を利用して裏技的にやってみたのです。

書いたところで解る人はあまりいない気もしますけど。
こういう瞬間が楽しいのでプログラムは結構ハマります。

それはともかく、裏技的なので挙動はちょっと怪しいかも知れないとかもあるのですけどね。

余計なものかは知らない

ということで面倒な機能が保留になったことでバージョン0.2.0が完成間近のMecoressですが。

今バージョンの予定になかったテキスト読み込み機能が追加されてしまいました。
240124_01.jpg
確か、お手本となったMedia Proにはなかったですが、その前のiView MediaPro ではテキストの読み込みが出てきたはずなので、そのうちやろうとは思っていたのです。

こういうソフトでテキストファイルが読み込めて嬉しいかどうか?ということだとビミョーかも知れませんし、それもあってMediaProでは削除された可能性もありますけど。

テキストファイルだってメディアといえばメディアなので、メディアをあれこれするソフトのMecoressでは読み込めるようにするのです。

ついでにLMB仕様なので台詞っぽいやつの名前のところが太字になってたりとか、コメントっぽいところでは色が変わるとかもやってたりします。
こういうところの正規表現はややこしいので何度もやり直しましたけど。

プログラムをやり始めたのはPerlでこういうテキストをHTMLに変換するのが目的だったので、正規表現も最初からやっているという事でもあるのですが、なぜか全然進歩しないようです。

<!-- 今気づいたのですが、テキストファイルとかオーディオファイルはスライドショーで再生するタイプのファイルではないですが、どうするのか決めてなかったりして。-->

0.3.0に持ち越しか

やる気があって、コードがゴチャゴチャでも良いのならJavaScriptはなんとかなる、ということで今年に入ってからMecoressが急成長だったのですが。
これをやったら、とりあえず完成かも知れないという機能をやろうとしたらダメでした。

というかRustでやらないといけない部分だったので、謎のエラーに遭遇するとどうにもならなくなるのです。

謎のエラーといっても、Rustのコンパイラはかなり丁寧にエラーを解説してくれるので、言ってることは解るという感じなのですけど。
それでもやっぱり謎なので、Mecoressのコードの中ではなくて、それだけのRustのコードを書いて試してみてもダメだったり。

使っているcrateのマニュアルページのサンプルをほぼそのまま書いたのに、エラーというのはやっぱり謎なのですけど。

この機能はとりあえず保留にして、バージョン0.2.0が出来たあとはRustをもう少し頑張りたい、という事になってきました。

めこるりす

ということで、Mecoressが急成長しているというか、ゴチャゴチャした機能が色々と追加されているのですけど。

あったら便利な詳細なデータを表示するコーナー(非表示にも出来ちゃう!)が追加されているのです。
240122_01.jpg
こういう感じのJavaScriptにはだいぶ慣れてきたのですが、サムネイルが並んでいる横に表示させるレイアウトの設定をどうするのか?という方が面倒だったり。

どういうアレかわかりませんが、CSSでflexにしたら上手くいってます。

それとは関係なく、なにも選択されてない時の表示が寂しいのですが。
240122_02.jpg
このスペースがもったいないので、なにも選択されていない時には、面白いデザインの時計を表示しようかなあ。
アハハハハハハハ...!
アハハハハハハハ...!

エスはサーチのエス?

カタカナで書いたら意味が解らないですが、久々にMecoress

書くのは久々でも、作業は少しずつやっていましたが。

にオーディを読み込めるようにして、そのあとでウィンドウ間でのファイルのやり取りが可能になって、本格的になってきたのです。

そして、さらに検索機能がついたらかなりそれっぽい、ということでやってみたのですけど。

簡単なファイル名検索じゃなくて、複数の条件を指定できたりとかにしたら、検索キーワードを入力するための窓を作ったりするところから大変だったり。

ついでに書くと、作成日とかの検索も作ってみたのですけど。
作成日が何日前よりも「以前」か「以後」か、というのを英語ではなんていうのか?というのも謎で。
辞書で調べても良くわからないので、findというファイルを検索するコマンドの英語のマニュアルを見て確認したり。
そうしたら、以前、以後は'less than' と 'greater than' になってました。

これもなんとなくピンとこないですが、findでそうならそうなのです。
(なんで英語なのか?ということですが、Mecoressはグローバルなアプリなので英語なのです。)

ということですが、検索機能を作ったらもう少しでバージョン0.2になってしまう!ということだったり。
でもその前にコードがゴチャゴチャになりすぎて何かが破綻しそうという心配もありますが。
バージョン0.3の前に大幅な修正が必要になったりするのか、どうなのか。