mirror of
https://github.com/stagehacks/Cue-View.git
synced 2026-08-07 06:43:39 +00:00
gray out disabled buttons, change element tree a bit
This commit is contained in:
sparks-alec
+58
-54
@@ -15,104 +15,106 @@
|
||||
<div class="source-label"><%= input.shortName %></div>
|
||||
</div>
|
||||
<% } else {%>
|
||||
<div id="me-<%= meIndex %>-input-<%= input.inputId %>" class="atem-input hide">
|
||||
<div id="me-<%= meIndex %>-input-<%= input.inputId %>" class="atem-input atem-disabled">
|
||||
<div class="source-label"><%= input.shortName %></div>
|
||||
</div>
|
||||
<% }%>
|
||||
<% }) %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="program-container hide-small">
|
||||
<h3 class="atem-gray">Program</h3>
|
||||
<div class="source-wrapper">
|
||||
<% Object.values(data.inputs).sort((a,b)=>a.internalPortType<b.internalPortType).forEach((input)=>{ %>
|
||||
<% if ([0,1,2,3,4].includes(input.internalPortType)) { %>
|
||||
<div id="me-<%= meIndex %>-program-input-<%= input.inputId %>" class="atem-input">
|
||||
<div class="source-label"><%= input.shortName %></div>
|
||||
</div>
|
||||
<% } else {%>
|
||||
<div id="me-<%= meIndex %>-program-input-<%= input.inputId %>" class="atem-input hide">
|
||||
<div class="source-label"><%= input.shortName %></div>
|
||||
</div>
|
||||
<% }%>
|
||||
<div class="float-left" style="margin-right: 30px;">
|
||||
<div class="program-container hide-small">
|
||||
<h3 class="atem-gray">Program</h3>
|
||||
<div class="source-wrapper">
|
||||
<% Object.values(data.inputs).sort((a,b)=>a.internalPortType<b.internalPortType).forEach((input)=>{ %>
|
||||
<% if ([0,1,2,3,4].includes(input.internalPortType)) { %>
|
||||
<div id="me-<%= meIndex %>-program-input-<%= input.inputId %>" class="atem-input">
|
||||
<div class="source-label"><%= input.shortName %></div>
|
||||
</div>
|
||||
<% } else {%>
|
||||
<div id="me-<%= meIndex %>-program-input-<%= input.inputId %>" class="atem-input atem-disabled">
|
||||
<div class="source-label"><%= input.shortName %></div>
|
||||
</div>
|
||||
<% }%>
|
||||
|
||||
<% }) %>
|
||||
<% }) %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="preview hide-small">
|
||||
<h3 class="atem-gray">Preview</h3>
|
||||
<div class="source-wrapper">
|
||||
<% Object.values(data.inputs).forEach((input)=>{ %>
|
||||
<% if ([0,1,2,3,4].includes(input.internalPortType)) { %>
|
||||
<div id="me-<%= meIndex %>-preview-input-<%= input.inputId %>" class="atem-input">
|
||||
<div class="source-label"><%= input.shortName %></div>
|
||||
</div>
|
||||
<% } else {%>
|
||||
<div id="me-<%= meIndex %>-preview-input-<%= input.inputId %>" class="atem-input hide">
|
||||
<div class="source-label"><%= input.shortName %></div>
|
||||
</div>
|
||||
<% }%>
|
||||
<div class="preview hide-small">
|
||||
<h3 class="atem-gray">Preview</h3>
|
||||
<div class="source-wrapper">
|
||||
<% Object.values(data.inputs).forEach((input)=>{ %>
|
||||
<% if ([0,1,2,3,4].includes(input.internalPortType)) { %>
|
||||
<div id="me-<%= meIndex %>-preview-input-<%= input.inputId %>" class="atem-input">
|
||||
<div class="source-label"><%= input.shortName %></div>
|
||||
</div>
|
||||
<% } else {%>
|
||||
<div id="me-<%= meIndex %>-preview-input-<%= input.inputId %>" class="atem-input atem-disabled">
|
||||
<div class="source-label"><%= input.shortName %></div>
|
||||
</div>
|
||||
<% }%>
|
||||
|
||||
<% }) %>
|
||||
<% }) %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="transition-container">
|
||||
<div class="transition-container float-left">
|
||||
<div class="transition-settings">
|
||||
<div class="next-transition">
|
||||
<h3>Next Transition</h3>
|
||||
<div class="source-wrapper" style="flex-direction:column">
|
||||
<div class="source-wrapper no-wrap clear">
|
||||
<div class="source-wrapper" style="width: 260px;">
|
||||
<!-- <div class="source-wrapper no-wrap clear"> -->
|
||||
<div class="atem-input clear"></div>
|
||||
<div id="me-<%= meIndex %>-key-1-onair" class="atem-input">
|
||||
<div class="source-label" style="flex-direction: column;">
|
||||
<div>ON</div> <div>AIR</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="me-<%= meIndex %>-key-2-onair" class="atem-input">
|
||||
<div id="me-<%= meIndex %>-key-2-onair" class="atem-input <% if(data.video.downstreamKeyers.length<2){ %> atem-disabled <% } %>">
|
||||
<div class="source-label" style="flex-direction: column;">
|
||||
<div>ON</div> <div>AIR</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="me-<%= meIndex %>-key-3-onair" class="atem-input">
|
||||
<div id="me-<%= meIndex %>-key-3-onair" class="atem-input <% if(data.video.downstreamKeyers.length<3){ %> atem-disabled <% } %>">
|
||||
<div class="source-label" style="flex-direction: column;">
|
||||
<div>ON</div> <div>AIR</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="me-<%= meIndex %>-key-4-onair" class="atem-input">
|
||||
<div id="me-<%= meIndex %>-key-4-onair" class="atem-input <% if(data.video.downstreamKeyers.length<4){ %> atem-disabled <% } %>">
|
||||
<div class="source-label" style="flex-direction: column;">
|
||||
<div>ON</div> <div>AIR</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
|
||||
<div>
|
||||
<!-- <div>
|
||||
<div class="atem-input clear" style="height:10px"></div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="source-wrapper no-wrap clear">
|
||||
<!-- <div class="source-wrapper no-wrap"> -->
|
||||
<div id="me-<%= meIndex %>-transition-selection-1" class="atem-input">
|
||||
<div class="source-label">BKGD</div>
|
||||
</div>
|
||||
<div id="me-<%= meIndex %>-transition-selection-2" class="atem-input">
|
||||
<div class="source-label">KEY 1</div>
|
||||
</div>
|
||||
<div id="me-<%= meIndex %>-transition-selection-4" class="atem-input">
|
||||
<div id="me-<%= meIndex %>-transition-selection-4" class="atem-input <% if(data.video.downstreamKeyers.length<2){ %> atem-disabled <% } %>">
|
||||
<div class="source-label">KEY 2</div>
|
||||
</div>
|
||||
<div id="me-<%= meIndex %>-transition-selection-8" class="atem-input">
|
||||
<div id="me-<%= meIndex %>-transition-selection-8" class="atem-input <% if(data.video.downstreamKeyers.length<3){ %> atem-disabled <% } %>">
|
||||
<div class="source-label">KEY 3</div>
|
||||
</div>
|
||||
<div id="me-<%= meIndex %>-transition-selection-16" class="atem-input">
|
||||
<div id="me-<%= meIndex %>-transition-selection-16" class="atem-input <% if(data.video.downstreamKeyers.length<4){ %> atem-disabled <% } %>">
|
||||
<div class="source-label">KEY 4</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="transition-style">
|
||||
<h3>Transition Style</h3>
|
||||
<div class="source-wrapper" style="flex-direction:column">
|
||||
<div class="source-wrapper no-wrap clear">
|
||||
<div class="source-wrapper" style="width: 260px;">
|
||||
<!-- <div class="source-wrapper no-wrap clear"> -->
|
||||
<div id="me-<%= meIndex %>-transition-style-0" class="atem-input">
|
||||
<div class="source-label">MIX</div>
|
||||
</div>
|
||||
@@ -128,13 +130,13 @@
|
||||
<div id="me-<%= meIndex %>-transition-style-3" class="atem-input">
|
||||
<div class="source-label">DVE</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
|
||||
<div>
|
||||
<!-- <div>
|
||||
<div class="atem-input clear" style="height:10px"></div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="source-wrapper no-wrap clear">
|
||||
<!-- <div class="source-wrapper no-wrap clear"> -->
|
||||
<div id="me-<%= meIndex %>-transition-preview" class="atem-input">
|
||||
<div class="source-label" style="flex-direction: column;">
|
||||
<div>PREV</div> <div>TRANS</div>
|
||||
@@ -149,13 +151,15 @@
|
||||
</div>
|
||||
<div class="transition-rate atem-input clear">
|
||||
<div class="atem-gray rate-heading">Rate</div>
|
||||
<div id="me-<%= meIndex %>-transition-rate" class="transition-rate-label">00</div>
|
||||
<div id="me-<%= meIndex %>-transition-rate" class="transition-rate-label"> </div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tbar-container">
|
||||
<div class="tbar-bg"></div>
|
||||
<div id="me-<%= meIndex %>-tbar-handle-div" class="tbar-handle"></div>
|
||||
<div id="me-<%= meIndex %>-tbar-div" class="tbar-div" ></div>
|
||||
</div>
|
||||
<div class="fade-to-black-container">
|
||||
@@ -169,7 +173,7 @@
|
||||
</div>
|
||||
<div class="dsk-rate atem-input clear">
|
||||
<div class="atem-gray rate-heading">Rate</div>
|
||||
<div id="dsk-<%= dskIndex %>-rate" class="dsk-rate-label">00</div>
|
||||
<div id="dsk-<%= dskIndex %>-rate" class="dsk-rate-label"> </div>
|
||||
</div>
|
||||
<div id="dsk-<%= dskIndex %>-onair" class="atem-input">
|
||||
<div class="source-label" style="flex-direction: column;">
|
||||
@@ -188,7 +192,7 @@
|
||||
<div class="source-wrapper">
|
||||
<div class="ftb-rate atem-input clear">
|
||||
<div class="atem-gray rate-heading">Rate</div>
|
||||
<div id="me-<%= meIndex %>-ftb-rate" class="ftb-rate-label">00</div>
|
||||
<div id="me-<%= meIndex %>-ftb-rate" class="ftb-rate-label"> </div>
|
||||
</div>
|
||||
<div id="me-<%= meIndex %>-ftb" class="atem-input">
|
||||
<div class="source-label">FTB</div>
|
||||
|
||||
Reference in New Issue
Block a user