【2.12】文字装飾機能内部設計書 [email protected] [email protected] http://trac.openpne.jp/ticket/333 【A-1】文字装飾タグの基本仕様 例： <op:b> 装飾したい文字列 </op:b> •基本的な形式はXMLに準拠 •要素名はHTMLの文字装飾のための要素名になるべく準拠する（上の例は<b></b>に対応してい る） •要素名には op という名前空間を与え、他のHTMLタグと明確に区別する 【A-2】文字装飾タグの変換規則 1. 2. 以下の文字装飾タグは無効な指定とする。これらの扱いは各変換処理に依る（「無効な文字装飾タグ」） • 開始タグのみの指定 • 終了タグのみの指定 • ネストが正しくない指定 • <op:要素名>の形式であるが、要素名が文字装飾変換表に存在しない • （携帯版のみ）「使用しない」に設定された文字装飾タグ 以下のタグは文字装飾タグとして認めない（「文字装飾タグでないタグ」） • 3. HTML タグなど、<op:要素名>の形式でないタグ 「1. 」 に当てはまらない文字装飾タグ（「有効な文字装飾タグ」）を以下のように変換する • <op:要素名> は <span class=“op_要素名”> に変換する • 4. 例外として、 op:color:#(カラーコード) は <span class=“op_要素名” style=“color:#(カラーコー ド)”> に変換される 「1. 」～「3. 」のいずれにも当てはまらないものは通常の文字列と見なす 【A-3】文字装飾変換表 文字装飾タグ 意味 PC版記述 PC版スタイル 携帯版 記述 op:b 太字 <span class=“op_b”> .op_b {font-weight:bold} <b> op:u 下線 <span class=“op_u”> .op_u { text-decoration: underline} <u> op:s 取消線 <span class=“op_s”> .op_s { text-decoration: linethrough } <s> op:i 斜体 <span class=“op_i”> .op_i { font-style: italic} <i> op:large フォントサイズ 大 <span class=“op_large”> .op_large { font-size:20px } <font size=“” > op:small フォントサイズ 小 <span class=“op_small”> .op_small { font-size:8px} <font size=“” > op:color:#(カ ラーコード) 文字色 <span class=“op_color” style=“color:#(カラーコー ド)”> .op_color {color: #(デフォル ト文字色) ! important} <font color=“ ”> 備考 この文字装飾を使用し ない場合に「PC版スタ イル」を適用する ※op:color を除き、文字装飾を使用する設定になっている場合、「.名前空間_要素名」の class にスタイル指定を与える ※PC版では文字装飾変換処理時には使用設定を見ない ※携帯版では文字装飾変換処理時に使用設定を見る 【B-1】文字装飾タグの変換処理（日記表示時） 1. DB内データ <op:b> 装飾したい文字列 </op:b> 2. t_truncate 3. t_cmd 4. t_decoration • 有効な文字装飾タグ： span 要素に変換 • 無効な文字装飾タグ： 変換せず出力 • 文字装飾タグでないタグ： 変換せず出力 5. 日記表示 <span class=“op_b”> 装飾したい文字列 </span> ※<op:b> と </op:b> が span 要素に変換される 【B-2】文字装飾タグの変換処理（日記編集時） （1. DB内データ） <op:b> 装飾したい文字列 </op:b> 2. テキストエリア <op:b> 装飾したい文字列 </op:b> ※変換しない （確認画面） <span class=“op_b”> 装飾したい 文字列 </span> ※表示用に変換するのみ ※フォーム内データは変換しない 3. 投稿処理 ※変換処理の内容は【B-1】と同一 4. DB内データ <op:b> 装飾したい文字列 </op:b> ※変換しない 【B-3】文字装飾タグの変換処理（管理画面・一覧系表示時） 1. DB内データ <op:b> 装飾したい文字列 </op:b> 2. t_strip_decoration ※t_description にオプション を指定する形でも可 • 有効な文字装飾タグ： 取り除く • 無効な文字装飾タグ： 取り除かない • 文字装飾タグでないタグ： 取り除かない 3. 一覧表示 装飾したい文字列 ※<op:b> と </op:b> が取り除かれている 【B-4】文字装飾タグの変換処理（携帯版日記表示時） 1. DB内データ <op:b> 装飾したい文字列 </op:b> 2. t_decoration_ktai • 有効な文字装飾タグ： 対応するHTML要素に変換する • 無効な文字装飾タグ： 変換せず出力 • 文字装飾タグでないタグ： 変換せず出力 3. 日記表示 <b> 装飾したい文字列 </b> ※<op:b> と </op:b> が対応するHTML要素に変換されている 【C-1】文字装飾機能の実装にあたり必要なOpenPNEの機能 1. CSSの動的書き出し機能 • 2. 実装前は、head要素内に動的にスタイルを書き出す リッチテキストエリア • 文字装飾機能開発時に追加
© Copyright 2024 ExpyDoc
