zgaetano/BM-Camera-Control-WebUI
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

removed testing files

Browse source
This commit is contained in:
DylanSpeiser 2024-06-13 15:52:14 -07:00
parent 8b7b191c74
commit 661a6a4065
8 changed files with 0 additions and 360 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
testing/.DS_Store → .DS_Store vendored
View file

Binary file not shown.

BIN
testing/Screenshot 2024-06-11 081958.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 147 KiB

BIN
testing/Screenshot 2024-06-11 082211.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 230 KiB

47
testing/api-test/index.html
View file

@ -1,47 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>JavaScript API Test</title>
</head>
<body onload="onBodyLoad()">
<!-- Header -->
<header>
<h1>JavaScript AJAX API Testing Page</h1>
<h3>For Blackmagic Camera Control, by Dylan Speiser</h3>
<span><a id="documentationLink" href="#" target="_blank">YAML Documentation</a></span>
<span><a id="mediaManagerLink" href="#" target="_blank">Web Media Manager</a></span>
</header>
<br>
<!-- Request Form -->
<form id="requestForm">
<!-- Request type radio -->
<input type="radio" id="requestTypeGET" value="GET" name="requestType" checked>
<label for="requestTypeGET">GET</label>
<input type="radio" id="requestTypePUT" value="PUT" name="requestType">
<label for="requestTypePUT">PUT</label>
<!-- Request Endpoint -->
<input type="text" id="queryName" value="/system">
<input type="text" id="queryBody" value="">
<!-- Send Request Button -->
<button type="button" onclick="sendButtonPressed()">Send Request</button>
</form>
<br>
<!-- Iris Slider -->
<div class="sliderContainer">
<p>Iris Control: <span id="currentIrisNumber">8.0</span></p>
<span id="irisRangeMinLabel">0.0</span>
<input type="range" min="0.0" max="1.0" step="0.001" value="0.5" id="irisRange" onmouseup="irisInputHandler()" ontouchend="irisInputHandler()">
<span id="irisRangeMaxLabel">100.0</span>
</div>
<p id="responseTextParagraph">Response should show up here</p>
<script src="script.js"></script>
</body>
</html>

108
testing/api-test/script.js
View file

@ -1,108 +0,0 @@
var CameraAddress = "http://Studio-Camera-6K-Pro.local"
var CameraAPIAddress = CameraAddress+"/control/api/v1"
var Camera = {
"maximumAperture": 100.0,
"minimumAperture": 0.0
}
function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
function getIrisBounds() {
// First we get the maximum aperture of the lens
var requestBody = {"apertureStop": 100.0};
sendRequest("PUT",CameraAPIAddress+"/lens/iris",JSON.stringify(requestBody));
sleep(1000).then(() =>
sendRequest("GET",CameraAPIAddress+"/lens/iris").then(function(value) {
Camera.maximumAperture = parseFloat(value.apertureStop);
})
);
// Then we get the minimum aperture of the lens
requestBody = {"apertureStop": 0.0};
sleep(1500).then(() =>
sendRequest("PUT",CameraAPIAddress+"/lens/iris",JSON.stringify(requestBody))
);
sleep(2500).then(() =>
sendRequest("GET",CameraAPIAddress+"/lens/iris").then(function(value) {
Camera.minimumAperture = parseFloat(value.apertureStop);
})
);
sleep(3000).then(() => {
var irisRangeSlider = document.getElementById("irisRange");
irisRangeSlider.value = 0.0;
upadteIrisTextLabels();
});
}
function sendButtonPressed() {
const requestRadioGET = document.getElementById("requestTypeGET");
const requestEndpointText = document.getElementById("queryName").value;
const requestMethod = (requestRadioGET.checked ? "GET" : "PUT");
const requestURL = CameraAPIAddress+requestEndpointText;
const requestData = document.getElementById("queryBody").value;
console.log("Method: ",requestMethod);
console.log("URL: ",requestURL);
console.log("Data: ",requestData);
sendRequest(requestMethod,requestURL,requestData);
};
async function sendRequest(method, url, data) {
const xhttp = new XMLHttpRequest();
var responseObject;
xhttp.onload = function() {
if (this.responseText) {
document.getElementById("responseTextParagraph").innerHTML = this.responseText;
responseObject = JSON.parse(this.responseText);
} else {
document.getElementById("responseTextParagraph").innerHTML = this.statusText;
responseObject = {"status": this.statusText};
}
}
xhttp.open(method, url, false);
xhttp.send(data);
return responseObject;
}
function onBodyLoad() {
document.getElementById("documentationLink").href = CameraAddress+"/control/documentation.html";
document.getElementById("mediaManagerLink").href = CameraAddress;
getIrisBounds();
}
function irisInputHandler() {
// Get HTML Elements
var irisSliderValue = parseFloat(document.getElementById("irisRange").value);
// Set up request body
var requestBody = {"normalised": irisSliderValue};
// Update text labels
upadteIrisTextLabels();
// Send request
sendRequest("PUT",CameraAPIAddress+"/lens/iris",JSON.stringify(requestBody));
}
function upadteIrisTextLabels() {
var irisDisplayText = document.getElementById("currentIrisNumber");
var irisSliderValue = parseFloat(document.getElementById("irisRange").value);
var apertureStop = irisSliderValue;
irisDisplayText.innerHTML = parseFloat(Camera.minimumAperture + (apertureStop*(Camera.maximumAperture-Camera.minimumAperture))).toFixed(1);
document.getElementById("irisRangeMinLabel").innerHTML = Camera.minimumAperture.toFixed(1);
document.getElementById("irisRangeMaxLabel").innerHTML = Camera.maximumAperture.toFixed(1);
}

