Sync: implement camera animation rendering function and refactor platform row logic

This commit is contained in:
Matt Batchelder
2026-02-21 17:55:50 -05:00
parent f9f15708e3
commit 6b8b6b2328
2 changed files with 65 additions and 62 deletions

View File

@@ -1356,6 +1356,56 @@ function oribi_render_platform_section( $a, $content ) {
}
/* ── Platform Row (child - renders one service row) ────────────────────────── */
function oribi_render_camera_animation() {
return <<<'HTML'
<div class="cam-stage" aria-hidden="true">
<div class="pc-wrap">
<div class="pc-body">
<div class="pc-flash-unit"></div>
<div class="pc-top"><div class="pc-shutter-btn"></div><div class="pc-viewfinder"></div></div>
<div class="pc-front">
<div class="pc-lens-ring"><div class="pc-lens-glass"><div class="pc-lens-reflex"></div></div></div>
<div class="pc-grip"></div>
</div>
</div>
<div class="pc-prints">
<div class="pc-print pc-print--1"><div class="pc-print__img"></div></div>
<div class="pc-print pc-print--2"><div class="pc-print__img"></div></div>
<div class="pc-print pc-print--3"><div class="pc-print__img"></div></div>
</div>
</div>
<div class="cam-scene">
<div class="cam-subject cam-subject--1"></div>
<div class="cam-subject cam-subject--2"></div>
<div class="cam-subject cam-subject--3"></div>
<div class="cam-flash-overlay"></div>
<div class="cam-vid-overlay"></div>
</div>
<div class="vc-wrap">
<div class="vc-camera">
<div class="vc-handle"></div>
<div class="vc-body">
<div class="vc-lens-barrel"><div class="vc-lens-tip"><div class="vc-lens-glass"><div class="vc-lens-reflex"></div></div></div></div>
<div class="vc-top-rail"></div>
<div class="vc-rec-light"></div>
<div class="vc-eyepiece"></div>
</div>
</div>
<div class="vc-tripod">
<div class="vc-stem"></div>
<div class="vc-legs">
<div class="vc-leg vc-leg--l"></div>
<div class="vc-leg vc-leg--c"></div>
<div class="vc-leg vc-leg--r"></div>
</div>
</div>
</div>
</div>
HTML;
}
function oribi_render_platform_row( $a ) {
$rev = ! empty( $a['reversed'] ) ? ' reverse' : '';
$img_id = ! empty( $a['imgId'] ) ? intval( $a['imgId'] ) : 0;
@@ -1742,57 +1792,7 @@ function oribi_render_platform_row( $a ) {
$visual_html = $bd;
$visual_cls = 'platform-visual has-branded';
} elseif ( ! empty( $a['cameraAnim'] ) ) {
$ca = '<div class="cam-stage" aria-hidden="true">';
// ── Left: compact photo camera ──
$ca .= '<div class="pc-wrap">';
$ca .= '<div class="pc-body">';
$ca .= '<div class="pc-flash-unit"></div>';
$ca .= '<div class="pc-top"><div class="pc-shutter-btn"></div><div class="pc-viewfinder"></div></div>';
$ca .= '<div class="pc-front">';
$ca .= '<div class="pc-lens-ring"><div class="pc-lens-glass"><div class="pc-lens-reflex"></div></div></div>';
$ca .= '<div class="pc-grip"></div>';
$ca .= '</div>';
$ca .= '</div>'; // pc-body
$ca .= '<div class="pc-prints">';
$ca .= '<div class="pc-print pc-print--1"><div class="pc-print__img"></div></div>';
$ca .= '<div class="pc-print pc-print--2"><div class="pc-print__img"></div></div>';
$ca .= '<div class="pc-print pc-print--3"><div class="pc-print__img"></div></div>';
$ca .= '</div>'; // pc-prints
$ca .= '</div>'; // pc-wrap
// ── Centre: product scene both cameras shoot ──
$ca .= '<div class="cam-scene">';
$ca .= '<div class="cam-subject cam-subject--1"></div>';
$ca .= '<div class="cam-subject cam-subject--2"></div>';
$ca .= '<div class="cam-subject cam-subject--3"></div>';
$ca .= '<div class="cam-flash-overlay"></div>';
$ca .= '<div class="cam-vid-overlay"></div>';
$ca .= '</div>'; // cam-scene
// ── Right: retro VHS video camera on tripod ──
$ca .= '<div class="vc-wrap">';
$ca .= '<div class="vc-camera">';
$ca .= '<div class="vc-handle"></div>';
$ca .= '<div class="vc-body">';
$ca .= '<div class="vc-lens-barrel"><div class="vc-lens-tip"><div class="vc-lens-glass"><div class="vc-lens-reflex"></div></div></div></div>';
$ca .= '<div class="vc-top-rail"></div>';
$ca .= '<div class="vc-rec-light"></div>';
$ca .= '<div class="vc-eyepiece"></div>';
$ca .= '</div>'; // vc-body
$ca .= '</div>'; // vc-camera
$ca .= '<div class="vc-tripod">';
$ca .= '<div class="vc-stem"></div>';
$ca .= '<div class="vc-legs">';
$ca .= '<div class="vc-leg vc-leg--l"></div>';
$ca .= '<div class="vc-leg vc-leg--c"></div>';
$ca .= '<div class="vc-leg vc-leg--r"></div>';
$ca .= '</div>'; // vc-legs
$ca .= '</div>'; // vc-tripod
$ca .= '</div>'; // vc-wrap
$ca .= '</div>'; // cam-stage
$visual_html = $ca;
$visual_html = oribi_render_camera_animation();
$visual_cls = 'platform-visual has-camera';
/* ── Gallery TV Slideshow ───────────────────────────────── */