haha svelte je dobry
2
ui/.gitignore
vendored
|
|
@ -1,2 +1,4 @@
|
||||||
node_modules
|
node_modules
|
||||||
out/
|
out/
|
||||||
|
vars.json
|
||||||
|
.svelte-kit
|
||||||
46
ui/Vars.js
|
|
@ -1,46 +0,0 @@
|
||||||
|
|
||||||
//Paths
|
|
||||||
var AsphyxiaPath = "C:\\Users\\kryvas\\Downloads\\asphyxia-core-win-x64\\asphyxia.exe"
|
|
||||||
var GamePath1 = "C:\\sdvx\\spice2.lnk"
|
|
||||||
var GamePath2 = ""
|
|
||||||
var GamePath3 = ""
|
|
||||||
var GamePath4 = ""
|
|
||||||
var GamePath5 = ""
|
|
||||||
var GamePath6 = ""
|
|
||||||
|
|
||||||
//exes
|
|
||||||
var browser = "brave.exe"
|
|
||||||
var GameExe1 = "spice.exe"
|
|
||||||
var GameExe2 = ""
|
|
||||||
var GameExe3 = ""
|
|
||||||
var GameExe4 = ""
|
|
||||||
var GameExe5 = ""
|
|
||||||
var GameExe6 = ""
|
|
||||||
|
|
||||||
//Keys
|
|
||||||
var KeyUp = "KeyW"
|
|
||||||
var KeyDown = "KeyS"
|
|
||||||
var KeyLeft = "KeyA"
|
|
||||||
var KeyRight = "KeyD"
|
|
||||||
var KeyStart = "KeyE"
|
|
||||||
var ExitKey1 = "G" // Only add uppercase name of the key without "Key" part example: "KeyA" becomes "A"
|
|
||||||
var ExitKey2 = "H" // Only add uppercase name of the key without "Key" part example: "KeyA" becomes "A"
|
|
||||||
|
|
||||||
//Game Icons
|
|
||||||
var ImgPath1 = "JPGS/sound-voltex-iii-gravity-wars-1.png"
|
|
||||||
var ImgPath2 = "JPGS/maxresdefault3.jpg"
|
|
||||||
var ImgPath3 = "JPGS/SDVX5scaled.jpg"
|
|
||||||
var ImgPath4 = "JPGS/exceed gear.jpg"
|
|
||||||
var ImgPath5 = ""
|
|
||||||
var ImgPath6 = ""
|
|
||||||
|
|
||||||
// Game Titles
|
|
||||||
var Title1 = "Sound Voltex III: Gravity Wars"
|
|
||||||
var Title2 = "Sound Voltex IV: Heavenly Haven"
|
|
||||||
var Title3 = "Sound Voltex V: Vivid Wave"
|
|
||||||
var Title4 = "Sound Voltex VI: Exceed GEAR"
|
|
||||||
var Title5 = "GAME1"
|
|
||||||
var Title6 = "GAME2"
|
|
||||||
|
|
||||||
if(module)
|
|
||||||
module.exports = { ExitKey1, ExitKey2, GameExe1, GameExe2, GameExe3, GameExe4, GameExe5, GameExe6 };
|
|
||||||
201
ui/index.html
|
|
@ -1,201 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<link rel="stylesheet" href="style.css" />
|
|
||||||
<title>UI</title>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<script src="Vars.js"></script>
|
|
||||||
<!--Loadne Vars.js-->
|
|
||||||
|
|
||||||
<div class="hlavnidiv">
|
|
||||||
<div class="container">
|
|
||||||
<button
|
|
||||||
class="move"
|
|
||||||
type="button"
|
|
||||||
id="sdvx3-button"
|
|
||||||
onclick="vers=1;sdvx()"
|
|
||||||
>
|
|
||||||
<!-- on click sets var vers to number and then runs sdvx which is just switch for
|
|
||||||
game path select-->
|
|
||||||
<img id="img1" src="" alt="" />
|
|
||||||
<h1 class="sex" id="title1"></h1>
|
|
||||||
</button>
|
|
||||||
<!--SDVX3-->
|
|
||||||
<button
|
|
||||||
class="move"
|
|
||||||
type="button"
|
|
||||||
id="sdvx4-button"
|
|
||||||
onclick="vers=2;sdvx()"
|
|
||||||
>
|
|
||||||
<img id="img2" src="" alt="" />
|
|
||||||
<h1 class="sex" id="title2"></h1>
|
|
||||||
</button>
|
|
||||||
<!--SDVX4-->
|
|
||||||
<button
|
|
||||||
class="move"
|
|
||||||
type="button"
|
|
||||||
id="sdvx5-button"
|
|
||||||
onclick="vers=3;sdvx()"
|
|
||||||
>
|
|
||||||
<img id="img3" src="" alt="" />
|
|
||||||
<h1 class="sex" id="title3"></h1>
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="move"
|
|
||||||
type="button"
|
|
||||||
id="sdvx6-button"
|
|
||||||
onclick="vers=4;sdvx()"
|
|
||||||
>
|
|
||||||
<img id="img4" src="" alt="" />
|
|
||||||
<h1 class="sex" id="title4"></h1>
|
|
||||||
</button>
|
|
||||||
<!--SDVX5-->
|
|
||||||
<button
|
|
||||||
class="move"
|
|
||||||
type="button"
|
|
||||||
id="sdvx7-button"
|
|
||||||
onclick="vers=7;sdvx()"
|
|
||||||
>
|
|
||||||
<img id="img5" src="" alt="" />
|
|
||||||
<h1 class="sex" id="title5"></h1>
|
|
||||||
</button>
|
|
||||||
<!--SDVX5-->
|
|
||||||
<button
|
|
||||||
class="move"
|
|
||||||
type="button"
|
|
||||||
id="sdvx6-button"
|
|
||||||
onclick="vers=8;sdvx()"
|
|
||||||
>
|
|
||||||
<img id="img6" src="" alt="" />
|
|
||||||
<h1 class="sex" id="title6"></h1>
|
|
||||||
</button>
|
|
||||||
<!--SDVX5-->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<script>
|
|
||||||
document.getElementById('img1').src = ImgPath1 //Sets Button Imgs
|
|
||||||
document.getElementById('img2').src = ImgPath2
|
|
||||||
document.getElementById('img3').src = ImgPath3
|
|
||||||
document.getElementById('img4').src = ImgPath4
|
|
||||||
document.getElementById('img5').src = ImgPath5
|
|
||||||
document.getElementById('img6').src = ImgPath6
|
|
||||||
|
|
||||||
document.getElementById('title1').innerHTML = Title1
|
|
||||||
document.getElementById('title2').innerHTML = Title2
|
|
||||||
document.getElementById('title3').innerHTML = Title3
|
|
||||||
document.getElementById('title4').innerHTML = Title4
|
|
||||||
document.getElementById('title5').innerHTML = Title5
|
|
||||||
document.getElementById('title6').innerHTML = Title6
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
const prvnihra = [...document.querySelectorAll('button')] //creates array from buttons for focus select
|
|
||||||
console.log(prvnihra[0])
|
|
||||||
prvnihra[0].focus()
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
//SFX Audio Sources
|
|
||||||
var i = 0
|
|
||||||
const switchfocus = new Audio('Audio/switchfocus.mp3')
|
|
||||||
const startaudio = new Audio('Audio/audiostart4.mp3')
|
|
||||||
/* Handles interaction with bindable buttons and focus*/
|
|
||||||
document.addEventListener('keydown', function (KeypressD) {
|
|
||||||
if (KeypressD.code === KeyRight) {
|
|
||||||
if (i >= prvnihra.length - 1) i = -1
|
|
||||||
switchfocus.play() //plays audio
|
|
||||||
i++
|
|
||||||
prvnihra[i].focus()
|
|
||||||
console.log('right', i)
|
|
||||||
console.log('array je', prvnihra.length)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
document.addEventListener('keydown', function (Keypress) {
|
|
||||||
if (Keypress.code === KeyLeft) {
|
|
||||||
switchfocus.play()
|
|
||||||
if (i <= 0) i = prvnihra.length
|
|
||||||
i--
|
|
||||||
prvnihra[i].focus()
|
|
||||||
console.log('left', i)
|
|
||||||
}
|
|
||||||
if (Keypress.code === KeyStart) {
|
|
||||||
startaudio.play()
|
|
||||||
console.log(document.activeElement)
|
|
||||||
document.activeElement.click()
|
|
||||||
}
|
|
||||||
if (Keypress.code === KeyDown && i + 3 < prvnihra.length) {
|
|
||||||
switchfocus.play()
|
|
||||||
console.log(i)
|
|
||||||
i = i + 3
|
|
||||||
prvnihra[i].focus()
|
|
||||||
}
|
|
||||||
if (Keypress.code === KeyUp && i - 3 >= 0) {
|
|
||||||
switchfocus.play()
|
|
||||||
console.log(i)
|
|
||||||
i = i - 3
|
|
||||||
prvnihra[i].focus()
|
|
||||||
}
|
|
||||||
//document.body.requestFullscreen();
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
var vers = 0
|
|
||||||
const { execFile, exec, spawn } = require('child_process')
|
|
||||||
function sdvx() {
|
|
||||||
console.log('promenna', vers)
|
|
||||||
const { ipcRenderer } = require('electron')
|
|
||||||
/* Handles Running of apps */
|
|
||||||
switch (vers) {
|
|
||||||
case 1:
|
|
||||||
execFile(AsphyxiaPath)
|
|
||||||
exec('start /b ' + GamePath1) //executes cmd with start and path
|
|
||||||
setTimeout(function () {
|
|
||||||
exec('taskkill /im ' + browser) //kills browser
|
|
||||||
}, 1200)
|
|
||||||
//console.log(vers);
|
|
||||||
ipcRenderer.send('number', vers) //sends number to main which tells main what to kill on shortcut
|
|
||||||
break
|
|
||||||
case 2:
|
|
||||||
execFile(AsphyxiaPath)
|
|
||||||
exec('start /b ' + GamePath2)
|
|
||||||
setTimeout(function () {
|
|
||||||
exec('taskkill /im ' + browser)
|
|
||||||
}, 1200)
|
|
||||||
ipcRenderer.send('number', vers)
|
|
||||||
break
|
|
||||||
case 3:
|
|
||||||
execFile(AsphyxiaPath)
|
|
||||||
exec('start /b ' + GamePath3)
|
|
||||||
setTimeout(function () {
|
|
||||||
exec('taskkill /im ' + browser)
|
|
||||||
}, 1200)
|
|
||||||
ipcRenderer.send('number', vers)
|
|
||||||
break
|
|
||||||
case 4:
|
|
||||||
execFile(AsphyxiaPath)
|
|
||||||
exec('start /b ' + GamePath4)
|
|
||||||
setTimeout(function () {
|
|
||||||
exec('taskkill /im ' + browser)
|
|
||||||
}, 1200)
|
|
||||||
ipcRenderer.send('number', vers)
|
|
||||||
break
|
|
||||||
case 5:
|
|
||||||
execFile(GamePath5)
|
|
||||||
ipcRenderer.send('number', vers)
|
|
||||||
break
|
|
||||||
case 6:
|
|
||||||
execFile(GamePath6)
|
|
||||||
ipcRenderer.send('number', vers)
|
|
||||||
default:
|
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
155
ui/main.cjs
Normal file
|
|
@ -0,0 +1,155 @@
|
||||||
|
const { app, BrowserWindow, ipcMain } = require("electron");
|
||||||
|
const { globalShortcut } = require("electron");
|
||||||
|
const path = require("path");
|
||||||
|
const vars = require("./vars.json");
|
||||||
|
const { spawn } = require("child_process");
|
||||||
|
|
||||||
|
/** @type {BrowserWindow} */
|
||||||
|
let mainWindow;
|
||||||
|
|
||||||
|
if (!app.requestSingleInstanceLock()) {
|
||||||
|
app.quit();
|
||||||
|
} else {
|
||||||
|
app.on("second-instance", (event, commandLine, workingDirectory) => {
|
||||||
|
// Someone tried to run a second instance, we should focus our window.
|
||||||
|
if (mainWindow) {
|
||||||
|
if (mainWindow.isMinimized()) mainWindow.restore();
|
||||||
|
mainWindow.focus();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const createWindow = () => {
|
||||||
|
mainWindow = new BrowserWindow({
|
||||||
|
width: 800,
|
||||||
|
height: 600,
|
||||||
|
webPreferences: {
|
||||||
|
nodeIntegration: true,
|
||||||
|
contextIsolation: false,
|
||||||
|
enableRemoteModule: true,
|
||||||
|
},
|
||||||
|
autoHideMenuBar: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (process.env.NODE_ENV !== "development") {
|
||||||
|
console.log("Production mode");
|
||||||
|
mainWindow.loadFile(path.join(__dirname, "/renderer/dist/index.html"));
|
||||||
|
} else {
|
||||||
|
console.log("Development mode");
|
||||||
|
mainWindow.loadURL("http://localhost:5173/");
|
||||||
|
mainWindow.webContents.openDevTools();
|
||||||
|
}
|
||||||
|
|
||||||
|
mainWindow.on("closed", () => {
|
||||||
|
// Dereference the window object, usually you would store windows
|
||||||
|
// in an array if your app supports multi windows, this is the time
|
||||||
|
// when you should delete the corresponding element.
|
||||||
|
mainWindow = null;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
app.whenReady().then(() => {
|
||||||
|
createWindow();
|
||||||
|
|
||||||
|
// const {
|
||||||
|
// ExitKey1,
|
||||||
|
// ExitKey2,
|
||||||
|
// GameExe1,
|
||||||
|
// GameExe2,
|
||||||
|
// GameExe3,
|
||||||
|
// GameExe4,
|
||||||
|
// GameExe5,
|
||||||
|
// GameExe6,
|
||||||
|
// } = require("./Vars.js"); //imports exitkeys from vars.js
|
||||||
|
// const { execFile, exec, spawn } = require("child_process");
|
||||||
|
// console.log(ExitKey1 + " + " + ExitKey2);
|
||||||
|
|
||||||
|
// const ret = globalShortcut.register(ExitKey1 + " + " + ExitKey2, () => {
|
||||||
|
// //makes globalshortcut from vars in vars.js
|
||||||
|
// console.log("CommandOrControl+X is pressed");
|
||||||
|
// //On shortcut kills game exe
|
||||||
|
// switch (Execounter) {
|
||||||
|
// case 1:
|
||||||
|
// exec("taskkill /im " + GameExe1);
|
||||||
|
// break;
|
||||||
|
// case 2:
|
||||||
|
// exec("taskkill /im " + GameExe2);
|
||||||
|
// break;
|
||||||
|
// case 3:
|
||||||
|
// exec("taskkill /im " + GameExe3);
|
||||||
|
// break;
|
||||||
|
// case 4:
|
||||||
|
// exec("taskkill /im " + GameExe4);
|
||||||
|
// break;
|
||||||
|
// case 5:
|
||||||
|
// exec("taskkill /im " + GameExe5);
|
||||||
|
// break;
|
||||||
|
// case 6:
|
||||||
|
// exec("taskkill /im " + GameExe6);
|
||||||
|
// break;
|
||||||
|
// default:
|
||||||
|
// break;
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
});
|
||||||
|
|
||||||
|
/** @type {null|{ id: number, process: ReturnType<spawn>, title: string }} */
|
||||||
|
let running = null;
|
||||||
|
|
||||||
|
const stop = () => {
|
||||||
|
if (running == null) return;
|
||||||
|
|
||||||
|
running.process.kill();
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
if (running) {
|
||||||
|
running.process.kill("SIGKILL");
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
|
||||||
|
mainWindow.webContents.send("game-stoping", running.id, running.title);
|
||||||
|
};
|
||||||
|
|
||||||
|
let supporting = [];
|
||||||
|
|
||||||
|
ipcMain.on("start", (event, data) => {
|
||||||
|
if (running) stop();
|
||||||
|
const game = vars.games[data];
|
||||||
|
if (!game) return event.reply("error", "Game not found");
|
||||||
|
|
||||||
|
if (game.supporting) {
|
||||||
|
for (const exe of game.supporting) {
|
||||||
|
if (supporting.includes(exe)) continue;
|
||||||
|
supporting.push(exe);
|
||||||
|
spawn(exe.path, {
|
||||||
|
windowsHide: true
|
||||||
|
});
|
||||||
|
if (exe["kill-browser"]) {
|
||||||
|
setTimeout(() => {
|
||||||
|
spawn("taskkill", ["/im", vars.browser]);
|
||||||
|
}, 1200);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
running = {
|
||||||
|
id: data,
|
||||||
|
process: spawn(game.path, game.args, {
|
||||||
|
windowsHide: true
|
||||||
|
}),
|
||||||
|
title: game.title,
|
||||||
|
};
|
||||||
|
|
||||||
|
event.reply("game-start", data, game.title);
|
||||||
|
|
||||||
|
running.process.on("close", () => {
|
||||||
|
running = null;
|
||||||
|
|
||||||
|
event.reply("game-stop", data, game.title);
|
||||||
|
});
|
||||||
|
|
||||||
|
running.process.on("error", (err) => {
|
||||||
|
console.error(err);
|
||||||
|
event.reply("game-error", err, data, game.title);
|
||||||
|
})
|
||||||
|
});
|
||||||
68
ui/main.js
|
|
@ -1,68 +0,0 @@
|
||||||
const { app, BrowserWindow, ipcMain } = require('electron')
|
|
||||||
const { globalShortcut } = require('electron')
|
|
||||||
const createWindow = () => {
|
|
||||||
ipcMain.on('number', (event, data) => {
|
|
||||||
//Reads number var from index
|
|
||||||
Execounter = 0
|
|
||||||
console.warn(data)
|
|
||||||
Execounter = data
|
|
||||||
console.warn(Execounter)
|
|
||||||
})
|
|
||||||
// Create the browser window.
|
|
||||||
mainWindow = new BrowserWindow({
|
|
||||||
width: 800,
|
|
||||||
height: 600,
|
|
||||||
webPreferences: {
|
|
||||||
nodeIntegration: true,
|
|
||||||
contextIsolation: false,
|
|
||||||
enableRemoteModule: true,
|
|
||||||
},
|
|
||||||
autoHideMenuBar: true,
|
|
||||||
})
|
|
||||||
mainWindow.loadFile('index.html') //loads index.html
|
|
||||||
}
|
|
||||||
|
|
||||||
app.whenReady().then(() => {
|
|
||||||
createWindow()
|
|
||||||
|
|
||||||
const {
|
|
||||||
ExitKey1,
|
|
||||||
ExitKey2,
|
|
||||||
GameExe1,
|
|
||||||
GameExe2,
|
|
||||||
GameExe3,
|
|
||||||
GameExe4,
|
|
||||||
GameExe5,
|
|
||||||
GameExe6,
|
|
||||||
} = require('./Vars.js') //imports exitkeys from vars.js
|
|
||||||
const { execFile, exec, spawn } = require('child_process')
|
|
||||||
console.log(ExitKey1 + ' + ' + ExitKey2)
|
|
||||||
|
|
||||||
const ret = globalShortcut.register(ExitKey1 + ' + ' + ExitKey2, () => {
|
|
||||||
//makes globalshortcut from vars in vars.js
|
|
||||||
console.log('CommandOrControl+X is pressed')
|
|
||||||
//On shortcut kills game exe
|
|
||||||
switch (Execounter) {
|
|
||||||
case 1:
|
|
||||||
exec('taskkill /im ' + GameExe1)
|
|
||||||
break
|
|
||||||
case 2:
|
|
||||||
exec('taskkill /im ' + GameExe2)
|
|
||||||
break
|
|
||||||
case 3:
|
|
||||||
exec('taskkill /im ' + GameExe3)
|
|
||||||
break
|
|
||||||
case 4:
|
|
||||||
exec('taskkill /im ' + GameExe4)
|
|
||||||
break
|
|
||||||
case 5:
|
|
||||||
exec('taskkill /im ' + GameExe5)
|
|
||||||
break
|
|
||||||
case 6:
|
|
||||||
exec('taskkill /im ' + GameExe6)
|
|
||||||
break
|
|
||||||
default:
|
|
||||||
break
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
5854
ui/package-lock.json
generated
|
|
@ -2,26 +2,38 @@
|
||||||
"name": "ui",
|
"name": "ui",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"description": "UI pro arcade mach",
|
"description": "UI pro arcade mach",
|
||||||
"main": "main.js",
|
"main": "main.cjs",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"test": "echo \"Error: no test specified\" && exit 1",
|
"dev": "NODE_ENV=development concurrently \"vite\" \"electron-forge start\"",
|
||||||
"start": "electron-forge start",
|
"package": "vite build && electron-forge package",
|
||||||
"package": "electron-forge package",
|
"make": "vite build && electron-forge make"
|
||||||
"make": "electron-forge make"
|
|
||||||
},
|
},
|
||||||
"author": "Kryvas",
|
"author": "Kryvas",
|
||||||
"license": "ISC",
|
"license": "ISC",
|
||||||
|
"public": false,
|
||||||
|
"type": "module",
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@electron-forge/cli": "^6.0.5",
|
"@electron-forge/cli": "^6.0.5",
|
||||||
"@electron-forge/maker-deb": "^6.0.5",
|
"@electron-forge/maker-deb": "^6.0.5",
|
||||||
"@electron-forge/maker-rpm": "^6.0.5",
|
"@electron-forge/maker-rpm": "^6.0.5",
|
||||||
"@electron-forge/maker-squirrel": "^6.0.5",
|
"@electron-forge/maker-squirrel": "^6.0.5",
|
||||||
"@electron-forge/maker-zip": "^6.0.5",
|
"@electron-forge/maker-zip": "^6.0.5",
|
||||||
|
"@sveltejs/adapter-node": "^1.2.1",
|
||||||
|
"@sveltejs/kit": "^1.9.3",
|
||||||
|
"@sveltejs/vite-plugin-svelte": "^1.0.0-next.30",
|
||||||
|
"concurrently": "^7.6.0",
|
||||||
"electron": "^23.1.0",
|
"electron": "^23.1.0",
|
||||||
"electron-packager": "^17.1.1"
|
"electron-packager": "^17.1.1",
|
||||||
|
"svelte": "^3.47.0",
|
||||||
|
"svelte-check": "^3.0.4",
|
||||||
|
"svelte-preprocess": "^5.0.1",
|
||||||
|
"vite": "^4.1.4",
|
||||||
|
"vite-plugin-commonjs-externals": "^0.1.1"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"electron-squirrel-startup": "^1.0.0",
|
"electron-squirrel-startup": "^1.0.0",
|
||||||
"jquery": "^3.6.3"
|
"jquery": "^3.6.3",
|
||||||
|
"prettier": "^2.8.4",
|
||||||
|
"prettier-plugin-svelte": "^2.9.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
4031
ui/pnpm-lock.yaml
Normal file
10
ui/src/app.d.ts
vendored
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
// See https://kit.svelte.dev/docs/types#app
|
||||||
|
// for information about these interfaces
|
||||||
|
// and what to do when importing types
|
||||||
|
declare namespace App {
|
||||||
|
// interface Locals {}
|
||||||
|
// interface Platform {}
|
||||||
|
// interface PrivateEnv {}
|
||||||
|
// interface PublicEnv {}
|
||||||
|
// interface Session {}
|
||||||
|
}
|
||||||
13
ui/src/app.html
Normal file
|
|
@ -0,0 +1,13 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
|
||||||
|
<meta name="viewport" content="width=device-width" />
|
||||||
|
<style>body { padding: 0; margin: 0; overflow: hidden } * { box-sizing: border-box; }</style>
|
||||||
|
%sveltekit.head%
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div>%sveltekit.body%</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
1
ui/src/routes/+layout.js
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
export const ssr = false;
|
||||||
90
ui/src/routes/+page.svelte
Normal file
|
|
@ -0,0 +1,90 @@
|
||||||
|
<script>
|
||||||
|
import Game from "./Game.svelte";
|
||||||
|
import { vars } from "./utils";
|
||||||
|
const { ipcRenderer } = require('electron');
|
||||||
|
|
||||||
|
const switchfocus = new Audio('audio/switchfocus.mp3')
|
||||||
|
const startaudio = new Audio('audio/audiostart4.mp3')
|
||||||
|
|
||||||
|
var focusID = -1;
|
||||||
|
|
||||||
|
var ingame = -1;
|
||||||
|
|
||||||
|
ipcRenderer.on('game-start', (event, arg) => {
|
||||||
|
ingame = arg;
|
||||||
|
});
|
||||||
|
|
||||||
|
ipcRenderer.on("game-stop", (event, arg) => {
|
||||||
|
ingame = -1;
|
||||||
|
});
|
||||||
|
|
||||||
|
ipcRenderer.on("game-error", (event, arg) => {
|
||||||
|
ingame = -1;
|
||||||
|
console.error(arg);
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {KeyboardEvent} e
|
||||||
|
*/
|
||||||
|
function keydown(e) {
|
||||||
|
if(![vars.keys.up, vars.keys.down, vars.keys.left, vars.keys.right, vars.keys.start].includes(e.code)) return;
|
||||||
|
|
||||||
|
if(e.code == vars.keys.start && focusID > -1) {
|
||||||
|
ipcRenderer.send('start', focusID);
|
||||||
|
startaudio.pause();
|
||||||
|
startaudio.currentTime = 0;
|
||||||
|
startaudio.play();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if(e.code == vars.keys.up) {
|
||||||
|
focusID += 3;
|
||||||
|
} else if(e.code == vars.keys.down) {
|
||||||
|
focusID -= 3;
|
||||||
|
} else if(e.code == vars.keys.right) {
|
||||||
|
focusID++;
|
||||||
|
} else if(e.code == vars.keys.left) {
|
||||||
|
focusID--;
|
||||||
|
}
|
||||||
|
if(focusID < 0) focusID = vars.games.length - 1;
|
||||||
|
if(focusID > vars.games.length - 1) focusID = 0;
|
||||||
|
switchfocus.pause();
|
||||||
|
switchfocus.currentTime = 0;
|
||||||
|
switchfocus.play();
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<svelte:window on:keydown={keydown} />
|
||||||
|
|
||||||
|
<svelte:head>
|
||||||
|
<title>UI</title>
|
||||||
|
</svelte:head>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="hlavnidiv">
|
||||||
|
<div class="container">
|
||||||
|
{#each vars.games as game, i (game)}
|
||||||
|
<Game {game} hasFocus={focusID == i} running={ingame == i} />
|
||||||
|
{/each}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
grid-template-rows: repeat(2, 1fr);
|
||||||
|
grid-gap: 15px;
|
||||||
|
margin-top: 10px;
|
||||||
|
height: 90vh;
|
||||||
|
width: 100vw;
|
||||||
|
padding: 2rem;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hlavnidiv {
|
||||||
|
aspect-ratio: 3/4;
|
||||||
|
background-image: url("images/BACKGROUND GOOD.png");
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
126
ui/src/routes/Game.svelte
Normal file
|
|
@ -0,0 +1,126 @@
|
||||||
|
<script>
|
||||||
|
/** @type {{ title: string, image: string }} */
|
||||||
|
export var game;
|
||||||
|
export var hasFocus = false;
|
||||||
|
export var running = false;
|
||||||
|
|
||||||
|
/** @type {HTMLButtonElement} */
|
||||||
|
var button;
|
||||||
|
|
||||||
|
$: if(hasFocus && button) button.focus();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
<button
|
||||||
|
class="move"
|
||||||
|
type="button"
|
||||||
|
on:click
|
||||||
|
bind:this={button}
|
||||||
|
on:focus
|
||||||
|
on:blur
|
||||||
|
>
|
||||||
|
<img src="{game.image}" alt="" />
|
||||||
|
<h1 class="sex">{game.title}</h1>
|
||||||
|
{#if running}
|
||||||
|
<button class="running">
|
||||||
|
running
|
||||||
|
</button>
|
||||||
|
{/if}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.move {
|
||||||
|
display: flex;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
border: 3px solid black;
|
||||||
|
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
border-radius: 15px;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.move img {
|
||||||
|
content: "";
|
||||||
|
object-fit: cover;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 0;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sex {
|
||||||
|
opacity: 0;
|
||||||
|
bottom: 110px;
|
||||||
|
z-index: 1;
|
||||||
|
transition: opacity 1s, bottom 0.8s;
|
||||||
|
position: relative;
|
||||||
|
/* color: rgb(15, 12, 12, 0.88); */
|
||||||
|
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
||||||
|
font-weight: bolder;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes blik {
|
||||||
|
0% {
|
||||||
|
box-shadow: 0 0 0 3px rgba(255, 254, 254, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
box-shadow: 0 0 0 3px rgba(255, 254, 254, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
box-shadow: 0 0 0 3px rgba(255, 254, 254, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.move:focus {
|
||||||
|
outline: none;
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
animation-name: blik;
|
||||||
|
animation-duration: 1.4s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.move:focus h1 {
|
||||||
|
transition: opacity 1s, bottom 0.8s;
|
||||||
|
z-index: 1;
|
||||||
|
opacity: 0.9;
|
||||||
|
|
||||||
|
bottom: 80px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.move:focus img {
|
||||||
|
opacity: 0.68;
|
||||||
|
/* filter: blur(2.2px); */
|
||||||
|
transform: scale(1.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.move img {
|
||||||
|
transition: opacity 0.6s, filter 1s, transform .6s;
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale(1);
|
||||||
|
/* filter: blur(0); */
|
||||||
|
}
|
||||||
|
.running {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 30px;
|
||||||
|
background: green;
|
||||||
|
border: none;
|
||||||
|
color: white;
|
||||||
|
font-weight: bolder;
|
||||||
|
font-size: 1.2em;
|
||||||
|
border-radius: 0 0 15px 15px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
2
ui/src/routes/utils.js
Normal file
|
|
@ -0,0 +1,2 @@
|
||||||
|
|
||||||
|
export const vars = require("./vars.json");
|
||||||
|
Before Width: | Height: | Size: 219 KiB After Width: | Height: | Size: 219 KiB |
|
Before Width: | Height: | Size: 89 KiB After Width: | Height: | Size: 89 KiB |
|
Before Width: | Height: | Size: 165 KiB After Width: | Height: | Size: 165 KiB |
|
Before Width: | Height: | Size: 424 KiB After Width: | Height: | Size: 424 KiB |
|
Before Width: | Height: | Size: 1.8 MiB After Width: | Height: | Size: 1.8 MiB |
|
Before Width: | Height: | Size: 210 KiB After Width: | Height: | Size: 210 KiB |
|
Before Width: | Height: | Size: 136 KiB After Width: | Height: | Size: 136 KiB |
|
Before Width: | Height: | Size: 136 KiB After Width: | Height: | Size: 136 KiB |
|
Before Width: | Height: | Size: 428 KiB After Width: | Height: | Size: 428 KiB |
|
Before Width: | Height: | Size: 1.1 MiB After Width: | Height: | Size: 1.1 MiB |
107
ui/style.css
|
|
@ -1,107 +0,0 @@
|
||||||
.container {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(3, 1fr);
|
|
||||||
grid-template-rows: repeat(2, 1fr);
|
|
||||||
grid-gap: 15px;
|
|
||||||
margin-top: 10px;
|
|
||||||
height: 90vh;
|
|
||||||
width: 100vw;
|
|
||||||
padding: 2rem;
|
|
||||||
margin: 0 auto;
|
|
||||||
/*background-color: rgb(56, 55, 55, 1);*/
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
* {
|
|
||||||
box-sizing: border-box;
|
|
||||||
/* ulehci zivot */
|
|
||||||
}
|
|
||||||
|
|
||||||
.move {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
border: 3px solid black;
|
|
||||||
|
|
||||||
justify-content: flex-end;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
border-radius: 15px;
|
|
||||||
position: relative;
|
|
||||||
border-radius: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.move img {
|
|
||||||
content: "";
|
|
||||||
object-fit: cover;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 0;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sex {
|
|
||||||
opacity: 0;
|
|
||||||
bottom: 110px;
|
|
||||||
z-index: 1;
|
|
||||||
transition: opacity 1s, bottom 0.8s;
|
|
||||||
position: relative;
|
|
||||||
/* color: rgb(15, 12, 12, 0.88); */
|
|
||||||
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
|
||||||
font-weight: bolder;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes blik {
|
|
||||||
0% {
|
|
||||||
box-shadow: 0 0 0 3px rgba(255, 254, 254, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
50% {
|
|
||||||
box-shadow: 0 0 0 3px rgba(255, 254, 254, 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
box-shadow: 0 0 0 3px rgba(255, 254, 254, 0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.move:focus {
|
|
||||||
outline: none;
|
|
||||||
animation-iteration-count: infinite;
|
|
||||||
animation-name: blik;
|
|
||||||
animation-duration: 1.4s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.move:focus h1 {
|
|
||||||
transition: opacity 1s, bottom 0.8s;
|
|
||||||
z-index: 1;
|
|
||||||
opacity: 0.9;
|
|
||||||
|
|
||||||
bottom: 80px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.move:focus img {
|
|
||||||
transition: opacity 0.6s, filter 1s;
|
|
||||||
opacity: 0.68;
|
|
||||||
filter: blur(2.2px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.move img {
|
|
||||||
opacity: 1;
|
|
||||||
filter: blur(0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.hlavnidiv {
|
|
||||||
aspect-ratio: 3/4;
|
|
||||||
background-image: url("JPGS/BACKGROUND GOOD.png");
|
|
||||||
background-size: cover;
|
|
||||||
}
|
|
||||||
15
ui/svelte.config.js
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
import adapter from '@sveltejs/adapter-node';
|
||||||
|
import preprocess from 'svelte-preprocess';
|
||||||
|
|
||||||
|
/** @type {import('@sveltejs/kit').Config} */
|
||||||
|
const config = {
|
||||||
|
// Consult https://github.com/sveltejs/svelte-preprocess
|
||||||
|
// for more information about preprocessors
|
||||||
|
preprocess: preprocess(),
|
||||||
|
|
||||||
|
kit: {
|
||||||
|
adapter: adapter()
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
export default config;
|
||||||
13
ui/tsconfig.json
Normal file
|
|
@ -0,0 +1,13 @@
|
||||||
|
{
|
||||||
|
"extends": "./.svelte-kit/tsconfig.json",
|
||||||
|
"compilerOptions": {
|
||||||
|
"allowJs": true,
|
||||||
|
"checkJs": true,
|
||||||
|
"esModuleInterop": true,
|
||||||
|
"forceConsistentCasingInFileNames": true,
|
||||||
|
"resolveJsonModule": true,
|
||||||
|
"skipLibCheck": true,
|
||||||
|
"sourceMap": true,
|
||||||
|
"strict": true
|
||||||
|
}
|
||||||
|
}
|
||||||
9
ui/vite.config.js
Normal file
|
|
@ -0,0 +1,9 @@
|
||||||
|
|
||||||
|
import { sveltekit } from '@sveltejs/kit/vite';
|
||||||
|
|
||||||
|
/** @type {import('vite').UserConfig} */
|
||||||
|
const config = {
|
||||||
|
plugins: [sveltekit()]
|
||||||
|
};
|
||||||
|
|
||||||
|
export default config;
|
||||||