45
testing/ping-test/index.html
View file

@ -1,45 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>JS Ping Widget Test</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+Display:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>JS Ping Widget Test</h1>
<div id="pingWidget">
<span id="statusCircle">⬤</span>
<span id="hostname">hostname</span>
<span class="pingTime" id="pingTimeNumber">XX</span>
<span class="pingTime">&nbsp; ms</span>
</div>
<div id="outputDiv"></div>
<script>
let hostname = "8.8.8.8";
let statusCircleText = document.getElementById("statusCircle");
let pingTimeText = document.getElementById("pingTimeNumber");
let hostnameText = document.getElementById("hostname");
// Simulate pings for now. ICMP ping doesn't seem to be possible in JS. Will have to check status codes of regular API calls.
let intervalID = setInterval(pingEverySecond, 1000);
function pingEverySecond() {
hostnameText.innerHTML = hostname;
pingTimeText.innerHTML = Math.floor(Math.random()*50);
if (parseInt(pingTimeText.innerHTML) < 25) {
statusCircleText.setAttribute("style","color: green");
} else {
statusCircleText.setAttribute("style","color: red");
}
}
</script>
</body>
</html>

34
testing/ping-test/style.css
View file

@ -1,34 +0,0 @@
html {
height: 100%;
margin: 0;
font-family: "Noto Sans Display", sans-serif;
font-optical-sizing: auto;
font-weight: 300;
font-style: normal;
font-variation-settings: "wdth" 100;
background-color: rgb(36, 36, 36);
color: white;
}
body {
margin: 2em;
}
h1 {
display: inline-flex;
margin: 0px;
}
#pingWidget {
display: inline-flex;
margin: 0px 0px 15px 0px;
float: right;
}
#pingWidget #hostname {
padding: 0px 1em;
}
#pingWidget .pingTime {
color: grey;
}

126
testing/tab-ui-test/index.html
View file

@ -1,126 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+Display:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
<style>
* {
box-sizing: border-box
}
/* Set height of body and the document to 100% */
html {
height: 100%;
margin: 0;
font-family: "Noto Sans Display", sans-serif;
font-optical-sizing: auto;
font-weight: 300;
font-style: normal;
font-variation-settings:
"wdth" 100;
}
button {
font-family: "Noto Sans Display", sans-serif;
font-optical-sizing: auto;
font-weight: 300;
font-style: normal;
font-variation-settings:
"wdth" 100;
}
/* Style tab links */
.tablink {
background-color: #555;
color: white;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
font-size: 17px;
width: 25%;
}
.tablink:hover {
background-color: #777;
}
/* Style the tab content (and add height:100% for full page content) */
.tabcontent {
color: white;
display: none;
padding: 100px 20px;
height: 100%;
}
#Home {
background-color: red;
}
#News {
background-color: green;
}
#Contact {
background-color: blue;
}
#About {
background-color: orange;
}
</style>
</head>
<body>
<button class="tablink" onclick="openPage('Home', this, 'red')">Home</button>
<button class="tablink" onclick="openPage('News', this, 'green')" id="defaultOpen">News</button>
<button class="tablink" onclick="openPage('Contact', this, 'blue')">Contact</button>
<button class="tablink" onclick="openPage('About', this, 'orange')">About</button>
<div id="Home" class="tabcontent">
<h3>Home</h3>
<p>Home is where the heart is..</p>
</div>
<div id="News" class="tabcontent">
<h3>News</h3>
<p>Some news this fine day!</p>
</div>
<div id="Contact" class="tabcontent">
<h3>Contact</h3>
<p>Get in touch, or swing by for a cup of coffee.</p>
</div>
<div id="About" class="tabcontent">
<h3>About</h3>
<p>Who we are and what we do.</p>
</div>
<script>
function openPage(pageName, elmnt, color) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablink");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].style.backgroundColor = "";
}
document.getElementById(pageName).style.display = "block";
elmnt.style.backgroundColor = color;
}
// Get the element with id="defaultOpen" and click on it
document.getElementById("defaultOpen").click();
</script>
</body>
</html>