stagehacks/Cue-View
1
0
Fork 0
mirror of https://github.com/stagehacks/Cue-View.git synced 2026-08-06 14:23:40 +00:00
Code Issues Packages Projects Releases 9 Wiki Activity

update transition section layout with dsk

Browse Source
This commit is contained in:
Joel Wetzell
2023-02-08 16:15:45 -06:00
parent 5ea17755d1
commit 7709792fb5
2 changed files with 45 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/atem/styles.css
+20 -6
View File
@@ -53,10 +53,10 @@ h3 {
flex-wrap: wrap;
}
.tbar-progress {
width: 100%;
height: 40px;
accent-color: limegreen;
.transition-settings {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.tbar-container {
@@ -76,24 +76,38 @@ h3 {
overflow: hidden;
}
.dsk {
width: 100%;
}
.dsk .source-wrapper {
display: flex;
flex-direction: column;
width: fit-content;
align-content: center;
width: 100%;
padding: 5px;
}
.dsk h3 {
text-align: center;
}
.fade-to-black-container {
display: flex;
flex-direction: column;
align-items: flex-end;
}
.fade-to-black .source-wrapper {
display: flex;
width: fit-content;
width: 100%;
padding: 5px;
}
.fade-to-black h3 {
text-align: center;
}
.dsk-rate,
.ftb-rate,
.transition-rate {
plugins/atem/template.ejs
+25 -27
View File
@@ -41,7 +41,7 @@
</div>
</div>
<div class="transition-container">
<div>
<div class="transition-settings">
<div class="next-transition">
<h3>Next Transition</h3>
<div class="source-wrapper" style="flex-direction:column">
@@ -143,6 +143,30 @@
<div id="me-<%= meIndex %>-tbar-div" class="tbar-div" ></div>
</div>
<div class="fade-to-black-container">
<% if (data.video.downstreamKeyers) { %>
<% Object.entries(data.video.downstreamKeyers).forEach(([dskIndex, state])=>{ %>
<div class="dsk">
<h3 class="atem-gray">DSK<%= Number(dskIndex) + 1 %></h3>
<div class="source-wrapper">
<div id="dsk-<%= dskIndex %>-tie" class="atem-input">
<div class="source-label">TIE</div>
</div>
<div class="dsk-rate atem-input clear">
<div class="atem-gray" style="text-align: center">Rate</div>
<div id="dsk-<%= dskIndex %>-rate" class="dsk-rate-label">00</div>
</div>
<div id="dsk-<%= dskIndex %>-onair" class="atem-input">
<div class="source-label" style="flex-direction: column;">
<div>ON</div> <div>AIR</div>
</div>
</div>
<div id="dsk-<%= dskIndex %>-auto" class="atem-input">
<div class="source-label">AUTO</div>
</div>
</div>
</div>
<% }) %>
<% } %>
<div class="fade-to-black">
<h3 class="atem-gray">Fade to Black</h3>
<div class="source-wrapper">
@@ -160,29 +184,3 @@
</div>
<% }) %>
<% } %>
<% if (data.video.downstreamKeyers) { %>
<% Object.entries(data.video.downstreamKeyers).forEach(([dskIndex, state])=>{ %>
<div class="dsk">
<h3 class="atem-gray">DSK<%= Number(dskIndex) + 1 %></h3>
<div class="source-wrapper">
<div id="dsk-<%= dskIndex %>-tie" class="atem-input">
<div class="source-label">TIE</div>
</div>
<div class="dsk-rate atem-input clear">
<div class="atem-gray" style="text-align: center">Rate</div>
<div id="dsk-<%= dskIndex %>-rate" class="dsk-rate-label">00</div>
</div>
<div id="dsk-<%= dskIndex %>-onair" class="atem-input">
<div class="source-label" style="flex-direction: column;">
<div>ON</div> <div>AIR</div>
</div>
</div>
<div id="dsk-<%= dskIndex %>-auto" class="atem-input">
<div class="source-label">AUTO</div>
</div>
</div>
</div>
<% }) %>
<% } %>