Merge all work on server with filmout features #77

Merged
mattmcw merged 12 commits from server into main 2023-02-26 02:16:29 +00:00
13 changed files with 83 additions and 22 deletions
Showing only changes of commit 8e35596088 - Show all commits

View File

@ -1,5 +1,5 @@
{ {
"version": "1.7.15", "version": "1.7.16",
"ext_port": 1111, "ext_port": 1111,
"profiles": { "profiles": {
"mcopy": { "mcopy": {

View File

@ -15,7 +15,13 @@
} }
body.meter #img, body.meter #img,
body.meter #can { body.meter #can {
display : none; display: none;
}
body.image #can{
display: none;
}
body.image #img {
display: block;
} }
#img { #img {
position: absolute; position: absolute;
@ -59,6 +65,7 @@
let img = document.getElementById('img') let img = document.getElementById('img')
let body = document.querySelector('body') let body = document.querySelector('body')
body.className = '' body.className = ''
body.classList.add('image')
imgTmp.onload = function () { imgTmp.onload = function () {
img.style.backgroundImage = `url('${src}')`; img.style.backgroundImage = `url('${src}')`;
return resolve(src); return resolve(src);

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,8 @@
/**
* Delay in an async/await function
*
* @param {integer} ms Milliseconds to delay for
*
* @returns {Promise} Promise to resolve after timeout
**/
declare function delay(ms: number): Promise<unknown>;

2
app/package-lock.json generated
View File

@ -1,6 +1,6 @@
{ {
"name": "mcopy-app", "name": "mcopy-app",
"version": "1.7.15", "version": "1.7.16",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {

View File

@ -1,6 +1,6 @@
{ {
"name": "mcopy-app", "name": "mcopy-app",
"version": "1.7.15", "version": "1.7.16",
"description": "GUI for the mcopy small gauge film optical printer platform", "description": "GUI for the mcopy small gauge film optical printer platform",
"main": "main.js", "main": "main.js",
"scripts": { "scripts": {

View File

@ -4,8 +4,9 @@
html, body{ background: #000; padding: 0; margin: 0; width: 100vw; height: 100vh; overflow: hidden; } html, body{ background: #000; padding: 0; margin: 0; width: 100vw; height: 100vh; overflow: hidden; }
body.meter { background: rgb(117, 117, 117); } body.meter { background: rgb(117, 117, 117); }
body.blank { background: #000; } body.blank { background: #000; }
body.blank #img, body.blank #can, body.meter #img, body.meter #can { display: none; } body.blank #img, body.blank #can, body.meter #img, body.meter #can, body.image #can { display: none; }
#nosleep { color: #fff; margin: 50px auto } body.image #img, #can.show { display: block; }
#nosleep { color: #fff; margin: 50px auto; text-align: center; }
#img { #img {
position: absolute; position: absolute;
background-repeat:no-repeat; background-repeat:no-repeat;
@ -25,11 +26,8 @@
top: 50%; top: 50%;
transform: translate(-50%,-50%); transform: translate(-50%,-50%);
} }
#can.show{
display: block;
}
</style> </style>
<div id="nosleep">Click to prevent sleep</div> <div id="nosleep">Click to full screen and prevent sleep</div>
<div id="img"> <div id="img">
</div> </div>
<canvas id="can"> <canvas id="can">

View File

@ -14,7 +14,7 @@ interface McopyResponse {
id : string; id : string;
} }
const ws = new WebSocket('ws://localhost:{{PORT}}/'); const ws = new WebSocket(`ws://${location.host.split(':')[0]}:{{PORT}}/`);
let imgTmp : HTMLImageElement let imgTmp : HTMLImageElement
function preventSleep () { function preventSleep () {
@ -22,17 +22,41 @@ function preventSleep () {
var noSleep = new NoSleep(); var noSleep = new NoSleep();
document.addEventListener('click', function enableNoSleep() { document.addEventListener('click', function enableNoSleep() {
document.removeEventListener('click', enableNoSleep, false); document.removeEventListener('click', enableNoSleep, false);
document.getElementById('nosleep').remove();
noSleep.enable(); noSleep.enable();
document.getElementById('nosleep').remove();
}, false); }, false);
} }
function fullScreen () {
document.addEventListener('click', function enableFullScreen() {
const elem = document.querySelector('body');
document.removeEventListener('click', enableFullScreen, false);
if (elem.requestFullscreen) {
elem.requestFullscreen();
//@ts-ignore
} else if (typeof elem.webkitRequestFullscreen !== 'undefined') { /* Safari */
//@ts-ignore
elem.webkitRequestFullscreen();
//@ts-ignore
} else if (typeof elem.msRequestFullscreen !== 'undefined') { /* IE11 */
//@ts-ignore
elem.msRequestFullscreen();
}
}, false);
}
function displayMode () {
fullScreen();
preventSleep();
}
async function setImage (src : string) { async function setImage (src : string) {
return new Promise(async (resolve : Function, reject : Function) => { return new Promise(async (resolve : Function, reject : Function) => {
imgTmp = new Image() imgTmp = new Image()
let img = document.getElementById('img') let img = document.getElementById('img')
let body = document.querySelector('body') let body = document.querySelector('body')
body.className = '' body.className = ''
body.classList.add('image')
imgTmp.onload = function () { imgTmp.onload = function () {
img.style.backgroundImage = `url('${src}')`; img.style.backgroundImage = `url('${src}')`;
return resolve(src) return resolve(src)
@ -243,5 +267,5 @@ ws.onclose = async (event : any) => {
}; };
(function main () { (function main () {
preventSleep(); displayMode();
})() })()

View File

@ -1,5 +1,5 @@
{ {
"version": "1.7.15", "version": "1.7.16",
"ext_port": 1111, "ext_port": 1111,
"profiles": { "profiles": {
"mcopy": { "mcopy": {

4
package-lock.json generated
View File

@ -1,12 +1,12 @@
{ {
"name": "mcopy", "name": "mcopy",
"version": "1.7.15", "version": "1.7.16",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "mcopy", "name": "mcopy",
"version": "1.7.15", "version": "1.7.16",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"arduino": "file:app/lib/arduino", "arduino": "file:app/lib/arduino",

View File

@ -1,6 +1,6 @@
{ {
"name": "mcopy", "name": "mcopy",
"version": "1.7.15", "version": "1.7.16",
"description": "Small gauge film optical printer platform", "description": "Small gauge film optical printer platform",
"main": "build.js", "main": "build.js",
"directories": { "directories": {

View File

@ -1,5 +1,5 @@
{ {
"version": "1.7.15", "version": "1.7.16",
"ext_port": 1111, "ext_port": 1111,
"profiles": { "profiles": {
"mcopy": { "mcopy": {