livechroma: use shutter animation

Change-Id: I5750bfd63f533f24a755cef2788e2ac926534595
andi34 · Jan 17, 2022 · 77e672b · 77e672b
1 parent 6b441af
commit 77e672b
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 0 deletions.
diff --git a/livechroma.php b/livechroma.php
@@ -65,6 +65,8 @@
 		<?php endif; ?>
 	</head>
 <body>
+<div id="blocker"></div>
+<div id="aperture"></div>
 	<div class="chromawrapper">
 	<div class="rotarygroup" id="start">
 		<div class="top-bar">

diff --git a/src/sass/classic_live_chromakeying.scss b/src/sass/classic_live_chromakeying.scss
@@ -125,6 +125,31 @@
   }
 }
 
+#blocker {
+  position: absolute;
+  display: none;
+  width: 100%;
+  height: 100%;
+  z-index: 1499;
+  background-color: #ffffff;
+  opacity: 0;
+}
+
+#aperture {
+  box-sizing: content-box;
+  display: none;
+  width: 150%;
+  padding-bottom: 150%;
+  height: 0;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  z-index: 1500;
+  transform: translate(-50%, -50%);
+  border: solid 2000px #000000;
+  border-radius: 50%;
+}
+
 #video--view {
   top: 0;
   left: 0;