Added Video Updater and changed over to TBC theme

This commit is contained in:
Ben
2023-10-17 11:22:15 -05:00
parent 8cf254650d
commit d49aaba860
6 changed files with 341 additions and 38 deletions

View File

@@ -464,6 +464,28 @@ export default class FileManager {
return config.wowexe.patched_md5 === hash.digest('hex');
}
/**
* Replaces the default logo movie for a TBC movie
* @returns
*/
async AddMovieTBC(): Promise<void> {
const logoMovie800 = path.join(this.dataPath, 'enUS/Interface/Cinematics/Logo_800.avi');
const logoMovie1024 = path.join(this.dataPath, 'enUS/Interface/Cinematics/Logo_1024.avi');
const tbcMovie800 = path.join(this.dataPath, 'enUS/Interface/Cinematics/WOW_Intro_BC_800.avi');
const tbcMovie1024 = path.join(this.dataPath, 'enUS/Interface/Cinematics/WOW_Intro_BC_1024.avi');
// if the movies have already been copied exit.
if(fs.existsSync(`${logoMovie800}.old`)) {
return;
}
fs.moveSync(logoMovie800, `${logoMovie800}.old`);
fs.moveSync(logoMovie1024, `${logoMovie1024}.old`);
fs.copySync(tbcMovie800, logoMovie800);
fs.copySync(tbcMovie1024, logoMovie1024);
}
/**
* This will patch the local wow.exe with a patched version of wow.exe
*/

View File

@@ -152,6 +152,9 @@ if (process.platform === 'win32') {
versionFile = fs.readFileSync(path.join(__dirname, '../../package.json'), 'utf8');
}
// move the bc movie over
await fileManager.AddMovieTBC();
const versionjson = JSON.parse(versionFile.toString());
const VERSION = versionjson.release;

282
src/renderer/App-wotlk.css Normal file
View File

