-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
0773f41
commit a776aa5
Showing
9 changed files
with
3,718 additions
and
342 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,250 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title id="navtitle"> Sparkle {Version}</title> | ||
<link rel="stylesheet" href="styles.css"> | ||
<link rel="stylesheet" href="https://site-assets.fontawesome.com/releases/v6.4.2/css/all.css"> | ||
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous"> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script> | ||
<style> | ||
/* Center align the content vertically and horizontally */ | ||
.center-content { | ||
display: flex; | ||
flex-direction: column; | ||
justify-content: center; | ||
align-items: center; | ||
height: 100vh; | ||
} | ||
</style> | ||
</head> | ||
<body> | ||
<div class="nav-buttons nav" style="-webkit-app-region: drag"> | ||
<p id="title">✨ Sparkle {Version}</p> | ||
|
||
<div class="nav-buttons"> | ||
<button id="minimize"><i class="fa-light fa-window-minimize"></i></button> | ||
<button id="maximize"><i class="fa-light fa-square"></i></button> | ||
<button id="close"><i class="fa-light fa-xmark"></i></button> | ||
</div> | ||
</div> | ||
<div class="navitems"> | ||
<a>Home</a> | ||
<a>Debloat</a> | ||
<a id="runClean">Cleaner</a> | ||
<a>Wifi Booster</a> | ||
<a>Settings</a> | ||
</div> | ||
<div class="center-content"> | ||
<div class="text-center mt-5"> | ||
<h1> | ||
<span class="white-text">Welcome To Sparkle </span> | ||
<span class="yellow-text">✨</span> | ||
</h1> | ||
<h6 class="text-center">Windows Optimizer</h6> | ||
<div class="buttons text-center mt-4"> | ||
<button type="button" class="btn btn-primary mx-2" id="runClean">Cleaner</button> | ||
<button type="button" class="btn btn-primary mx-2" id="runDebloat">Debloat</button> | ||
<div id="ramUsage" class="mt-4"> | ||
<h4 class="text-center mb-3">Ram Usage</h4> | ||
<div class="progress"> | ||
<div id="progressBar" class="progress-bar bg-success" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div> | ||
</div> | ||
<p class="mt-2">Total RAM: <span id="totalRam"></span></p> | ||
<p>Free RAM: <span id="freeRam"></span></p> | ||
<p>Used RAM: <span id="usedRam"></span></p> | ||
</div> | ||
</div> | ||
<p class="mt-5" style="color:#4c4c4c">© 2023 Parcoil Network </p> | ||
</div> | ||
<script src="script.js"></script> | ||
</body> | ||
</html> | ||
<style> | ||
/* Your existing CSS */ | ||
/* Update or add styles as needed */ | ||
.container { | ||
display: flex; | ||
flex-direction: column; | ||
align-items: center; | ||
justify-content: center; | ||
min-height: calc(100vh - 35px); | ||
padding-top: 20px; | ||
} | ||
|
||
.buttons { | ||
margin-top: 20px; | ||
} | ||
|
||
/* Additional refinements */ | ||
.btn-primary { | ||
font-weight: 500; | ||
font-size: 16px; | ||
padding: 10px 20px; | ||
} | ||
.btn-primary:hover { | ||
opacity: 0.8; | ||
} | ||
.progress { | ||
width: 50%; | ||
margin: auto; | ||
} | ||
</style> | ||
|
||
<style> | ||
* { | ||
box-sizing: border-box; | ||
font-family: "Inter"; | ||
overflow: hidden; | ||
} | ||
body { | ||
background: #121212; | ||
color: #ededed; | ||
padding: 0; | ||
margin: 0; | ||
} | ||
nav { | ||
position: sticky; | ||
border: 1px solid #2c2c2c; | ||
height: 35px; | ||
display: flex; | ||
align-items: center; | ||
background: #1c1c1c; | ||
} | ||
#title { | ||
user-select: none; | ||
font-size: 15px; | ||
margin-left: 10px; | ||
-webkit-app-region: drag; | ||
margin-bottom:0px; | ||
} | ||
:not(nav) { | ||
-webkit-app-region: no-drag; | ||
} | ||
.nav-buttons { | ||
margin-left: auto; | ||
height: 100%; | ||
display: flex; | ||
} | ||
.nav-buttons > button { | ||
transition: background .2s ease; | ||
background: #1c1c1c; | ||
border: none; | ||
height: 100%; | ||
margin: 0; | ||
aspect-ratio: 1; | ||
color: #ededed; | ||
font-size: 17px; | ||
} | ||
.nav-buttons > button:hover { | ||
transition: .2s ease; | ||
background: #2c2c2c; | ||
cursor: pointer; | ||
} | ||
.nav-buttons > button:active { | ||
background: #4c4c4c; | ||
} | ||
body { | ||
font-family: Arial, sans-serif; | ||
margin: 0; | ||
padding: 0; | ||
} | ||
.container { | ||
display: flex; | ||
flex-direction: column; | ||
align-items: center; | ||
justify-content: center; | ||
min-height: calc(100vh - 35px); /* Consider the navbar height */ | ||
padding-top: 20px; | ||
} | ||
|
||
.buttons { | ||
margin-top: 20px; | ||
} | ||
|
||
/* Additional refinements */ | ||
.btn-primary { | ||
font-weight: 500; | ||
font-size: 16px; | ||
padding: 10px 20px; | ||
} | ||
.btn-primary:hover { | ||
opacity: 0.8; | ||
} | ||
</style> | ||
<script> | ||
// Fetching the version from package.json using Electron's built-in 'fs' module | ||
const fs = require('fs'); | ||
const path = require('path'); | ||
|
||
// Get the path to package.json | ||
const packagePath = path.join(__dirname, 'package.json'); | ||
|
||
// Read the package.json file | ||
fs.readFile(packagePath, 'utf8', (err, data) => { | ||
if (err) { | ||
console.error(err); | ||
return; | ||
} | ||
|
||
// Parse the JSON content to retrieve version | ||
const packageData = JSON.parse(data); | ||
const version = packageData.version; | ||
|
||
// Set the version in the HTML element | ||
const titleElement = document.getElementById('title'); | ||
titleElement.textContent = `✨ Sparkle v${version}`; | ||
const navtitleElement = document.getElementById('navtitle'); | ||
navtitleElement.textContent = `✨ Sparkle v${version}`; | ||
}); | ||
</script> | ||
|
||
<script> | ||
document.addEventListener('DOMContentLoaded', () => { | ||
// Event listener for the Clean and Debloat buttons | ||
document.getElementById('runClean').addEventListener('click', () => { | ||
runScript('Clean'); | ||
}); | ||
|
||
document.getElementById('runDebloat').addEventListener('click', () => { | ||
runScript('Debloat'); | ||
}); | ||
|
||
// Function to run the script and show modal | ||
function runScript(scriptType) { | ||
const modal = new bootstrap.Modal(document.getElementById('runningScriptModal'), { | ||
keyboard: false | ||
}); | ||
|
||
document.getElementById('runningScriptText').textContent = `Running ${scriptType} script`; | ||
modal.show(); | ||
|
||
// Simulate script execution (replace this with your actual script execution logic) | ||
setTimeout(() => { | ||
modal.hide(); | ||
// Replace with your logic to run the bat file or perform other actions | ||
}, 3000); // Simulated execution time: 3 seconds (3000ms) | ||
} | ||
}); | ||
</script> | ||
<style> | ||
.yellow-text { | ||
color: yellow; /* Set emoji color */ | ||
font-size: 1.5em; /* Adjust emoji size */ | ||
animation: glow 5s ease-in-out infinite; | ||
} | ||
|
||
/* Glowing effect animation for the emoji */ | ||
@keyframes glow { | ||
0% { | ||
text-shadow: 0 0 1px yellow, 0 0 2px yellow; | ||
} | ||
50% { | ||
text-shadow: 0 0 2px yellow, 0 0 3px yellow; | ||
} | ||
100% { | ||
text-shadow: 0 0 3px yellow, 0 0 4px yellow; | ||
} | ||
} | ||
</style> |
Oops, something went wrong.