# -*- coding: utf-8 -*-
"""从 miniprogram 同步 wxss 到 reactH5 的 css（P1 页面 + 全局 + TabBar + 登录）。"""
import os
import shutil

BASE = os.path.normpath(os.path.join(os.path.dirname(__file__), "..", ".."))

# 写入 index wxss 后追加（对齐 scroll-view 横滑 / 触摸）
INDEX_CSS_H5_TAIL = """

/* ----- H5 增补（对齐小程序 scroll-view 与可点反馈；源 wxss 无此块） ----- */
.super-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.super-scroll-inner {
  min-height: min-content;
}
.banner-card,
.contact-btn,
.featured-item,
.super-empty-btn,
.super-item-h,
.timeline-item,
.latest-expand-hint {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.contact-btn:active,
.featured-item:active,
.banner-card:active,
.super-empty-btn:active,
.super-item-h:active {
  opacity: 0.97;
}

/* ----- H5：左右安全区（刘海/曲面）；并提高首页作用域优先级，避免被其它页面同名类覆盖 ----- */
.index-page.page {
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  box-sizing: border-box;
}
.index-page .main-content {
  padding-left: 32rpx;
  padding-right: 32rpx;
  box-sizing: border-box;
}
.index-page .main-content .super-scroll,
.index-page .section .super-scroll,
.index-page .main-content .super-loading,
.index-page .section .super-loading {
  margin-left: 0;
  margin-right: 0;
}
"""

# TabBar：H5 用内联 SVG（TabBarIcons），需固定尺寸类名
TABBAR_CSS_H5_TAIL = """

/* ----- H5 增补：普通 Tab 为矢量描边（见 TabBarIcons），与 inactive #8e8e93 / active #00CED1 一致 ----- */
.tab-icon-svg {
  width: 48rpx;
  height: 48rpx;
  display: block;
  flex-shrink: 0;
}

/* ----- H5：TabBar 贴合左右安全区，避免首尾图标贴直角边 ----- */
.tab-bar {
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  box-sizing: border-box;
}
"""

CHAPTERS_CSS_H5_TAIL = """

/* ----- H5：目录页 scoped 兜底，避免与首页/匹配页同名类互相覆盖导致样式错乱 ----- */
.chapters-page.page {
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  box-sizing: border-box;
}
.chapters-page .chapters-content {
  padding: 16rpx 24rpx;
  width: 100%;
  box-sizing: border-box;
}
.chapters-page .book-card-title {
  font-size: 30rpx;
  font-weight: 700;
  color: #ffffff;
}
.chapters-page .part-title {
  font-size: 27rpx;
  font-weight: 600;
  color: #ffffff;
}
.chapters-page .section-title {
  font-size: 25rpx;
  color: #ffffff;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 1;
}
.chapters-page .tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20rpx;
  padding: 4rpx 14rpx;
  min-width: 64rpx;
  border-radius: 8rpx;
  box-sizing: border-box;
  text-align: center;
}
.chapters-page .tag-free {
  background: rgba(0, 206, 209, 0.1);
  color: #00CED1;
}
.chapters-page .section-item {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  align-items: flex-start;
}
.chapters-page .chapters-list {
  margin-top: 12rpx;
  margin-left: 12rpx;
}
.chapters-page .part-item {
  display: block;
  width: 100%;
  margin-bottom: 12rpx;
}
.chapters-page .part-item > .chapters-list {
  display: block;
  width: 100%;
}
.chapters-page .part-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 12rpx;
  width: 100%;
  box-sizing: border-box;
}
.chapters-page .part-left {
  min-width: 0;
}
.chapters-page .part-right {
  justify-self: end;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 12rpx;
}
.chapters-page .section-list {
  display: block;
  width: 100%;
}
.chapters-page .chapter-header {
  display: block;
  width: 100%;
  padding: 14rpx 24rpx;
  font-size: 23rpx;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.5);
  border-bottom: 1rpx solid rgba(255, 255, 255, 0.04);
}
.chapters-page .section-left {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 14rpx;
  flex: 1;
  min-width: 0;
}
.chapters-page .section-right {
  display: flex;
  align-items: center;
  gap: 12rpx;
  flex-shrink: 0;
  margin-left: 12rpx;
  padding-top: 2rpx;
}
.chapters-page .card {
  background: rgba(28, 28, 30, 0.7);
  border-radius: 20rpx;
  border: 1rpx solid rgba(255, 255, 255, 0.04);
  margin: 0 12rpx 16rpx 12rpx;
  box-sizing: border-box;
}
"""
PAIRS = [
    ("miniprogram/app.wxss", "reactH5/src/styles/app-global.css"),
    ("miniprogram/pages/index/index.wxss", "reactH5/src/pages/Index/IndexPage.css"),
    ("miniprogram/pages/chapters/chapters.wxss", "reactH5/src/pages/Chapters/ChaptersPage.css"),
    ("miniprogram/pages/match/match.wxss", "reactH5/src/pages/Match/MatchPage.css"),
    ("miniprogram/pages/my/my.wxss", "reactH5/src/pages/My/MyPage.css"),
    ("miniprogram/custom-tab-bar/index.wxss", "reactH5/src/components/TabBar/TabBar.css"),
    ("miniprogram/components/login-modal/login-modal.wxss", "reactH5/src/components/LoginModal/LoginModal.css"),
    ("miniprogram/pages/dev-login/dev-login.wxss", "reactH5/src/pages/DevLogin/DevLoginPage.css"),
]


