徐行運転な水曜日

9:00

おはようございます。今日は寒すぎるので徐行運転で進めていきましょう。

断片:開きすぎてはいけない:

普段、VS Codeの一つのワークスペース内でたくさんのタブを開き、最近ではそのワークスペースも複数開いていることが多いが、これはよくないのではないか。

しかし、こういうことをついついしてしまうのは、「閉じる」という行為の面倒さだけでなく、開いていることによる支配感が影響しているのではないか。

あとで読む:TauriがiOS/Androidに対応「Tauri Mobile」アルファ版登場。Electron代替を目指すRust製の軽量フレームワーク - Publickey

Textbox:

filterの使い方で困っていました。

1
2
3
4
function formatSearchHistoryJSON(json,text){
	const result = json.filter(item => item.address == text);
	return formatHistoryJSON(result)
}

これは通るのに、複数行にしようと{}を入れると思うようにいきません。

1
2
3
4
5
6
function formatSearchHistoryJSON(json,text){
	const result = json.filter(item => {
		item.address == text
	});
	return formatHistoryJSON(result)
}

なぜかな〜と悩んでいたら、よくよく考えたら何も値を返していないことを理解しました。正解はこうです。

1
2
3
4
5
6
function formatSearchHistoryJSON(json,text){
	const result = json.filter(item => {
		return item.address == text
	});
	return formatHistoryJSON(result)
}

これまでfilterやmapの機能として返す値を書かなくてよいかと思っていましたが、そうではなくてこれはアロー関数的な書き方による省略効果なのでしょう。最初と最後のコードが等価であると理解できたので、だいぶん「わかった」感があります。

断片:ポスト・ブログ論:

プロプロが−的なものがはやったのち、「ブログ」について論じることそのものがつまらなくなってしまった感がある。

低コストで稼ぐことが目的として固定されたら「なぜそれを書くのか」という議論そのものが空虚になり、「どうやって稼ぐか」という話ばかりになる。そもそも論への議論がなくなっていく。そうした議論が行われている中で、広がっていく考えがあるのではないか。

15:00

あとで読む:おひとりさまインスタンスがやはり最強であった - Komittee Express

トンネルChannel:

書きます。

* * *

publish:みなさんはどんな環境で書いていますか - by 倉下忠憲@rashita2 - トンネルChannel

16:00

R-style:

書きます。

* * *

publish:バトルフィールドはどこか | R-style

bct:

ブックカタリストの書き起こしデータを使っていこう、という企画をbctと名付けました。

goryugocast/bookcatalyst_transcription: ブックカタリストの文字起こしデータを共有し、それを使って様々な場面で活用できるようにする

とりあえず、皆さんにissueを使ってもらえるように、いくつかサンプルのissueを挙げておきました。使い方も解説しておきます。

publish:ブックカタリスト書き起こしプロジェクトのisseuの投稿方法 - BCBookReadingCircle

17:00

Textbox:

形が整ってきたので、for欄にタグを入力して、tabキーを押したら、そのタイミングでhistoryboxが絞り込まれるようにします。

ようするに今、blurイベントでトリガーしている関数を、tabキーの動作に移せばOKです。

* * *

index.htmlにあった、以下を削除。

1
2
3
4
5
6
7
8
9
const adbox = document.getElementById("addressbox")
adbox.addEventListener("blur",function(){
	if (this.value != ""){
		searchHistoryBox(this.value)
	}else{
    searchHistoryBox()
  }
  setHIstoryEvent()
})

代わりに、tagとして生成されるボタンに以下のイベントを追加。

1
2
3
	btn.addEventListener("change",function(){
		searchHistoryBox(getTagContents())//現在checkされているタグ名でhistoryを絞り込む
	})

これでOKです。で、現状元データのaddress(tagのこと)はほぼ、単一の文字列になっていて、複数あるものだけが配列になっているので、この処理をなんとかする。

一つ目は、正規表現による置換で強引にjsonのもとデータを配列に変えること。これは難しくない。もともと一行だけの文字列だけだから、ややこしい処理は考えなくてもいい。

もう一つは、一つだけしかタグがないなら文字列で、二つ以上のときに配列にする、でコードの処理の方でそれを区分する、という方法。これだとややコードが複雑になるが、その分jsonのデータが構造が崩れていても対応しやすい。

* * *

とりあえず、jsonのデータを書き換えて、すべてを配列にしておいた。

その場合、historyで、divを描写するコードも変える必要がある。

* * *

jsonとして保存する場合にも、これを配列にする必要がある。で、このときに、jsonに保存する関数がちらばっているとややこしいことになるわけだ。

* * *

これまではfor欄のvalueを取って保存していたが、これをtagボタンの(ラベルの)innerTextにする。

このとき、チェックのオンオフをどう考えるのか。チェックが入っているものだけを保存するのか、オンオフに関係なく保存するのか。

一度設定したタグを削除するボタンを付けようと考えていたが、もしチェックが入っているものだけを保存するならいちいち削除する必要もなくなる。

とりあえず、その方向でいくとするか。さらに、タグの入力中にサジェストが働くなら、タイプミスも減るだろうから、削除しなければならない場面も減ることだろう。

* * *

1
const tempobody = {"body":e.target.parentElement.parentElement.querySelector(".modal-body textarea").value,"address":e.target.parentElement.parentElement.querySelector("#addressbox").value}
1
 const tempobody = {"body":e.target.parentElement.parentElement.querySelector(".modal-body textarea").value,"address":getTagContents()}

以前のコードはバカみたいな感じだったが、少なくaddress欄に関してはスマートになった。

* * *

addボタン(保存ボタン)を押すときに、shiftクリックするとタグが保存されるようにするか。

* * *

shiftの有無で動作を変えました。今はshiftがあったときだけタグを残すようにします。今後の使い勝手次第ではこれをひっくり返すかもしれません。

* * *

タグの表示について。

Image from Gyazo

現状はCSSを後回しにしたので、タグがどどーんと大きく表示されます。さすがにタグっぽくないのので、Evernoteのようにもう少し小さくする予定でした。ulをflexにして、widthに上限を付ける。そんな感じです。

でも、このままの方が良い気がしてきました。たぐってそんなにたくさんつけても仕方がないので。

* * *

そうすると、タグをtabキーで入力したら、もう入力欄にフォーカスしてもいいかもしれません。二つ入力することの方が稀な感じです。

問題は、inputboxをショートカットキーで表示したときに、最初のフォーカスはどちらにあるのか。for欄か、テキスト欄か。