Skip to content

Commit 1a6a90b

Browse files
brunostjohnbrunostjohn
committed
edits
1 parent d877aac commit 1a6a90b

File tree

24 files changed

+705
-353
lines changed

24 files changed

+705
-353
lines changed

‎app.config.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
{"defaultThemePath":"C:\\Users\\bruno\\Documents\\GitHub\\capellix-lcd\\themes\\notzxt_2\\theme.js","fps":25,"renderAtStartup":false,"startMinimised":false,"startAtLogin":false,"showWarningAlert":true}
1+
{"defaultThemePath":"C:\\Users\\bruno\\Documents\\GitHub\\capellix-lcd\\themes\\notzxt_2\\theme.js","fps":25,"renderAtStartup":false,"startMinimised":false,"startAtLogin":false,"showWarningAlert":true,"rotation":0}

‎assets/scripts/device.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
window.addEventListener("load", (event) => {
22
window.electronAPI.requestDeviceInfo();
3+
changeFPSThing();
34
});
45

56
window.electronAPI.receiveDeviceInfo((_event, value) => {
@@ -12,3 +13,9 @@ window.electronAPI.receiveDeviceInfo((_event, value) => {
1213
const name = document.getElementById("title");
1314
name.textContent = value.deviceName;
1415
});
16+
17+
function changeFPSThing() {
18+
const slideyThing = document.getElementById("fpsInput");
19+
const labelThing = document.getElementById("fpsLabel");
20+
labelThing.textContent = "Current value: " + slideyThing.value;
21+
}

‎assets/scripts/renderer.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,7 @@ apply.addEventListener("click", () => {
101101
}
102102
});
103103
window.electronAPI.parametersSendback(parameters);
104-
104+
lasttime = Date.now();
105105
window.location.reload();
106106
}
107107
});
@@ -131,7 +131,7 @@ reset.addEventListener("click", () => {
131131
}
132132
});
133133
window.electronAPI.parametersSendback(parameters);
134-
134+
lasttimevol2 = Date.now();
135135
window.location.reload();
136136
}
137137
});

‎assets/styles/device.css

Lines changed: 31 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -28,27 +28,13 @@ html {
2828
border-radius: 20px;
2929
}
3030

31-
#maindiv {
32-
height: 100%;
33-
min-height: 100%;
34-
}
35-
36-
.col-container {
37-
display: table;
38-
width: 100%;
39-
min-height: 100%;
40-
height: 100%;
41-
position: absolute;
42-
top: 0;
43-
bottom: 0;
44-
left: 0;
45-
right: 0;
46-
}
47-
48-
.col {
49-
display: table-cell;
50-
min-height: 100%;
51-
height: 100%;
31+
#literallyEverything {
32+
/* height: 100%;
33+
min-height: 100%; */
34+
margin-top: 5.5rem;
35+
margin-bottom: 1rem;
36+
margin-left: 4rem;
37+
margin-right: 4rem;
5238
}
5339

5440
.sensorPicker {
@@ -64,41 +50,38 @@ html {
6450
margin-right: 0px;
6551
}
6652

67-
#smaller {
68-
max-width: 30%;
69-
width: 30%;
70-
outline-style: solid;
71-
outline-width: 1px;
72-
outline-color: var(--bs-secondary-bg);
73-
text-align: center;
74-
vertical-align: middle;
75-
}
76-
77-
#larger {
78-
max-width: 70%;
79-
width: 70%;
80-
}
81-
82-
.card {
83-
margin: 10px;
84-
}
85-
8653
#preview {
87-
margin: 3px;
54+
/* margin: 3px;
8855
margin-top: 6px;
89-
max-width: 15rem;
90-
max-height: 15rem;
9156
margin-left: auto;
9257
margin-right: auto;
93-
display: block;
94-
}
95-
96-
h2 {
97-
text-align: right;
58+
display: block; */
59+
max-width: 9rem;
60+
max-height: 9rem;
61+
float: right;
9862
}
9963

