docc-deploy.yml

name: Deploy DocC to GitHub Pages

on:
  push:
    branches:
      - develop
    paths:
      - 'CookieDungeon/CookieDungeonDocs.docc/**'
      - '.github/workflows/docc-deploy.yml'
  workflow_dispatch:

permissions:
  contents: read
  pages: write
  id-token: write

concurrency:
  group: pages
  cancel-in-progress: false

jobs:
  build:
    name: Build DocC
    runs-on: macos-latest
    timeout-minutes: 30

    steps:
      - name: Checkout repository
        uses: actions/checkout@v6

      - name: Configure GitHub Pages
        id: pages
        uses: actions/configure-pages@v6

      - name: Show Xcode version
        run: xcodebuild -version

      - name: Build DocC archive
        run: |
          xcodebuild docbuild \
            -project CookieDungeon.xcodeproj \
            -scheme CookieDungeon \
            -destination 'generic/platform=visionOS' \
            -derivedDataPath "$RUNNER_TEMP/DerivedData" \
            DOCC_HOSTING_BASE_PATH="${{ github.event.repository.name }}" \
            CODE_SIGN_IDENTITY="" \
            CODE_SIGNING_REQUIRED=NO \
            CODE_SIGNING_ALLOWED=NO

      - name: Find and transform DocC archive
        run: |
          ARCHIVE_PATH="$(
            find "$RUNNER_TEMP/DerivedData/Build/Products" \
              -type d \
              -name 'CookieDungeon.doccarchive' \
              -print \
              -quit
          )"

          if [ -z "$ARCHIVE_PATH" ]; then
            echo "::error::CookieDungeon.doccarchive를 찾지 못했습니다."
            find "$RUNNER_TEMP/DerivedData/Build/Products" \
              -maxdepth 4 \
              -print
            exit 1
          fi

          echo "DocC archive: $ARCHIVE_PATH"

          xcrun docc process-archive transform-for-static-hosting \
            "$ARCHIVE_PATH" \
            --hosting-base-path "${{ github.event.repository.name }}" \
            --output-path "$RUNNER_TEMP/docc-site"

      - name: Create landing-page redirect
        run: |
          BASE_PATH="/${{ github.event.repository.name }}"
          LANDING_URL="$BASE_PATH/tutorials/tableofcontents/"

          cat > "$RUNNER_TEMP/docc-site/index.html" <<EOF
          <!doctype html>
          <html lang="ko">
          <head>
            <meta charset="utf-8">
            <meta name="viewport" content="width=device-width, initial-scale=1">
            <meta http-equiv="refresh" content="0; url=$LANDING_URL">
            <link rel="canonical" href="$LANDING_URL">
            <title>Cookie Dungeon 공간 컴퓨팅 튜토리얼</title>
            <script>window.location.replace("$LANDING_URL");</script>
          </head>
          <body>
            <p><a href="$LANDING_URL">튜토리얼로 이동하기</a></p>
          </body>
          </html>
          EOF

      - name: Add DocC web UI fixes
        run: |
          SITE_ROOT="$RUNNER_TEMP/docc-site"
          BASE_PATH="/${{ github.event.repository.name }}"

          cat > "$SITE_ROOT/scroll-fix.js" <<'EOF'
          (() => {
            const scrollToCurrentSection = () => {
              const encodedID = window.location.hash.slice(1)
              if (!encodedID) return

              let sectionID = encodedID
              try {
                sectionID = decodeURIComponent(encodedID)
              } catch {
                // Keep the encoded value if the fragment isn't valid URI text.
              }

              const section = document.getElementById(sectionID)
              if (!section) return

              window.requestAnimationFrame(() => {
                section.scrollIntoView({ behavior: "smooth", block: "start" })
              })
            }

            const scheduleScroll = () => {
              window.setTimeout(scrollToCurrentSection, 0)
            }

            window.addEventListener("load", scheduleScroll)
            window.addEventListener("hashchange", scheduleScroll)
            window.addEventListener("popstate", scheduleScroll)

            // DocC's section menu updates the route through the History API.
            for (const methodName of ["pushState", "replaceState"]) {
              const originalMethod = window.history[methodName]
              window.history[methodName] = function (...args) {
                const result = originalMethod.apply(this, args)
                scheduleScroll()
                return result
              }
            }

            // Some DocC section links don't emit a history event. Only react to
            // same-page fragment links so an unrelated page click can't restore
            // the previously selected section.
            document.addEventListener("click", event => {
              const link = event.target instanceof Element
                ? event.target.closest('a[href*="#"]')
                : null
              if (!link) return

              const destination = new URL(link.href, window.location.href)
              const isSamePage =
                destination.origin === window.location.origin &&
                destination.pathname === window.location.pathname

              if (isSamePage && destination.hash) {
                scheduleScroll()
              }
            }, true)
          })()
          EOF

          cat > "$SITE_ROOT/theme-fix.css" <<'EOF'
          /* DocC keeps tutorial overview pages dark even in Light mode. */
          body[data-color-scheme="light"]:has(.tutorials-overview) {
            --color-text-background: #fff;
            background: #fff;
          }

          body[data-color-scheme="light"] .tutorials-overview,
          body[data-color-scheme="light"] .tutorials-overview .hero {
            --color-tutorials-overview-background: #fff;
            --color-tutorials-overview-fill: #fff;
            --color-tutorials-overview-fill-secondary: #f7f7f7;
            --color-tutorials-overview-content: #000;
            --color-tutorials-overview-content-alt: #333;
            --color-tutorials-overview-header-text: #000;
            --color-tutorials-overview-eyebrow: #666;
            --color-tutorials-overview-icon: #666;
            --color-tutorials-overview-navigation-link: #666;
            --color-tutorials-overview-navigation-link-active: #000;
            --color-tutorials-overview-navigation-link-hover: #000;
            background: #fff;
          }

          body[data-color-scheme="light"] .tutorials-overview .hero .title,
          body[data-color-scheme="light"] .tutorials-overview .hero .content,
          body[data-color-scheme="light"] .tutorials-overview .hero .meta {
            color: #111 !important;
          }

          /* Ensure section titles (e.g., 필요한 사전지식, 준비물) are readable in Light mode */
          body[data-color-scheme="light"] .tutorials-overview .hero .content h1,
          body[data-color-scheme="light"] .tutorials-overview .hero .content h2,
          body[data-color-scheme="light"] .tutorials-overview .hero .content h3,
          body[data-color-scheme="light"] .tutorials-overview .hero .content h4,
          body[data-color-scheme="light"] .tutorials-overview .hero .content h5,
          body[data-color-scheme="light"] .tutorials-overview .hero .content h6,
          body[data-color-scheme="light"] .tutorials-overview .hero .content .title,
          body[data-color-scheme="light"] .tutorials-overview .hero .content .section-title,
          body[data-color-scheme="light"] .tutorials-overview .hero .content .eyebrow {
            color: #000 !important;
          }

          /* Keep preparation lists readable inside the centered tutorial hero. */
          .tutorials-overview .hero .content ul,
          .tutorials-overview .hero .content ul p {
            text-align: left;
          }

          body[data-color-scheme="light"]:has(.tutorials-overview) .nav.theme-dark {
            --color-nav-dark-color: #000;
            --color-nav-dark-current-link: #000;
            --color-nav-dark-link-color: #000;
            --color-nav-dark-link-color-hover: #06c;
            --color-nav-dark-root-subhead: #000;
            --color-nav-dark-solid-background: #fff;
            --color-nav-dark-stuck: rgba(255, 255, 255, 0.92);
            --color-nav-dark-uiblur-expanded: rgba(255, 255, 255, 0.92);
            --color-nav-dark-uiblur-stuck: rgba(255, 255, 255, 0.82);
            --color-nav-dark-keyline: rgba(0, 0, 0, 0.2);
            color: #000;
            background: rgba(255, 255, 255, 0.92);
          }

          body[data-color-scheme="light"]:has(.tutorials-overview)
            .nav.theme-dark .nav-title-content {
            color: #000 !important;
          }

          body[data-color-scheme="light"]:has(.tutorials-overview)
            .nav.theme-dark .tutorials-navigation-link {
            color: #555 !important;
          }

          body[data-color-scheme="light"]:has(.tutorials-overview)
            .nav.theme-dark .tutorials-navigation-link.active {
            color: #000 !important;
          }

          @media (prefers-color-scheme: light) {
            body[data-color-scheme="auto"]:has(.tutorials-overview) {
              --color-text-background: #fff;
              background: #fff;
            }

            body[data-color-scheme="auto"] .tutorials-overview,
            body[data-color-scheme="auto"] .tutorials-overview .hero {
              --color-tutorials-overview-background: #fff;
              --color-tutorials-overview-fill: #fff;
              --color-tutorials-overview-fill-secondary: #f7f7f7;
              --color-tutorials-overview-content: #000;
              --color-tutorials-overview-content-alt: #333;
              --color-tutorials-overview-header-text: #000;
              --color-tutorials-overview-eyebrow: #666;
              --color-tutorials-overview-icon: #666;
              --color-tutorials-overview-navigation-link: #666;
              --color-tutorials-overview-navigation-link-active: #000;
              --color-tutorials-overview-navigation-link-hover: #000;
              background: #fff;
            }

            body[data-color-scheme="auto"] .tutorials-overview .hero .title,
            body[data-color-scheme="auto"] .tutorials-overview .hero .content,
            body[data-color-scheme="auto"] .tutorials-overview .hero .meta {
              color: #111 !important;
            }

            /* Ensure section titles are readable when system prefers light and site is Auto */
            body[data-color-scheme="auto"] .tutorials-overview .hero .content h1,
            body[data-color-scheme="auto"] .tutorials-overview .hero .content h2,
            body[data-color-scheme="auto"] .tutorials-overview .hero .content h3,
            body[data-color-scheme="auto"] .tutorials-overview .hero .content h4,
            body[data-color-scheme="auto"] .tutorials-overview .hero .content h5,
            body[data-color-scheme="auto"] .tutorials-overview .hero .content h6,
            body[data-color-scheme="auto"] .tutorials-overview .hero .content .title,
            body[data-color-scheme="auto"] .tutorials-overview .hero .content .section-title,
            body[data-color-scheme="auto"] .tutorials-overview .hero .content .eyebrow {
              color: #000 !important;
            }

            body[data-color-scheme="auto"]:has(.tutorials-overview) .nav.theme-dark {
              --color-nav-dark-color: #000;
              --color-nav-dark-current-link: #000;
              --color-nav-dark-link-color: #000;
              --color-nav-dark-link-color-hover: #06c;
              --color-nav-dark-root-subhead: #000;
              --color-nav-dark-solid-background: #fff;
              --color-nav-dark-stuck: rgba(255, 255, 255, 0.92);
              --color-nav-dark-uiblur-expanded: rgba(255, 255, 255, 0.92);
              --color-nav-dark-uiblur-stuck: rgba(255, 255, 255, 0.82);
              --color-nav-dark-keyline: rgba(0, 0, 0, 0.2);
              color: #000;
              background: rgba(255, 255, 255, 0.92);
            }

            body[data-color-scheme="auto"]:has(.tutorials-overview)
              .nav.theme-dark .nav-title-content {
              color: #000 !important;
            }

            body[data-color-scheme="auto"]:has(.tutorials-overview)
              .nav.theme-dark .tutorials-navigation-link {
              color: #555 !important;
            }

            body[data-color-scheme="auto"]:has(.tutorials-overview)
              .nav.theme-dark .tutorials-navigation-link.active {
              color: #000 !important;
            }
          }
          EOF

          find "$SITE_ROOT" \
            -type f \
            -name 'index.html' \
            ! -path "$SITE_ROOT/index.html" \
            -exec sed -i '' \
              "s|</head>|<link rel=\"stylesheet\" href=\"$BASE_PATH/theme-fix.css\"></head>|" \
              {} +

          find "$SITE_ROOT" \
            -type f \
            -name 'index.html' \
            ! -path "$SITE_ROOT/index.html" \
            -exec sed -i '' \
              "s|</body>|<script defer src=\"$BASE_PATH/scroll-fix.js\"></script></body>|" \
              {} +

      - name: Verify generated site
        run: |
          ROOT_INDEX="$RUNNER_TEMP/docc-site/index.html"
          TUTORIAL_INDEX="$RUNNER_TEMP/docc-site/tutorials/tableofcontents/index.html"
          ROOM_TUTORIAL_INDEX="$RUNNER_TEMP/docc-site/tutorials/cookiedungeon/roomtracking/index.html"
          SCROLL_FIX="$RUNNER_TEMP/docc-site/scroll-fix.js"
          THEME_FIX="$RUNNER_TEMP/docc-site/theme-fix.css"
          EXPECTED_BASE="/${{ github.event.repository.name }}/"
          LANDING_URL="${EXPECTED_BASE}tutorials/tableofcontents/"

          if [ ! -f "$ROOT_INDEX" ]; then
            echo "::error::생성된 사이트에 index.html이 없습니다."
            exit 1
          fi

          if [ ! -f "$TUTORIAL_INDEX" ]; then
            echo "::error::튜토리얼 목차 페이지가 생성되지 않았습니다."
            exit 1
          fi

          if [ ! -f "$ROOM_TUTORIAL_INDEX" ]; then
            echo "::error::Room Tracking 튜토리얼 페이지가 생성되지 않았습니다."
            exit 1
          fi

          if [ ! -f "$SCROLL_FIX" ]; then
            echo "::error::튜토리얼 섹션 스크롤 보정 파일이 없습니다."
            exit 1
          fi

          if [ ! -f "$THEME_FIX" ]; then
            echo "::error::DocC 테마 보정 파일이 없습니다."
            exit 1
          fi

          if ! grep -Fq "var baseUrl = \"$EXPECTED_BASE\"" "$TUTORIAL_INDEX"; then
            echo "::error::DocC hosting base path가 튜토리얼 페이지에 적용되지 않았습니다."
            grep -o 'var baseUrl = [^<]*' "$TUTORIAL_INDEX" || true
            exit 1
          fi

          if ! grep -Fq "$LANDING_URL" "$ROOT_INDEX"; then
            echo "::error::루트 페이지의 튜토리얼 리디렉션이 올바르지 않습니다."
            exit 1
          fi

          if ! grep -Fq "${EXPECTED_BASE}scroll-fix.js" "$ROOM_TUTORIAL_INDEX"; then
            echo "::error::튜토리얼 페이지에 섹션 스크롤 보정이 적용되지 않았습니다."
            exit 1
          fi

          if ! grep -Fq "${EXPECTED_BASE}theme-fix.css" "$TUTORIAL_INDEX"; then
            echo "::error::튜토리얼 목차에 테마 보정이 적용되지 않았습니다."
            exit 1
          fi

          echo "Verified DocC base path: $EXPECTED_BASE"
          echo "Verified landing page: $LANDING_URL"
          echo "Verified tutorial section scrolling fix"
          echo "Verified tutorial overview color-scheme fix"

      - name: Upload GitHub Pages artifact
        uses: actions/upload-pages-artifact@v5
        with:
          path: ${{ runner.temp }}/docc-site

  deploy:
    name: Deploy GitHub Pages
    needs: build
    runs-on: ubuntu-latest
    timeout-minutes: 10

    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}

    steps:
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v5