From 009a1b58af1fb82e7689f300db378c5e026b9194 Mon Sep 17 00:00:00 2001
From: Daniel Scalzi <d_scalzi@yahoo.com>
Date: Fri, 27 Apr 2018 00:04:09 -0400
Subject: [PATCH] Added basic functionality to server selection UI.
The server list is now dynamically generated based on the servers listed in the distribution index. Also, moved to event.key for key bindings as event.keyCode is deprecated.
---
app/assets/css/launcher.css | 4 +--
app/assets/js/scripts/landing.js | 2 +-
app/assets/js/scripts/overlay.js | 57 ++++++++++++++++++++++++++++-
app/assets/js/scripts/uicore.js | 2 +-
app/assets/westeroscraft.json | 39 +++++++++++++++++++-
app/overlay.ejs | 61 +++-----------------------------
6 files changed, 102 insertions(+), 63 deletions(-)
diff --git a/app/assets/css/launcher.css b/app/assets/css/launcher.css
index b4d36a63..fdc0cc8c 100644
--- a/app/assets/css/launcher.css
+++ b/app/assets/css/launcher.css
@@ -1562,7 +1562,7 @@ p {
margin: 0px 10px 0px 5px;
border: 1px solid #fff;
height: 50px;
- width: auto;
+ width: 50px;
}
/* Content container for the server listing's details. */
@@ -1657,7 +1657,7 @@ p {
border-style: solid;
border-color: transparent rgba(0, 0, 0, 0.40) transparent transparent;
}
-#serverListingStarWrapper:hover .serverListingStarTooltip {
+.serverListingStarWrapper:hover .serverListingStarTooltip {
visibility: visible;
opacity: 1;
transition-delay:0s;
diff --git a/app/assets/js/scripts/landing.js b/app/assets/js/scripts/landing.js
index a968d427..719e5877 100644
--- a/app/assets/js/scripts/landing.js
+++ b/app/assets/js/scripts/landing.js
@@ -113,7 +113,7 @@ function updateSelectedServer(serverName){
updateSelectedServer(AssetGuard.getServerById(ConfigManager.getGameDirectory(), ConfigManager.getSelectedServer()).name)
server_selection_button.addEventListener('click', (e) => {
e.target.blur()
- toggleOverlay(true, 'serverSelectContent')
+ toggleServerSelection(true)
})
// Test menu transform.
diff --git a/app/assets/js/scripts/overlay.js b/app/assets/js/scripts/overlay.js
index 0b3e0cf8..195ab7f2 100644
--- a/app/assets/js/scripts/overlay.js
+++ b/app/assets/js/scripts/overlay.js
@@ -42,6 +42,11 @@ function toggleOverlay(toggleState, dismissable = false, content = 'overlayConte
}
}
+function toggleServerSelection(toggleState){
+ prepareServerSelectionList()
+ toggleOverlay(toggleState, 'serverSelectContent')
+}
+
/**
* Set the content of the overlay.
*
@@ -91,12 +96,26 @@ function setDismissHandler(handler){
/* Server Select View */
+document.addEventListener('keydown', (e) => {
+ if(document.getElementById('serverSelectContent').style.display !== 'none'){
+ console.debug('ServSelLi Keydown Called:', document.getElementById('serverSelectContent').style.display)
+ if(e.key === 'Escape'){
+ document.getElementById('serverSelectCancel').click()
+ } else if(e.key === 'Enter'){
+ document.getElementById('serverSelectConfirm').click()
+ }
+ }
+})
+
+document.getElementById('serverSelectActions').onsubmit = () => { return false }
+
document.getElementById('serverSelectConfirm').addEventListener('click', () => {
const listings = document.getElementsByClassName('serverListing')
for(let i=0; i<listings.length; i++){
if(listings[i].hasAttribute('selected')){
const serv = AssetGuard.getServerById(ConfigManager.getGameDirectory(), listings[i].getAttribute('servid'))
ConfigManager.setSelectedServer(serv != null ? serv.id : null)
+ ConfigManager.save()
updateSelectedServer(serv != null ? serv.name : null)
setLaunchEnabled(serv != null)
refreshServerStatus(true)
@@ -135,4 +154,40 @@ function setServerListingHandlers(){
}
})
}
-setServerListingHandlers()
\ No newline at end of file
+
+function populateServerListings(){
+ const distro = AssetGuard.retrieveDistributionDataSync(ConfigManager.getGameDirectory())
+ const giaSel = ConfigManager.getSelectedServer()
+ const servers = distro.servers
+ let htmlString = ``
+ for(let i=0; i<servers.length; i++){
+ htmlString += `<button class="serverListing" servid="${servers[i].id}" ${servers[i].id === giaSel ? `selected` : ``}>
+ <img class="serverListingImg" src="${servers[i].icon_url}"/>
+ <div class="serverListingDetails">
+ <span class="serverListingName">${servers[i].name}</span>
+ <span class="serverListingDescription">${servers[i].description}</span>
+ <div class="serverListingInfo">
+ <div class="serverListingVersion">${servers[i].mc_version}</div>
+ <div class="serverListingRevision">${servers[i].revision}</div>
+ ${servers[i].default_selected ? `<div class="serverListingStarWrapper">
+ <svg id="Layer_1" viewBox="0 0 107.45 104.74" width="20px" height="20px">
+ <defs>
+ <style>.cls-1{fill:#fff;}.cls-2{fill:none;stroke:#fff;stroke-miterlimit:10;}</style>
+ </defs>
+ <path class="cls-1" d="M100.93,65.54C89,62,68.18,55.65,63.54,52.13c2.7-5.23,18.8-19.2,28-27.55C81.36,31.74,63.74,43.87,58.09,45.3c-2.41-5.37-3.61-26.52-4.37-39-.77,12.46-2,33.64-4.36,39-5.7-1.46-23.3-13.57-33.49-20.72,9.26,8.37,25.39,22.36,28,27.55C39.21,55.68,18.47,62,6.52,65.55c12.32-2,33.63-6.06,39.34-4.9-.16,5.87-8.41,26.16-13.11,37.69,6.1-10.89,16.52-30.16,21-33.9,4.5,3.79,14.93,23.09,21,34C70,86.84,61.73,66.48,61.59,60.65,67.36,59.49,88.64,63.52,100.93,65.54Z"/>
+ <circle class="cls-2" cx="53.73" cy="53.9" r="38"/>
+ </svg>
+ <span class="serverListingStarTooltip">Main Server</span>
+ </div>` : ``}
+ </div>
+ </div>
+ </button>`
+ }
+ document.getElementById('serverSelectListScrollable').innerHTML = htmlString
+
+}
+
+function prepareServerSelectionList(){
+ populateServerListings()
+ setServerListingHandlers()
+}
\ No newline at end of file
diff --git a/app/assets/js/scripts/uicore.js b/app/assets/js/scripts/uicore.js
index 527dd08b..758f575f 100644
--- a/app/assets/js/scripts/uicore.js
+++ b/app/assets/js/scripts/uicore.js
@@ -99,7 +99,7 @@ $(document).on('click', 'a[href^="http"]', function(event) {
* DevTools, for example the chrome debugger in VS Code.
*/
document.addEventListener('keydown', function (e) {
- if(e.keyCode == 73 && e.ctrlKey && e.shiftKey){
+ if(e.key === 'I' && e.ctrlKey && e.shiftKey){
let window = remote.getCurrentWindow()
window.toggleDevTools()
}
diff --git a/app/assets/westeroscraft.json b/app/assets/westeroscraft.json
index a9668516..e0c2c01c 100644
--- a/app/assets/westeroscraft.json
+++ b/app/assets/westeroscraft.json
@@ -12,9 +12,10 @@
{
"id": "WesterosCraft-1.11.2",
"name": "WesterosCraft Production Server",
+ "description": "Main WesterosCraft server. Connect to enter the Realm.",
"news_feed": "http://www.westeroscraft.com/api/rss.php?preset_id=12700544",
"icon_url": "http://mc.westeroscraft.com/WesterosCraftLauncher/files/server-prod.png",
- "revision": "0.0.1",
+ "revision": "3.4.17",
"server_ip": "mc.westeroscraft.com",
"mc_version": "1.11.2",
"discord": {
@@ -409,6 +410,42 @@
}
}
]
+ },
+ {
+ "id": "WesterosCraftTest-1.11.2",
+ "name": "WesterosCraft Test Server",
+ "description": "Main testing server. Experimental changes are live here.",
+ "news_feed": "http://www.westeroscraft.com/api/rss.php?preset_id=12700544",
+ "icon_url": "http://mc.westeroscraft.com/WesterosCraftLauncher/files/server-test.png",
+ "revision": "3.6.0",
+ "server_ip": "mc.westeroscraft.com:4444",
+ "mc_version": "1.11.2",
+ "discord": {
+ "shortId": "Test Server",
+ "largeImageText": "WesterosCraft Test Server",
+ "largeImageKey": "server-test"
+ },
+ "default_selected": false,
+ "autoconnect": true,
+ "modules": []
+ },
+ {
+ "id": "WesterosCraftTest-1.12.2",
+ "name": "WesterosCraft 1.12.2 Test Server",
+ "description": "Tests for our version change to 1.12.2 are live here.",
+ "news_feed": "http://www.westeroscraft.com/api/rss.php?preset_id=12700544",
+ "icon_url": "http://mc.westeroscraft.com/WesterosCraftLauncher/files/server-test.png",
+ "revision": "4.0.1",
+ "server_ip": "mc.westeroscraft.com:4445",
+ "mc_version": "1.12.2",
+ "discord": {
+ "shortId": "1.12.2 Test Server",
+ "largeImageText": "WesterosCraft 1.12.2 Test Server",
+ "largeImageKey": "server-test"
+ },
+ "default_selected": false,
+ "autoconnect": true,
+ "modules": []
}
]
}
\ No newline at end of file
diff --git a/app/overlay.ejs b/app/overlay.ejs
index 9f714c0d..0340afdd 100644
--- a/app/overlay.ejs
+++ b/app/overlay.ejs
@@ -1,72 +1,19 @@
<div id="overlayContainer" style="display: none;">
- <div id="serverSelectContent">
+ <div id="serverSelectContent" style="display: none;">
<span id="serverSelectHeader">Available Servers</span>
<div id="serverSelectList">
<div id="serverSelectListScrollable">
- <button class="serverListing" servid="WesterosCraft-1.11.2" selected>
- <img class="serverListingImg" src="./assets/images/WesterosSealSquare.png"/>
- <div class="serverListingDetails">
- <span class="serverListingName">WesterosCraft Production Server</span>
- <span class="serverListingDescription">Main WesterosCraft server. Connect to enter the Realm.</span>
- <div class="serverListingInfo">
- <div class="serverListingVersion">1.11.2</div>
- <div class="serverListingRevision">3.4.17</div>
- <div class="serverListingStarWrapper">
- <svg id="Layer_1" viewBox="0 0 107.45 104.74" width="20px" height="20px">
- <defs>
- <style>.cls-1{fill:#fff;}.cls-2{fill:none;stroke:#fff;stroke-miterlimit:10;}</style>
- </defs>
- <path class="cls-1" d="M100.93,65.54C89,62,68.18,55.65,63.54,52.13c2.7-5.23,18.8-19.2,28-27.55C81.36,31.74,63.74,43.87,58.09,45.3c-2.41-5.37-3.61-26.52-4.37-39-.77,12.46-2,33.64-4.36,39-5.7-1.46-23.3-13.57-33.49-20.72,9.26,8.37,25.39,22.36,28,27.55C39.21,55.68,18.47,62,6.52,65.55c12.32-2,33.63-6.06,39.34-4.9-.16,5.87-8.41,26.16-13.11,37.69,6.1-10.89,16.52-30.16,21-33.9,4.5,3.79,14.93,23.09,21,34C70,86.84,61.73,66.48,61.59,60.65,67.36,59.49,88.64,63.52,100.93,65.54Z"/>
- <circle class="cls-2" cx="53.73" cy="53.9" r="38"/>
- </svg>
- <span class="serverListingStarTooltip">Main Server</span>
- </div>
- </div>
- </div>
- </button>
- <button class="serverListing" servid="WesterosCraft-Test">
- <img class="serverListingImg" src="./assets/images/testserver.png"/>
- <div class="serverListingDetails">
- <span class="serverListingName">WesterosCraft Test Server</span>
- <span class="serverListingDescription">Main testing server. Experimental changes live here.</span>
- <div class="serverListingInfo">
- <div class="serverListingVersion">1.11.2</div>
- <div class="serverListingRevision">3.6.0</div>
- </div>
- </div>
- </button>
- <button class="serverListing" servid="WesterosCraft-Test-1.12.2">
- <img class="serverListingImg" src="./assets/images/testserver.png"/>
- <div class="serverListingDetails">
- <span class="serverListingName">WesterosCraft 1.12.2 Test Server</span>
- <span class="serverListingDescription">Tests for our version change to 1.12.2 are live here.</span>
- <div class="serverListingInfo">
- <div class="serverListingVersion">1.12.2</div>
- <div class="serverListingRevision">4.0.1</div>
- </div>
- </div>
- </button>
- <button class="serverListing" servid="EssosCraft">
- <img class="serverListingImg" src="./assets/images/testserver.png"/>
- <div class="serverListingDetails">
- <span class="serverListingName">EssosCraft Test Server</span>
- <span class="serverListingDescription">Tests for our next project!</span>
- <div class="serverListingInfo">
- <div class="serverListingVersion">1.15.0</div>
- <div class="serverListingRevision">9.7.2</div>
- </div>
- </div>
- </button>
+ <!-- Server sistings populated here. -->
</div>
</div>
<div id="serverSelectActions">
- <button id="serverSelectConfirm">Select</button>
+ <button id="serverSelectConfirm" type="submit">Select</button>
<div id="serverSelectCancelWrapper">
<button id="serverSelectCancel">Cancel</button>
</div>
</div>
</div>
- <div id="overlayContent" style="display: none;">
+ <div id="overlayContent">
<span id="overlayTitle">Lorem Ipsum:<br>Finis Illud</span>
<span id="overlayDesc">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud..</span>
<div id="overlayActionContainer">