Copyright: copyright (C) carty, 1995


HTML mode for Dana

HTML mode for Dana は、テキストエディタDana上でHTMLテキスト作成を支援するスクリプトです。

いわゆるWYSWYGタイプではなく、タグをテキスト上に直接入力するものですが、洗練されたユーザーインターフェイスにより、驚くほど簡単にホームページの作成、メンテナンスをする事が出来ます。ブラウザと併用してご利用下さい。

特長

インストール

メインメニュー

インテリジェントメニュー

ブラウザで見る

テクニカル

注意事項


特長

・HTML3.0準拠（全てのタグをサポートしているわけではありません。）

・ESCキー、または右クリックでオープンするメニューから全ての操作が可能。キーボードのみでのオペレーションも容易。

・選択領域に対してあらゆるタグが入力可能。

・読込み、保存時のＪＩＳ変換をサポート。

・タグの上にカーソルを置いて開くだけで、そのタグ特有の属性を入力する事が出来るインテリジェントメニュー。

・HTMLのテンプレートがワンタッチで作成可能。

・選択範囲から全てのタグを取り除く機能をサポート。既存のHTMLテキストからざっと内容を把握したい時便利。

・色指定をカラーダイアログから出来る。

・もちろんDanaの高度な編集機能がそのまま利用可能。

HTML mode for Dana は、全て、BASICライクな、"Dana Script"で記述されていますので、ロジックレベルでのカスタマイズも比較的簡単に出来ます。

HTMLそのものについては、詳しくは触れません。市販の書籍などを参考にしてください。

ちなみに、私が愛用しているHTMLリファレンスは

http://www.access.digex.net/~werbach/barebone.html

より入手したテキストです。これは、日本語版もあり（なんと６ヶ国語に翻訳されている！）大変良くまとまっています。参考までに。


インストール

HTML mode for Dana は、以下の手順でDanaに組み込むことが出来ます。

１）HTMLMode.DAS と、HTMLMode.HLPをDana.EXEと同じディレクトリに置く。

２）Danaの「ﾂｰﾙ」メニューから「設定」ダイアログを起動し、「アドイン」ページをアクティブにする。

３）「コマンドスクリプト」で、空いている適当な番号をコンボボックスから選択する。

４）スクリプト名のところに"HTMLMode"と記述する。

５）「'ﾂｰﾙ'ﾒﾆｭｰに登録」をチェックし、メニュー項目に「HTML mode for Dana(&H)」と記述する。

６）次に「メニュー」ページをアクティブにする。

７）ﾕｰｻﾞｰﾍﾙﾌﾟのところで、ﾍﾙﾌﾟ1から5までのうち、空いているものを選ぶ。

８）「ﾒﾆｭｰ項目」のところに、「HTML mode for Dana ﾍﾙﾌﾟ(&H)」と記述する。

９）ﾌｧｲﾙ名のところに「HTMLMode.HLP」と記述する。

以上で、Dana への組み込みが完了しました。

ツールメニューから、「HTML mode for Dana(&H)」を選択すると起動します。起動しても、画面上は変化がありませんが、ESCキーを押してみると、メインメニューが開く事が確認出来ると思います。

○いちいち起動するのが面倒な方へ

