mirror of
https://gitlab.com/vyla-entertainment/home.git
synced 2026-11-09 19:57:20 -05:00
fixed some issues...?
This commit is contained in:
@@ -589,10 +589,23 @@ fn main() {
|
||||
.setup(|app| {
|
||||
debug_log("Tauri setup started");
|
||||
let app_data = app.path().app_data_dir().unwrap_or_default();
|
||||
let _app_data_str = clean_path(&app_data);
|
||||
|
||||
let vyla_files = if let Ok(appdata_env) = std::env::var("APPDATA") {
|
||||
std::path::PathBuf::from(appdata_env).join("vyla-home").join("vyla-home-files")
|
||||
std::path::PathBuf::from(appdata_env)
|
||||
.join("vyla-home")
|
||||
.join("vyla-home-files")
|
||||
} else if let Ok(_home) = std::env::var("HOME") {
|
||||
#[cfg(target_os = "macos")]
|
||||
let base = std::path::PathBuf::from(&home)
|
||||
.join("Library")
|
||||
.join("Application Support");
|
||||
#[cfg(target_os = "linux")]
|
||||
let base = std::path::PathBuf::from(&home)
|
||||
.join(".local")
|
||||
.join("share");
|
||||
#[cfg(not(any(target_os = "macos", target_os = "linux")))]
|
||||
let base = app_data.clone();
|
||||
base.join("vyla-home").join("vyla-home-files")
|
||||
} else {
|
||||
app_data.join("vyla-home-files")
|
||||
};
|
||||
@@ -637,21 +650,25 @@ fn main() {
|
||||
.build()?;
|
||||
|
||||
let (main_js, root_dir) = resolve_script_and_root(app);
|
||||
debug_log("Searching for node binary...");
|
||||
let node_bin = match find_node_binary(app) {
|
||||
Some(bin) => bin,
|
||||
Some(bin) => {
|
||||
debug_log(&format!("Found node binary: {}", bin));
|
||||
bin
|
||||
}
|
||||
None => {
|
||||
let _ = window.emit(
|
||||
"error",
|
||||
serde_json::json!({
|
||||
"message": "Node.js runtime not found. Please ensure Node.js is installed or bundled correctly."
|
||||
}),
|
||||
);
|
||||
debug_log("FATAL: No node binary found in bundle or PATH.");
|
||||
std::thread::sleep(std::time::Duration::from_millis(600));
|
||||
let _ = window.eval("document.getElementById('status-message').textContent='Error: Node runtime missing. Please reinstall.';");
|
||||
let _ = window.eval("var b=document.getElementById('debug-log-box');b.style.display='block';b.textContent='Node binary not found. bin/node missing from app bundle or not executable.';");
|
||||
return Ok(());
|
||||
}
|
||||
};
|
||||
|
||||
let vyla_files_str = clean_path(&vyla_files);
|
||||
|
||||
std::thread::sleep(std::time::Duration::from_millis(400));
|
||||
|
||||
let mut cmd = Command::new(&node_bin);
|
||||
cmd.arg(&main_js)
|
||||
.current_dir(&root_dir)
|
||||
@@ -847,12 +864,12 @@ fn main() {
|
||||
}
|
||||
Err(e) => {
|
||||
debug_log(&format!("Failed to spawn node: {}", e));
|
||||
let _ = window.emit(
|
||||
"error",
|
||||
serde_json::json!({
|
||||
"message": format!("Failed to launch backend runtime: {}", e)
|
||||
}),
|
||||
let emsg = format!("Failed to spawn node: {}", e);
|
||||
let js = format!(
|
||||
"document.getElementById('status-message').textContent='Spawn Error';var b=document.getElementById('debug-log-box');b.style.display='block';b.textContent={};",
|
||||
serde_json::to_string(&emsg).unwrap_or_default()
|
||||
);
|
||||
let _ = window.eval(&js);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
273
ui/index.html
273
ui/index.html
@@ -271,61 +271,66 @@
|
||||
console.warn("OGL Shader background failed to load (offline):", err);
|
||||
}
|
||||
|
||||
if (!window.__OGL_LOADED__) {
|
||||
document.body.style.background = "radial-gradient(circle at 80% 20%, #1e1b4b 0%, #050505 70%)";
|
||||
} else {
|
||||
const { Renderer, Program, Triangle, Mesh } = window.__OGL_LOADED__;
|
||||
const rayContainer = document.getElementById("side-rays");
|
||||
const settings = {
|
||||
speed: 2.5,
|
||||
rayColor1: "#EAB308",
|
||||
rayColor2: "#96c8ff",
|
||||
intensity: 2,
|
||||
spread: 2,
|
||||
origin: "top-right",
|
||||
tilt: 0,
|
||||
saturation: 1.5,
|
||||
blend: 0.75,
|
||||
falloff: 1.6,
|
||||
opacity: 1
|
||||
};
|
||||
window.dispatchEvent(new Event('ogl-ready'));
|
||||
</script>
|
||||
|
||||
function hexToRgb(hex) {
|
||||
const match = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
|
||||
if (!match) return [1, 1, 1];
|
||||
return [
|
||||
parseInt(match[1], 16) / 255,
|
||||
parseInt(match[2], 16) / 255,
|
||||
parseInt(match[3], 16) / 255
|
||||
];
|
||||
}
|
||||
<script>
|
||||
window.addEventListener('ogl-ready', () => {
|
||||
if (!window.__OGL_LOADED__) {
|
||||
document.body.style.background = "radial-gradient(circle at 80% 20%, #1e1b4b 0%, #050505 70%)";
|
||||
} else {
|
||||
const { Renderer, Program, Triangle, Mesh } = window.__OGL_LOADED__;
|
||||
const rayContainer = document.getElementById("side-rays");
|
||||
const settings = {
|
||||
speed: 2.5,
|
||||
rayColor1: "#EAB308",
|
||||
rayColor2: "#96c8ff",
|
||||
intensity: 2,
|
||||
spread: 2,
|
||||
origin: "top-right",
|
||||
tilt: 0,
|
||||
saturation: 1.5,
|
||||
blend: 0.75,
|
||||
falloff: 1.6,
|
||||
opacity: 1
|
||||
};
|
||||
|
||||
function originToFlip(origin) {
|
||||
switch (origin) {
|
||||
case "top-left": return [1, 0];
|
||||
case "bottom-right": return [0, 1];
|
||||
case "bottom-left": return [1, 1];
|
||||
default: return [0, 0];
|
||||
function hexToRgb(hex) {
|
||||
const match = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
|
||||
if (!match) return [1, 1, 1];
|
||||
return [
|
||||
parseInt(match[1], 16) / 255,
|
||||
parseInt(match[2], 16) / 255,
|
||||
parseInt(match[3], 16) / 255
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
const renderer = new Renderer({
|
||||
dpr: Math.min(window.devicePixelRatio, 2),
|
||||
alpha: true
|
||||
});
|
||||
const gl = renderer.gl;
|
||||
gl.canvas.style.width = "100%";
|
||||
gl.canvas.style.height = "100%";
|
||||
rayContainer.appendChild(gl.canvas);
|
||||
function originToFlip(origin) {
|
||||
switch (origin) {
|
||||
case "top-left": return [1, 0];
|
||||
case "bottom-right": return [0, 1];
|
||||
case "bottom-left": return [1, 1];
|
||||
default: return [0, 0];
|
||||
}
|
||||
}
|
||||
|
||||
const vertexShader = `
|
||||
const renderer = new Renderer({
|
||||
dpr: Math.min(window.devicePixelRatio, 2),
|
||||
alpha: true
|
||||
});
|
||||
const gl = renderer.gl;
|
||||
gl.canvas.style.width = "100%";
|
||||
gl.canvas.style.height = "100%";
|
||||
rayContainer.appendChild(gl.canvas);
|
||||
|
||||
const vertexShader = `
|
||||
attribute vec2 position;
|
||||
void main() {
|
||||
gl_Position = vec4(position, 0.0, 1.0);
|
||||
}
|
||||
`;
|
||||
|
||||
const fragmentShader = `
|
||||
const fragmentShader = `
|
||||
precision highp float;
|
||||
uniform float iTime;
|
||||
uniform vec2 iResolution;
|
||||
@@ -386,77 +391,77 @@ void main() {
|
||||
}
|
||||
`;
|
||||
|
||||
const [flipX, flipY] = originToFlip(settings.origin);
|
||||
const uniforms = {
|
||||
iTime: { value: 0 },
|
||||
iResolution: { value: [1, 1] },
|
||||
iSpeed: { value: settings.speed },
|
||||
iRayColor1: { value: hexToRgb(settings.rayColor1) },
|
||||
iRayColor2: { value: hexToRgb(settings.rayColor2) },
|
||||
iIntensity: { value: settings.intensity },
|
||||
iSpread: { value: settings.spread },
|
||||
iFlipX: { value: flipX },
|
||||
iFlipY: { value: flipY },
|
||||
iTilt: { value: settings.tilt },
|
||||
iSaturation: { value: settings.saturation },
|
||||
iBlend: { value: settings.blend },
|
||||
iFalloff: { value: settings.falloff },
|
||||
iOpacity: { value: settings.opacity }
|
||||
};
|
||||
const [flipX, flipY] = originToFlip(settings.origin);
|
||||
const uniforms = {
|
||||
iTime: { value: 0 },
|
||||
iResolution: { value: [1, 1] },
|
||||
iSpeed: { value: settings.speed },
|
||||
iRayColor1: { value: hexToRgb(settings.rayColor1) },
|
||||
iRayColor2: { value: hexToRgb(settings.rayColor2) },
|
||||
iIntensity: { value: settings.intensity },
|
||||
iSpread: { value: settings.spread },
|
||||
iFlipX: { value: flipX },
|
||||
iFlipY: { value: flipY },
|
||||
iTilt: { value: settings.tilt },
|
||||
iSaturation: { value: settings.saturation },
|
||||
iBlend: { value: settings.blend },
|
||||
iFalloff: { value: settings.falloff },
|
||||
iOpacity: { value: settings.opacity }
|
||||
};
|
||||
|
||||
const geometry = new Triangle(gl);
|
||||
const program = new Program(gl, { vertex: vertexShader, fragment: fragmentShader, uniforms });
|
||||
const mesh = new Mesh(gl, { geometry, program });
|
||||
const geometry = new Triangle(gl);
|
||||
const program = new Program(gl, { vertex: vertexShader, fragment: fragmentShader, uniforms });
|
||||
const mesh = new Mesh(gl, { geometry, program });
|
||||
|
||||
function resize() {
|
||||
const width = rayContainer.clientWidth;
|
||||
const height = rayContainer.clientHeight;
|
||||
renderer.dpr = Math.min(window.devicePixelRatio, 2);
|
||||
renderer.setSize(width, height);
|
||||
uniforms.iResolution.value = [width * renderer.dpr, height * renderer.dpr];
|
||||
}
|
||||
function resize() {
|
||||
const width = rayContainer.clientWidth;
|
||||
const height = rayContainer.clientHeight;
|
||||
renderer.dpr = Math.min(window.devicePixelRatio, 2);
|
||||
renderer.setSize(width, height);
|
||||
uniforms.iResolution.value = [width * renderer.dpr, height * renderer.dpr];
|
||||
}
|
||||
|
||||
window.addEventListener("resize", resize);
|
||||
resize();
|
||||
window.addEventListener("resize", resize);
|
||||
resize();
|
||||
|
||||
function animate(time) {
|
||||
uniforms.iTime.value = time * 0.001;
|
||||
renderer.render({ scene: mesh });
|
||||
function animate(time) {
|
||||
uniforms.iTime.value = time * 0.001;
|
||||
renderer.render({ scene: mesh });
|
||||
requestAnimationFrame(animate);
|
||||
}
|
||||
requestAnimationFrame(animate);
|
||||
}
|
||||
requestAnimationFrame(animate);
|
||||
|
||||
function initLiquidButtons() {
|
||||
const borderWidth = 0.16;
|
||||
const brightness = 35;
|
||||
const opacity = 0.55;
|
||||
const blur = 4;
|
||||
const displace = 1.2;
|
||||
const borderRadius = 9999;
|
||||
const distortionScale = -380;
|
||||
const redOffset = -25;
|
||||
const greenOffset = 0;
|
||||
const blueOffset = 25;
|
||||
const xChannel = "R";
|
||||
const yChannel = "G";
|
||||
const mixBlendMode = "screen";
|
||||
function initLiquidButtons() {
|
||||
const borderWidth = 0.16;
|
||||
const brightness = 35;
|
||||
const opacity = 0.55;
|
||||
const blur = 4;
|
||||
const displace = 1.2;
|
||||
const borderRadius = 9999;
|
||||
const distortionScale = -380;
|
||||
const redOffset = -25;
|
||||
const greenOffset = 0;
|
||||
const blueOffset = 25;
|
||||
const xChannel = "R";
|
||||
const yChannel = "G";
|
||||
const mixBlendMode = "screen";
|
||||
|
||||
document.querySelectorAll(".liquid-glass-btn").forEach((btn, index) => {
|
||||
const filterId = `glass-filter-${index + 1}`;
|
||||
btn.style.setProperty("--filter-id", `url(#${filterId})`);
|
||||
document.querySelectorAll(".liquid-glass-btn").forEach((btn, index) => {
|
||||
const filterId = `glass-filter-${index + 1}`;
|
||||
btn.style.setProperty("--filter-id", `url(#${filterId})`);
|
||||
|
||||
const feImage = btn.querySelector(".fe-image");
|
||||
const redChannel = btn.querySelector(".redchannel");
|
||||
const greenChannel = btn.querySelector(".greenchannel");
|
||||
const blueChannel = btn.querySelector(".bluechannel");
|
||||
const gaussianBlur = btn.querySelector(".gaussianBlur");
|
||||
const feImage = btn.querySelector(".fe-image");
|
||||
const redChannel = btn.querySelector(".redchannel");
|
||||
const greenChannel = btn.querySelector(".greenchannel");
|
||||
const blueChannel = btn.querySelector(".bluechannel");
|
||||
const gaussianBlur = btn.querySelector(".gaussianBlur");
|
||||
|
||||
function generateDisplacementMap() {
|
||||
const rect = btn.getBoundingClientRect();
|
||||
const actualWidth = rect.width || 140;
|
||||
const actualHeight = rect.height || 48;
|
||||
function generateDisplacementMap() {
|
||||
const rect = btn.getBoundingClientRect();
|
||||
const actualWidth = rect.width || 140;
|
||||
const actualHeight = rect.height || 48;
|
||||
|
||||
const svgContent = `
|
||||
const svgContent = `
|
||||
<svg viewBox="0 0 ${actualWidth} ${actualHeight}" xmlns="http://www.w3.org/2000/svg">
|
||||
<defs>
|
||||
<linearGradient id="red-grad-${index}" x1="100%" y1="0%" x2="0%" y2="0%">
|
||||
@@ -473,32 +478,33 @@ void main() {
|
||||
<rect width="${actualWidth}" height="${actualHeight}" rx="${borderRadius}" fill="url(#blue-grad-${index})" style="mix-blend-mode:${mixBlendMode}"/>
|
||||
</svg>
|
||||
`;
|
||||
return "data:image/svg+xml," + encodeURIComponent(svgContent);
|
||||
}
|
||||
return "data:image/svg+xml," + encodeURIComponent(svgContent);
|
||||
}
|
||||
|
||||
function update() {
|
||||
feImage.setAttribute("href", generateDisplacementMap());
|
||||
redChannel.setAttribute("scale", distortionScale + redOffset);
|
||||
greenChannel.setAttribute("scale", distortionScale + greenOffset);
|
||||
blueChannel.setAttribute("scale", distortionScale + blueOffset);
|
||||
[redChannel, greenChannel, blueChannel].forEach((ch) => {
|
||||
ch.setAttribute("xChannelSelector", xChannel);
|
||||
ch.setAttribute("yChannelSelector", yChannel);
|
||||
});
|
||||
gaussianBlur.setAttribute("stdDeviation", displace);
|
||||
}
|
||||
function update() {
|
||||
feImage.setAttribute("href", generateDisplacementMap());
|
||||
redChannel.setAttribute("scale", distortionScale + redOffset);
|
||||
greenChannel.setAttribute("scale", distortionScale + greenOffset);
|
||||
blueChannel.setAttribute("scale", distortionScale + blueOffset);
|
||||
[redChannel, greenChannel, blueChannel].forEach((ch) => {
|
||||
ch.setAttribute("xChannelSelector", xChannel);
|
||||
ch.setAttribute("yChannelSelector", yChannel);
|
||||
});
|
||||
gaussianBlur.setAttribute("stdDeviation", displace);
|
||||
}
|
||||
|
||||
update();
|
||||
btn.classList.remove("glass-surface--fallback");
|
||||
btn.classList.add("glass-surface--svg");
|
||||
update();
|
||||
btn.classList.remove("glass-surface--fallback");
|
||||
btn.classList.add("glass-surface--svg");
|
||||
|
||||
const observer = new ResizeObserver(() => setTimeout(update, 0));
|
||||
observer.observe(btn);
|
||||
});
|
||||
const observer = new ResizeObserver(() => setTimeout(update, 0));
|
||||
observer.observe(btn);
|
||||
});
|
||||
}
|
||||
|
||||
initLiquidButtons();
|
||||
}
|
||||
|
||||
initLiquidButtons();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<script>
|
||||
@@ -535,8 +541,17 @@ void main() {
|
||||
}
|
||||
|
||||
async function initTauriEvents() {
|
||||
const eventApi = window.__TAURI__?.event || window.__TAURI_INTERNALS__;
|
||||
if (!eventApi || typeof eventApi.listen !== 'function') {
|
||||
let eventApi = null;
|
||||
|
||||
if (window.__TAURI__?.event && typeof window.__TAURI__.event.listen === 'function') {
|
||||
eventApi = window.__TAURI__.event;
|
||||
} else if (window.__TAURI_INTERNALS__ && typeof window.__TAURI_INTERNALS__.listen === 'function') {
|
||||
eventApi = window.__TAURI_INTERNALS__;
|
||||
} else if (window.__TAURI__ && typeof window.__TAURI__.listen === 'function') {
|
||||
eventApi = window.__TAURI__;
|
||||
}
|
||||
|
||||
if (!eventApi) {
|
||||
setTimeout(initTauriEvents, 50);
|
||||
return;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user