darkside13
Centipat
- Katılım
- 11 Ağustos 2024
- Mesajlar
- 13
Daha fazla
- Cinsiyet
- Erkek
Kod:
<!DOCTYPE html>
<Html lang="TR">
<Head>
<Meta charset="UTF-8" />
<Meta name="viewport" content="width = device-width, initial-scale = 1" />
<Title>Ana Ekran</title>
<Style>
HTML, body {
Margin: 0; padding: 0;
Height: 100%;
Font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
Color: White;
Overflow: Hidden;
Position: Relative;
Background-color: #1E1e2F;
}
#Background {
Position: Fixed;
Top: 0; left: 0; right: 0; bottom: 0;
/* Background-image burada boş, inline style ile JS'de atanacak */
Background-repeat: No-repeat;
Background-size: Cover;
Background-position: Center Center;
Filter: Brightness(0.5);
Z-index: -1;
}
#Header {
Position: Fixed;
Top: 20px;
Width: 100%;
Text-align: Center;
Font-size: 36px;
Font-weight: Bold;
Letter-spacing: 4px;
Text-Shadow: 0 0 10px rgba(0, 0, 0,0.7);
Z-index: 10;
User-select: None;
}
#Footer {
Position: Fixed;
Bottom: 60px;
Width: 100%;
Display: Flex;
Justify-content: Center;
Gap: 20px;
Z-index: 10;
}
Button {
Padding: 12px 30px;
Font-size: 18px;
Font-weight: 600;
Border: None;
Border-radius: 6px;
Cursor: Pointer;
Transition: Background-color 0.3s ease, box-Shadow 0.3s ease;
User-select: None;
Box-Shadow: 0 4px 8px rgba(0, 0, 0,0.2);
}
#Play-btn {
Background-color: #43b581;
Color: White;
}
#Play-btn: Hover {
Background-color: #369F6D;
Box-Shadow: 0 6px 12px rgba(54, 159, 109, 0.7);
}
#Logout-btn {
Background-color: #F04747;
Color: White;
}
#Logout-btn: Hover {
Background-color: #B83737;
Box-Shadow: 0 6px 12px rgba(184, 55, 55, 0.7);
}
#Log-bar-container {
Position: Fixed;
Bottom: 20px;
Left: 50%;
Transform: TranslateX(-50%);
Width: 360px;
Height: 24px;
Background: Rgba(255, 255, 255,0.15);
Border-radius: 12px;
Overflow: Hidden;
Box-Shadow: 0 0 10px rgba(0, 0, 0,0.7);
Z-index: 10;
User-select: None;
}
#Log-bar-progress {
Height: 100%;
Width: 0%;
Background: Linear-gradient(90deg, #43b581, #369F6D);
Transition: Width 0.3s ease;
}
#Log-bar-text {
Position: Absolute;
Width: 100%;
Height: 24px;
Top: 0;
Left: 0;
Text-align: Center;
Line-height: 24px;
Font-size: 14px;
Color: White;
Text-Shadow: 0 0 3px Black;
Pointer-events: None;
User-select: None;
}
</Style>
</Head>
<Body>
<Div ID="background"></div>
<Div ID="header">AZENETWORK</div>
<Div ID="footer">
<Button ID="play-btn">Oyna</button>
<Button ID="logout-btn">Çıkış Yap</button>
</Div>
<Div ID="log-bar-container">
<Div ID="log-bar-progress"></div>
<Div ID="log-bar-text">Başlatılmayı bekliyor...</div>
</Div>
<Script>
// Electron preload veya contextBridge ile erişim yoksa.
Const ipcRenderer = window. İpcRenderer || require('electron').ipcRenderer;
// Background resim yolunu JS ile doğru şekilde ayarla.
Const path = require('path');
Const backgroundDiv = document. GetElementById('background');
Const imagePath = path. Join(__dirname, 'assets', 'bg. JPG').replace(/\\/g, '/');
BackgroundDiv. Style. BackgroundImage = 'URL('file://${imagePath}')';
// Kullanıcı kontrolü.
Const username = localStorage. GetItem('loggedUser');
İf (!username) {
Window. Location. Href = 'login.html';
}
Const logBarProgress = document. GetElementById('log-bar-progress');
Const logBarText = document. GetElementById('log-bar-text');
Let logCount = 0;
Const maxLogs = 20;
Document. GetElementById('play-btn').addEventListener('Click', () => {
İpcRenderer. Send('launch-game', username);
AddLog("Minecraft başlatılıyor...");
});
İpcRenderer. On('log', (Event, message) => {
AddLog(message);
});
Document. GetElementById('logout-btn').addEventListener('Click', () => {
LocalStorage. RemoveItem('loggedUser');
Window. Location. Href = 'login.html';
});
Function addLog(message) {
LogCount++;
İf (logCount > maxLogs) logCount = maxLogs;
Const percentage = (logCount / maxLogs) * 100;
LogBarProgress. Style. Width = percentage + '%';
LogBarText. TextContent = message;
}
</Script>
</Body>
</Html>Arkadaş buradaki kodda arka planda resim çıkmıyor nasıl çözerim?
