見出し画像

Charm.js 更新 v2.0

Lanamaで公開していた名前変換スクリプト「Charm.js」を更新しました。
合わせてLanama全体も改装しています。


Charm.js v2.0 更新内容

使い方説明ページでの呼び方変更

これまでは「アレンジ」と呼んでいた応用変換を「カスタム」と改めました。

全体的にタグのidを変更

サンプルファイルにある入力フォームのidとボタン関連のidが変更になりました。これはサンプルファイルのみでの話なので、独自のidを設定していた方には何の影響もありません。
サンプルのidを変更したので、説明の中での名前表示のspanタグのclassが変わりますが、既にCharm.jsをお使いの方は既存のタグを無理に変更する必要はありません。
旧版サンプルを利用していた方向けのコピペ用コードも用意してあります。
コピペ用カスタムコード(v1.2フォーム用)

classカスタムを追加

タグにdata属性を付与して「なーまーえ」などを設定できていましたが、今回の更新でclassを付与しても「なーまーえ」等のカスタムができるようになりました。
例えばカタカナ変換は↓の通りです。1行目がdataでのカスタム、2行目がclassでのカスタムです。

<span class="charmname4" data-charm-kana="on">ナマエ</span>
<span class="charmname4 charm_kana">ナマエ</span>

classカスタムはカタカナ変換、省略表現、詰まり表現、区切り表現、響き表現と、今回新たに追加にした「母音のばし表現」も出来ます。
回数指定や記号変更ではdata属性の方が自由度は高いですが、使いやすい方を選んでお使いください。

classの詳しい使い方は Charm.js カスタムページ をご覧ください。

データ保存先をLocalStorageまたはSessionStorageに変更

Cookieへの保存機能を削除し、LocalStorageまたはSessionStorageに保存するようになりました。サンプルファイルでいうところの「登録」がLocalStorage、「一時登録」がSessionStorageです。

<button type="button" id="charmset">登録</button> 
<button type="button" id="charmsession">一時登録</button>

2つのボタンを併用することもできますし、どちらかだけを選んで導入することもできます。
※登録ボタンのidは旧版の「charm-setname」でも動きますが、旧版の登録ボタンと新版の登録ボタンを2つ設置すると動かなくなりますのでご注意ください。

LocalStorageとSessionStorageってなに?という方向けにざっくり説明すると、どちらもPCやスマホのブラウザにデータを保存する機能です。
LocalStorageとSessionStorageの違いは保存期間で、LocalStorageの保存期間は長期的(日数制限なし)、SessionStorageはタブを閉じたりブラウザを閉じるとデータが削除されます。

一時登録ボタンで登録した場合、以下のタグがあると一時保存をしたときだけ(一時保存しました)の文字が出るようになります。表示の必要がなければこのタグは削除してもOKです。

<div id="charmsessionmsg"></div>

母音のばし表現を追加

ひらがな登録された名前の末尾の文字を母音にする機能を新たに追加しました。あ行の名前は勿論、か~わ行、「ゃゅょ」のある拗音、濁音も「あいうえお」「ぁぃぅぇぉ」のどれかにします。

「みょうじ」と登録されていたら「みょうじいいい」とか「みょうじぃぃ」とかできます。
既存のカタカナ変換と併用すれば「苗字イイイイィィィィ!!」のような表現もできますので是非ご活用ください。

母音のばし機能についての詳細は、Charm.js のカスタム > 母音のばし機能 の説明ページをご覧ください。

Charm.js のその他の変更点

Cookieにデータを保存しなくなったため、Cookieが使えるかどうかのアラート機能は削除しました。
また、JavaScriptファイル内を一部圧縮したので、旧版よりもファイルサイズは軽量化されています。
読み手さんに負担をかけないよう、初期設定での登録文字数は一つの項目につき50文字までになりました。これを変更するにはJavaScriptの変更が必要です。詳細は Charm.js > More 参照。

サイト全体の更新について

バナーについて

情報を見やすくするために Lanama 全体も改装しました。
リンク用バナーは無くてもいいかと思って無くしましたが、紹介等にあたって必要な方がいらっしゃれば再度用意しようと思います。

新しい名前変換スクリプト

前回のnoteでお知らせしていたスクリプトは少しずつ作業を進めています。公開日は未定ですが、春頃には公開できるようにしたいと思っています。
(新スクリプト自体はだいたい完成していて、当初はCharm.js v2.0 と一緒に公開する予定でしたが、思ったよりCharm.jsの説明ページ作成に時間がかかり…)

今後の更新

ひとまずは新しい名前変換スクリプトの公開に向けて作業を進めていますが、他の更新や追加が先になる可能性もあります。
また何かあればnoteも更新すると思いますので、今後ともよろしくお願いします。

この記事が気に入ったらサポートをしてみませんか?