ティラノスクリプト - メモ
ティラノスクリプトのメモ。

縦書きセーブ画面

2017-06-23 2022-07-03 メモ 改造 , 縦書き , セーブ , CSS
この記事をシェアする

縦書きにするならセーブ画面も縦書きにしたいな、と思ったのでやってみました。
※カッコよくしたいと思うと、結構CSSの知識は必要な気がします。

動作確認

ティラノスクリプト v515beta4

やり方

kag.layer.js

kag.layer.jsalign='center' を削除します。

1ヶ所しかないので検索するといいです。 消してもたぶん困らないです。今のところ。
でも、消さないと上手い事いきません。

消さなくても大丈夫でした。

CSSを書き換える

tyrano.css を開いて、 .save_listwriting-mode: vertical-rl; を追記する。
後は、好きなようにCSSを変更してください。

…というのもなんなので、とりあえずな例です。

下記コードを適当な名前で保存して、[loadcss]タグで読み込めば、サンプル画像のレイアウトになります。

日付を漢数詞にする

「25日」を「二十五日」と表記したいとなるとさっぱりわからず、ググってみつけた置換コードをそのまま使わせていただく事にしました。
※時間を「二十一時二十三分四十六秒」とかにすると文字数多くなりすぎるので、時間はただの置換にしてます。

jsRender converter を使う方法と、ティラノ本体を改造する方法があります。

漢数詞変換jsを用意して読み込む

漢数字変換用関数 | sikaku

数値を漢数字に変換するJavaScript用関数

コチラのコードまるまんまコピペして、適当な名前で保存します。
例えば kansuji.js として、/data/others 以下に置きます。

first.ks など、起動時に必ず読み込むksファイルに [loadjs storage="kansuji.js"] を記入してjaファイルを呼び出します。

JsRender コンバータで変換する場合

  1. 下記コードをjsファイルにして [loadjs] タグで読み込んでください。
    漢数字用のjsファイルに纏めて記述しても問題ありません。
  2. load.html と save.html の日付部分を書き換える。
    変更前
    <span class="save_list_item_date">{{>save_date}}</span>
    
    変更後
    <span class="save_list_item_date">{{date_kanji:save_date}}</span>
    

kag.menu.js を改造する場合

※セーブ時に漢数字に変更しているので、セーブ済みのデータを算用数字に戻す等はできません。

doSave の save_date 部分を改造します。
日付改造に関しては、黒豆さん作の「カスタマイズ補助プラグイン」を参考にさせて頂きました。

日付を縦中横にする

※縦中横はFontによって色々難しい。

↓メイリオ(上に寄るというか下が空くというか)

↓しねきゃぷしょん (4ケタだと縦中横にならない)

tyarano.css などのCSSファイルに追記

tcy {
  -webkit-text-combine: horizontal;
  -ms-text-combine-horizontal: all;
  text-combine-upright: all;
}

JsRender コンバータで変換する場合

  1. 下記コードをjsファイルにして [loadjs] タグで読み込んでください。
    漢数字用のjsファイルに纏めて記述しても問題ありません。
  2. load.html と save.html の日付部分を書き換える。
    変更前
    <span class="save_list_item_date">{{>save_date}}</span>
    
    変更後
    <span class="save_list_item_date">{{date_tcy:save_date}}</span>
    

kag.menu.js を改造する場合

参考にさせて頂いたサイト

漢数字変換用関数 | sikaku

数値を漢数字に変換するJavaScript用関数

この記事をシェアする
[fuki_star][fuki_stop]でスタイルを保存・再指定するマクロ ループする [mtext] マクロ

コメント送信フォーム


※ Email will not be published
Loading...
 Please enter the letters of the image