タグ構成のチェック機能を実装
「HTML編集画面」から「区画」を登録する操作は、前後の不要な空白行などをきれいに排除できます。 その理由で、私はもっぱら「HTML編集画面」で「区画」を登録して来ました。「区画」を記事に貼り付ける時は、前後の空白行の処理が必要なので、「HTML画面」の登録に拘る意味は少ないです。 しかし、非表示の「styleタグ」等を含めた「区画」の登録が確実に出来るので、「HTML画面」での登録機能は必要不可欠の機能です。
しかし、「区画」に登録する「HTMLコード」の範囲が適正でないと、登録した「区画」や、登録パネル全体のレイアウト崩れを生じる事があります。 そこで、チェックツールの「TAG CLose Check」を作り、「Fixed Format Palette ⭐」に実装する段階まで来ました。
「TAG CLose Check」の移植
「TAG CLose Check ver.0.3」のテストで、充分タグ構成のチェックとして使えると判断し、このツールのコードを「Fixed Format Palette ⭐」に移植しました。 エラー報告機能などを省き、関数名や変数名を書換えて、チェックの可否のみを返す仕様にダイエットして、組み込ました。
当初は、「不適当なタグ構成」の場合に「ペースト」するかどうかをユーザーが選択できる方式を考えていましたが、良いインターフェイスが作れませんでした。 結局その案を棄て、「不適当なタグ構成」は常にペースト不可としました。
実際の使用で、タグが閉じていない「HTMLコード」の貼付けはリスクを伴います。 また、そもそもタグ構成が怪しい半端な境界の「区画」を、あえて登録する必要はないと思われます。 チェックを通らない「HTMLコード」は登録出来ない仕様で良いでしょう。
実際のチェックの様子
任意の記事の「HTML編集画面」を開いて、「HTMLコード」が終了タグを入れない範囲を反転選択をした上で「Alt+F11」を押下すると、チェックコードが機能して、下の様なダイアログを表示します。
チェックを通らない場合は、「区画」として登録ができません。「OK」を押すと、登録しようと反転選択した「HTMLコード」は解除されます。 登録は何度でもやりなおせるので、タグが閉じた範囲を選択すれば登録できる事が判ります。
今回のチェック機能の実装で、登録パネルが崩れる事はなくなるはずです。 ユーザーの選択の失敗をカバーする機能の実装で、「HTML編集画面」での「区画」登録が安心して使える様になったと思います。 より多くのユーザーが「HTMLコード」に親しみ扱える様になる環境は、望むところです。
チェック制限回数について
「HTMLコード」のチェックエンジンは「TAG CLose Check ver.0.3」譲りで、そのチェックループ回数を 2000回上限にしています。 これは、チェック対象の「HTMLコード」が想定外で、永遠にチェックが終了しない状態に陥ることを防ぐためです。 で、記事をまるごと「区画」登録する場合を想定して、チェック処理がどの位の回数必要かを調べました。
〔注〕「TAG CLose Check」は、編集枠に見える範囲しかチェック対象に出来ませんが、「Fixed Format Palette ⭐」は、「Ctrl+A」で記事全部の「HTMLコード」を取得して「区画」に登録できるので、記事の全範囲をチェックする事になります。
〔テスト記事1〕
文字制限 60000文字のギリギリの記事を探すと、リンクカードを沢山並べた記事があり、その記事でのチェック回数を調べました。 下は、その記事の結果ですが、479回の処理で「OK」が出ました。 以下は「Format Palette」コードを一部書換え、ループ終了時の回数を表示させています。
リンクカードの1個の文字数は 2000文字程度ですが、タグ数は20個以下ですから、この数は計算通りです。（60000÷2000×20=600）
〔テスト記事2〕
空白改行を繰り返しただけの記事は、処理回数が増えます。
上はテスト記事の一部で、1024桁 / 約15400文字のサンプルです。 この記事でチェックコードの処理回数は「1030」の結果。 実は最初は変な値が出て、ループ上限を「1000」にしていたのに気付き、「2000」に修正して予想の結果を得ました。
〔テスト記事3 / 計算値〕
空白改行は「<p> </p>」の 13文字で、最大は「60000÷13=4615」行ほどになり、タグ数もその数のはず。 最大のタグ数の記事は「<p>0</p>」の行を文字数限界まで埋めた記事で、1行「8文字」でタグ数は 60000/8=7500 のはずです。
そんな記事全部を「区画」として登録するのは想定外です。 実際の記事は多くても数100程度で、巨大なテーブル表などがあっても 1000にはなかなか届きません。 安全弁としてのチェック処理回数の上限の設定を考えたのですが、JavaScriptの処理スピードでは 10000回も一瞬でしょうが、常識的な 2000回を上限に設定しました。 それ以上の処理が必要な「HTMLコード」は、タグ構成の問題がなくてもチェックが停止して「区画」登録が出来ませんが、これはチェックコードの仕様としました。
私のブログは長文が多い方だと思いますが、「2000」のチェック上限を超える記事は無い様です。
スクリプトの「自動更新」に対応しました
「Tampermonkey」の自動更新に対応するメタデータを追加しました。 これにより、このツールのインストールや更新がリンクを押すだけで可能になりました。
「Fixed Format Palette ⭐」の操作方法
このツールの詳細や操作方法は、以下のマニュアルを参照ください。
「Fixed Format Palette ⭐」を利用するには
このツールは Chrome・Edge・Firefox版の拡張機能「Tampermonkey」上で動作します。 以下に、このツールの導入・更新の手順を説明します。
❶「Tampermonkey」を導入します
◎ 使用しているブラウザに拡張機能「Tampermonkey」を導入する事が必要です。
既に「Tampermonkey」を導入している場合は、この手順 ❶ は不要です。
拡張機能の導入については、以下のページに簡単な説明があるので参照ください。
❷ スクリプトコードを登録・更新します
「Fixed Format Palette ⭐」のコードは「GitHub」で配布しています。
● 以下のリンクを押すと「Fixed Format Palette ⭐」を初めて利用される場合は「インストール」、既に利用されている場合は「上書き」（更新）ができます。
● 下の様な確認画面が表示されたら、「スクリプト名（ツール名）」「バージョン」を確認して、「インストール」または「上書き」のボタンを押します。
以上の操作で、「Tampermonkey」の「インストール済み UserScript」のリストに「Fixed Format Palette ⭐」の最新バージョンが登録・更新されます。
▪ ダッシュボードのリストは「 リロード」すると、新しい登録が反映します。
「自動更新」の設定について
「自動更新」対応のツールは、以下の設定をすることで定期的な自動チェックによる更新版のインストールが可能です。（スクリプトの自動更新）
Chrome / Edge では、拡張機能の「管理」➔「Tampermonkey」の「詳細」で
●「ファイルの URL へのアクセスを許可する」を「ON」にします。
「Tampermonkey」の「ダッシュボード」➔「設定」タブで
●「UserScript の更新」の項で、適当な「確認の間隔」を設定します。
「自動更新」の設定の詳細については、以下のページを参照ください。
上記の設定をせずに、任意のタイミングで手動で「スクリプトの更新」が可能です。
●「ポップアップ」のメニューの「 UserScript の更新を確認」を押します。
「Fixed Format Palette ⭐」最新版に関する記事について
スクリプトツールは、動作対象ページのHTML変更などで正常動作が不能になる場合があります。「自動更新」や手動による「更新」で、最新バージョンを利用することをお勧めします。
「Fixed Format Palette ⭐」の最新バージョンに関する記事は、以下のページのリンクリストから探せます。
