メモ代わり。てきとーに。 いや、ですからてきとーですって。 2年前ぐらいにPythonあたりでメールくれた方、ごめんなさい。メール紛失してしまい無視した形になってしまいました。。。

2008年5月17日土曜日

[mod_chxj] css部分をざっくり考え中

個人的メモ。

CSS関連でやるべきことは、

  • CSSEngineOn/CSSEngineOff機能の追加
  • CSS変換エンジンの実装
ぐらいか。

## データ構造
### property型
* name
* value

### selector型
* name (tag, class, id)
* propertyのリスト


### stylesheet型
* selectorのリストを保持する。
* linkタグがあった場合、該当CSSを読み込み、同一セレクタが既にある場合には上書きする。
* linkタグがあった場合、該当CSSを読み込み、同一セレクタが無い場合は新規にselectorを追加する。
* @importルールがあった場合、該当CSSを読み込み、同一セレクタが既にある場合には、該当セレクタのプロパティだけ
を更新する。
* @importルールがあった場合、該当CSSを読み込み、同一セレクタが無い場合には、新規にselectorを追加する。

### current_stylesheet型
* 現在有効なプロパティのリストを保持する。
* 各プロパティは静的にもつ。
* 定義されていないプロパティについては、nullが設定されている。

### current_stylesheetスタック
* 現在有効なcurrent_stylesheet型を要素とするスタック。
* タグがオープンされると、現在最上位にあるcurrent_stylesheetをコピーして新しいcurrent_stylesheetを
作成し、current_stylesheetにpushする。
(extended_environment)
* タグがクローズされると、current_stylesheetスタックをpopする。

## 各コンバータでの処理
1) タグがオープンされる。
1-1) current_stylesheet型領域を確保する。
1-2) current_stylesheet型領域にcurrent_stylesheetスタックの最上位(if any)のプロパティを設定する。
1-3) オープンされたタグ名、クラス名、ID名により、該当selectorをstylesheet型から探す。
1-4) もしあれば、該当selectorのプロパティでcurrent_stylesheetのプロパティを更新する。
1-5) current_stylesheetをcurrent_stylesheetスタックにpushする。

2) タグ内の処理
2-1) style属性があれば、style属性のvalue値をパースする。
2-2) パース結果でcurrent_stylesheetスタックの最上位にあるcurrent_stylesheetのプロパティを更新する。

3) 各端末用タグの生成
3-1) current_stylesheetを考慮したうえで、各端末用にタグを出力する。
DoCoMoであればstyle属性出力等。

4) タグがクローズされる。
4-1) current_stylesheetスタックから1要素popする。

# selectorの特定方法
## class,IDが指定されている場合
1) tag.class#IDを検索する

2) tag#IDを検索する

3) #IDを検索する

4) 「classのみが指定されている場合」へ

IDのみが指定されている場合は、
1) tag#IDを検索する

2) #IDを検索する

3) 「tagのみが指定されている場合」へ

classのみが指定されている場合
1) tag.classを検索する
2) .classを検索する
3) 「tagのみが指定されている場合」へ

tagのみが指定されている場合
1) tagを検索する
2) *を検索する

同一定義があった場合は後に書かれているものが優先。


うーむ・・・。
.

0 コメント: