diff --git a/trailer.html b/trailer.html index a66df1d..1533051 100644 --- a/trailer.html +++ b/trailer.html @@ -28,7 +28,37 @@ .ch .ap{color:var(--muted);font-size:12px;margin-top:4px} .sheets{display:flex;gap:5px;margin-bottom:8px} .sheets img{width:33%;border-radius:6px;border:1px solid var(--line);display:block; - aspect-ratio:16/9;object-fit:cover} + aspect-ratio:3/4;object-fit:cover;object-position:top} + img[data-zoom]{cursor:zoom-in} + .lookset{border-top:1px dashed var(--line);margin-top:8px;padding-top:8px} + .lookset .lw{color:var(--muted);font-size:12px;margin-bottom:5px} + .lookset .lw b{display:inline;color:inherit} + .lookset.idle{opacity:.55} + .whoin{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0} + .whoin .p{display:flex;gap:8px;border:1px solid var(--line);border-radius:10px; + padding:8px;width:310px;font-size:12px;align-items:flex-start} + .whoin .p img{width:64px;aspect-ratio:3/4;object-fit:cover;object-position:top; + border-radius:6px;border:1px solid var(--line);flex:none} + .whoin .p .none{width:64px;aspect-ratio:3/4;border-radius:6px;flex:none; + border:1px dashed var(--line);display:flex;align-items:center; + justify-content:center;color:var(--muted);font-size:10px;text-align:center} + .whoin .p .t{flex:1;min-width:0} + .whoin .p .t b{display:block;font-size:13px} + .whoin .p .t .w{color:var(--muted);margin:2px 0 6px} + .whoin .p .t .st{color:#b4531f} + .whoin .p .t .new{color:#1f7a3a;font-weight:600} + .whoin .p input{width:100%;box-sizing:border-box;font:inherit;padding:5px 7px; + border:1px solid var(--line);border-radius:6px;background:transparent;color:inherit} + .whoin .p .go{margin-top:5px;font-size:12px;padding:3px 9px} + .whole{border:1px solid var(--line);border-radius:10px;padding:12px;margin:0 0 18px} + .whole h4{margin:0 0 4px;font-size:14px} + .whole p{margin:0 0 8px;color:var(--muted);font-size:13px} + .whole textarea{width:100%;box-sizing:border-box} + #zoom{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:99;display:none; + align-items:center;justify-content:center;cursor:zoom-out;padding:18px} + #zoom.on{display:flex} + #zoom img{max-width:100%;max-height:100%;border-radius:6px} + #zoom .cap{position:fixed;left:0;right:0;bottom:10px;text-align:center;color:#ddd;font-size:13px} .shot{border-top:1px solid var(--line);padding:16px 0;display:flex;gap:16px} .shot .num{width:40px;flex:none;color:var(--muted);font-variant-numeric:tabular-nums} .shot .body{flex:1;min-width:0} @@ -191,6 +221,8 @@ } function busyShots() { + if (String(PKG.look_state || "") + && (Date.now() - (Date.parse(PKG.look_started || "") || 0)) < 15 * 60 * 1000) return true; return (PKG.shots || []).some(function (s) { return s.writing || s.drawing || stillFilming(s); }); } @@ -413,7 +445,10 @@ out.push(''); else { var over = (PKG.timing && Number(PKG.timing.over_by)) || 0; - if (REVIEWS.length || Object.keys(NOTES).length || over > 5) + // Always on offer. It used to appear only once a note existed, and + // a note typed a moment ago does not repaint the bar - so an author + // wrote their notes and found nothing to press. + if (true) out.push('
'; if (!REEL) { + // A storyboard is its pictures. With some missing it plays as a slide + // show with holes, which tells the author nothing about the sequence. + var toDraw = Number(PKG.pictures_to_draw || 0); + if (toDraw > 0) + out += '' + toDraw + ' picture' + + (toDraw === 1 ? ' is' : 's are') + ' still to be drawn. Use Draw this storyboard ' + + 'above, then come back here.
'; out += 'What is missing, what should go, what order the story should be told in, ' + + 'what you want people to feel. The head writer reads this first when you press ' + + 'Revise the whole script. Notes on a single shot go in the box under that shot.
' + + '' + esc(s.action || "") + '
' + (s.camera ? 'camera: ' + esc(s.camera) + '
' : '') + (s.continuity ? 'continuity: ' + esc(s.continuity) + '
' : '') @@ -1071,6 +1193,28 @@ el.disabled = true; r = await act("start_review", { run_id: runId }); if (r) await refresh(); return; } + var zi = e.target.closest && e.target.closest("img[data-zoom]"); + if (zi) { + var z = document.getElementById("zoom"); + z.querySelector("img").src = zi.getAttribute("src"); + z.querySelector(".cap").textContent = zi.getAttribute("data-zoom") || ""; + z.classList.add("on"); + return; + } + if ((el = hit("data-lookgo"))) { + var pr = el.getAttribute("data-lookgo").split("|"); + var box = document.getElementById("look-" + pr[0] + "-" + pr[1]); + var ask = box ? box.value.trim() : ""; + if (ask.length < 3) { if (box) box.focus(); return; } + el.disabled = true; el.textContent = "working…"; + r = await act("set_look", { draft_id: CUR, shot_id: pr[0], character_id: pr[1], prompt: ask }); + if (r) { + showMsg("msg", "Redrawing that look" + (r.frames ? " and " + r.frames + " scene" + + (r.frames === 1 ? "" : "s") + " it appears in" : "") + ", about $" + r.usd + ".", "ok"); + await refresh(); + } else { el.disabled = false; el.textContent = "Change"; } + return; + } if ((el = hit("data-revise"))) { el.disabled = true; r = await act("start_revision", { run_id: runId }); if (r) await refresh(); return; @@ -1140,6 +1284,15 @@ }, 700); }); + (function () { + var z = document.createElement("div"); + z.id = "zoom"; z.innerHTML = '