Sync: implement camera animation rendering function and refactor platform row logic
This commit is contained in:
@@ -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 ───────────────────────────────── */
|
||||
|
||||
Reference in New Issue
Block a user