10064
.full .clr-field button {
10165
width: 100%;
10266
height: 100%;
10367
border-radius: 5px;
10468
}
69+
70+
#brightness {
71+
margin-bottom: 8px;
72+
}
73+
74+
#fpsInput {
75+
max-width: 30rem;
76+
}
77+
78+
#fpsControls {
79+
display: flex;
80+
flex-direction: column;
81+
}
82+
83+
#applyFps {
84+
margin-bottom: 5px;
85+
margin: 0 0;
86+
max-width: 4.4rem;
87+
}

‎assets/ui/device.html

Lines changed: 37 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -35,47 +35,47 @@
3535
</div>
3636
</div>
3737

38-
<div class="col-container">
39-
<div class="col" id="larger">
40-
<div id="scrollContainer">
41-
<h1>Device options</h1>
38+
<div id="literallyEverything">
39+
<div id="coolerImg">
40+
<img id="preview" src="" />
41+
</div>
42+
<h2 id="title">Your LCD</h2>
43+
<p id="title"></p>
44+
<p id="vid">Vendor ID: </p>
45+
<p id="pid">Product ID: </p>
46+
<form id="parameterContainer">
47+
<div id="rotate">
4248
<hr />
43-
<h2>IDs</h2>
44-
<p id="vid">Vendor ID: </p>
45-
<p id="pid">Product ID: </p>
46-
<div id="parameters">
47-
<hr id="separator"/>
48-
<h2>Settings</h2>
49-
<form id="parameterContainer">
50-
<div id="brightness">
51-
<h3>Brightness</h3>
52-
<div class="btn-group" role="group">
53-
<button type="button" class="btn btn-outline-secondary">Darker (-)</button>
54-
<button type="button" class="btn btn-outline-primary">Brighter (+)</button>
55-
</div>
56-
</div>
57-
<div id="hardwareImage">
58-
<h3>Set hardware image</h3>
59-
</div>
60-
</form>
61-
<div class="btn-group">
62-
<button type="button" class="btn btn-primary" id="apply">Apply</button>
63-
</div>
49+
<h3>Rotate</h3>
50+
<div class="btn-group" role="group">
51+
<button type="button" class="btn btn-outline-secondary" onclick="window.electronAPI.rotateLeft()">&#8592;Left</button>
52+
<button type="button" class="btn btn-outline-primary" onclick="window.electronAPI.rotateRight()">Right&#8594;</button>
6453
</div>
6554
</div>
66-
</div>
67-
<div class="col" id="smaller">
68-
<div id="rendering">
69-
<div class="card">
70-
<img src="" class="card-img-top" id="preview" />
71-
<div class="card-body">
72-
<h5 class="card-title" id="title">
73-
Device Name
74-
</h5>
75-
</div>
76-
</div>
55+
<div id="brightness" style="visibility: hidden;">
56+
<h3>Brightness</h3>
57+
<div class="btn-group" role="group">
58+
<button type="button" class="btn btn-outline-secondary">Darker (-)</button>
59+
<button type="button" class="btn btn-outline-primary">Brighter (+)</button>
60+
</div>
61+
<hr />
7762
</div>
78-
</div>
63+
<div id="fpsControls" style="visibility: hidden;">
64+
<h3>FPS</h3>
65+
<input type="range" class="form-range" min="1" max="30" step="1" value="25" id="fpsInput" oninput="changeFPSThing()" />
66+
<label for="fpsInput" class="form-label" id="fpsLabel">
67+
Current value:
68+
</label>
69+
<button type="button" class="btn btn-outline-primary" id="applyFps">Apply</button>
70+
<hr />
71+
</div>
72+
<div id="hardwareImage" style="visibility: hidden;">
73+
<h3>Set hardware image</h3>
74+
<div class="btn-group">
75+
<button type="button" class="btn btn-outline-primary" id="apply">Apply</button>
76+
</div>
77+
</div>
78+
</form>
7979
</div>
8080

8181
<script src="../scripts/device.js"></script>

