From ba916aa953df7efdc6ea82b71fbe728c387c6821 Mon Sep 17 00:00:00 2001 From: Daniel Scalzi Date: Thu, 17 May 2018 03:11:44 -0400 Subject: [PATCH] v0.0.1-alpha.5 Added tooltip UI which shows the status of each Mojang service. Updated dependencies. --- app/assets/css/launcher.css | 95 ++++++++++++++++++++++++++++++++ app/assets/js/mojang.js | 38 +++++++------ app/assets/js/scripts/landing.js | 29 +++++++++- app/landing.ejs | 20 ++++++- package-lock.json | 38 ++++++------- package.json | 6 +- 6 files changed, 181 insertions(+), 45 deletions(-) diff --git a/app/assets/css/launcher.css b/app/assets/css/launcher.css index 6a8d52f8..d3fd7031 100644 --- a/app/assets/css/launcher.css +++ b/app/assets/css/launcher.css @@ -1495,6 +1495,13 @@ p { margin-left: 10px; } +/* Wrapper container for the mojang status bar. */ +#mojangStatusWrapper { + position: relative; + display: flex; + cursor: pointer; +} + /* Icon which displays the status of the mojang services. */ #mojang_status_icon { font-size: 30px; @@ -1502,6 +1509,94 @@ p { margin-left: 15px; } +/* Tooltip which displays more details about the mojang statuses. */ +#mojangStatusTooltip { + position: absolute; + visibility: hidden; + opacity: 0; + width: 145px; + min-height: 150px; + background-color: rgba(0, 0, 0, 0.75); + color: #fff; + border-radius: 4px; + padding: 5px 10px; + z-index: 1; + font-family: 'Avenir Medium'; + font-size: 12px; + transition: visibility 0s linear 0.25s, opacity 0.25s ease; + bottom: calc(100% + 15px); + transform: translateX(-50%); + margin-left: 50%; + box-shadow: 0px 0px 20px rgb(0, 0, 0); + cursor: default; +} +#mojangStatusTooltip:after { + content: " "; + position: absolute; + left: 50%; + top: 100%; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: rgba(0, 0, 0, 0.75) transparent transparent transparent; +} +#mojangStatusWrapper:hover #mojangStatusTooltip { + visibility: visible; + opacity: 1; + transition-delay: 0s; +} + +/* Tooltip title for the mojang statuses. */ +#mojangStatusTooltipTitle { + width: 100%; + text-align: center; + margin-bottom: 5px; + letter-spacing: 1px; +} + +/* Wrapper container for the non essential services title. */ +#mojangStatusNEContainer { + display: flex; + align-items: center; + margin: 10px 0px; +} + +/* White bar which surrounds the non essential service title. */ +.mojangStatusNEBar { + height: 1px; + width: 100%; + background: white; +} + +/* Non essential service title text. */ +#mojangStatusNETitle { + font-size: 10px; + padding: 0px 3px; + text-align: center; + letter-spacing: 1px; +} + +/* Wrapper container for mojang service information. */ +.mojangStatusContainer { + display: flex; +} + +/* Displays the name of the mojang service. */ +.mojangStatusName { + width: 100%; + font-size: 10px; + letter-spacing: 1px; + line-height: 12px; + padding: 6px 0px; +} + +/* Displays the status of the mojang service. */ +.mojangStatusIcon { + margin-right: 10px; + font-size: 18.5px; + color: #848484; +} + /* * * * Landing View (Bottom Styles) | Center Content * * */ diff --git a/app/assets/js/mojang.js b/app/assets/js/mojang.js index 1a6ad213..4ca9faf0 100644 --- a/app/assets/js/mojang.js +++ b/app/assets/js/mojang.js @@ -16,34 +16,40 @@ const minecraftAgent = { const authpath = 'https://authserver.mojang.com' const statuses = [ { - service: 'minecraft.net', + service: 'sessionserver.mojang.com', status: 'grey', - name: 'Minecraft.net' - }, - { - service: 'api.mojang.com', - status: 'grey', - name: 'Public API' - }, - { - service: 'textures.minecraft.net', - status: 'grey', - name: 'Minecraft Skins' + name: 'Multiplayer Session Service', + essential: true }, { service: 'authserver.mojang.com', status: 'grey', - name: 'Authentication Service' + name: 'Authentication Service', + essential: true }, { - service: 'sessionserver.mojang.com', + service: 'textures.minecraft.net', status: 'grey', - name: 'Multiplayer Session Service' + name: 'Minecraft Skins', + essential: false + }, + { + service: 'api.mojang.com', + status: 'grey', + name: 'Public API', + essential: false + }, + { + service: 'minecraft.net', + status: 'grey', + name: 'Minecraft.net', + essential: false }, { service: 'account.mojang.com', status: 'grey', - name: 'Mojang accounts website' + name: 'Mojang Accounts Website', + essential: false } ] diff --git a/app/assets/js/scripts/landing.js b/app/assets/js/scripts/landing.js index ba6101f8..ccc897cb 100644 --- a/app/assets/js/scripts/landing.js +++ b/app/assets/js/scripts/landing.js @@ -141,27 +141,52 @@ server_selection_button.addEventListener('click', (e) => { // Update Mojang Status Color const refreshMojangStatuses = async function(){ console.log('Refreshing Mojang Statuses..') + let status = 'grey' + let tooltipEssentialHTML = `` + let tooltipNonEssentialHTML = `` + try { const statuses = await Mojang.status() greenCount = 0 + for(let i=0; i + • + ${service.name} + ` + } else { + tooltipNonEssentialHTML += `
+ • + ${service.name} +
` + } + + if(service.status === 'yellow' && status !== 'red'){ status = 'yellow' continue - } else if(statuses[i].status === 'red'){ + } else if(service.status === 'red'){ status = 'red' break } + ++greenCount } + if(greenCount == statuses.length){ status = 'green' } + } catch (err) { console.warn('Unable to refresh Mojang service status.') console.debug(err) } + + document.getElementById('mojangStatusEssentialContainer').innerHTML = tooltipEssentialHTML + document.getElementById('mojangStatusNonEssentialContainer').innerHTML = tooltipNonEssentialHTML document.getElementById('mojang_status_icon').style.color = Mojang.statusToHex(status) } diff --git a/app/landing.ejs b/app/landing.ejs index 560d68e6..0ee21bfa 100644 --- a/app/landing.ejs +++ b/app/landing.ejs @@ -97,8 +97,24 @@ OFFLINE
- MOJANG STATUS - • +
+ MOJANG STATUS + • +
+
Services
+
+ +
+
+
+
Non Essential
+
+
+
+ +
+
+
diff --git a/package-lock.json b/package-lock.json index 4d2f2b96..95f2b252 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "westeroscraftlauncher", - "version": "0.0.1-alpha.4", + "version": "0.0.1-alpha.5", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -37,9 +37,9 @@ "optional": true }, "@types/node": { - "version": "8.10.11", - "resolved": "https://registry.npmjs.org/@types/node/-/node-8.10.11.tgz", - "integrity": "sha512-FM7tvbjbn2BUzM/Qsdk9LUGq3zeh7li8NcHoS398dBzqLzfmSqSP1+yKbMRTCcZzLcu2JAR5lq3IKIEYkto7iQ==", + "version": "8.10.15", + "resolved": "https://registry.npmjs.org/@types/node/-/node-8.10.15.tgz", + "integrity": "sha512-qNb+m5Cuj6YUMK7YFcvuSgcHCKfVg1uXAUOP91SWvAakZlZTzbGmJaBi99CgDWEAyfZo51NlUhXkuP5WtXsgjg==", "dev": true }, "adm-zip": { @@ -846,9 +846,9 @@ } }, "electron": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/electron/-/electron-2.0.0.tgz", - "integrity": "sha512-FCcVzHgoBmNTPUEhKN7yUxjluCRNAQsHNOfdtFEWKL3DPYEdLdyQW8CpmJEMqIXha5qZ+qdKVAtwvvuJs+b/PQ==", + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/electron/-/electron-2.0.1.tgz", + "integrity": "sha512-piSwY2P7L6NWx672MNdSvtGPdQP/mhwAg8ICN6ofTTItPkd7D6kNHBPkq+DXwZcXVH1EifYR9yD/l3Xw1haVpQ==", "dev": true, "requires": { "@types/node": "^8.0.24", @@ -1425,9 +1425,9 @@ "integrity": "sha512-QLg82fGkfnJ/4iy1xZ81/9SIJiq1NGFUMGs6ParyjBZr6jW2Ufj/snDqTHixNlHdPNwN2RLVD0Pi3igeK9+JfA==" }, "home-path": { - "version": "1.0.5", - "resolved": "https://registry.npmjs.org/home-path/-/home-path-1.0.5.tgz", - "integrity": "sha1-eIspgVsS1Tus9XVkhHbm+QQdEz8=", + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/home-path/-/home-path-1.0.6.tgz", + "integrity": "sha512-wo+yjrdAtoXt43Vy92a+0IPCYViiyLAHyp0QVS4xL/tfvVz5sXIW1ubLZk3nhVkD92fQpUMKX+fzMjr5F489vw==", "dev": true }, "hosted-git-info": { @@ -2195,9 +2195,9 @@ "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=" }, "qs": { - "version": "6.5.1", - "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.1.tgz", - "integrity": "sha512-eRzhrN1WSINYCDCbrz796z37LOe3m5tmW7RQf6oBntukAG1nmovJvhnwHHRMAfeoItc1m2Hk02WER2aQ/iqs+A==" + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.2.tgz", + "integrity": "sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA==" }, "rc": { "version": "1.2.7", @@ -2320,9 +2320,9 @@ } }, "request": { - "version": "2.85.0", - "resolved": "https://registry.npmjs.org/request/-/request-2.85.0.tgz", - "integrity": "sha512-8H7Ehijd4js+s6wuVPLjwORxD4zeuyjYugprdOXlPSqaApmL/QOy+EB/beICHVCHkGMKNh5rvihb5ov+IDw4mg==", + "version": "2.86.0", + "resolved": "https://registry.npmjs.org/request/-/request-2.86.0.tgz", + "integrity": "sha512-BQZih67o9r+Ys94tcIW4S7Uu8pthjrQVxhsZ/weOwHbDfACxvIyvnAbzFQxjy1jMtvFSzv5zf4my6cZsJBbVzw==", "requires": { "aws-sign2": "~0.7.0", "aws4": "^1.6.0", @@ -2342,7 +2342,6 @@ "performance-now": "^2.1.0", "qs": "~6.5.1", "safe-buffer": "^5.1.1", - "stringstream": "~0.0.5", "tough-cookie": "~2.3.3", "tunnel-agent": "^0.6.0", "uuid": "^3.1.0" @@ -2551,11 +2550,6 @@ "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=", "dev": true }, - "stringstream": { - "version": "0.0.5", - "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz", - "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg=" - }, "strip-ansi": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", diff --git a/package.json b/package.json index 657649dd..5583385f 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "westeroscraftlauncher", - "version": "0.0.1-alpha.4", + "version": "0.0.1-alpha.5", "description": "Custom modded launcher for Westeroscraft", "productName": "WesterosCraft Launcher", "main": "index.js", @@ -37,14 +37,14 @@ "electron-updater": "^2.21.10", "jquery": "^3.3.1", "mkdirp": "^0.5.1", - "request": "^2.85.0", + "request": "^2.86.0", "rimraf": "^2.6.2", "tar-fs": "^1.16.2", "uuid": "^3.2.1", "winreg": "^1.2.4" }, "devDependencies": { - "electron": "^2.0.0", + "electron": "^2.0.1", "electron-builder": "^20.13.5" }, "build": {