def copy_tree_merge(src_dir: str, dst_dir: str) -> None:
    if not os.path.isdir(src_dir):
        print("SKIP dir missing:", src_dir)
        return
    os.makedirs(dst_dir, exist_ok=True)
    for root, _, files in os.walk(src_dir):
        rel = os.path.relpath(root, src_dir)
        out_root = os.path.join(dst_dir, rel) if rel != "." else dst_dir
        os.makedirs(out_root, exist_ok=True)
        for name in files:
            shutil.copy2(os.path.join(root, name), os.path.join(out_root, name))
    print("ASSETS merged", src_dir, "->", dst_dir)


def main():
    # 静态资源：SVG/图片等与小程序共用一份
    copy_tree_merge(
        os.path.join(BASE, "miniprogram", "assets"),
        os.path.join(BASE, "reactH5", "public", "assets"),
    )
    st_src = os.path.join(BASE, "miniprogram", "static")
    st_dst = os.path.join(BASE, "reactH5", "public", "static")
    if os.path.isdir(st_src):
        os.makedirs(st_dst, exist_ok=True)
        for fn in os.listdir(st_src):
            shutil.copy2(os.path.join(st_src, fn), os.path.join(st_dst, fn))
        print("STATIC", st_src, "->", st_dst)

    # iconfont：同步 wxss + 注入与小程序一致的 CDN（app.js loadIconFont）
    ic_wxss = os.path.join(BASE, "miniprogram", "static", "iconfont.wxss")
    ic_css = os.path.join(BASE, "reactH5", "src", "styles", "iconfont.css")
    if os.path.isfile(ic_wxss):
        with open(ic_wxss, "r", encoding="utf-8", errors="replace") as f:
            ic_text = f.read()

        CDN_MARK = "at.alicdn.com"
        if CDN_MARK not in ic_text:
            old = "  src: url('/static/iconfont.woff2') format('woff2'),"
            new = (
                "  src: url('https://at.alicdn.com/t/c/font_5142223_1sq6pv9vvbt.woff2') format('woff2'),\n"
                "       url('/static/iconfont.woff2') format('woff2'),"
            )
            if old in ic_text:
                ic_text = ic_text.replace(old, new, 1)

        icon_cmp = os.path.join(BASE, "miniprogram", "components", "icon", "icon.wxss")
        if os.path.isfile(icon_cmp):
            with open(icon_cmp, "r", encoding="utf-8", errors="replace") as f:
                cmp_txt = f.read().strip()
            ic_text += "\n\n/* H5 appended: miniprogram/components/icon/icon.wxss */\n"
            ic_text += cmp_txt + "\n"

        ic_header = "/* Synced from miniprogram/static/iconfont.wxss + H5 CDN + icon/component */\n"
        os.makedirs(os.path.dirname(ic_css), exist_ok=True)
        with open(ic_css, "w", encoding="utf-8", newline="\n") as f:
            f.write(ic_header + ic_text)
        print("OK iconfont.css")

    for src_rel, dst_rel in PAIRS:
        src = os.path.join(BASE, src_rel.replace("/", os.sep))
        dst = os.path.join(BASE, dst_rel.replace("/", os.sep))
        if not os.path.isfile(src):
            print("SKIP missing:", src_rel)
            continue
        with open(src, "r", encoding="utf-8", errors="replace") as f:
            text = f.read()
        # app.wxss 中两处 page { 均映射为 H5 根选择器
        if "app.wxss" in src_rel:
            text = text.replace("page {", ":root, html, body, #root {")
        header = "/* Auto-synced from miniprogram → reactH5; 源: %s */\n" % src_rel
        if "pages/index/index.wxss" in src_rel:
            text += INDEX_CSS_H5_TAIL
        if "pages/chapters/chapters.wxss" in src_rel:
            text += CHAPTERS_CSS_H5_TAIL
        if "custom-tab-bar/index.wxss" in src_rel:
            text += TABBAR_CSS_H5_TAIL
        os.makedirs(os.path.dirname(dst), exist_ok=True)
        with open(dst, "w", encoding="utf-8", newline="\n") as f:
            f.write(header + text)
        print("OK", dst_rel, len(text), "chars")


if __name__ == "__main__":
    main()