‎devices-src/capellix/resources/device.manifest.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ module.exports = {
66
width: 480,
77
height: 480,
88
maxFps: 30,
9-
supportsStaticHardwareImage: true,
10-
supportHardwareGif: true,
11-
supportBrightnessControl: true,
9+
supportsStaticHardwareImage: false,
10+
supportHardwareGif: false,
11+
supportBrightnessControl: false,
1212
},
1313
};

‎devices-src/capellixv2/resources/device.manifest.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ module.exports = {
66
width: 480,
77
height: 480,
88
maxFps: 30,
9-
supportsStaticHardwareImage: true,
10-
supportHardwareGif: true,
11-
supportBrightnessControl: true,
9+
supportsStaticHardwareImage: false,
10+
supportHardwareGif: false,
11+
supportBrightnessControl: false,
1212
},
1313
};

‎libraries/preload.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,4 +40,6 @@ contextBridge.exposeInMainWorld("electronAPI", {
4040
minimiseWindow: () => ipcRenderer.invoke("main:minimiseWindow"),
4141
closeApp: () => ipcRenderer.invoke("main:killApp"),
4242
threeDivs: (callback) => ipcRenderer.on("themes:addAdjust", callback),
43+
rotateLeft: () => ipcRenderer.invoke("device:rotateLeft"),
44+
rotateRight: () => ipcRenderer.invoke("device:rotateRight"),
4345
});

‎libraries/renderer.js

Lines changed: 44 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
const { workerData, parentPort } = require("worker_threads");
22
const lcd = require("./display.js");
33
let themeScript = require(workerData.renderPath);
4+
const { createCanvas, Image } = require("@napi-rs/canvas");
45

56
LCD = new lcd.LCD(workerData.availableDevice.devicePlugin);
67

@@ -11,14 +12,36 @@ class Renderer {
1112
this.frametime = 1000 / workerData.fps;
1213
this.lasttime = Date.now();
1314
this.deviceState = false;
15+
this.rotation = (workerData.rotation * Math.PI) / 180;
16+
this.width = workerData.availableDevice.width;
17+
this.height = workerData.availableDevice.height;
18+
this.canvas =
19+
this.rotation != 0 || this.width != 480 || this.height != 480
20+
? createCanvas(this.width, this.height)
21+
: null;
22+
this.context =
23+
this.rotation != 0 || this.width != 480 || this.height != 480
24+
? this.canvas.getContext("2d")
25+
: null;
26+
this.toChange =
27+
this.rotation != 0 || this.width != 480 || this.height != 480
28+
? new Image()
29+
: null;
1430
}
1531

1632
startRendering() {
1733
if (!this.deviceState) {
1834
this.LCD.openDevice();
1935
this.deviceState = true;
2036
}
21-
this.timer = setInterval(this.render, this.frametime);
37+
if (this.rotation != 0) {
38+
this.context.translate(this.canvas.width / 2, this.canvas.height / 2);
39+
this.context.rotate(this.rotation);
40+
}
41+
this.timer =
42+
this.canvas == null
43+
? setInterval(this.render.bind(this), this.frametime)
44+
: setInterval(this.renderWithChanges.bind(this), this.frametime);
2245
}
2346

2447
stopRendering(shouldBeClosed) {
@@ -30,7 +53,26 @@ class Renderer {
3053
}
3154

3255
render() {
33-
LCD.sendFrame(themeScript.renderFrame());
56+
this.LCD.sendFrame(themeScript.renderFrame().toString("base64"));
57+
}
58+
59+
renderWithChanges() {
60+
this.context.clearRect(0, 0, this.width, this.height);
61+
const frame = themeScript.renderFrame();
62+
this.toChange.src = frame;
63+
if (this.rotation != 0) {
64+
this.context.drawImage(
65+
this.toChange,
66+
-this.toChange.width / 2,
67+
-this.toChange.width / 2,
68+
this.width,
69+
this.height
70+
);
71+
} else {
72+
this.context.drawImage(this.toChange, 0, 0, this.width, this.height);
73+
}
74+
const toRender = this.canvas.toBuffer("image/jpeg").toString("base64");
75+
this.LCD.sendFrame(toRender);
3476
}
3577

3678
setFramerate(framerate) {

0 commit comments

Comments
 (0)