16mm
/
mcopy
1
0
Fork 0
Code Issues 14 Pull Requests Projects 2 Releases 13 Wiki Activity
mcopy/app/display.html

202 lines
4.9 KiB
HTML
Raw Normal View History

Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
<!doctype html>
<html>
<head>
<title>display</title>
<style>
body{
background: #000;
padding: 0;
margin: 0;
max-width: 100%;
max-height: 100vh;
}
body.meter {
background: rgb(117, 117, 117);
}
#img {
position: absolute;
/*background-image: url(".../img/background.jpg");*/
background-repeat:no-repeat;
background-size: contain;
background-position: center;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
#can{
margin: 0;
background: #fff;
display: none;
position: fixed;
left: 0;
top: 0;
}
#can.show{
display: block;
}
</style>
</head>
<body>
<div id="img">
</div>
<canvas id="can">
</canvas>
<script>
'use strict';
const { remote, ipcRenderer } = require('electron')
async function setImage (src) {
return new Promise(async (resolve, reject) => {
//let img = new Image()
let img = document.getElementById('img')
let body = document.querySelector('body')
if (body.classList.contains('meter')) {
body.classList.remove('meter')
}
img.style.backgroundImage = `url('${src}')`;
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
});
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
}
Display will now show a meter screen (middle grey) when instructed. Not wired to anything, got distracted by the re-naming shenanigans.
2019-06-18 19:47:17 +00:00
async function onMeter () {
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
console.log('meter')
Display will now show a meter screen (middle grey) when instructed. Not wired to anything, got distracted by the re-naming shenanigans.
2019-06-18 19:47:17 +00:00
const body = document.querySelector('body')
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
if (!body.classList.contains('meter')) {
body.classList.add('meter')
}
}
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
async function onFocus () {
console.log('focus')
const can = document.getElementById('can')
const dpr = window.devicePixelRatio || 1
let ctx;
if (!can.classList.contains('show')) {
can.classList.add('show')
}
can.width = window.innerWidth * dpr
can.height = window.innerHeight * dpr
can.style.width = `${window.innerWidth}px`
can.style.height = `${window.innerHeight}px`
ctx = can.getContext('2d')
ctx.scale(dpr, dpr)
try{
await drawFocus(can, ctx)
} catch (err) {
alert(JSON.stringify(err))
}
}
async function drawFocus (can, ctx) {
const count = 20
const half = Math.round(count / 2)
const dpr = window.devicePixelRatio || 1
const w = can.width / dpr
const h = can.height / dpr
const opp = (Math.tan(360 / count) * ((h / 2) + h - w) / 1.5)
console.log(opp)
for (let i = 0; i < count; i++) {
ctx.beginPath()
ctx.moveTo(w / 2, h / 2)
ctx.lineTo((w / 2) + opp, h - w)
ctx.lineTo((w / 2) - opp, h - w)
ctx.fill()
ctx.translate(w / 2, h / 2);
ctx.rotate((360 / count) * Math.PI / 180)
ctx.translate(- w / 2, -h / 2)
}
}
Display will now show a meter screen (middle grey) when instructed. Not wired to anything, got distracted by the re-naming shenanigans.
2019-06-18 19:47:17 +00:00
async function onField () {
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
console.log('field guide')
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
const can = document.getElementById('can')
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
const dpr = window.devicePixelRatio || 1
let ctx;
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
if (!can.classList.contains('show')) {
can.classList.add('show')
}
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
can.width = window.innerWidth * dpr
can.height = window.innerHeight * dpr
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
can.style.width = `${window.innerWidth}px`
can.style.height = `${window.innerHeight}px`
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
ctx = can.getContext('2d')
ctx.scale(dpr, dpr)
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
try{
Display will now show a meter screen (middle grey) when instructed. Not wired to anything, got distracted by the re-naming shenanigans.
2019-06-18 19:47:17 +00:00
await drawField(can, ctx)
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
} catch (err) {
alert(JSON.stringify(err))
}
}
Display will now show a meter screen (middle grey) when instructed. Not wired to anything, got distracted by the re-naming shenanigans.
2019-06-18 19:47:17 +00:00
// draw a field guide
async function drawField (can, ctx) {
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
const count = 20
const half = Math.round(count / 2)
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
const dpr = window.devicePixelRatio || 1
const w = can.width / dpr
const h = can.height / dpr
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
const wsec = w / count
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
const hsec = h / count
const spacer = 12
const fontSize = 18;
Display will now show a meter screen (middle grey) when instructed. Not wired to anything, got distracted by the re-naming shenanigans.
2019-06-18 19:47:17 +00:00
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
ctx.moveTo(w / 2, 0)
ctx.lineTo(w / 2, h)
ctx.stroke()
ctx.moveTo(0, h / 2)
ctx.lineTo(w, h / 2)
ctx.stroke()
Display will now show a meter screen (middle grey) when instructed. Not wired to anything, got distracted by the re-naming shenanigans.
2019-06-18 19:47:17 +00:00
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
for (let i = 0; i < count; i++) {
ctx.moveTo(wsec * i, hsec * i)
ctx.lineTo(wsec * i, h - (hsec * i))
ctx.stroke()
ctx.moveTo(wsec * i, hsec * i)
ctx.lineTo(w - (wsec * i), hsec * i)
ctx.stroke()
}
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
ctx.font = `${fontSize}px Arial`
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
for (let i = 0; i < half; i++) {
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
ctx.fillText(`${(half - i)}`, (wsec * i) + spacer, (h / 2) - spacer)
//ctx.fillText(`${(half - i)}`, (w - (wsec * i)) - spacer, (h / 2) - spacer)
ctx.fillText(`${(half - i)}`, (w / 2) + spacer, (hsec * i) + spacer + (fontSize / 2) )
//ctx.fillText(`${(half - i)}`, (w / 2) + spacer, (h - (hsec * i)) - spacer)
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
}
}
async function onDigital (event, arg) {
if (arg.src) {
try {
await setImage(arg.src)
} catch (err) {
console.error(err)
}
}
return event.returnValue = true
}
async function onEscape (evt) {
let isEscape = false
let win
evt = evt || window.event
if ('key' in evt) {
isEscape = (evt.key == 'Escape' || evt.key == 'Esc')
} else {
isEscape = (evt.keyCode == 27)
}
if (isEscape) {
win = remote.getCurrentWindow()
win.close()
}
}
ipcRenderer.on('display', onDigital)
Display will now show a meter screen (middle grey) when instructed. Not wired to anything, got distracted by the re-naming shenanigans.
2019-06-18 19:47:17 +00:00
ipcRenderer.on('field', onField)
ipcRenderer.on('meter', onMeter)
Fixed frame counting optimization, resolving issue #17. Also added a Siemens Star focusing screen, a middle gray metering screen and a field guide screen for use with the filmout feature. TODO: actually change monitors when selected.
2019-06-25 16:13:15 +00:00
ipcRenderer.on('focus', onFocus)
Add new display and capture modules. Don't need new capture module rn.
2019-02-08 18:16:42 +00:00
document.onkeydown = onEscape
</script>
</body>
</html>