C.E.L_Slide_test2/scripts/verify_retry_1_2.py

"""검증 1, 2 재시도 — 프롬프트 개선.

검증 1: 배경 박스가 영역을 꽉 채우도록
검증 2: 벤 다이어그램이 아니라 포함 관계 박스 구조 (C_reference 방식)
"""
from __future__ import annotations
import asyncio, json, sys, time, datetime, base64, re
from pathlib import Path

ROOT = Path(__file__).parent.parent
sys.path.insert(0, str(ROOT))


async def main():
    from src.sse_utils import stream_sse_tokens
    from src.slide_measurer import measure_rendered_heights, capture_slide_screenshot
    from src.config import settings
    import httpx

    out_dir = ROOT / "data" / "runs" / f"verify_retry_{datetime.datetime.now().strftime('%Y%m%d_%H%M%S')}"
    out_dir.mkdir(parents=True, exist_ok=True)
    print(f"출력: {out_dir}\n")

    kei_url = getattr(settings, "kei_api_url", "http://localhost:8000")
    t0 = time.time()

    # ═══════════════════════════════════════
    # 검증 1 재시도: 배경 박스가 영역을 꽉 채움
    # ═══════════════════════════════════════
    print("=== 검증 1 재시도: 배경 사례 박스 ===")

    prompt_1 = """다음 콘텐츠를 다크 배경 박스 HTML로 만들어라.

## 크기 제약
- 너비: 707px을 꽉 채운다 (width: 100%)
- 높이: 176px을 꽉 채운다 (height: 176px)
- overflow 금지 — 176px 안에 모든 내용이 보여야 한다

## 콘텐츠 (이 텍스트를 그대로 사용, 축약 금지)
- 제목: "현실 — 용어의 혼용"
- 본문: "건설산업에서 DX와 BIM이 동일 개념으로 인식되고 있다. 실질적으로 DX는 산업 전반의 프로세스를 혁신하는 상위개념이며, BIM은 3차원 모델 기반의 정보 관리 도구로서 DX의 하위 기술에 해당한다."
- 사례 1: 제목 "스마트 건설 활성화 방안(2022.07)" / 내용 "추진과제: 건설산업 디지털화 / 실행과제: BIM 전면 도입, BIM 전문인력 양성"
- 사례 2: 제목 "제7차 건설기술진흥 기본계획(2023.12)" / 내용 "추진방향: 디지털 전환을 통한 스마트 건설 확산 / 추진과제: BIM 도입으로 건설산업 디지털화"

## 디자인
- 배경: linear-gradient(135deg, #1e293b, #0f172a)
- border-radius: 8px
- width: 100%, height: 176px (고정)
- 제목: 13px bold, color: #93c5fd
- 본문: 12px, color: #e2e8f0
- 사례 카드 2개를 가로 나란히 (flex 또는 grid)
- 사례 카드: background: rgba(255,255,255,0.06), border-left: 3px solid #60a5fa, padding: 8px 12px
- 사례 제목: 11px bold, color: #fbbf24
- 사례 내용: 10px, color: #cbd5e1
- DX와 BIM을 strong 태그로 강조

## 출력
HTML + inline <style>만 반환. 설명 없이.
```html
(여기)
```"""

    html_1 = await _call_kei(kei_url, prompt_1)
    if html_1:
        wrapped_1 = _wrap_in_container(html_1, 707, 200)
        m_1 = await asyncio.to_thread(measure_rendered_heights, wrapped_1)
        s_1 = await asyncio.to_thread(capture_slide_screenshot, wrapped_1)
        _save(out_dir, "verify1_retry.html", wrapped_1)
        if s_1:
            (out_dir / "verify1_retry.png").write_bytes(base64.b64decode(s_1))
        print(f"  [{time.time()-t0:.0f}s] 완료. HTML {len(html_1)}자")
    else:
        print(f"  [{time.time()-t0:.0f}s] ❌ 실패")

    # ═══════════════════════════════════════
    # 검증 2 재시도: 포함 관계 박스 구조 (벤 다이어그램 아님)
    # ═══════════════════════════════════════
    print("\n=== 검증 2 재시도: DX 포함 관계 ===")

    prompt_2 = """다음 포함 관계를 시각화하는 HTML을 만들어라.

## 크기 제약
- 너비: 707px을 꽉 채운다
- 높이: 293px 안에 맞춘다

## 관계 구조
DX는 상위개념이다. DX 안에 GIS, BIM, 디지털 트윈이 포함된다.
이 3개 기술이 융합되어야 DX가 실현된다.

## 시각화 구조 (이 구조를 정확히 따르라)
1. "DX와 핵심기술의 올바른 관계" 제목 (14px bold, #2563eb, 가운데 정렬)
2. DX 큰 박스:
   - border: 3px solid #2563eb, border-radius: 14px
   - background: linear-gradient(180deg, #eff6ff, #dbeafe)
   - 상단에 라벨 배지: "DX — 디지털 전환 (상위개념)" (absolute, top: -11px, background: #2563eb, color: white, border-radius: 10px)
   - 배지 아래에 설명: "BIM, GIS, 디지털 트윈 등 핵심기술의 융합을 통해서만 실현 가능" (11px, #1e40af, 가운데)
   - 내부에 카드 3개를 가로 나란히:
     - 각 카드: background: white, border: 2px solid #93c5fd, border-radius: 8px, padding: 10px
     - 각 카드 상단: 원형 아이콘 (36px, gradient #93c5fd→#2563eb, 흰 글자)
     - GIS 카드: 아이콘 "G", 이름 "GIS", 설명 "지리적 데이터를 공간 분석하여 시각적으로 표현, 위치기반 정보 제공"
     - BIM 카드: 아이콘 "B", 이름 "BIM", 설명 "시설물 생애주기 정보를 3차원 모델 기반으로 통합·관리하는 도구"
     - 디지털트윈 카드: 아이콘 "T", 이름 "디지털 트윈", 설명 "현실 세계의 물리적 객체를 디지털 환경에 동일하게 구현"
3. DX 박스 아래에 핵심 메시지 박스:
   - background: #f0f9ff, border: 2px solid #bae6fd, border-radius: 8px
   - 텍스트: "BIM ≠ DX — BIM은 DX를 실현하기 위한 핵심 기술 중 하나일 뿐이다" (13px bold, #0c4a6e)
   - "BIM ≠ DX" 부분만 color: #dc2626, font-weight: 900

## 출력
HTML + inline <style>만 반환. 설명 없이.
```html
(여기)
```"""

    html_2 = await _call_kei(kei_url, prompt_2)
    if html_2:
        wrapped_2 = _wrap_in_container(html_2, 707, 310)
        m_2 = await asyncio.to_thread(measure_rendered_heights, wrapped_2)
        s_2 = await asyncio.to_thread(capture_slide_screenshot, wrapped_2)
        _save(out_dir, "verify2_retry.html", wrapped_2)
        if s_2:
            (out_dir / "verify2_retry.png").write_bytes(base64.b64decode(s_2))
        print(f"  [{time.time()-t0:.0f}s] 완료. HTML {len(html_2)}자")
    else:
        print(f"  [{time.time()-t0:.0f}s] ❌ 실패")

    print(f"\n총 소요: {time.time()-t0:.0f}초")
    print(f"결과: {out_dir}")


