|
このページでは、Just Arks（PrezArk）の様々な面に焦点を当てて、開発スタッフ自らがメッセージを発信します。
今回は、Javaプレゼーションソフト「PrezArk」ファイルをテキストエディタや一太郎Arkで編集できるようになる技を紹介します。
| |
PrezArkファイルの文書構造について 〜 XHTMLへの挑戦 〜 |
|
| |
|
|
みなさんはじめまして。毎年恒例の健康診断が近いこともあり、マフィンの食べ過ぎを解消すべく、週に3回ほどジム通いしているPrezArkファイル担当のIです。
今回はPrezArkファイルの文書構造について紹介します。
ファイル形式としてXHTMLを採用した経緯からPrezArk固有の要素、属性まで説明していきます。
文書構造を丸裸にしますので、テキストエディタや一太郎Arkなどを使って遊んでみてください（テキストエディタ等で編集したPrezArkファイルの動作は保証対象外）。
PrezArkは、Arkアーキテクチャを継承するプロジェクトなので、開発当初から独自バイナリ形式という話は一切出ませんでした。
「やっぱりバイナリじゃなくてXMLだよね」というメンバーの総意から、プレゼンテーションに必要な要素を洗い出し、新しく文書型を設計し、ある程度実装が進み、レビューをすることになりました。そこで「なぜ独自のXML形式なのか？既存のボキャブラリを流用すべき」という意見からXHTMLにしてはどうかということになりました。SMILも候補にあがりましたが、アウトラインプロセッサとしての方向性と異なることから見送りました。ちょうどそのころXHTML1.0は勧告(2000年1月)になったばかりでタイミングも良かったのです。
XHTMLにするメリットは、
- タグセットの設計コストが省略できる
- 仕様の説明が省略できる（XHTMLと同じというだけで済む）
画面1 Netscape6.1での表示例 |
独自のXML形式にこだわる理由はありませんでした。既存のXHTMLの語彙で足らない部分だけを拡張するという方針に切り替え、PrezArkファイルはホスト言語をXHTMLとしたXML複合文書として再設計することになりました（ベクトルデータはSVGとしています）。
Technology Preview版(以下TP版)では、再設計したXHTML形式となりましたが、製品ではもう一段階進化しています。それはそのままブラウザで表示できることを考慮して若干の変更を加えたことです。TP版ではそのままブラウザで表示すると、ページが重なるように表示されていましたが、製品ではページが重ならないように属性を設定し、ハイパーリンクでページを送る機能をつけました。
PrezArkファイルは、ホスト言語をXHTMLとしたXML複合文書として設計しています。
XHTMLに定義されていないPrezArk固有の要素、属性については、XML名前空間を利用し、XHTMLのタグ、属性名と衝突しないように定義します。
文書は、次の３つの部分から構成されます。
- XML宣言(リスト1の001行目)
- 宣言的ヘッダの部分 (リスト1の004行目〜021行目, head要素として区切られる)
- 文書の実際の内容を含む、本体 (リスト1の022行目〜054行目, body要素)
XML宣言は、すべてのXML文書に必須というわけではありませんが、XHTML文書ではXML宣言を使うよう強く奨励されています。文書のキャラクタエンコーディングがデフォルトの UTF-8 か UTF-16 以外のものであるときは、宣言は必須なので、PrezArkでは必ずつけることにします。
ヘッダは、文書のタイトル、作成者、文書共通のスタイル情報（[書式−タイトルページの設定]、[書式−スライドページ共通の設定]で設定される）、その他文書の内容以外のデータを格納します。
文書の本体には、文書の内容が含まれます。
PrezArkでは、独自の拡張属性を用い、XHTML文書にページ、枠、ノートの構造を付加しています。
リスト1 ：サンプルXHTMLファイル抜粋「sample.html」
*sample.htmlはutf-8で記述されていますので、IEなどのブラウザで閲覧時にはエンコードしてご確認ください。 |
001
002
003
004
005
006
007
008
009
010
011
012
013
014
015
016
017
018
019
020
021
022
023
024
025
026
027
028
029
030
031
032
033
034
035
036
037
038
039
040
041
042
043
044
045
046
047
048
049
050
051
052
053
054
055
|
<?xml version="1.0" encoding="utf-8"?>
<html xmlns:pa="http://www.justsystem.co.jp/ark/xmlns/prezark/" pa:version="1.0"
xml:lang="ja-JP" lang="ja-JP"xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="schema.DC" href="http://dublincore.org/qdcmes/1.0/" />
<meta content="2001-09-17 14:28" name="DC.Date" />
<meta content="text/html" name="DC.Format" />
<meta content="PrezArk(Muffin/1.0)" name="generator" />
<meta content="タイトル" name="DC.Title" />
<meta content="isikawa" name="DC.Creator" />
<title>タイトル</title>
<pa:permit>
<pa:item title=" " />
</pa:permit>
<style>
...
省略
...
</style>
</head>
<body>
<div class="navi" style="position: absolute;left: 0px;width: 800px;height: 50px;top: 1px;">
<a name="pa:page1"></a>
<div>[previous] [<a href="#pa:page2">next</a>] [top]</div>
</div>
<div class="tmPage" pa:type="page" pa:layout="title" style="top: 30px;">
<div class="tmTitle" style="z-index: 0;" pa:type="area.title">
<h1>タイトル</h1>
</div>
<div class="tmSubTitle" style="z-index: 1;" pa:type="area.subtitle">
<h2>サブタイトル</h2>
</div>
<div class="note" pa:type="note">タイトルページのノート</div>
</div>
<div class="navi" style="position: absolute;left: 0px;width: 800px;height: 50px;top: 650px;">
<a name="pa:page2"></a>
<div>[<a href="#pa:page1">previous</a>] [next] [<a href="#pa:page1">top</a>]</div>
</div>
<div class="smPage" pa:type="page" pa:layout="list" style="top: 680px;">
<div class="smTitle" style="z-index: 0;" pa:type="area.title">
<h1>たいとる</h1>
</div>
<div class="smArea1A" style="z-index: 1;" pa:type="area.list">
<ul>
<li>箇条書き１</li>
<li>箇条書き２</li>
</ul>
</div>
<div class="note" pa:type="note">箇条書きページのノート</div>
</div>
<div class="navi" style="position: absolute;left: 0px;width: 800px;height: 600px; top: 1330px;">
</div>
</body>
</html>
|
リスト１の文書をPrezArkで読み込み、DOMツリー表示プラグインでツリー表示させたのが下の画面２です。
html要素をルートとし、文書本体のbody要素にページが並んでいます。リスト１ではページごとに存在しているページへのリンク情報がDOMツリーにないのは、読み込みの際、PrezArkにとっては必要のないデータなので、削除しているためです。これは、ファイルへの保存時に復活します。
１ページ目の要素を展開させています。名前空間 http://www.justsystem.co.jp/ark/xmlns/prezark/ に属するpa:type属性でページ、枠、ノートを区別しています。
画面2 DOMツリー表示プラグインでの表示例
XHTMLでは表現できないため拡張したPrezArk固有の要素と属性について紹介します。
固有の要素はすべて管理用で、head要素に格納され、レンダリング対象外となっています。
|
|
permit要素
パーソナライズドビューの管理情報を保持します。パーソナライズドビューの個数だけitem要素を子供として持ちます。
head要素の子供として出現します。
item要素
パーソナライズドビューの項目情報を保持します。title属性で名前、selected属性で選択されているかどうかを表します。
permit要素の子供として出現します。
tmaster要素
[書式−タイトルページの設定]で追加した枠の情報を保持します。
この要素は、タイトルページの設定で枠を追加しない場合は存在しません。
head要素の子供として出現します。
smaster要素
[書式−スライドページ共通の設定]で追加した枠の情報を保持します。
この要素は、スライドページ共通の設定で枠を追加しない場合は存在しません。
head要素の子供として出現します。
|
|
version属性
PrezArkのバージョン情報を格納します。PrezArkのファイルかどうかの判別にも使用しています。
設定場所は、html要素です。
type属性
ページ、枠、ノートを表します。属性値については以下の表を参照してください。
設定場所は、div要素です。
表1 type属性値の一覧
| 属性値 |
意味 |
| page |
ページを表します。body要素直下に並びます。 |
| note |
ノートを表します。存在する場合は、ページ最後の子要素となります。 |
| area.title |
タイトルの枠を表します。ページ先頭の子要素として必ず存在します。 |
| area.subtitle |
サブタイトルの枠を表します。 |
| area.list |
箇条書きの枠を表します。 |
| area.image |
画像の枠を表します。 |
| area.clipart |
クリップアートの枠を表します。 |
| area.object |
オブジェクトの枠を表します。 |
| area.misc |
上記の種別に該当しない枠を表します。 |
permit属性
パーソナライズドビューの表示、非表示の情報を格納します。
設定場所は、箇条書き項目(li要素)、タイトル(h1要素)、画像(img要素)、タイトル/箇条書き/画像以外の枠です。
以下のようなパーソナライズドビューの設定時
<pa:permit>
<pa:item title="英語" />
<pa:item title="日本語" selected="selected" />
</pa:permit> |
2つのパーソナライズドビューが存在し、以下のような例の場合は日本語のパーソナライズドビューが選択されている場合のみ有効となります。(0:OFF 1:ON を表す)
<li pa:permit="01">この項目は日本語の項目です。</li> |
effect属性
[書式−画面切替のエフェクト]、[書式−枠のエフェクト]での設定値を保持します。以下の表は現在のプラグインで実装されているエフェクトの一覧です。エフェクトプラグインは拡張できるようになっているので、仕様が公開されれば、自分好みのエフェクトを作成することも可能になります。
設定場所は、画面切替のエフェクトはページ、枠のエフェクトは枠です。
表2 effect属性値の一覧
| 属性値 |
エフェクト名 |
| wipe-right |
ワイプ(右へ) |
| wipe-left |
ワイプ(左へ) |
| wipe-down |
ワイプ(下へ) |
| wipe-up |
ワイプ(上へ) |
| wipe-open-horizontal |
ワイプ(開く(左右)) |
| wipe-close-horizontal |
ワイプ(閉じる(左右)) |
| wipe-open-vertical |
ワイプ(開く(上下)) |
| wipe-close-vertical |
ワイプ(閉じる(上下) |
| slide-right |
スライド(右へ) |
| slide-left |
スライド(左へ) |
| slide-down |
スライド(下へ) |
| slide-up |
スライド(上へ) |
| disolve |
ディゾルブ |
| box-in |
ボックスイン |
| box-out |
ボックスアウト |
| random-stripe-horizontal |
ランダムストライプ(縦) |
| random-stripe-vertical |
ランダムストライプ(横) |
expand属性
[アウトライン−展開]、[アウトライン−折り畳み]で設定されるアウトラインのページを展開するか折り畳むかの情報を保持します。
設定場所はページです。
表3 expand属性値の一覧
| 属性値 |
状態 |
| expand |
アウトラインは展開されている(初期値) |
| collapse |
アウトラインは折り畳まれている |
layout属性
[挿入−新しいページ]、[書式−スライドのレイアウト]で設定されたスライドのレイアウト情報を保持します。
設定場所はページです。
表4 layout属性値の一覧
| 属性値 |
スライドのレイアウト名 |
| title |
タイトル |
| list |
箇条書き(初期値) |
| list2 |
2段組箇条書き |
| clipart |
クリップアート |
| clipart_list |
テキストとクリップアート1 |
| list_clipart |
テキストとクリップアート2 |
| blank |
白紙 |
category属性
クリップアートの分類名（グループ名）を保持します。
設定場所はクリップアートのimg要素です。
keyword属性
クリップアートのキーワードを保持します。
設定場所はクリップアートのimg要素です。
data属性
クリップアート挿入時のURIを保持します。
設定場所はクリップアートのimg要素です。
rehearsal属性
リハーサル予定（期待）時間を部分クロック値（MM:SS 例 02:33）で保持します。
設定場所はページです。
frame-decoration属性
枠飾りの情報をCSSライクな仕様で保持します。「プロパティ名: 値」という書式で１組のプロパティを形成し、各プロパティ宣言がセミコロンで区切られるスタイルです。
設定場所は枠です。
表5 frame-decoration属性値の一覧
| プロパティ名 |
プロパティ説明 |
値 |
値説明 |
| shape |
枠飾りの型 |
rect |
長方形(初期値) |
| round-rect |
角丸長方形 |
| lozenge |
菱形 |
| ellipse |
楕円 |
| cloud |
雲形 |
| balloon |
吹き出し |
| direction |
向き(吹き出し) |
btt |
上向き(初期値) |
| ttb |
下向き |
| ltr |
右向き |
| rtl |
左向き |
| border-style |
縁取りの線種 |
solid |
実線(初期値) |
| none |
枠なし |
| dotted |
点線(背景色に重ねられる) |
| dashed |
破線(背景色に重ねられる) |
| border-width |
縁取りの太さ |
medium |
中くらいの太さ(初期値) |
| thin |
細い |
| thick |
太い |
| border-color |
縁取りの色 |
色 |
CSS2で指定されている色と同じ |
| shadow |
影 |
none |
影なし(初期値) |
横位置,
縦位置,
色 |
影の性質を設定します。書式は、横位置, 縦位置, 色です。“横位置”、“縦位置”では、影の位置を長さで与えます（負の値も許される）。
通常の枠飾りの位置を基準にして、横は右方向を、縦は下方向を正にとります。
たとえば、3px, 2px, black であれば，影は枠飾りの 3 ピクセル右、2 ピクセル下にできます。
-3px -2px, black ならば、3 ピクセル左，2 ピクセル上になります。
“色”は影の色(CSS2で指定されている色と同じ)です。
|
| background-color |
背景色 |
色 |
CSS2で指定されている色と同じ |
content属性
ページ内容を示す文字列を保持します。
設定場所はページです。
表6 content属性値の一覧
| 属性値 |
内容 |
| table_of_contents |
目次ページを表します（[ツール−目次生成]で目次を生成したとき設定されます）。 |
|
|
PrezArkファイルの文書構造についての紹介はいかがでしたか？
これであなたもPrezArkファイルをテキストエディタ等で編集することが可能(?)ですね。テキストエディタ等で編集したPrezArkファイルの動作は保証対象外となりますが、ぜひ遊んでみてください。
今回は PrezArk開発チームのIが担当しました。
またお会いできることを楽しみにしています。
|
開発の現場から
