- 追加された行はこの色です。
- 削除された行はこの色です。
[[PukiWiki/1.4]]
from:名無しさん
CAPTION実装してみました。
表の最初の行で
>CAPTION(文字列):
を挿入するだけ。どの列にも何回でも挿入できますが、最後尾の列が適用されます。
（2列目以降に入れても無効となります：仕様？）
1.4.6Releaceからの差分的なもの：
以下、変更点
>
class Table extends Element
{
var $type;
var $types;
var $col; // number of column
var $caption;
function Table($out)
{
parent::Element();
$cells = explode('|', $out[1]);
$this->col = count($cells);
$this->type = strtolower($out[2]);
$this->types = array($this->type);
$is_template = ($this->type == 'c');
$row = array();
$caption = array();
foreach ($cells as $key => $cell)
$cells[$key] = $this->readCaption( $cell );
foreach ($cells as $cell)
$row[] = & new TableCell($cell, $is_template);
$this->elements[] = $row;
}
function readCaption($text){
define('CAPTION_PLANE' , 1);
define('CAPTION_TOP' , 2);
define('CAPTION_BOTTOM', 3);
define('CAPTION_TEXT' , 4);
$caption_match_type = '/^(?:CAPTION\((.+)\)|CAPTIONTOP\((.+)\)|CAPTIONBOTTOM\((.+)\)):(.*)$/';
while (preg_match($caption_match_type, $text, $matches)) {
if ($matches[CAPTION_PLANE]) {
$this->caption['text'] = htmlspecialchars($matches[CAPTION_PLANE]);
$this->caption['align'] = NULL;
} else if ($matches[CAPTION_TOP]) {
$this->caption['text'] = htmlspecialchars($matches[CAPTION_TOP]);
$this->caption['align'] = 'top';
} else if ($matches[CAPTION_BOTTOM]) {
$this->caption['text'] = htmlspecialchars($matches[CAPTION_BOTTOM]);
$this->caption['align'] = 'bottom';
}
$text = $matches[CAPTION_TEXT];
}
return $text;
}
function canContain(& $obj)
{
return is_a($obj, 'Table') && ($obj->col == $this->col);
}
function & insert(& $obj)
{
$this->elements[] = $obj->elements[0];
$this->types[] = $obj->type;
return $this;
}
function toString()
{
static $parts = array('h'=>'thead', 'f'=>'tfoot', ''=>'tbody');
// rowspanを設定(下から上へ)
for ($ncol = 0; $ncol < $this->col; $ncol++) {
$rowspan = 1;
foreach (array_reverse(array_keys($this->elements)) as $nrow) {
$row = & $this->elements[$nrow];
if ($row[$ncol]->rowspan == 0) {
++$rowspan;
continue;
}
$row[$ncol]->rowspan = $rowspan;
while (--$rowspan) // 行種別を継承する
$this->types[$nrow + $rowspan] = $this->types[$nrow];
$rowspan = 1;
}
}
// colspan,styleを設定
$stylerow = NULL;
foreach (array_keys($this->elements) as $nrow) {
$row = & $this->elements[$nrow];
if ($this->types[$nrow] == 'c')
$stylerow = & $row;
$colspan = 1;
foreach (array_keys($row) as $ncol) {
if ($row[$ncol]->colspan == 0) {
++$colspan;
continue;
}
$row[$ncol]->colspan = $colspan;
if ($stylerow !== NULL) {
$row[$ncol]->setStyle($stylerow[$ncol]->style);
while (--$colspan) // 列スタイルを継承する
$row[$ncol - $colspan]->setStyle($stylerow[$ncol]->style);
}
$colspan = 1;
}
}
// テキスト化
$string = '';
// CAPTIONの挿入
// 上下指定 有り
if( $this->caption['align'] != NULL ){
$string .= $this->wrap( $this->caption['text'], 'caption',
' class="style_caption"' . ' style="caption-side:'.$this->caption['align'] .';"'
);
}else{ // 上下指定 無し
$string .= $this->wrap( $this->caption['text'], 'caption' );
}
foreach ($parts as $type => $part)
{
$part_string = '';
foreach (array_keys($this->elements) as $nrow) {
if ($this->types[$nrow] != $type)
continue;
$row = & $this->elements[$nrow];
$row_string = '';
foreach (array_keys($row) as $ncol)
$row_string .= $row[$ncol]->toString();
$part_string .= $this->wrap($row_string, 'tr');
}
$string .= $this->wrap($part_string, $part);
}
$string = $this->wrap($string, 'table', ' class="style_table" cellspacing="1" border="0"');
return $this->wrap($string, 'div', ' class="ie5"');
// return $this->wrap($string, 'span', ' class="ie5"');
}
}
(lib/convert_html.php)
>.style_caption{
font-weight:bold;
color:#000000;
}
(skin/pukiwiki.css.php)
※[[しろくろのへや:NewTable]]から移動してきました。 -- [[ぱんだ]]
*テーブル機能強化 [#v5787cd7]
以下のルールを新設。
-'>'だけのセルは右のセルと連結(colspan)
-'~'だけのセルは上のセルと連結(rowspan)
-'~'に続けて何か書くと<th>
-行末に'h'と書くと<thead>、'f'と書くと<tfoot>、何も書かないと<tbody>,rowspanで上のセルと接続している行は属性を(強制的に)引き継ぐ
--head/foot/bodyの出現順序は問わない。変換時に適当に並べ替える。
-行末に'c'と書くと各列のデフォルトアラインメント&列幅が指定できる。通常セルと同じく'>'でグループ化
--colgroupタグで済めば楽なのだが、こいつがNetscapeでは効かないので、苦肉の策として、全てのセルにalignと(colspan==1のとき)widthを埋め込んでいる。~
http://kanzaki.com/docs/html/htminfo16.html#S26より引用
>
行と列のグループ化~
このセクションでとりあげる機能は、対応しないブラウザでは期待通りには表現できません。Netscape Navigatorの場合、バージョン6/Mozillaで行のグループ化のみ対応しているようです。
<
---もともとPukiWiki 1.3.2はNetscape 4.xやIE4などには対応していない(切り捨てている)ので、colgroupやcolを使用したほうがいいと思います。tdやthタグのwidthはHTML4.01 StrictやXHTML 1.0/1.1では使用できません。HTML4.01 Transitional/Framesetでも非推奨属性になっています。 -- [[reimy]] SIZE(10){2002-09-17 (火) 18:55:29}
---いや、それが、NN6/MOZでも駄目なんですわ。 -- [[ぱんだ]] SIZE(10){2002-09-17 (火) 19:02:41}
---どうしてもth、tdに直接widthを指定するのであれば、style="width:ー"とする必要がある。-- [[reimy]] SIZE(10){2002-09-17 (火) 19:04:36}
---なるほど。 -- [[ぱんだ]] SIZE(10){2002-09-17 (火) 19:21:39}
--おまけにNetscapeでは<table>にrules="groups"を指定すると罫線が変になるし。
-この辺で打ち止め :) ((際限なくなる…))
-でも、C(olumn)SUM:/R(ow)SUM:なんてのはとても面白そう…(自爆)
-サマリ、キャプション…うーん。
--というか、ここまでやるとは…(笑い) --[[reimy]] SIZE(10){2002-09-17 (火) 19:35:36}
---どこまでできるか、が興味の対象で :) -- [[ぱんだ]] SIZE(10){2002-09-17 (火) 19:45:31}
-さらにセルの文字色／背景色を指定できる機能が追加。(開発日記/2003-05-26)
-さらにテーブル内のフォントサイズを一括指定できる機能が追加。(BugTrack/354)
*サンプル [#n3be1df4]
なんでIEとNetscapeで見た目が違うんや X(
-テーブルがへげへげなのはNetscapeの伝統(苦笑) --[[reimy]] SIZE(10){2002-09-17 (火) 19:37:20}
**四畳半 [#aa6247c2]
これが書きたくて実験をはじめた。
|>|>|CENTER:20|c
|1|>|2|
|~|3|4|
|>|5|~|
|>|>|CENTER:20|c
|1|>|2|
|~|3|4|
|>|5|~|
**<thead><tfoot><tbody>をでたらめに並べてみる [#q8a4733e]
|>|2x1|foot|f <tfoot>
|>|2x2|body| <tbody>
|>|~|body| <tbody>
|~A|~B|~C|h <thead>
|>|2x1|foot|f
|>|2x2|body|
|>|~|body|
|~A|~B|~C|h
**複雑な表 [#k44a3080]
本来、style_thの方がcolgroupで指定したalignより強いはずなのだが、ここではそうなっていない。(Netscapeがcolgroupに対応するまでの)仕様ということでひとつ。
|CENTER:80|>|RIGHT:|RIGHT:100|c
|>|>|>|CENTER:表|h
|~年度|CENTER:~男|CENTER:~女|CENTER:~TOTAL|h
|~2001|20|30|50|
|~2002|30|40|70|
|~TOTAL|~50|~70|~120|f
|~|41.7%|58.3%|100%| <-'f'を引き継ぐ
|CENTER:80|>|RIGHT:|RIGHT:100|c
|>|>|>|CENTER:表|h
|~年度|CENTER:~男|CENTER:~女|CENTER:~TOTAL|h
|~2001|20|30|50|
|~2002|30|40|70|
|~TOTAL|~50|~70|~120|f
|~|41.7%|58.3%|100%|
**セルの文字色と背景色 [#z37938e9]
|BGCOLOR(red):COLOR(white):''こんな感じ''|
|BGCOLOR(red):COLOR(white):''こんな感じ''|
*スタイルシート [#zbf58a21]
こんな感じ。
thead td.style_td,
tfoot td.style_td { background-color:#D0D8E0; }
thead th.style_th,
tfoot th.style_th { background-color:#E0E8F0; }
.style_table {
margin:auto;
border:0px;
padding:0px;
text-align:left;
background-color:#ccd5dd;
}
.style_th {
text-align:center;
background-color: #EEEEEE;
padding: 5px;
margin: 1px;
}
.style_td {
background-color: #EEF5FF;
padding: 5px;
margin: 1px;
}
*問題点 [#ledd1d9d]
-空要素のセルとcolspanとの区別がつかない。 -- [[reimy]] SIZE(10){2002-09-16 (月) 11:56:06}
--空要素って必要でしょうか。 -- [[ぱんだ]] SIZE(10){2002-09-16 (月) 12:08:17}
---必要です。すでに多数使用してます。 -- [[reimy]] SIZE(10){2002-09-16 (月) 12:38:35}
---うーむ :) -- [[ぱんだ]] SIZE(10){2002-09-16 (月) 13:29:46}
---<th>や<thead><tfoot><tbody>の機能がないのを補うために、空要素で罫線代わりに多用していますので。--[[reimy]] SIZE(10){2002-09-16 (月) 14:55:01}
|CENTER:年度||CENTER: 男 |CENTER: 女 ||CENTER:TOTAL|
|||||||
|CENTER:2001||RIGHT:20|RIGHT:30||RIGHT:50|
|CENTER:2002||RIGHT:30|RIGHT:40||RIGHT:70|
|||||||
|CENTER:TOTAL||RIGHT:50|RIGHT:70||RIGHT:120|
|CENTER:年度||CENTER: 男 |CENTER: 女 ||CENTER:TOTAL|
|||||||
|CENTER:2001||RIGHT:20|RIGHT:30||RIGHT:50|
|CENTER:2002||RIGHT:30|RIGHT:40||RIGHT:70|
|||||||
|CENTER:TOTAL||RIGHT:50|RIGHT:70||RIGHT:120|
-|（バー）を既に使っているので難しいですが、[[RT:http://www.ruby-lang.org/~rubikitch/computer/rt/]]など他の記述法と互換性が欲しいところです。 -- [[tejicube]] SIZE(10){2002-10-11 (金) 21:12:16}
--ブロックを引数に取れるプラグインが書けるようになれば…。 :) -- [[ぱんだ]] SIZE(10){2002-10-25 (金) 16:50:09}
--YukiWikiTableからRTライクな書式へ持っていこうとしています。 -- [[ぱんだ]] SIZE(10){2002-10-30 (水) 00:03:46}
-ぼちぼち、差分公開してほしいなあ。 -- [[reimy]] SIZE(10){2002-12-29 (Sun) 15:38:05}
--これもconvert_htmlの中に入っています。 -- [[ぱんだ]] SIZE(10){2002-12-29 (日) 18:00:13}
![[PukiWiki]](image/pukiwiki-dev.png "[PukiWiki]")
