Mirror/Erupe
1
0
Fork 0
mirror of https://github.com/Mezeporta/Erupe.git synced 2025-12-15 00:15:08 +01:00
Code Issues Packages Projects Releases Wiki Activity

Finalise launcher code

Browse Source
This commit is contained in:
wishu
2022-04-24 15:05:41 +10:00
parent 4baed27d18
commit 08a9bc495e
5 changed files with 146 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
Erupe/www/erupe/css/main.css
View File

@@ -111,7 +111,6 @@ body{background:#092314; font-family:sans-serif; color:#d1c0a5; font-size:14px;
#footer{width:100%; height:39px; position:absolute; left:0; bottom:0; background-color:rgba(0,0,0,0.6); overflow:hidden;} #footer{width:100%; height:39px; position:absolute; left:0; bottom:0; background-color:rgba(0,0,0,0.6); overflow:hidden;}
#footer .link{padding:4px; display:block; z-index:1000; cursor:pointer;float:left;} #footer .link{padding:4px; display:block; z-index:1000; cursor:pointer;float:left;}
#launcher_info_list{width:535px; height:240px; position:absolute; right:38px; padding:5px; top:135px; overflow:hidden; overflow-y:auto; background-color:rgba(0,0,0,0.5); border-radius:3px 3px 3px 3px; border: 1px solid #a6a08a;} #launcher_info_list{width:535px; height:240px; position:absolute; right:38px; padding:5px; top:135px; overflow:hidden; overflow-y:auto; background-color:rgba(0,0,0,0.5); border-radius:3px 3px 3px 3px; border: 1px solid #a6a08a;}
#launcher_info_list .important_info, #launcher_info_list .normal_info{margin-bottom:5px;} #launcher_info_list .important_info, #launcher_info_list .normal_info{margin-bottom:5px;}
#launcher_info_list .head{width:513px; height:23px; position:relative;} #launcher_info_list .head{width:513px; height:23px; position:relative;}
@@ -139,21 +138,21 @@ body{background:#092314; font-family:sans-serif; color:#d1c0a5; font-size:14px;
#launcher_modal .dialog p span.attention{color:#f4de22;} #launcher_modal .dialog p span.attention{color:#f4de22;}
#launcher_modal .dialog p span.notes{color:#eb3535; font-size:16px; line-height:20px;} #launcher_modal .dialog p span.notes{color:#eb3535; font-size:16px; line-height:20px;}
#launcher_modal .dialog p div.sp{width:100%; height:10px;} #launcher_modal .dialog p div.sp{width:100%; height:10px;}
#launcher_modal .dialog .btnBox{width:100%; height:44px; position:absolute; left:0; top:252px;} #launcher_modal .dialog .btn_box{width:100%; height:44px; position:absolute; left:0; top:252px;}
#launcher_modal .dialog .btns{text-align:center; margin:0 auto; position:relative; overflow:hidden} #launcher_modal .dialog .btns{text-align:center; margin:0 auto; position:relative; overflow:hidden;}
#launcher_modal .dialog .btns ul{position:relative; left:50%; float:left; list-style:none} #launcher_modal .dialog .btns ul{position:relative; left:50%; float:left; list-style:none}
#launcher_modal .dialog .btns ul li{position:relative; left:-50%; float:left; margin-left:33px;} #launcher_modal .dialog .btns ul li{position:relative; left:-50%; float:left; margin-left:33px;}
#launcher_modal .dialog .btns ul li:first-child{margin-left:5px;} #launcher_modal .dialog .btns ul li:first-child{margin-left:5px;}
#launcher_modal .dialog .btns ul li div{display:block; width:130px; height:35px; padding-top:9px; position:relative; background:url(../img/button_option.png) no-repeat 0px 0px; text-decoration:none; color:#d1c0a5; font-weight:bold; font-size:18px; line-height:18px; text-align:center; cursor:pointer;} #launcher_modal .dialog .btns ul li div{display:block; width:130px; height:35px; padding-top:9px; position:relative; background:url(../img/button_option.png) no-repeat 0px 0px; text-decoration:none; color:white; font-weight:bold; font-size:18px; line-height:18px; text-align:center; cursor:pointer;}
#launcher_modal .dialog .btns ul li div:hover,#launcher_modal .dialog .btns ul li div.hover{background:url(../img/button_option_hover.png) no-repeat 0px 0px;} #launcher_modal .dialog .btns ul li div:hover,
#launcher_modal .dialog .btns ul li div.wait:hover,#launcher_modal .dialog .btns ul li div.wait.hover{background-position:0px 0px; cursor:default;} #launcher_modal .dialog .btns ul li div.hover{background:url(../img/button_option_hover.png) no-repeat 0px 0px;}
#launcher_menu{height:86px; position:absolute; left:535px; top:416px; overflow:hidden;} #launcher_menu{height:86px; position:absolute; left:535px; top:416px; overflow:hidden;}
#launcher_menu .btn{width:82px; height:86px; background:no-repeat 0px 0px; float:left; margin:0 2px; cursor:pointer;} #launcher_menu .btn{width:82px; height:86px; background:no-repeat 0px 0px; float:left; margin:0 2px; cursor:pointer;}
#launcher_menu .btn:hover{background-position:0px -86px;} #launcher_menu .btn:hover{background-position:0px -86px;}
#launcher_menu .btn.hangameb,#launcher_menu .btn.hancoin{display:none;} #launcher_menu .btn.manual{background-image:url(../img/manual.png);}
#launcher_menu .btn.manual{background:url(../img/manual.png);} #launcher_menu .btn.pastebin{background-image:url(../img/pastebin.png);}
#launcher_menu .btn.pastebin{background:url(../img/pastebin.png);}
/* UNUSED /* UNUSED
#launcher_bnr{width:533px; height:129px; position:absolute; right:38px; top:30px;} #launcher_bnr{width:533px; height:129px; position:absolute; right:38px; top:30px;}
#launcher_bnr .bnr{width:523px; height:129px; position:absolute; left:0; top:0; background:no-repeat 0px 0px; overflow:hidden;} #launcher_bnr .bnr{width:523px; height:129px; position:absolute; left:0; top:0; background:no-repeat 0px 0px; overflow:hidden;}

BIN
Erupe/www/erupe/img/manual.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
Erupe/www/erupe/img/pastebin.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 5.0 KiB

98
Erupe/www/erupe/index.html
View File

@@ -15,8 +15,8 @@
<div id="game_starting"></div> <div id="game_starting"></div>
<div id="window_controls"> <div id="window_controls">
<div class="grabbable"></div> <div class="grabbable"></div>
<div class="unselectable button_min" onclick="window.external.minimizeWindow()" onmouseover="soundSel()">__</div> <div class="unselectable button_min" onclick="soundOk(); window.external.minimizeWindow()" onmouseover="soundSel()">__</div>
<div class="unselectable button_close" onclick="window.external.closeWindow()" onmouseover="soundSel()">✕</div> <div class="unselectable button_close" onclick="soundOk(); window.external.closeWindow()" onmouseover="soundSel()">✕</div>
</div> </div>
<div id="header"> <div id="header">
<div class="grabbable"></div> <div class="grabbable"></div>
@@ -33,67 +33,52 @@
<div class="login_form"> <div class="login_form">
<form id="login_form" onsubmit="event.preventDefault();doLogin()"> <form id="login_form" onsubmit="event.preventDefault();doLogin()">
<label for="username" class="unselectable label_username">Erupe ID</label> <label for="username" class="unselectable label_username">Erupe ID</label>
<input type="text" id="username" placeholder="Username" onkeyup="soundSel()" onmouseover="soundSel()"> <input type="text" id="username" placeholder="Username" onkeypress="soundSel()" onmouseover="soundSel()" onclick="soundOk()">
<label for="password" class="unselectable label_password">Password</label> <label for="password" class="unselectable label_password">Password</label>
<input type="password" id="password" placeholder="Password" onkeyup="soundSel()" onmouseover="soundSel()"> <input type="password" id="password" placeholder="Password" onkeypress="soundSel()" onmouseover="soundSel()" onclick="soundOk()">
<label for="server" class="label_server">Server</label> <label for="server" class="unselectable label_server">Server</label>
<input type="text" id="server" value="Erupe" readonly> <input class="unselectable" type="text" id="server" value="Erupe" readonly>
<input type="submit"> <input type="submit">
</form> </form>
</div> </div>
<div class="unselectable login_button" onmouseenter="soundSel()" onclick="doLogin()"><span <div class="unselectable login_button" onmouseenter="soundSel()" onclick="doLogin()"><span class="unselectable">Log In</span></div>
class="unselectable">Log In</span></div> <div class="unselectable login_save">
<div class="unselectable login_save"><input type="checkbox" id="login_save"><span id="login_save_text"> Remember <input class="unselectable" type="checkbox" id="login_save"><span id="login_save_text"> Remember Login</span>
Login</span></div> </div>
</div>
<div id="launcher_menu" class="unselectable" unselectable="on" onselectstart="return false;">
<div class="manual btn" onclick="toggleModal('openLink','http://mhfz.capcom.com.tw/manuals/')"
unselectable="on" onselectstart="return false;"></div>
<div class="pastebin btn" onclick="toggleModal('openLink','https://pastebin.com/QqAwZSTC')" unselectable="on"
onselectstart="return false;"></div>
</div> </div>
<div id="char_select"> <div id="char_select">
<div id="units"></div> <div id="units"></div>
<div class="weapon_text">Current Weapon</div> <div class="weapon_text">Current Weapon</div>
<div class="scroll up" onmouseover="soundSel()" onclick="soundOk();charselScrollUp()"></div> <div class="scroll up" onmouseover="soundSel()" onclick="soundOk();charselScrollUp()"></div>
<div class="scroll down" onmouseover="soundSel()" onclick="soundOk();charselScrollDown()"></div> <div class="scroll down" onmouseover="soundSel()" onclick="soundOk();charselScrollDown()"></div>
<div class="auto_login" onclick="autoWarning()"><input type="checkbox" id="auto_box"><span id="auto_text"> <div class="auto_login" onclick="autoWarning()">
Auto-Login</span></div> <input type="checkbox" id="auto_box"><span id="auto_text"> Auto-Login</span>
<div class="button_add" onmouseenter="soundSel()" onclick="soundOk();charselAdd()"><span class="unselectable">Add </div>
Character</span></div> <div class="button_add" onmouseenter="soundSel()" onclick="soundOk();charselAdd()"><span class="unselectable">Add Character</span></div>
<div class="button_del" onmouseenter="soundSel()" onclick="soundOk();charselDel()"><span <div class="button_del" onmouseenter="soundSel()" onclick="soundOk();charselDel()"><span class="unselectable">Delete Character</span></div>
class="unselectable">Delete Character</span></div> <div class="button_log" onmouseenter="soundSel()" onclick="soundOk();charselLog()"><span class="unselectable">Log Out</span></div>
<div class="button_log" onmouseenter="soundSel()" onclick="soundOk();charselLog()"><span class="unselectable">Log <div class="button_start" onmouseenter="soundSel()" onclick="soundLogin();launch()"><span class="unselectable">Launch</span></div>
Out</span></div>
<div class="button_start" onmouseenter="soundSel()" onclick="soundLogin();launch()"><span
class="unselectable">Launch</span></div>
</div> </div>
<div class="unselectable" id="log_outer"> <div class="unselectable" id="log_outer">
<div class="log_inner"> <div class="log_inner">
<p id="log_p"></p> <p id="log_p"></p>
</div> </div>
</div> </div>
<div class="unselectable" id="button_config" onclick="soundOk();window.external.openMhlConfig()" <div class="unselectable" id="button_config" onclick="soundOk();window.external.openMhlConfig()" onmouseover="soundSel()"></div>
onmouseover="soundSel()"></div> <div id="launcher_info_list" class="unselectable">
<div id="footer">
<div class="link" onclick="toggleModal('openLink','https://github.com/sekaiwish/Erupe')"><img
src="img/icons/github.png"></div>
<div class="link" onclick="toggleModal('openLink','https://discord.gg/r4eYU2StK6')"><img
src="img/icons/discord.png"></div>
</div>
<div id="launcher_info_list" class="unselectable" style="display:block;">
<div class="important_info"> <div class="important_info">
<div class="head"> <div class="head">
<p class="lbl">Important Updates</p> <p class="lbl">Important Updates</p>
</div> </div>
<ul class="article"> <ul class="article">
<li> <li>
<div class="date">2020-04-01</div> <div class="date">2022-04-24</div>
<div class="body"><a <div class="body">
href="javascript:toggleModal('openLink',&quot;https://discord.com/channels/368424389416583169/929509970624532511/964339905364918272&quot;);" <a
onclick="soundOk();" unselectable="on" onselectstart="return false;">English PATCH v2.0 href="javascript:toggleModal('openLink',&quot;https://discord.com/channels/368424389416583169/929509970624532511/964339905364918272&quot;);"
RELEASED</a></div> onclick="soundOk()">Launcher Patch v1.0 Released!
</a>
</div>
</li> </li>
</ul> </ul>
</div> </div>
@@ -103,22 +88,30 @@
</div> </div>
<ul class="article"> <ul class="article">
<li> <li>
<div class="date">2020-04-01</div> <div class="date">2022-04-24</div>
<div class="body"><a <div class="body">
href="javascript:toggleModal('openLink',&quot;https://discord.com/channels/368424389416583169/929509970624532511/964339905364918272&quot;);" <a
onclick="soundOk();" unselectable="on" onselectstart="return false;">Join discord for a community and href="javascript:toggleModal('openLink',&quot;https://discord.gg/CFnzbhQ&quot;);"
updates!</a></div> onclick="soundOk()">Join the community discord for updates!
</a>
</div>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
<div id="launcher_modal"> <div id="launcher_menu" class="unselectable">
<div class="modal" onclick="return false;" unselectable="on" onselectstart="return false;"></div> <div class="manual btn" onmouseenter="soundSel()" onclick="soundOk(); toggleModal('openLink', 'https://mhfz.capcom.com.tw/manuals/')"></div>
<div class="pastebin btn" onmouseenter="soundSel()" onclick="soundOk(); toggleModal('openLink', 'https://pastebin.com/QqAwZSTC')"></div>
</div>
<div id="footer">
<div class="link unselectable" onclick="toggleModal('openLink', 'https://github.com/xl3lackout/Erupe')"><img src="img/icons/github.png"></div>
<div class="link unselectable" onclick="toggleModal('openLink', 'https://discord.gg/CFnzbhQ')"><img src="img/icons/discord.png"></div>
</div>
<div class="grabbable" id="launcher_modal">
<div class="modal"></div>
<div class="dialog"> <div class="dialog">
<p unselectable="on" onselectstart="return false;"></p> <p></p>
<div class="btnBox"> <div class="btn_box"><div class="btns unselectable"></div></div>
<div class="btns"></div>
</div>
</div> </div>
</div> </div>
<div class="unselectable" id="dev"> <div class="unselectable" id="dev">
@@ -130,5 +123,4 @@
</div> </div>
<script src="js/script.js"></script> <script src="js/script.js"></script>
</body> </body>
</html> </html>

143
Erupe/www/erupe/js/script.js
View File

@@ -83,25 +83,25 @@ function saveAccount() {
function createCharItem(name, uid, weapon, hr, gr, date, sex) { function createCharItem(name, uid, weapon, hr, gr, date, sex) {
var icon; var icon;
const dateObject = new Date(date * 1000); const dateObject = new Date(date * 1000);
date = dateObject.toLocaleDateString('en-US'); date = dateObject.toLocaleDateString('en-US');
let dateString = ''; let dateString = '';
for (var i = 0; i < date.length; i++) { for (var i = 0; i < date.length; i++) {
if (date[i] != '‎') { // invisible LTR char if (date[i] != '‎') { // invisible LTR char
dateString += date[i]; dateString += date[i];
} }
} }
if (sex == 'M') { if (sex == 'M') {
sex = "♂"; sex = "♂";
} else { } else {
sex = "♀"; sex = "♀";
} }
if (hr > 999) { if (hr > 999) {
hr = 999; hr = 999;
} }
if (gr > 999) { if (gr > 999) {
gr = 999; gr = 999;
} }
switch (weapon) { switch (weapon) {
case '片手剣': case '片手剣':
weapon = 'Sword & Shield'; weapon = 'Sword & Shield';
@@ -268,11 +268,12 @@ function doLogin(option) {
soundPreLogin(); soundPreLogin();
addLog('Authenticating...', 'normal'); addLog('Authenticating...', 'normal');
try { try {
if(option){ if (option) {
addLog('Creating new character...', 'normal'); addLog('Creating new character...', 'normal');
window.external.loginCog(username+"+", password, password); window.external.loginCog(username+'+', password, password);
}else{ } else {
window.external.loginCog(username, password, password);} window.external.loginCog(username, password, password);
}
} catch (e) { } catch (e) {
addLog('Error on loginCog: '+e, 'error'); addLog('Error on loginCog: '+e, 'error');
} }
@@ -356,51 +357,93 @@ function setUidIndex(index) {
document.getElementById(selectedUid).classList.add('active'); document.getElementById(selectedUid).classList.add('active');
} }
function toggleModal(preset,url) { function toggleModal(preset, url) {
// just pass 0 for hiding let modal = document.getElementById('launcher_modal');
// probably call toggleModal(0) when the user clicks any button?
// besides when chaining modals (i.e confirm delete 1 -> confirm delete 2)
let modal = document.getElementById("launcher_modal") // get modal id
modalState = !modalState; modalState = !modalState;
if (modalState) { if (modalState) {
setModalContent(preset,url) setModalContent(preset, url);
modal.style.display = 'block' modal.style.display = 'block';
} else { } else {
modal.style.display = 'none' modal.style.display = 'none';
} }
} }
function setModalContent(preset,url) { function setModalContent(preset, url) {
let modal = document.getElementById("launcher_modal"); let modal = document.getElementById('launcher_modal');
switch (preset) { switch (preset) {
case 'openLink': case 'openLink':
modal.querySelector('.dialog p').innerHTML = ' \
modal.querySelector(".dialog p").innerHTML = "You have clicked a link, are you sure you want to open it?<br><span class=\"uid\"> (URL:"+url+")</span><br><div class=\"sp\"></div><span class=\"attention\">This will open a web browser</span>"; Are you sure you want to open this URL? \
modal.querySelector(".dialog .btns").innerHTML = "<ul><li><div unselectable=\"on\" onselectstart=\"return false;\" onmouseover=\"soundSel();\" onclick=\"soundOk(); window.external.openBrowser('"+url+"'); toggleModal(0);\" style=\"opacity: 1;\">Open</div></li><li><div onmouseover=\"soundSel();\" onclick=\"soundOk(); toggleModal(0);\" unselectable=\"on\" onselectstart=\"return false;\" class=\"\">Cancel</div></li></ul>"; <br> \
break; <span class="uid">'+url+'</span> \
case 'confirmCharDelete': <br> \
modal.querySelector(".dialog p").innerHTML = "Are you sure you want to delete your character?<br>INSERT NAME<span class=\"uid\"> (ID:INSER NAME)</span>?<br><div+class=\"sp\"></div><span class=\"attention\">You wont be able to recover this character<br>It will be gone forever.</span>"; <div class="sp"></div> \
modal.querySelector(".dialog .btns").innerHTML = "<ul><li><div unselectable=\"on\" onselectstart=\"return false;\" onmouseover=\"soundSel();\" onclick=\"soundOk(); addLog('Not yet implemented.', 'error'); toggleModal(0);\" style=\"opacity: 1;\">Yes</div></li><li><div onmouseover=\"soundSel();\" onclick=\"soundOk(); toggleModal(0);\" unselectable=\"on\" onselectstart=\"return false;\" class=\"\">Cancel</div></li></ul>"; <span class="attention">This will open in a browser</span> \
//Uses the launcher delete ';
//modal.querySelector(".dialog .btns").innerHTML = "<ul><li><div unselectable=\"on\" onselectstart=\"return false;\" onmouseover=\"soundSel();\" onclick=\"soundOk(); window.external.deleteCharacter('"+selectedUid+"'); toggleModal(0);\" style=\"opacity: 1;\">Yes</div></li><li><div onmouseover=\"soundSel();\" onclick=\"soundOk(); toggleModal(0);\" unselectable=\"on\" onselectstart=\"return false;\" class=\"\">Cancel</div></li></ul>"; modal.querySelector('.dialog .btns').innerHTML = ' \
break; <ul> \
case 'addCharNew': <li> \
modal.querySelector(".dialog p").innerHTML = "Historically the game required you to buy character slots. <br><div+class=\"sp\"></div><span class=\"attention\">Click the 'Add Character' Button to add a new slot.</span>"; <div onmouseover="soundSel()" onclick="soundOk(); window.external.openBrowser(\''+url+'\'); toggleModal(0)">Open</div> \
modal.querySelector(".dialog .btns").innerHTML = "<ul><li><div unselectable=\"on\" onselectstart=\"return false;\" onmouseover=\"soundSel();\" onclick=\"soundOk(); soundNiku(); doLogin(1); switchPrompt(); toggleModal(0);\" style=\"opacity: 1;\">Add Character</div></li><li><div onmouseover=\"soundSel();\" onclick=\"soundOk(); toggleModal(0);\" unselectable=\"on\" onselectstart=\"return false;\" class=\"\">Cancel</div></li></ul>"; </li> \
break; <li> \
default: <div onmouseover="soundSel()" onclick="soundOk(); toggleModal(0)">Cancel</div> \
return; </li> \
} </ul> \
';
break;
case 'confirmCharDelete':
modal.querySelector('.dialog p').innerHTML = ' \
Are you sure you want to delete your character? \
<br>NAME \
<span class="uid"> (ID: 000000)</span> \
<br> \
<div class="sp"></div> \
<span class="attention">You will not be able to recover this character, \
<br>it will be gone forever. \
</span> \
';
modal.querySelector('.dialog .btns').innerHTML = ' \
<ul> \
<li> \
<div onmouseover="soundSel()" onclick="soundOk(); addLog(\'Not yet implemented.\', \'error\'); toggleModal(0)">Yes</div> \
</li> \
<li> \
<div onmouseover="soundSel()" onclick="soundOk(); toggleModal(0)">Cancel</div> \
</li> \
</ul> \
';
// Uses the launcher delete
// modal.querySelector(".dialog .btns").innerHTML = "<ul><li><div unselectable=\"on\" onselectstart=\"return false;\" onmouseover=\"soundSel();\" onclick=\"soundOk(); window.external.deleteCharacter('"+selectedUid+"'); toggleModal(0);\" style=\"opacity: 1;\">Yes</div></li><li><div onmouseover=\"soundSel();\" onclick=\"soundOk(); toggleModal(0);\" unselectable=\"on\" onselectstart=\"return false;\" class=\"\">Cancel</div></li></ul>";
break;
case 'addCharNew':
modal.querySelector('.dialog p').innerHTML = ' \
Are you sure you want to add a new character? \
<br> \
<div class="sp"></div> \
<span class="attention">Press [Add Character] to add a new slot.</span> \
';
modal.querySelector('.dialog .btns').innerHTML = ' \
<ul> \
<li> \
<div onmouseover="soundSel()" onclick="soundNiku(); doLogin(1); switchPrompt(); toggleModal(0)">Add Character</div> \
</li> \
<li> \
<div onmouseover="soundSel()" onclick="soundOk(); toggleModal(0)">Cancel</div> \
</li> \
</ul> \
';
break;
default:
return;
}
} }
function charselAdd() { function charselAdd() {
toggleModal('addCharNew') toggleModal('addCharNew');
} }
function charselDel() { function charselDel() {
toggleModal('confirmCharDelete') toggleModal('confirmCharDelete');
} }
function charselLog() { function charselLog() {