@@ -0,0 +1,282 @@
/*
* @NOTE: Prepend a `~` to css file paths that are in your node_modules
* See https://github.com/webpack-contrib/sass-loader#imports
*/
/**
* Wrath Background
*/
/* body {
position: relative;
color: white;
height: 100vh;
background-image: url('../../assets/wow-lich-bg.jpeg');
background-size: auto 100%;
font-family: 'Roboto', sans-serif;
overflow-y: hidden;
justify-content: center;
align-items: center;
filter: brightness(1.05);
animation: moveBackground 20s linear infinite alternate;
}
body::before {
content: "";
position: fixed;
opacity: 0.85;
background-color:rgb(5, 83, 156);
background-image: url('../../assets/wow-lich-bg.jpeg');
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
z-index: -1;
filter: brightness(1.30);
animation: moveBackground 20s linear infinite alternate;
} */
body {
position: relative;
color: white;
height: 100vh;
background-image: url('../../assets/burning-crusade.png');
background-size: auto 130%;
background-position-y: -150px;
background-position-x: 20px;
font-family: 'Roboto', sans-serif;
overflow-y: hidden;
justify-content: center;
align-items: center;
filter: brightness(1.00);
animation: moveBackground 50s linear infinite alternate;
}
@keyframes moveBackground {
0% {
background-position-y: -150px;
background-position-x: 20px;
}
100% {
background-position-y: -150px;
background-position-x: -200px;
}
}
/* @keyframes glow {
0% {
box-shadow: 0 0 120px 5px rgba(32, 224, 247, 0.3);
}
100% {
box-shadow: 0 0 90px 40px rgba(32, 224, 247, 1);
}
}
*/
p {
padding-bottom: 5px;
margin-top: 2px;
}
em {
font-size: 14px;
}
li {
list-style:disc;
}
h3 {
margin: 0;
font-size: '12px';
color: rgb(254,223,164, 1.2);
}
button {
background-color: rgb(15, 27, 72, 0.86);
padding: 10px 10px;
border-radius: 5px;
width: 150px;
border: none;
margin-left: 15px;
appearance: none;
color: white;
font-size: 1.2rem;
box-shadow: 0px 8px 28px -6px rgba(87, 120, 196, 0.587),
0px 18px 88px -4px rgba(24, 39, 75, 0.14);
transition: all ease-in 0.1s;
cursor: pointer;
opacity: 0.85;
}
button:hover {
transform: scale(1.05);
opacity: 1;
background-color: rgba(25, 172, 185, 0.86);
box-shadow: 10px 45px 35px rgba(10, 10, 9, 0.25);
}
a {
text-decoration: none;
height: fit-content;
width: fit-content;
margin: 10px;
}
a:hover {
opacity: 1;
text-decoration: none;
}
.wowlogo {
display: flex;
justify-content: center;
align-items: center;
padding: 65px 0 20px 0px;
filter: brightness(10000%) invert(100%) sepia(0%) saturate(0%);
}
.flexbox {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
bottom: 4%;
left:80%;
}
.snowfall {
position: 'absolute';
top: 0;
left: 0;
width: '100vw';
height: '100vh';
background: 'rgba(0, 0, 0, 0.40)';
}
.versionText h3 {
text-align: right!important;
/* width: 95%; */
padding: 5px;
margin-top: 5px;
margin-right: 10px;
font-size: 18px;
font-weight: 300;
/* letter-spacing: 1px; */
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.latest {
color: rgba(30,250,80,100);
}
::-webkit-scrollbar {
width: 5px;
}
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
-webkit-border-radius: 4px;
border-radius: 4px;
}
::-webkit-scrollbar-thumb {
-webkit-border-radius: 5px;
border-radius: 5px;
/* background: #BB2020; */
background: rgba(87, 120, 196, 0.587);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
::-webkit-scrollbar-thumb:window-inactive {
/* background: #BB2020; */
background: rgba(87, 120, 196, 0.987);
}
.overlay {
position: relative;
width: 100%;
background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent black overlay */
border-radius: 0.5em;
padding: 0.1em 10px 5px 10px;
pointer-events: none;
transition: box-shadow 0.3s, background-color 0.3s;
}
.overlay:hover {
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); /* Glow shadow on hover */
background-color: rgba(0, 0, 0, 0.7); /* Darken the background on hover */
}
.overlayContainer {
display: flex;
justify-content: center;
align-items: center;
}
.overlay.error {
color: red;
width: 80%;
background-color: rgba(25,25, 40, 0.85);
padding: 20px;
text-align: center;
}
.error h3 {
margin: 0;
font-size: 1.5em;
padding-bottom: 10px;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-weight: 600;
}
.errorDetails {
width: 100%;
color: aliceblue;
font-size: large;
}
.action-install {
width: 100px;
}
.container {
/* margin-top: 10px; */
display: flex;
padding: 20px 5px 20px 5px;
height: 35px;
}
.left-content {
flex: 75%;
}
.right-content {
flex: 35%;
text-align: right;
padding-top: 16px;
font-size: 15px;
}
.new {
color: #fedc2a;
font-weight: 600;
}
.warning {
color: #eeff00;
font-weight: 600;
font-size: inherit;
}
.updatebtn {
background-color: #FF8000;
}
.updatebtn:hover {
background-color: #FFA500;
}

View File

