メッセージ・glink・ptext に縦中横を入れる

縦中横は、Font・ブラウザ等、環境によって結構表示が変わります。
chromeなら何文字でも縦中横になりますが、ティラノライダーでは半角2文字まででした。
あと、メイリオのような余白の広めなFontも表示がおかしくなる場合があります。

尚、mtext はどうしたらいいのかさっぱりわからず。


メッセージ・glink・ptext 共通

共通というか、.tcy がメッセージ用で、.text_tcy span がglink・ptext 用ですが、記述はまったく一緒なので纏めて記載しとく。
因みに、縦書きセーブの縦中横とも同じです。

CSS

縦中横のCSSを用意します。tyrano.cssの下の方にでもコピペしとく。

.tcy,.text_tcy span {
	-webkit-text-combine: horizontal;
	-ms-text-combine-horizontal: all;
	text-combine-upright: all;
}

glink・ptext

物凄く力業です…。
glinkの縦書きに関しては過去記事を参照してください。

タグ

テキストの縦中横にしたい部分を <span></span> で囲い、name=text_tcy を指定します。

[ptext text="テキストテキスト<span>!?</span>" vertical=true name=text_tcy]
[glink text="興味あります<span>!!</span>" name="vertical,text_tcy"]

メッセージ

kag.tagu.jsの [font] [resetfont] text.showMessageVertical に追記します。
[font][resetfont]はどちらも this.kag.ftag.nextOrder(); の上あたりに追記

[font]

if (pm.tcy){
	this.kag.tmp.tcy = true;
	this.kag.pushBackLog("<span class='tcy'>");
}

[resetfont]

if (this.kag.tmp.tcy == true){
	this.kag.pushBackLog("</span>");
	this.kag.tmp.tcy = false;
}

showMessageVertical

var j_span = that.kag.getMessageCurrentSpan(); の下あたりに追記

if(that.kag.tmp.tcy == true)j_span.addClass("tcy");

first.ks

起動したら必ず読むファイルの本編始まる前に。

[iscript]
TG.kag.tmp.tcy = false;
[endscript]

タグ

[font] のパラメータとして tcy=true を指定する。

[font size="30"]ちょっとまったーーー[resetfont][font size="30" tcy=true]!![resetfont]
誰だ[font tcy=true]!?[resetfont]

余談

tcy って何だよ!と、思うじゃないですか。
縦(tate)中(chu)横(yoko)と覚えるのです…(´▽`)←気づくまで覚えられなかった人

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

Pocket
LINEで送る


縦書きセーブ画面

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

改造方法

kag.layer.js

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

1ヶ所しかないので検索するといいです。
消してもたぶん困らないです。今のところ。
因みに、バックログを縦書きにした時にも引っかかってた(※過去記事参照)(/ω\)

CSS

tyrano.css を開いて、 .save_listwriting-mode: vertical-rl; を追記する。
後は、好きなようにCSSを変更してください。
…というのもなんなので、とりあえずな例です。

日付を漢数詞にする

「25日」を「二十五日」と表記したいとなるとさっぱりわからず、ググってみつけた置換コードをそのまま使わせていただく事にしました。

※時間を「二十一時二十三分四十六秒」とかにすると文字数多くなりすぎるので、時間はただの置換にしてます。
※セーブ時に漢数字に変更しているので、セーブ済みのデータを算用数字に戻す等はできません。

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

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

first.ks とか、毎回必ず読み込むファイルに [loadjs storage="kannsuuji.js"] を記入してjaファイルを呼び出します。

kag.menu.js を改造

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

日付を縦中横にする

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

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

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

tyarano.css に追記

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

kag.menu.js を改造

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

Pocket
LINEで送る


画面サイズ色々

標準のままかワイドで作るのが一般的だろうけど、アスペクト比変えて見比べてみた。

字幕風なのは、なんとなく映画っぽくして遊んでた名残です。
使用フォントは「しねきゃぷしょん」です。
途中でposition調整するのが面倒くさくなってる様が見て取れますが気にしない。

シネスコサイズ 2.35:1(960×408)

横長過ぎる…。

ビスタサイズ 1.85:1(960×518)

標準の映画サイズ。ワイドと殆ど変わらんけどなんとなく。

ワイドサイズ 16:9(960×540)

今のTVサイズ。

ティラノ標準 3:2(960×640)

写真(35mmフィルム)の比率。

ノーマルサイズ 4:3(960×720)

昔のTVサイズ。

…うん、まぁ、結局標準かワイドだよね。
映画っぽくするならビスタもアリかなー。height 500くらいでもいいかも。
まったくいらない記事だったけど、せっかくスクショ撮ったので、せっかくなので。

Pocket
LINEで送る


[glink]を縦書きにする

glink に vertical パラメータ無かった!!!

ので、とりあえず縦書き用CSSを用意してみた。
tyarano.css の一番下にコピペして glink に name="vertical" を指定すれば縦書きになる。はず。
縦書きしか要らないなら .vertical 消せばいい。
※Chromeのみ確認。

CSSのグラデはジェネレーター頼みなのでめっちゃ苦手…。

Pocket
LINEで送る


バックログ関係記事まとめ

だいぶ前にコメントで質問頂いてた件、なかなかテスト出来ずにうだうだしてたら記事をみつけたのでまとめという名のリンクを貼るだけの記事(-_-;)
今後、バックログ関係の記事見つけたらここに追加して行きます。

にしても、みんな困る事は同じなんだなぁ・・・ノベル系エンジンでテキスト・バックログ周りが微妙なのは結構なマイナスポイントじゃないかと思ってるんですけどそんな事ないのかなぁ?


私はバックログに保存する前に分岐しようと考えてました。
スクリプトって結果は同じでもアプローチの仕方が人それぞれなのが本当に面白いなぁと思います。
まぁ、処理効率などで最適解はあるんでしょうけどよくわからんしー。

あと、バックログにのみ任意のテキストを追記する方法。

Pocket
LINEで送る