「組込めたはいいんだけど、いちいちツールメニューから起動するのは面倒だな」という方や、「俺はDanaなんてHTMLエディタとしてしか使わないぜ」（ｺﾚｺﾚ(^^;）という方で、かっ飛びペンティアムマシンをお持ちの方には以下の方法をお薦めします。

１）Danaの初期常駐スクリプト Dana.DASを開きます。

２）以下の箇所を探します。

Main ()

    Select Case .DanaState

    Case STATE_INIT

        StayResident()

３）以下の一文を付け加えます。

Main ()

    Select Case .DanaState

    Case STATE_INIT

        Run("HTMLMode")           '←これ

        StayResident()

４）後は、Dana.DASを保存後、Danaを再起動してください。起動と同時に、HTMLModeが常駐するようになります。

HTMLMode.DASの起動にはそれ相応の時間がかかりますので、Danaの起動自体遅くなります。そこは御了承下さい。


メインメニュー

文字列を選択した状態、または、カーソルがタグ("<"と">"の間）上にない状態でESCキー、またはマウスを右クリックすることで、メインメニューを開く事が出来ます。

繰り返し

文字

ﾌｫﾝﾄ

ﾘﾝｸ

ﾘｽﾄ

段落

特殊文字

ﾃｰﾌﾞﾙ

ﾌｫｰﾑ

ﾌﾚｰﾑ

その他

ﾈｯﾄｽｹｰﾌﾟで見る

ﾀｸﾞ除去

ﾃﾝﾌﾟﾚｰﾄ

HTMLﾓｰﾄﾞの終了


繰り返し
前回入力したタグを再度入力することが出来ます。Danaのコマンドで「繰り返し」に割り当てられているキー（デフォルトではCtrl+R）を入力する事でも呼び出せます。（Danaのメインメニューの「繰り返し」からは呼び出せません。）


文字

選択範囲のテキストに文字関係のタグを付加します。

見出し

仕切り

整形済

中央

点滅

強調

更に強調

引用

ｿｰｽｺｰﾄﾞ

ｻﾝﾌﾟﾙ

ｷｰﾎﾞｰﾄﾞ

変数

ｺﾒﾝﾄ


見出し
文字の大きさを１<H1>から６<H6>までで指定します。１が最大です。


仕切り
仕切りタグ<DIV>を入力します。


整形済
固定幅フォントを前提としたテキストに<PRE>タグを付加します。これにより、ブラウザは選択された部分を固定幅のテキストで表示します。


中央
選択されたテキストを中央寄せ<CENTER>します。


点滅
選択範囲を点滅<BLINK>状態にします。


強調
選択範囲を強調表示<EM>します。通常、イタリック体で表示されます。


更に強調
選択範囲を強い強調表示<STRONG>にします。通常ボールド体で表示されます。


引用
選択範囲に引用<CITE>タグを付加します。


ｿｰｽｺｰﾄﾞ
選択範囲にソースコード<CODE>タグを付加します。プログラムソースなどに有効です。


ｻﾝﾌﾟﾙ
選択範囲にサンプル<SAMPLE>タグを付加します。


ｷｰﾎﾞｰﾄﾞ
選択範囲にキーボード<KBD>タグを付加します。


変数
選択範囲に変数<VAR>タグを付加します。


ｺﾒﾝﾄ
選択範囲をコメントにします。ブラウザに表示されなくなります。


ﾌｫﾝﾄ

フォント関係のタグです。文字タグが、意味的であるのに対し、フォントタグは、物理的に文字の見た目を設定します。

NetScape独自の拡張部分が多いので、注意して使用してください。

ｻｲｽﾞ

色

ﾎﾞｰﾙﾄﾞ

ｲﾀﾘｯｸ

固定幅

ｱﾝﾀﾞｰﾗｲﾝ

削除線

下付き文字

上付き文字

小さなﾌｫﾝﾄ

大きなﾌｫﾝﾄ

基本ｻｲｽﾞ


ｻｲｽﾞ
選択範囲のフォントサイズを１から７まで<FONT SIZE=?>設定します。


色
選択範囲のフォントの色を指定します。NetScape2.0より有効になっています。


ﾎﾞｰﾙﾄﾞ
選択範囲のﾌｫﾝﾄを太字<B>に設定します。


ｲﾀﾘｯｸ
選択範囲のフォントを斜体字<I>に設定します。


固定幅
選択範囲のフォントを固定幅<TT>に設定します。


ｱﾝﾀﾞｰﾗｲﾝ
選択範囲のフォントをｱﾝﾀﾞｰﾗｲﾝ<U>に設定します。


削除線
選択範囲のフォントに削除線<S>を入れます。


下付き文字
選択範囲のフォントを下付き文字<SUB>にします。


上付き文字
選択範囲のフォントを上付き文字<SUP>に設定します。


小さなﾌｫﾝﾄ
選択範囲を小さなフォント<SMALL>に設定します。


大きなﾌｫﾝﾄ
選択範囲を大きなフォント<BIG>に指定します。


基本ｻｲｽﾞ
フォントの基本サイズ<BASEFONT SIZE=?>を指定します。


ﾘﾝｸ

他のURLへのリンクや埋めこみイメージの指定をします。

HTTP

FTP

ﾌｧｲﾙ

ｲﾝﾗｲﾝ画像ﾌｧｲﾙ

ｲﾝﾗｲﾝ画像ｿｰｽ


HTTP
他のHTTPへのリンクを指定します。<A HREF="http://....">


FTP
他のFTPへのリンクを指定します。<A HREF="ftp://....">


ﾌｧｲﾙ
ローカルファイルへのリンクを指定します。<A HREF="....">


ｲﾝﾗｲﾝ画像ﾌｧｲﾙ
インライン画像のファイル名を記述します。<IMG SRC="....">


ｲﾝﾗｲﾝ画像ｿｰｽ
インライン画像のファイル名などを記述します。URLで外部のリソースを参照する事も可能です。<IMG SRC="....">


ﾘｽﾄ

リストを作成します。

通常

番号付き

ﾒﾆｭｰ型

名簿型

定義型

項目


通常
選択された行を通常の形式のリストにします。

<UL>

<LI>Item1

<LI>Item2

<LI>Item3

</UL>


番号付き
選択された行を番号付きのリストにします。

<OL>

<LI>Item1

<LI>Item2

<LI>Item3

</OL>


ﾒﾆｭｰ型
選択された行をメニュー型のリストにします。

<MENU>

<LI>Item1

<LI>Item2

<LI>Item3

</MENU>


名簿型
選択された行を名簿型のリストにします。

<DIR>

<LI>Item1

<LI>Item2

<LI>Item3

</DIR>


定義型
以下の形式で記述されたテキストを選択して、定義型のリストを作成する事が出来ます。

---------------------------------------------------

見出し

内容は、タブまたはスペースで始まるように

記述しておく。

---------------------------------------------------

                        ↓

---------------------------------------------------

<DL>

<DT>見出し

<DD>内容は、タブまたはスペースで始まるように

<DD>記述しておく。

</DL>

---------------------------------------------------


項目
選択された行、または現在行の先頭に<LI>を付加してリスト項目とします。


段落

段落関係の設定をします。

強制改行

段落

罫線


強制改行
選択範囲の末尾、または現在行の末尾に<BR>を付加して強制改行とします。

シフト＋Ｅｎｔｅｒキーでも入力可能です。


段落
選択範囲の末尾、または現在行の末尾に<P>を付加して段落の終わりとします。

コントロール＋Ｅｎｔｅｒキーでも入力可能です。


罫線
罫線<HR>を入力します。


特殊文字

HTMLソース内に直接記述できない文字や、特殊なフォントを必要とする文字を入力します。

<

>

ｱﾝﾊﾟｻﾝﾄﾞ

"

ｽﾍﾟｰｽ

登録商標

著作権


<
<記号を入力します。


>
>記号を入力します。


ｱﾝﾊﾟｻﾝﾄﾞ
アンパサンド(&)を入力します。


"
ダブルクオート(")を入力します。


ｽﾍﾟｰｽ
スペース文字を入力します。


登録商標
登録商標記号(R)を入力します。


著作権
著作権記号(C)を入力します。


ﾃｰﾌﾞﾙ

テーブルを作成します。

ﾃｰﾌﾞﾙ

ﾃｰﾌﾞﾙ行

ｷｬﾌﾟｼｮﾝ

ﾃｰﾌﾞﾙﾍｯﾀﾞ

ﾃｰﾌﾞﾙﾃﾞｰﾀ


ﾃｰﾌﾞﾙ
以下のようなフォーマットから枠付きのテーブルを作成します。

----------------------------------------------

Caption

Header1

Item1

Item2

Header2

Item3

Item4

----------------------------------------------

空行で区切られた１テキストブロックが一行として横に並べられます。

但し、先頭の１行をキャプションにするかどうかと、各ブロックの先頭を見出しにするかどうかはオプションで選択できます。

上記の例で、両方YESを選択すると以下のようなHTML文が作成されます。

----------------------------------------------

<TABLE BORDER>

<CAPTION>Caption</CAPTION>

<TR>

<TH>Header1</TH>

<TD>Item1</TD>

<TD>Item2</TD>

</TR>

<TR>

<TH>Header2</TH>

<TD>Item3</TD>

<TD>Item4</TD>

</TR>

</TABLE>

----------------------------------------------

枠なしに設定したい時は、<TABLE BORDER>の上にカーソルを置いてメニューを開き、「枠付き」→「いいえ」を選択して下さい。


ﾃｰﾌﾞﾙ行
選択範囲をテーブルの１行<TR>として定義します。


ｷｬﾌﾟｼｮﾝ
選択された文字列をキャプション<CAPTION>とします。


ﾃｰﾌﾞﾙﾍｯﾀﾞ
選択された範囲を１個のテーブルヘッダ<TH>として定義します。


ﾃｰﾌﾞﾙﾃﾞｰﾀ
選択された範囲を１個のテーブルデータ<TD>として定義します。


ﾌｫｰﾑ

入力フォームを作成します。

ﾌｫｰﾑ

送信ﾎﾞﾀﾝ

ﾘｾｯﾄﾎﾞﾀﾝ

ﾃｷｽﾄ

ﾊﾟｽﾜｰﾄﾞ

ﾁｪｯｸﾎﾞｯｸｽ

ﾗｼﾞｵﾎﾞﾀﾝ

選択ﾎﾞｯｸｽ

ﾃｷｽﾄｴﾘｱ


ﾌｫｰﾑ
選択された範囲内を一つの入力フォーム<FORM>として定義します。テキストやボタンなどのコントロールは必ずこのフォームブロックの中に記述されなければなりません。


送信ﾎﾞﾀﾝ
送信ボタンを定義します。これを押すと、フォームに指定されたアクションが実行されます。


ﾘｾｯﾄﾎﾞﾀﾝ
リセットボタンを定義します。これを押すとフォーム内で入力された内容がクリアされます。


ﾃｷｽﾄ
テキストボックスを定義します。


ﾊﾟｽﾜｰﾄﾞ
入力文字列が見えないテキストボックスを定義します。


ﾁｪｯｸﾎﾞｯｸｽ
チェックボックスを定義します。


ﾗｼﾞｵﾎﾞﾀﾝ
ラジオボタンを定義します。


選択ﾎﾞｯｸｽ
選択ボックスを定義します。可視項目が１の時コンボボックスに、それ以外の時はリストボックスになります。

可視項目については、<SELECT>タグの上にカーソルを置いて開くメニューから設定できます。


ﾃｷｽﾄｴﾘｱ
テキストエリアを定義します。縦、横幅などは、<TEXTAREA>タグの上にカーソルを置いて開くメニューから指定できます。


ﾌﾚｰﾑ

フレーム関連のタグを入力します。

ﾌﾚｰﾑｾｯﾄ

ﾌﾚｰﾑ

ﾉｰﾌﾚｰﾑ


ﾌﾚｰﾑｾｯﾄ
選択範囲に<FRAMESET>タグを追加します。


ﾌﾚｰﾑ
フレームを設定します。

フレームの各プロパティについては、FRAME タグの上にカーソルを置いてメニューを開くことで設定出来ます。


ﾉｰﾌﾚｰﾑ
選択範囲を、フレームをサポートしていないブラウザ用の領域に設定します。


その他

その他タグを入力します。

ﾒｰﾙ宛先

ﾍｯﾀﾞ

ﾎﾞﾃﾞｨ

ﾀｸﾞ入力


ﾒｰﾙ宛先
メールの宛て先タグを作成します。これをクリックすると通常ブラウザは宛て先へのメール送信フォーマットを開きます。


ﾍｯﾀﾞ
選択範囲をヘッダ<HEAD>として定義します。


ﾎﾞﾃﾞｨ
選択範囲をページの本体<BODY>として定義します。


ﾀｸﾞ入力
選択範囲を任意のタグで囲みます。例えば XYZ と入力すると、結果は、

<XYZ>選択範囲</XYZ>となります。


ﾈｯﾄｽｹｰﾌﾟで見る
編集中のファイルをネットスケープに読み込みます。

ネットスケープが起動している必要があります。


ﾀｸﾞ除去
選択範囲のタグ指定を全て除去します。タグ指定に失敗して収拾がつかなくなった時や、内容をざっと見る時にタグが邪魔な時などにお使い下さい。アンドゥ２回で元に戻ります。


ﾃﾝﾌﾟﾚｰﾄ
新規HTMLファイルのテンプレートを作成します。


HTMLﾓｰﾄﾞの終了
HTMLモードを終了します。


インテリジェントメニュー

HTML mode for Dana は、単にHTMLのタグ入力を支援する、というだけでなく、既に入力されたタグに対して処理を加えることが出来ます。

入力済みのタグの上にカーソルを置いてＥＳＣキーまたは右クリックで、そのタグに対して指定できるプロパティのメニューが起動します。

タグの上でＥＳＣを押してもなにも起こらない時は、そのタグに対して指定するオプションがないか、または未対応ということです。

例えば、<BODY>タグの上でＥＳＣキーを押すと、色や背景GIFなどを指定するメニューが起動して、好みの設定を加えることが出来ます。

しかも、例えば既に <BODY BACKGROUND="..."> という設定がある状態でバックグラウンドの指定をすると、前の設定を置き換える形で入力されます。

また、<HR NOSHADE>など、=値を指定しないプロパティについては、メニューから選択することで、それを指定するか、取り除くかを選ぶことが出来ます。

一つ一つの項目については、特に説明の必要もないので省きます。やってみれば判るでしょう。

この操作性に慣れてしまうともう普通のHTMLエディタには戻れなくなること受けあいです。(^^)


ブラウザで見る

HTML文書自体は難解なテキストの塊です。専用のブラウザ、例えばNetscape Navigatorなどで見て初めてイメージが解ります。ですから、HTMLテキストを編集する時は、ぜひＷＷＷブラウザを立ちあげて、編集中のファイルをOpen Fileで読み込んだ状態にしておく事をおすすめします。

編集中のテキストを見たい時は、いったんDanaで上書き保存して、例えば、Reloadボタンを押すと、保存した内容を見ることが出来ます。

また、"ﾈｯﾄｽｹｰﾌﾟで見る"コマンドを使うと、現在編集中のファイルを自動的にNetscapeに読み込むことが出来ます。この機能はNetscapeでしか使えません。

読み込むだけでなくウインドウが手前に出てくれるとうれしいのですが、これはなぜか現在のネットスケープ2.0などでは出来ないようです。コマンドはあるのですが・・・


テクニカル

HTMLMode.DAS 本体は1500ステップを越す、スクリプトとしてはかなり巨大な部類に入ります。が、所詮はBASIC、あなたの手でお好みの形にカスタマイズすることも可能です。

一般的にスクリプトを編集するには、Script Jukeboxに登録して、そこから、編集ラジオボタンを選択して読み込むのが簡単です。保存して、再度実行すると、既に前のスクリプトが常駐していてもそれを置き換えて再常駐します。

また、スクリプトの先頭に、ユーザー指定が可能な定数の定義と説明がありますので、これも一度目を通しておくとよいでしょう。

メインメニュー

インテリジェントメニュー

日本語処理

テンプレートをいぢりたい


メインメニュー

メインメニューの作成は、MenuInit()ルーチン内で行なっています。

メニューの順番を変える程度であれば、それ程面倒はないとおもいますが、メニューを追加したい時は新たなメニュー項目ＩＤを、ファイルの先頭でConst宣言して下さい。通常、T_で始まる名前を指定します。他のＩＤと値が重複しないよう、注意して下さい。

ＩＤが定義出来たら、今度は、メニューの追加です。

既存のメニューにカスケードしたい時は、定義済みのメニューハンドルを親にしてメニューアイテムを追加して下さい。新たなカスケードメニューを追加したい時は、メニューハンドル自体を新たに宣言する必要があります。

ファイル先頭のConst宣言の次あたりにメニューハンドルの変数宣言がありますので、ここで宣言した上でメニューを追加すると良いでしょう。

くれぐれも、関数内でローカルに宣言しないようにして下さい。

さて、メニュー項目が追加できたら、次は実際の処理です。

HTMLDispatch()ルーチン内に、選択されたメニューＩＤを見て、適切な処理にディスパッチするようCase文を追加する必要があります。

簡単なタグの追加だけであれば、AddTag("TAG")を呼び出すだけで足りますが、若干複雑な処理になると、自前で処理ルーチンを記述する必要があります。

既存の処理ルーチンを参考にしてみてください。


インテリジェントメニュー

インテリジェントメニューの処理は、全て InTag(sCsr$)ルーチン内で行われています。sCsr$には、現在カーソルがある位置のタグ名が格納されていますので、通常これを見て適切なメニューを作成するようになっています。

メニューＩＤは、InTagルーチンの手前にあるConst宣言でV_を先頭にして定義されています。

その後に、メニューが実際に実行された後のディスパッチルーチンが記述されています。

ここでは、sAdd$ に、プロパティ値を含めた設定文字列を設定するようにします。（例えば "BGCOLOR=FFFFFF" とか）

ファイル名を指定したい時は、GetOpenFileString, 色を指定したい時は GetColorStringなど、既存のルーチンを活用できると思います。

ここまでやれば、後は、後続の処理がうまくやってくれます。(^^)


日本語処理

HTML mode for Dana では、.html .htmのファイルの読み込みと保存でJIS変換をするようになっています。インターネットは、まだまだ必ず８ビットクリーンで通してくれるとは限らないので、一般的に、Shift-JISや、EUCなどの８ビットコードは使わない方が無難です。

また、JISコードで記述すると、ブラウザ側の自動判別も容易になり、文字化けの可能性が少なくなります。（Shift-JIS とEUCとの間には決定的なコード体系の違いを判別する方法がないので）

と、ここまでいっても、EUCを使いたいですか。(^^;仕方がないですね。

HTML mode for Dana では、.html, .htmのファイルは保存前にSjisToJisTextで変換してから保存し、保存直後に、JisToSjisTextを呼出して元に戻しています。また、読み込み後にも、JisToSjisTextを呼び出して、JISテキストは基本的にユーザの目に触れないようになっています。

カスタマイズするとなると、ここの部分をいじることになります。

幸いDanaの標準添付スクリプトに「漢字変換.DAS」というのがあって、これが一通りの変換をサポートしていますので、ここから欲しい部分を持ってくると良いでしょう。

また、「俺はクールでハイスピードな漢字変換DLLを書いたんだ。こんなのろったいBASICルーチンは置き換えさせてもらうぜ。」なんてのもまったくＯＫ。(^^)ぜひ、HTML mode for Dana のバージョンＵＰ版としてアップロードしてください。


テンプレートをいぢりたい

テンプレートの作成は AddTemplate()ルーチン内で行なっています。

ここに手を加えてください。入力ファイル名から、ページのデフォルト名を取得するあたりを除いて、基本的にInsertStringの羅列ですから、特に難しい部分はないと思います。(^^)


注意事項
HTML mode for Dana は、テキストエディタDana 専用のアプリケーションです。動作させるためには、テキストエディタDanaが必要です。

HTML mode for Dana は、フリーソフトウェアです。改造、改変、再配布等まったく自由ですが、改変者が誰であるかはソース中に明記して下さい。

//////////////////////////////////////////////////////////// carty@pis.bekkoame.or.jp