Charm.js を更新しました（v2.5）

コピペで使える名前変換スクリプト「Charm.js」を更新しました。

カスタム変換「先頭文字スキップ」追加

登録した名前をすべて表示させずに、先頭の文字をスキップした名前で表示することができるようになりました。

以下はサイトのカスタム説明ページをベースにしています。

data指定：data-charm-skip="on"

<span class="charmname4" data-charm-skip="on">まえ</span>

class指定：charm_skip

<span class="charmname4 charm_skip">まえ</span>

▼カタカナと組み合わせ

<!-- data指定 -->
<span class="charmname4" data-charm-skip="on" data-charm-kana="on">マエ</span>

<!-- data指定 -->
<span class="charmname4 charm_skip charm_kana">マエ</span>

既存の「省略表現」と並べて使うと、「なまえ」という登録で「な……まえ……」等も表現できます。ぜひ使ってみてください。

▼な……まえ……

<!-- data指定 -->
<span class="charmname4" data-charm-short="1">な</span>……<span class="charmname4" data-charm-skip="on">まえ</span>……

<!-- data指定 -->
<span class="charmname4 charm_short">な</span>……<span class="charmname4 charm_skip">まえ</span>……

class指定で使える記号を追加（39～48番）

• 「っ」 charm_symbol39

• 「っ！」 charm_symbol40

• 「っ！　」 charm_symbol41

• 「っ、」 charm_symbol42

• 「っ……」 charm_symbol43

• 「ッ」 charm_symbol44

• 「ッ！」 charm_symbol45

• 「ッ！　」 charm_symbol46

• 「ッ、」 charm_symbol47

• 「ッ……」 charm_symbol48

使い方はこれまでの記号指定と同じです。

<span class="charmname4 charm_pause charm_symbol43">なっ……まっ……え</span>っ……

名前登録時に画面をリロードできるように修正

名前登録直後にリロードするか、スクリプトファイルを編集することで指定できるようになりました。

スクリプトファイルのsetReload値を1に変更すると、名前登録直後に画面の再読み込みが入るようになります。

  // 名前登録時にページを再読み込みをするかどうか
  // 再読み込みをする場合は1、再読み込みをしない場合は0を設定してください。
  static setReload = 0;

サイトの内容にもよりますが、再読み込みをすると画面を再描画することになり、多少チラついたりします。
デフォルトでは0なので、これまで通りの動きで良い方は特に編集しなくてOKです。

v2.5でのその他の更新

More > Charm.js の使い方についてのQ&A > Q14 を追加

Charm.jsの特徴で「jQueryやPHPを用意しなくてOK」と書いているためか、「jQueryと一緒だと動かないの？」「PHPで作ったサイトでは動かない？」と気になる方がいらっしゃるようなので
基本的には他の環境に関係なく動くということを書きました。

Charm.jsは<script>タグで読み込んで、指定のタグを埋め込めるサイトであれば、HTMLとJSのみのサイトでもWordPressサイトでも動きます。

ファイルサイズがだいたい15KBになりました

今回の更新でファイルサイズが約14KB → 約15KBになりました。
一般的なサイトでは影響は無いと思いますが、念のためお知らせします。

V2.4.1 について

色々と立て込んでいてv2.4.1の公開時にnoteが書けなかったので、ここでお知らせします。

v2.4.1以降から、Charm.jsで登録するデータのキーを指定できるようになっています。
同じサイト（※同じドメイン）の中で複数のCharm.jsを使うと、互いに干渉してしまうため、それぞれが干渉しないように、保存データにつけているキーを変更できるようになりました。

▼保存キー指定部分

static storageKeyName = 'charm';

デフォルトでは「charm」になっています。
同じドメインの中で複数のCharm.jsを使いたい場合は、ここを任意の文字に変えてください。

どうしてキーを変えないと複数使えないのかについて

Charm.js がデータ保存に利用しているLocalStorageとSessionStorageは、ドメインごとにブラウザがデータを保持しています。
これはブラウザの仕様です。
なので、フォルダ階層を変えたり、スクリプト本体名を変えるだけでは複数のスクリプトは使うことができません。

小説のジャンルごとに変えたい場合や、同じドメインの中でフォルダを分けて別サイトとして動かしている場合は、キーを変えて使ってくださいね。

※ドメインって何？　という方にざっくり説明すると
https://google.com/aiueo/　というサイトがあるとすると「google.com」の部分がドメインです。細かい説明はいろいろとあるのですが、ざっくりとはこんな感じです。

---

今回と前回の更新は以上です。
今後もCharm.jsをよろしくお願いいたします。

何かありましたらこちらのContactへお願いします
Lanama.net