#!/usr/bin/env python3
"""Generate per-product creative HTML files (1:1, dark textured bg, ZRD logo top)."""
import os

TEMPLATE = """<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<style>
  @font-face {{ font-family:'Benzin'; src:url('fonts/benzin-medium-1.ttf') format('truetype'); }}
  * {{ margin:0; padding:0; box-sizing:border-box; }}
  html,body {{ width:1080px; height:1080px; overflow:hidden; }}
  body {{
    background:#101010; position:relative;
    -webkit-font-smoothing:antialiased;
  }}
  .bg {{
    position:absolute; inset:0;
    background:
      radial-gradient(ellipse 70% 55% at 50% 46%, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.012) 45%, transparent 70%),
      linear-gradient(180deg, #161616 0%, #0E0E0E 60%, #0A0A0A 100%);
  }}
  .light-l {{
    position:absolute; left:{gl_x}%; top:53%; width:{gl_w}px; height:600px;
    transform:translate(-50%,-50%);
    background:radial-gradient(ellipse 50% 50% at 50% 50%, rgba(255,255,255,0.13) 0%, rgba(255,255,255,0.035) 45%, transparent 72%);
    filter:blur(34px);
  }}
  .light-r {{
    position:absolute; right:{gr_x}%; top:53%; width:{gr_w}px; height:600px;
    transform:translate(50%,-50%);
    background:radial-gradient(ellipse 50% 50% at 50% 50%, rgba(255,255,255,0.13) 0%, rgba(255,255,255,0.035) 45%, transparent 72%);
    filter:blur(34px);
  }}
  .noise {{
    position:absolute; inset:0; opacity:.55; mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.10'/%3E%3C/svg%3E");
  }}
  .grain {{
    position:absolute; inset:0; opacity:.5; mix-blend-mode:soft-light;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.6' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='0.25'/%3E%3C/svg%3E");
  }}
  .red-glow {{
    position:absolute; left:50%; top:53%; width:760px; height:560px;
    transform:translate(-50%,-50%);
    background:radial-gradient(ellipse 50% 50% at 50% 50%, rgba(192,45,45,0.07) 0%, transparent 70%);
    filter:blur(40px);
  }}
  .vignette {{
    position:absolute; inset:0;
    background:radial-gradient(ellipse 88% 88% at 50% 46%, transparent 55%, rgba(0,0,0,0.55) 100%);
  }}
  .logo {{
    position:absolute; top:36px; left:0; right:0; text-align:center;
    font-family:'Benzin'; font-size:28px; letter-spacing:5px;
    color:#fff; opacity:.8; transform:skewX(-8deg);
  }}
  .duo {{
    position:absolute; left:0; right:0; top:52%; transform:translateY(-50%);
    display:flex; align-items:center; justify-content:center; gap:56px;
  }}
  .duo .item {{ width:{item_w}px; }}
  .duo .item img {{ width:100%; display:block;
    filter:drop-shadow(0 34px 50px rgba(0,0,0,0.6)); }}
</style>
</head>
<body>
  <div class="bg"></div>
  <div class="light-l"></div>
  <div class="light-r"></div>
  <div class="noise"></div>
  <div class="grain"></div>
  <div class="red-glow"></div>
  <div class="vignette"></div>

  <div class="logo">ZRD</div>

  <div class="duo">
    {items}
  </div>
</body>
</html>
"""

# slug: (имя креатива, [(img1, w1), (img2, w2)] ) — 1 или 2 изображения
jobs = {
 'bomber-hood-weather-black': ('zrd_bomber', [('bomber_front.png', 560)]),
 'windbreaker-hood-weather': ('zrd_windbreaker', [('windbreaker_front.png', 560)]),
 'pants-reflector-black': ('zrd_reflector', [('reflector_front.png', 430), ('reflector_back.png', 430)]),
 't-shirt-workflow-black': ('zrd_workflow', [('workflow_front.png', 470), ('workflow_back.png', 470)]),
 't-shirt-belyj-russkij-white': ('zrd_belyj', [('belyj_front.png', 470), ('belyj_back.png', 470)]),
 'futbolka-zrd-cnt-3': ('zrd_cnt', [('cnt_front.png', 430), ('cnt_back.png', 430)]),
 'pants-no-color-black': ('zrd_nocolor', [('nocolor_front.png', 560)]),
 'jacket-full-grey': ('zrd_fullgrey', [('fullgrey_front.png', 560)]),
 'pants-nylon-basic-grey': ('zrd_nylon', [('nylon_front.png', 560)]),
}

OUTD = '/root/.hermes/image_cache/zrd_1x1/creatives/'
os.makedirs(OUTD, exist_ok=True)

for slug, (name, items) in jobs.items():
    two = len(items) == 2
    if two:
        gl_x, gl_w = 26, 430
        gr_x, gr_w = 26, 430
        item_w = max(w for _, w in items)
        imgs = '\n'.join(f'    <div class="item"><img src="../cutouts/{f}"></div>' for f, _ in items)
    else:
        gl_x, gl_w = 50, 620
        gr_x, gr_w = 50, 620
        item_w = items[0][1]
        imgs = f'    <div class="item"><img src="../cutouts/{items[0][0]}"></div>'
    html = TEMPLATE.format(gl_x=gl_x, gl_w=gl_w, gr_x=gr_x, gr_w=gr_w, item_w=item_w, items=imgs)
    open(os.path.join(OUTD, name + '.html'), 'w', encoding='utf-8').write(html)
    print('generated', name + '.html', 'items=', len(items))
print('done')
