
カレンダーセレクターを日本語化する!ーGoogleサイトで作るグループウェア (78)ー
この記事を読んで欲しい方
企業DXや校務DXの進め方に悩んでいる方
クラウドアプリの導入に悩んでいる方
①Rui Calendar Selector
前回、カレンダーセレクター拡張機能として、Rui Calendar Selectorをご紹介しましたが、Chrome拡張機能作成の勉強を兼ねて日本語化してみました。
あくまでも、Chrome拡張機能作成の勉強なので、ハッキング等の意図はありません。
【注意!】Rui Calendar Selectorは拡張機能を更新すると、追加したカレンダーグループのデータが消えるのでご注意ください。カレンダーグループデータの外部保存機能はありません。
②拡張機能のソースコードをダウンロード!?
ネットを漁っていたら、ものすごいツールを発見しました。Extension Source Downloaderです。
拡張機能の画面を表示しておいて、Extension Source Downloaderのアイコンをクリックすると、ZIP形式でソースコード丸ごとダウンロードできてしまいます。

③Extension Source Downloaderの使い方
まず、インストールしたら拡張機能アイコンを表示させる設定(ピンで止める)にしてください。
次にダウンロードしたい拡張機能の画面を表示します。

拡張機能アイコンをクリックすると、ダウンロードのダイアログが出てきますので、Download as ZIPを選んでください。

④ダウンロードしてきたソースコード
ZIPを解凍してフォルダごとGoogleドライブにアップロードしてください。

フォルダの中身はこの様になっています。

⑤日本語化する
日本語化するのはindex.jsの中の3か所です。
左サイドメニューのCalendar Groupをカレンダーグループに、+Addを+追加に、ダイアログの中の文のPlease enter a group name.をグループ名を入れてくださいに変更します。

【注意!】
Googleドライブからテキストエディタで開いて修正しますが、文字コードは必ずUTF-8で保存してください。
特にWindowsOSを使っている人はデフォルトでSHIFT-JISになっているので気をつけてください。
まず、index.jsを開いて、78行を変更します。
header.textContent = `Calendar Group`
header.textContent = `カレンダーグループ`
次に、72行を変更します。
addButton.textContent = '+Add'
addButton.textContent = '+追加'
最後に、29行を変更し、index.jsをUTF-8で保存します。
const groupName = window.prompt('Please enter a group name.')
const groupName = window.prompt('グループ名を入れてください')
⑥日本語化した拡張機能のインストール
日本語化の変更をした拡張機能のソースコードには特別なインストール方法があります。
拡張機能の管理画面を開いて、右上のデベロッパーモードをONにします。

そうすると、パッケージ化されていない拡張機能を読み込むボタンが出てきますのでクリックしてください。
つぎに、ファイルを選択する画面が出ますので、ソースコードが入っているフォルダを選択します。(フォルダ名はダウンロードした拡張機能のID番号になっています。)

日本語化したものが読み込まれました。(アイコンの表示が少し違います)

Googleカレンダーを表示すると正常に日本語化されていました。

⑦ソースコードの共有方法と注意事項
日本語化したソースコードの配布ですが、一応ソースコードのフォルダを共有ドライブに入れて、自分のパソコン上のGoogleドライブの共有ドライブからソースコードをインストールさせることは可能でした。(;゚д゚)エエーッ!!!
ただし、この方法はGoogleからは非推奨になっていました。Googleによると拡張機能の更新がうまくいかない可能性があるからだそうです。
ですので、正式に自作の拡張機能パッケージを社内で配布する場合は、5ドル(最初の1回だけ)払えば、パッケージ化して社内だけで配布できるようにできるようです。
これのほうが自動ダウンロードにも対応できるので人数が多い場合には便利だと思います。
【注意!】
今回、日本語化した拡張機能は、個人利用でのみお使いください。また、この件でのRui Calendar Selectorの作者への問い合わせは、お止めください。