サンプルコードで身につける: 全部つなぐ — main.rs、ローカルサーバー、途中の木を覗くオプション

// Page::load の 5 段: 1 HTML → DOM、2 <style> → CSSOM、3 <script> を実行(DOM が変わる)、4 DOM + CSSOM → 箱の木、5 箱の木 → 表示リスト。
// ここでは各段を数行の仮実装にして「順番と、段ごとの入出力」だけを見る(本物は HtmlParser / CssParser / JsRuntime / layout_document / paint)。
struct Element { tag: String, id: String, text: String }

#[derive(Default)]
struct Page {
    document: Vec<Element>,              // 1 の出力
    stylesheet: Vec<(String, String)>,   // 2 の出力: (セレクタ, color)
    layout_root: Vec<(usize, f32)>,      // 4 の出力: (document の添字, y)
    display_list: Vec<String>,           // 5 の出力
    console: Vec<String>,                // 3 の副産物
}

/// open と close の間の文字列を全部集める(<style>...</style> など)
fn between<'a>(src: &'a str, open: &str, close: &str) -> Vec<&'a str> {
    src.split(open).skip(1).filter_map(|rest| rest.split(close).next()).collect()
}

impl Page {
    fn load(&mut self, html: &str) {
        self.document = parse_html(html);                                        // 1
        self.stylesheet = between(html, "<style>", "</style>").iter()            // 2
            .flat_map(|css| css.lines().filter(|l| l.contains('{')))
            .map(|l| (l.split('{').next().unwrap_or("").trim().to_string(), between(l, "color:", "}").first().unwrap_or(&"").trim().to_string()))
            .collect();
        for src in between(html, "<script>", "</script>") {                      // 3
            self.run_script(src);
        }
        self.relayout();                                                         // 4, 5
    }

    /// 2 種類の文だけ分かる仮のランタイム: document.getElementById("x").textContent = "v"; と console.log("...");
    fn run_script(&mut self, src: &str) {
        for line in src.lines().map(str::trim) {
            if let (Some(id), Some(value)) = (between(line, "getElementById(\"", "\")").first(), between(line, "= \"", "\"").first()) {
                if let Some(e) = self.document.iter_mut().find(|e| e.id == *id) {
                    e.text = value.to_string(); // DOM が変わる
                }
            } else if let Some(msg) = between(line, "console.log(\"", "\")").first() {
                self.console.push(msg.to_string());
            }
        }
    }

    fn relayout(&mut self) {
        self.layout_root = (0..self.document.len()).map(|i| (i, i as f32 * 24.0)).collect(); // 4: block を縦に積む
        self.display_list = self.layout_root.iter().map(|(i, y)| {                              // 5: 文字の命令にする
            let e = &self.document[*i];
            let color = self.stylesheet.iter().find(|(sel, _)| *sel == e.tag || *sel == format!("#{}", e.id)).map(|(_, c)| c.as_str()).unwrap_or("black");
            format!("Text  x=0 y={:.0} {:?} color={}", y, e.text, color)
        }).collect();
    }
}

/// <tag id="x">text</tag> の形の行だけを要素にする仮のパーサ
fn parse_html(html: &str) -> Vec<Element> {
    html.lines().map(str::trim).filter(|l| l.starts_with('<') && !l.starts_with("</") && l.contains("</")).map(|l| {
        let head = l[1..].split('>').next().unwrap_or("");
        Element {
            tag: head.split(' ').next().unwrap_or("").to_string(),
            id: between(head, "id=\"", "\"").first().unwrap_or(&"").to_string(),
            text: between(l, ">", "</").first().unwrap_or(&"").to_string(),
        }
    }).collect()
}

fn main() {
    let html = "<html><head>\n<style>\nh1 { color: navy }\n#count { color: red }\n</style>\n</head><body>\n<h1>Hello</h1>\n<p id=\"count\">0</p>\n<script>\ndocument.getElementById(\"count\").textContent = \"3\";\nconsole.log(\"done\");\n</script>\n</body></html>";
    let mut page = Page::default();
    page.load(html);
    println!("1 DOM          : {}", page.document.iter().map(|e| format!("<{} id={:?}>{}", e.tag, e.id, e.text)).collect::<Vec<_>>().join(" "));
    println!("2 CSSOM        : {:?}", page.stylesheet);
    println!("3 console      : {:?}(script が DOM の count を 0 → 3 に変えた)", page.console);
    println!("4 箱の木        : {:?}", page.layout_root);
    println!("5 表示リスト    : {:?}", page.display_list);
}

// main.rs の入口: 引数を「-- で始まるフラグ」と「それ以外(URL やパス)」に分け、--file ならローカルのファイル、
// 無ければ URL として扱う。使い方を間違えたら終了コード 2(本物は ExitCode::from(2))。
#[derive(Debug, PartialEq)]
enum Source { File(String), Url(String) }

/// 引数の列 → (読み込み元, 表示オプション)。失敗したら (終了コード, メッセージ)
fn decide(args: &[&str]) -> Result<(Source, Vec<String>), (u8, String)> {
    let flags: Vec<&str> = args.iter().filter(|a| a.starts_with("--")).cloned().collect();
    let positional: Vec<&str> = args.iter().filter(|a| !a.starts_with("--")).cloned().collect();
    let target = match positional.first() {
        Some(t) => t.to_string(),
        None => return Err((2, "使い方: tinybrowser <http://host[:port]/path> | --file <path.html>".to_string())),
    };
    let source = if flags.contains(&"--file") { Source::File(target) } else { Source::Url(target) };
    // 表示オプションだけ残す(--file は読み込み元の指定なので除く)
    let options = flags.iter().filter(|f| **f != "--file").map(|f| f.to_string()).collect();
    Ok((source, options))
}

fn main() {
    let cases: [&[&str]; 4] = [
        &["http://localhost:8000/index.html", "--headers"],
        &["--file", "sample/index.html", "--dom", "--layout", "--display-list"],
        &["--dom", "--file", "page.html"], // フラグの順番は問わない
        &["--layout"],                     // 読み込み元が無い
    ];
    for args in cases.iter() {
        match decide(args) {
            Ok((source, options)) => println!("{:?}\n  -> {:?}, 表示 {:?}", args, source, options),
            Err((code, msg)) => println!("{:?}\n  -> 終了コード {}: {}", args, code, msg),
        }
    }
}