mirror of
https://github.com/stagehacks/Cue-View.git
synced 2026-07-26 17:28:40 +00:00
Merge branch 'plugin-atem' of github.com:stagehacks/Cue-View into plugin-atem
This commit is contained in:
@@ -0,0 +1,11 @@
|
||||
<h3>ATEM Configuration</h3>
|
||||
<ul>
|
||||
<li>Set the IP Address, Subnet Mask, and Gateway of the ATEM using the <em>ATEM Setup utility</em></li>
|
||||
<li>The ATEM must be connected to a computer using a USB cable to change its Network settings</li>
|
||||
</ul>
|
||||
|
||||
<h3>ATEM Software Download</h3>
|
||||
<button href="https://www.blackmagicdesign.com/support/family/atem-live-production-switchers">
|
||||
Blackmagic Support
|
||||
</button>
|
||||
(Look for <em>ATEM Switchers Update</em>)
|
||||
|
||||
@@ -54,7 +54,6 @@ exports.update = function update(device, _document, updateType, data) {
|
||||
if (document.getElementById(tbarHandleId)) {
|
||||
document.getElementById(tbarHandleId).style.bottom = `${mixEffect.transitionPosition.handlePosition / 100}%`;
|
||||
}
|
||||
// TODO: format in 0:00 format
|
||||
document.getElementById(`me-${i}-transition-rate`).textContent = framesToTime(
|
||||
mixEffect.transitionPosition.remainingFrames
|
||||
);
|
||||
@@ -94,7 +93,6 @@ exports.update = function update(device, _document, updateType, data) {
|
||||
const ftbRateId = `me-${i}-ftb-rate`;
|
||||
const ftbId = `me-${i}-ftb`;
|
||||
|
||||
// TODO: format in 0:00 format
|
||||
document.getElementById(ftbRateId).textContent = framesToTime(fadeToBlack.remainingFrames);
|
||||
|
||||
if (fadeToBlack.isFullyBlack) {
|
||||
@@ -198,14 +196,12 @@ exports.update = function update(device, _document, updateType, data) {
|
||||
// videoModes pulled from https://github.com/nrkno/sofie-atem-connection/blob/master/src/enums/index.ts#L238
|
||||
if ([27, 26, 23, 25, 19, 13, 11, 7, 5].includes(data.settings.videoMode)) {
|
||||
timerFrameRate = 30;
|
||||
}
|
||||
if ([24, 22, 18, 16, 12, 10, 6, 4].includes(data.settings.videoMode)) {
|
||||
// 25 FPS Timers
|
||||
} else if ([24, 22, 18, 16, 12, 10, 6, 4].includes(data.settings.videoMode)) {
|
||||
timerFrameRate = 25;
|
||||
// 25fps timers
|
||||
}
|
||||
if ([21, 20, 15, 14, 9, 8].includes(data.settings.videoMode)) {
|
||||
} else if ([21, 20, 15, 14, 9, 8].includes(data.settings.videoMode)) {
|
||||
timerFrameRate = 24;
|
||||
} else {
|
||||
timerFrameRate = 30;
|
||||
}
|
||||
|
||||
if (!device.displayName) {
|
||||
|
||||
@@ -20,22 +20,6 @@ h3 {
|
||||
.atem-input {
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
/* border: 2px solid;
|
||||
border-color: #bcbcbc;
|
||||
border-radius: 3px; */
|
||||
/* margin: 2px; */
|
||||
|
||||
/* background: rgb(250, 250, 249);
|
||||
background: radial-gradient(
|
||||
circle,
|
||||
rgba(250, 250, 249, 1) 0%,
|
||||
rgba(249, 249, 249, 1) 54%,
|
||||
rgba(203, 203, 203, 1) 66%,
|
||||
rgba(234, 235, 235, 1) 78%,
|
||||
rgba(209, 212, 212, 1) 86%,
|
||||
rgba(224, 224, 224, 1) 90%,
|
||||
rgba(255, 255, 255, 1) 100%
|
||||
); */
|
||||
background-image: url('img/button_white.png');
|
||||
}
|
||||
|
||||
@@ -44,74 +28,30 @@ h3 {
|
||||
flex-wrap: wrap;
|
||||
background-color: #1f1f1f;
|
||||
border: #1a1a1a 2px solid;
|
||||
/* border-color: #1a1a1a; */
|
||||
border-radius: 8px;
|
||||
/* width: fit-content; */
|
||||
max-width: 416px;
|
||||
padding: 12px;
|
||||
/* justify-content: space-between;
|
||||
flex-direction: row; */
|
||||
}
|
||||
|
||||
.atem-red {
|
||||
/* background: rgb(255, 104, 108);
|
||||
background: radial-gradient(
|
||||
circle,
|
||||
rgba(255, 104, 108, 1) 0%,
|
||||
rgba(235, 11, 40, 1) 55%,
|
||||
rgba(255, 41, 68, 1) 69%,
|
||||
rgba(249, 24, 50, 1) 75%,
|
||||
rgba(232, 0, 26, 1) 79%,
|
||||
rgba(255, 43, 58, 1) 100%
|
||||
); */
|
||||
background-image: url('img/button_red.png');
|
||||
box-shadow: 0px 0px 10px 1px #ff0000;
|
||||
z-index: 10000;
|
||||
}
|
||||
|
||||
.atem-green {
|
||||
/* background: rgb(78, 255, 73);
|
||||
background: radial-gradient(
|
||||
circle,
|
||||
rgba(78, 255, 73, 1) 0%,
|
||||
rgba(42, 198, 34, 1) 55%,
|
||||
rgba(35, 217, 24, 1) 69%,
|
||||
rgba(22, 199, 17, 1) 75%,
|
||||
rgba(13, 208, 0, 1) 79%,
|
||||
rgba(29, 204, 14, 1) 100%
|
||||
); */
|
||||
background-image: url('img/button_green.png');
|
||||
box-shadow: 0px 0px 10px 1px #06c300;
|
||||
z-index: 10000;
|
||||
}
|
||||
|
||||
.atem-yellow {
|
||||
/* background: rgb(249, 255, 3);
|
||||
background: radial-gradient(
|
||||
circle,
|
||||
rgba(249, 255, 3, 1) 0%,
|
||||
rgba(253, 214, 14, 1) 55%,
|
||||
rgba(255, 174, 0, 1) 69%,
|
||||
rgba(253, 181, 0, 1) 75%,
|
||||
rgba(249, 197, 7, 1) 79%,
|
||||
rgba(250, 169, 9, 1) 100%
|
||||
); */
|
||||
background-image: url('img/button_yellow.png');
|
||||
box-shadow: 0px 0px 10px 1px #c7ca00;
|
||||
z-index: 10000;
|
||||
}
|
||||
|
||||
.atem-disabled {
|
||||
/* background: rgb(249, 255, 3);
|
||||
background: radial-gradient(
|
||||
circle,
|
||||
rgba(249, 255, 3, 1) 0%,
|
||||
rgba(253, 214, 14, 1) 55%,
|
||||
rgba(255, 174, 0, 1) 69%,
|
||||
rgba(253, 181, 0, 1) 75%,
|
||||
rgba(249, 197, 7, 1) 79%,
|
||||
rgba(250, 169, 9, 1) 100%
|
||||
); */
|
||||
background-image: url('img/button_off.png');
|
||||
color: #3a3a3a;
|
||||
}
|
||||
|
||||
@@ -63,7 +63,6 @@
|
||||
<div class="next-transition">
|
||||
<h3>Next Transition</h3>
|
||||
<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;">
|
||||
@@ -85,13 +84,7 @@
|
||||
<div>ON</div> <div>AIR</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
|
||||
<!-- <div>
|
||||
<div class="atem-input clear" style="height:10px"></div>
|
||||
</div> -->
|
||||
|
||||
<!-- <div class="source-wrapper no-wrap"> -->
|
||||
<div id="me-<%= meIndex %>-transition-selection-1" class="atem-input">
|
||||
<div class="source-label">BKGD</div>
|
||||
</div>
|
||||
@@ -107,14 +100,12 @@
|
||||
<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 class="transition-style">
|
||||
<h3>Transition Style</h3>
|
||||
<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>
|
||||
@@ -130,13 +121,6 @@
|
||||
<div id="me-<%= meIndex %>-transition-style-3" class="atem-input">
|
||||
<div class="source-label">DVE</div>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
|
||||
<!-- <div>
|
||||
<div class="atem-input clear" style="height:10px"></div>
|
||||
</div> -->
|
||||
|
||||
<!-- <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>
|
||||
@@ -153,7 +137,6 @@
|
||||
<div class="atem-gray rate-heading">Rate</div>
|
||||
<div id="me-<%= meIndex %>-transition-rate" class="transition-rate-label"> </div>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user