async def _call_kei(kei_url: str, prompt: str) -> str | None:
    import httpx
    try:
        async with httpx.AsyncClient(timeout=None) as client:
            async with client.stream(
                "POST", f"{kei_url}/api/message",
                json={"message": prompt, "session_id": "verify-retry", "mode_hint": "chat"},
                timeout=None,
            ) as response:
                if response.status_code != 200:
                    return None
                from src.sse_utils import stream_sse_tokens
                full_text = await stream_sse_tokens(response)

        if not full_text:
            return None

        match = re.search(r"```html\s*(.*?)```", full_text, re.DOTALL)
        if match:
            return match.group(1).strip()

        match = re.search(r"(<(?:div|style|section)[^>]*>.*)", full_text, re.DOTALL)
        if match:
            return match.group(1).strip()

        return full_text.strip()
    except Exception as e:
        print(f"  Kei API 오류: {e}")
        return None


def _wrap_in_container(inner_html: str, width: int, height: int) -> str:
    return f"""<!DOCTYPE html>
<html lang="ko"><head><meta charset="UTF-8">
<style>
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css');
* {{ margin: 0; padding: 0; box-sizing: border-box; }}
body {{ background: white; }}
.slide {{
    width: 1280px; height: 720px; overflow: hidden;
    background: white;
    font-family: 'Pretendard Variable', sans-serif;
    display: flex; align-items: center; justify-content: center;
}}
.test-container {{
    width: {width}px;
}}
</style>
</head><body>
<div class="slide">
<div class="test-container">
{inner_html}
</div>
</div>
</body></html>"""


def _save(out_dir, name, data):
    (out_dir / name).write_text(data if isinstance(data, str) else json.dumps(data, ensure_ascii=False, indent=2), encoding="utf-8")


if __name__ == "__main__":
    import logging
    logging.basicConfig(level=logging.INFO, format="%(asctime)s %(levelname)s %(message)s", datefmt="%H:%M:%S")
    logging.getLogger("httpx").setLevel(logging.WARNING)
    logging.getLogger("httpcore").setLevel(logging.WARNING)
    logging.getLogger("selenium").setLevel(logging.WARNING)
    logging.getLogger("urllib3").setLevel(logging.WARNING)
    asyncio.run(main())