@@ -2,57 +2,43 @@
* @NOTE: Prepend a `~` to css file paths that are in your node_modules
* See https://github.com/webpack-contrib/sass-loader#imports
*/
body {
position: relative;
color: white;
height: 100vh;
background-image: url('../../assets/wow-lich-bg.jpeg');
background-size: auto 100%;
/* background-repeat: no-repeat; */
/* font-family: Segoe UI, Frutiger, Dejavu Sans, Helvetica Neue, Arial, sans-serif; */
background-image: url('../../assets/burning-crusade.png');
background-size: auto 130%;
background-position-y: -150px;
background-position-x: 20px;
font-family: 'Roboto', sans-serif;
overflow-y: hidden;
justify-content: center;
align-items: center;
filter: brightness(1.05);
animation: moveBackground 20s linear infinite alternate;
}
body::before {
content: "";
position: fixed;
opacity: 0.85;
background-color:rgb(5, 83, 156);
background-image: url('../../assets/wow-lich-bg.jpeg');
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
z-index: -1;
filter: brightness(1.30);
animation: moveBackground 20s linear infinite alternate;
filter: brightness(1.00);
animation: moveBackground 50s linear infinite alternate;
}
@keyframes moveBackground {
0% {
background-position: 0% 0;
background-position-y: -150px;
background-position-x: 20px;
}
100% {
background-position: 70% 0;
}
background-position-y: -150px;
background-position-x: -200px;
}
}
@keyframes glow {
/* @keyframes glow {
0% {
box-shadow: 0 0 120px 5px rgba(32, 224, 247, 0.3);
}
100% {
box-shadow: 0 0 90px 40px rgba(32, 224, 247, 1); /* Increased glow effect */
box-shadow: 0 0 90px 40px rgba(32, 224, 247, 1);
}
}
*/
p {
@@ -84,7 +70,7 @@ button {
appearance: none;
color: white;
font-size: 1.2rem;
box-shadow: 0px 8px 28px -6px rgba(87, 120, 196, 0.587),
box-shadow: 0px 8px 28px -6px rgba(4, 112, 4, 0.587),
0px 18px 88px -4px rgba(24, 39, 75, 0.14);
transition: all ease-in 0.1s;
cursor: pointer;
@@ -94,7 +80,7 @@ button {
button:hover {
transform: scale(1.05);
opacity: 1;
background-color: rgba(25, 172, 185, 0.86);
background-color: rgba(36, 146, 8, 0.86);
box-shadow: 10px 45px 35px rgba(10, 10, 9, 0.25);
}
@@ -255,8 +241,8 @@ a:hover {
}
.updatebtn {
background-color: #FF8000;
background-color: #63c20a;
}
.updatebtn:hover {
background-color: #FFA500;
background-color: #55bd01;
}

View File

@@ -180,11 +180,18 @@ function WoWClientPatcher() {
return (
<Container maxWidth="md" sx={{ border: 0 }}>
<div className="snowfall">
<Snowfall
{/* <Snowfall
changeFrequency={150}
speed={[2.5, 20]}
wind={[2.0, 5.0]}
color="rgba(200,220,230,0.35)"
/> */}
<Snowfall
changeFrequency={50}
speed={[1.0, 2]}
wind={[1.0, 1.0]}
color="rgba(15,90,20,0.55)"
snowflakeCount={50}
/>
</div>
<div className="wowlogo">
@@ -498,7 +505,7 @@ function WoWClientPatcher() {
left: '30%',
position: 'absolute',
backgroundColor: 'rgba(0,0,0,0.70)',
color: 'rgba(11,207,247, 1.0)',
color: 'rgba(11,207,47, 1.0)',
cursor: 'pointer',
}} severity="info">A newer version of this launcher can be download by clicking <b>here</b></Alert> }
</Box>

View File

@@ -2,22 +2,25 @@ import { createRoot } from 'react-dom/client';
import { Howl } from 'howler';
import React from 'react';
import App from './App';
import bgmusic from '../../assets/sounds/frozen-throne.mp3';
import bgmusiclk from '../../assets/sounds/frozen-throne.mp3';
import bgmusic from '../../assets/sounds/burning-crusade-bt.mp3';
const container = document.getElementById('root') as HTMLElement;
const root = createRoot(container);
root.render(<App />);
declare const window: Window;
const music = [bgmusic];
const sound = new Howl({
src: [bgmusic],
src: music,
autoplay: true,
loop: true,
html5: true,
volume: 0.25,
});
sound.play();
/**
* Register global events