livechroma: use shutter animation

andi34 · andi34 · commit 968b2e8cb5fc · 2022-01-17T08:03:37.000+01:00
Change-Id: I5750bfd63f533f24a755cef2788e2ac926534595
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;
