無料ブログ「rentafree.net」の管理人ブログ

エディター修正第二弾

Firefox用の新しいブログエディターを再度大幅修正しました。


<変更点その1>
<span><div>適用時に設定画面が出ずにタグ適用となっていましたが、
<span><div>は何も設定しないと見た目変わりませんので、わかりにくいと思うので設定画面出すようにしました。

PCなら右クリックからの修正前提でもわかれば問題ないと思いますが、
右クリック前提だとタッチパネルとかだと不便すぎたんじゃないかと思いますが、その辺も改善したと思います。
まあ、タッチパネルでは編集しにくいと思いますけど。


<変更点その2>
今までは上部メニューに無いタグの挿入はHTML直接入力以外ではできませんでしたが、
右クリックメニューから他にもいくつかのタグを入れられるようにしました。

右クリックから挿入できるようになったのは、既存の、
<b><i><s><u><ul><ol><span><div><a><img><table>
に加え、
<hr><em><q><strong><sub><sup><blockquote><h1><h2><h3><h4><h5><h6><p><pre>
です。

エディタ上の選択範囲の有無で挿入できるタグが変わってきます。


<変更点その3>
今まではインラインタグとブロックタグで処理を分けて、インラインタグ内にはタグを内包できませんでしたが、
処理を共通化してインラインタグ内にタグを内包することもできるようになりました。

<a>タグの設定画面から「文字列」の項目が消えましたので、
範囲指定かタグ適用後に変更する必要があります。
今までは<a>内には<img>以外のタグは内包できませんでしたが(<img>の内包も不完全でしたが)、入れられます。


<変更点その4>
タグの設定画面の処理を共通化して、設定項目を増やしました。
<table>だけ特殊すぎるので共通化していません。
<span><div><a><img><td>
の設定項目が増えています。


<変更点その5>
色選択ツールのポップアップ処理を他のポップアップ処理と共通化しました。
元の仕様だと、ポップアップ中に後ろの領域がクリックできてしまっていましたが、クリックできなくなりました。
ドラッグでの移動もできるようになっています。


<変更点その6>
今までは上部のタグ挿入ボタンをクリックした際、
選択範囲の問題で挿入できない場合でもエラー表示はしませんでしたが、
挿入できない場合はメッセージが出ます。
<a><img><table>
は今まではセレクション又はキャレットがエディタ内にあれば挿入出来ましたが、
セレクション範囲の有無で判別するようにしました。



機能は旧エディタよりかなり増えてますが、
処理の共通化と、IE8を考慮しなくて良くなったので、
コード量は3割以上(30kB以上)削減されています。
シンプルになってメンテナンスもしやすくなった。