From ccf2f7ad9878858ccb7f4cd96b26f143fc336283 Mon Sep 17 00:00:00 2001 From: NoLifeKing Date: Sat, 21 Aug 2021 19:12:18 +0200 Subject: [PATCH] feat: CSS styling based on screen size --- src/scripts/background.js | 53 +++++---- src/scripts/destiny2/apiClient.js | 189 +++++++++++++++--------------- src/scripts/destiny2/goalItems.js | 7 +- src/scripts/mainWindow.js | 30 ++++- src/scripts/overlayWindow.js | 6 + src/scss/overlay-styles.scss | 73 +++++++++--- src/windows/main-window.html | 3 +- 7 files changed, 216 insertions(+), 145 deletions(-) diff --git a/src/scripts/background.js b/src/scripts/background.js index 74a6576..249506d 100644 --- a/src/scripts/background.js +++ b/src/scripts/background.js @@ -42,7 +42,6 @@ function openWindow(event, originEvent) { var appUpdateCheck = null; -// function that handles the url-scheme event based on what comes directly after "d2overlay://" async function handleUrlLaunch(urlSchemeStart) { if (urlSchemeStart.indexOf("d2overlay://") == 0) { let urlScheme = urlSchemeStart.substr(12); @@ -50,26 +49,24 @@ async function handleUrlLaunch(urlSchemeStart) { let urlSchemeType = urlSchemeParts[0]; let urlSchemeId = urlSchemeParts[1]; - if (urlSchemeType == "authenticate") { - if (urlSchemeId) { - var queryParams = parseQueryString(urlSchemeId); - - let _state = queryParams.find((i) => i.key == "state"); - let _code = queryParams.find((i) => i.key == "code"); - - if (_state && _code) { - let res = destinyApiClient.getToken(_state.value, _code.value); - if (res == null) { - // Something is wrong, we got the wrong state from a request, so we are just ignoring it for now. - eventEmitter.emit("auth-unsuccessful"); - } else { - log("BUNGIEAUTH", "Successful"); - await destinyApiClient.checkManifestVersion(); - await destinyApiClient.getUserMemberships(); - await destinyApiClient.getTrackableData(true); - - eventEmitter.emit("auth-successful"); - } + if (urlSchemeType == "authenticate" && urlSchemeId) { + var queryParams = parseQueryString(urlSchemeId); + + let _state = queryParams.find((i) => i.key == "state"); + let _code = queryParams.find((i) => i.key == "code"); + + if (_state && _code) { + let res = await destinyApiClient.getToken(_state.value, _code.value); + if (res == null) { + // Something is wrong, we got the wrong state from a request, so we are just ignoring it for now. + eventEmitter.emit("auth-unsuccessful"); + } else { + log("BUNGIEAUTH", "Successful"); + await destinyApiClient.checkManifestVersion(); + await destinyApiClient.getUserMemberships(); + await destinyApiClient.getTrackableData(true); + + eventEmitter.emit("auth-successful"); } } } @@ -171,10 +168,20 @@ if (firstLaunch) { () => {} ); + let overlayWidth = 250; + + if (window.screen.availWidth > 1950) { + overlayWidth = 250; + } else if (window.screen.availWidth > 1900) { + overlayWidth = 200; + } else if (window.screen.availWidth > 1800) { + overlayWidth = 150; + } + overwolf.windows.changeSize( { window_id: overlayWindowId, - width: 250, + width: overlayWidth, height: parseInt(window.screen.availHeight * 0.75), auto_dpi_resize: false, }, @@ -375,7 +382,7 @@ if (firstLaunch) { } ); - //openOverlay(); + openOverlay(); let wasPreviouslyOpened = localStorage.getItem("mainWindow_opened"); diff --git a/src/scripts/destiny2/apiClient.js b/src/scripts/destiny2/apiClient.js index 9cc2b4d..6519bb7 100644 --- a/src/scripts/destiny2/apiClient.js +++ b/src/scripts/destiny2/apiClient.js @@ -253,7 +253,7 @@ function DestinyApiClient(d2ApiClient) { } } - this.getToken = function (state, code) { + this.getToken = async function (state, code) { if (state != this.randomState) { // We're getting a bad state, so we'll just return null here. return null; @@ -290,6 +290,11 @@ function DestinyApiClient(d2ApiClient) { }; this.refreshToken = async function () { + const refreshToken = await db.getItem("destinyRefreshToken"); + if (refreshToken === null) { + return null; + } + return new Promise(async (resolve, reject) => { let tokenRequest = getXMLHttpRequestClient( "POST", @@ -321,7 +326,7 @@ function DestinyApiClient(d2ApiClient) { tokenRequest.send( JSON.stringify({ - refresh_token: await db.getItem("destinyRefreshToken"), + refresh_token: refreshToken, }) ); }); @@ -526,17 +531,6 @@ function DestinyApiClient(d2ApiClient) { ); }; - const recordState = { - None: 0, - RecordRedeemed: 1, - RewardUnavailable: 2, - ObjectiveNotCompleted: 4, - Obscured: 8, - Invisible: 16, - EntitlementUnowned: 32, - CanEquipTitle: 64, - }; - this.equipItems = async function (_lastPlayer) { return new Promise(async (resolve, reject) => { await pluginClient.POSTJson( @@ -571,71 +565,39 @@ function DestinyApiClient(d2ApiClient) { ..._lastPlayer, }; - let statKeys = Object.keys(namedDataObject.characterInfo.stats); - - for (let statKey of statKeys) { + for (let statKey of Object.keys(namedDataObject.characterInfo.stats)) { namedDataObject.characterInfo.stats[statKey] = { - statName: - self.destinyDataDefinition.DestinyStatDefinition[statKey] - .displayProperties.name, - statDescription: - self.destinyDataDefinition.DestinyStatDefinition[statKey] - .displayProperties.description, - statIcon: - self.destinyDataDefinition.DestinyStatDefinition[statKey] - .displayProperties.icon, statValue: namedDataObject.characterInfo.stats[statKey], + statHash: statKey, }; } - let metricKeys = Object.keys(namedDataObject.metrics); - - for (let metricKey of metricKeys) { + for (let metricKey of Object.keys(namedDataObject.metrics)) { namedDataObject.metrics[metricKey] = { ...namedDataObject.metrics[metricKey], - metricName: - self.destinyDataDefinition.DestinyMetricDefinition[metricKey] - .displayProperties.name, - metricDescription: - self.destinyDataDefinition.DestinyMetricDefinition[metricKey] - .displayProperties.description, - metricIcon: - self.destinyDataDefinition.DestinyMetricDefinition[metricKey] - .displayProperties.icon, + metricHash: metricKey, }; } - let recordKeys = Object.keys(namedDataObject.records.records); - for (let recordKey of recordKeys) { + for (let recordKey of Object.keys(namedDataObject.records.records)) { namedDataObject.records.records[recordKey] = { ...namedDataObject.records.records[recordKey], - recordName: + recordHash: recordKey, + parentNodeHashes: self.destinyDataDefinition.DestinyRecordDefinition[recordKey] - .displayProperties.name, - recordDescription: - self.destinyDataDefinition.DestinyRecordDefinition[recordKey] - .displayProperties.description, - recordIcon: - self.destinyDataDefinition.DestinyRecordDefinition[recordKey] - .displayProperties.icon, + .parentNodeHashes, }; } - let characterRecordKeys = Object.keys( + for (let recordKey of Object.keys( namedDataObject.characterRecords.records - ); - for (let recordKey of characterRecordKeys) { + )) { namedDataObject.characterRecords.records[recordKey] = { ...namedDataObject.characterRecords.records[recordKey], - recordName: - self.destinyDataDefinition.DestinyRecordDefinition[recordKey] - .displayProperties.name, - recordDescription: + recordHash: recordKey, + parentNodeHashes: self.destinyDataDefinition.DestinyRecordDefinition[recordKey] - .displayProperties.description, - recordIcon: - self.destinyDataDefinition.DestinyRecordDefinition[recordKey] - .displayProperties.icon, + .parentNodeHashes, }; } @@ -646,6 +608,30 @@ function DestinyApiClient(d2ApiClient) { return namedDataObject; }; + this.getPresentationNodeFromHash = function (hash) { + const presentationNameArray = []; + + const presentationNode = + self.destinyDataDefinition.DestinyPresentationNodeDefinition[hash]; + if (presentationNode) { + presentationNameArray.unshift({ + name: presentationNode.displayProperties.name, + description: presentationNode.displayProperties.description, + icon: presentationNode.displayProperties.icon, + hash: hash, + }); + + for (let _hash of presentationNode.parentNodeHashes) { + const subItems = self.getPresentationNodeFromHash(_hash); + for (let item of subItems) { + presentationNameArray.push(item); + } + } + } + + return presentationNameArray; + }; + this.mapHashesToDefinitionsInObject = function (object) { let _objectCopy = { ...object }; @@ -663,15 +649,15 @@ function DestinyApiClient(d2ApiClient) { _field[x] = arrItem; } } + _objectCopy[key] = _field; } else if (_type === "object" && _field !== null) { _objectCopy[key] = self.mapHashesToDefinitionsInObject( - _objectCopy[key], - _objectCopy + _objectCopy[key] ); } else { - if (key.indexOf("Hash") > -1 && _type === "number" && _field > 0) { + if (key.indexOf("Hash") > -1 && !Array.isArray(_field)) { let _hashType = key - .replace("Hash", "") + .split("Hash")[0] .replace("current", "") .toLowerCase(); @@ -692,65 +678,67 @@ function DestinyApiClient(d2ApiClient) { definitionData[_field] && definitionData[_field].displayProperties ) { + const dField = definitionData[_field]; if ( - definitionData[_field].displayProperties.name && - definitionData[_field].displayProperties.name.length > 0 + dField.displayProperties.name && + dField.displayProperties.name.length > 0 ) { - _objectCopy[`${_hashType}Name`] = - definitionData[_field].displayProperties.name; + _objectCopy[`${_hashType}Name`] = dField.displayProperties.name; } else if ( - definitionData[_field].setData && - definitionData[_field].setData.questLineName && - definitionData[_field].setData.questLineName.length > 0 + dField.setData && + dField.setData.questLineName && + dField.setData.questLineName.length > 0 ) { - _objectCopy[`${_hashType}Name`] = - definitionData[_field].setData.questLineName; + _objectCopy[`${_hashType}Name`] = dField.setData.questLineName; } if ( - definitionData[_field].displayProperties.description && - definitionData[_field].displayProperties.description.length > 0 + dField.displayProperties.description && + dField.displayProperties.description.length > 0 ) { _objectCopy[`${_hashType}Description`] = - definitionData[_field].displayProperties.description; + dField.displayProperties.description; } if ( - definitionData[_field].displayProperties.icon && - definitionData[_field].displayProperties.icon.length > 0 + dField.displayProperties.icon && + dField.displayProperties.icon.length > 0 ) { - _objectCopy[`${_hashType}Icon`] = - definitionData[_field].displayProperties.icon; + _objectCopy[`${_hashType}Icon`] = dField.displayProperties.icon; } if ( - definitionData[_field].progressDescription && - definitionData[_field].progressDescription.length > 0 + dField.progressDescription && + dField.progressDescription.length > 0 ) { _objectCopy[`${_hashType}ProgressDescription`] = - definitionData[_field].progressDescription; + dField.progressDescription; } - if ( - typeof definitionData[_field].inProgressValueStyle !== "undefined" - ) { + if (typeof dField.inProgressValueStyle !== "undefined") { _objectCopy[`${_hashType}InProgressValueStyle`] = - definitionData[_field].inProgressValueStyle; + dField.inProgressValueStyle; } - if ( - typeof definitionData[_field].completedValueStyle !== "undefined" - ) { + if (typeof dField.completedValueStyle !== "undefined") { _objectCopy[`${_hashType}CompletedValueStyle`] = - definitionData[_field].completedValueStyle; + dField.completedValueStyle; } - if (typeof definitionData[_field].itemType !== "undefined") { - _objectCopy[`${_hashType}ItemType`] = - definitionData[_field].itemType; + if (typeof dField.itemType !== "undefined") { + _objectCopy[`${_hashType}ItemType`] = dField.itemType; + } + + if (typeof dField.parentNodeHashes !== "undefined") { + _objectCopy[`parentNodeHashes`] = dField.parentNodeHashes.map( + (item) => { + return self.getPresentationNodeFromHash(item); + } + ); } } } + _objectCopy[key] = _field; } } @@ -797,11 +785,11 @@ function DestinyApiClient(d2ApiClient) { trackableDataItems.push(characterRecord); } - trackableDataItems = trackableDataItems.sort((a, b) => { + function sortTrackableItems(a, b) { if (typeof a.endDate !== "undefined") { return typeof b.endDate === "undefined" || a.endDate < b.endDate - ? 1 - : -1; + ? -1 + : 1; } if ( @@ -815,7 +803,16 @@ function DestinyApiClient(d2ApiClient) { } return a.order < b.order ? 1 : -1; - }); + } + + const itemsWithExpiration = trackableDataItems + .filter((i) => i.endDate) + .sort(sortTrackableItems); + const itemsWithoutExpiration = trackableDataItems + .filter((i) => !i.endDate) + .sort(sortTrackableItems); + + trackableDataItems = [...itemsWithExpiration, ...itemsWithoutExpiration]; trackableDataItems.unshift( self.goalApi.getSeasonRankData( diff --git a/src/scripts/destiny2/goalItems.js b/src/scripts/destiny2/goalItems.js index bfc1592..e3d0023 100644 --- a/src/scripts/destiny2/goalItems.js +++ b/src/scripts/destiny2/goalItems.js @@ -110,11 +110,10 @@ function Destiny2Goals() { milestoneDataItem.icon = step.activityIcon; } - break; + break; //milestoneData.push(milestoneDataItem); } } } - break; } } } @@ -150,7 +149,7 @@ function Destiny2Goals() { challenge.objective.completionValue; } - break; + break; //milestoneData.push(milestoneDataItem); } } } @@ -355,7 +354,7 @@ function Destiny2Goals() { let characterRecord = namedObject.characterRecords.records[key]; if ( typeof characterRecord.objectives === "undefined" || - characterRecord.recordName.length === 0 + (characterRecord.recordName ?? "").length === 0 ) continue; diff --git a/src/scripts/mainWindow.js b/src/scripts/mainWindow.js index e4c179b..1363f40 100644 --- a/src/scripts/mainWindow.js +++ b/src/scripts/mainWindow.js @@ -49,6 +49,7 @@ eventEmitter.addEventListener("destiny-data-loaded", async function () { eventEmitter.addEventListener("destiny-not-authed", function () { document.querySelector("#authenticateWithBungie").style.display = ""; + document.querySelector("#logoutFromBungie").style.display = "none"; }); eventEmitter.addEventListener( @@ -132,6 +133,15 @@ function authenticateWithBungie() { ); } +async function logoutFromBungie() { + await db.removeItem("destinyToken"); + await db.removeItem("destinyExpires"); + await db.removeItem("destinyRefreshToken"); + await db.removeItem("destinyRefreshTokenExpires"); + + eventEmitter.emit("destiny-not-authed"); +} + function bindExitButtonEvent(window) { document.getElementById("exitButton").addEventListener("click", function () { localStorage.removeItem("mainWindow_opened"); @@ -154,22 +164,22 @@ function bindExitButtonEvent(window) { ); document.getElementById("trackMilestones").checked = JSON.parse( - (await db.getItem("d2-track-milestones")) || "true" + ((await db.getItem("d2-track-milestones")) ?? "true").toString() ) ? "checked" : ""; document.getElementById("trackBounties").checked = JSON.parse( - (await db.getItem("d2-track-bounties")) || "true" + ((await db.getItem("d2-track-bounties")) ?? "true").toString() ) ? "checked" : ""; document.getElementById("trackQuests").checked = JSON.parse( - (await db.getItem("d2-track-quests")) || "true" + ((await db.getItem("d2-track-quests")) ?? "true").toString() ) ? "checked" : ""; document.getElementById("trackRecords").checked = JSON.parse( - (await db.getItem("d2-track-records")) || "true" + ((await db.getItem("d2-track-records")) ?? "true").toString() ) ? "checked" : ""; @@ -190,6 +200,14 @@ function bindExitButtonEvent(window) { .getElementById("authenticateWithBungie") .addEventListener("click", authenticateWithBungie); + document + .getElementById("logoutFromBungie") + .removeEventListener("click", logoutFromBungie); + + document + .getElementById("logoutFromBungie") + .addEventListener("click", logoutFromBungie); + document .getElementById("visibleItems") .addEventListener("change", async (event) => { @@ -246,6 +264,10 @@ function bindExitButtonEvent(window) { let hasAuthed = await destinyApiClient.isAuthenticated(); if (hasAuthed) { document.querySelector("#authenticateWithBungie").style.display = "none"; + document.querySelector("#logoutFromBungie").style.display = ""; + } else { + document.querySelector("#authenticateWithBungie").style.display = ""; + document.querySelector("#logoutFromBungie").style.display = "none"; } }); diff --git a/src/scripts/overlayWindow.js b/src/scripts/overlayWindow.js index 31d54ed..cfa1b9c 100644 --- a/src/scripts/overlayWindow.js +++ b/src/scripts/overlayWindow.js @@ -160,6 +160,12 @@ async function loadSettings() { // Here we just signal to the rest of the app that we have opened the overlay, so that we can start sending the initial data eventEmitter.emit("overlay-opened", {}); +eventEmitter.addEventListener("game-exited", function () { + overwolf.windows.getCurrentWindow(function (_window) { + overwolf.windows.close(_window.window.id, function () {}); + }); +}); + eventEmitter.addEventListener("visible-items-changed", (visibleItems) => { window.visibleItems = visibleItems; diff --git a/src/scss/overlay-styles.scss b/src/scss/overlay-styles.scss index 249cf68..9b32e1b 100644 --- a/src/scss/overlay-styles.scss +++ b/src/scss/overlay-styles.scss @@ -50,22 +50,6 @@ supported by Chrome, Edge, Opera and Firefox */ } -h1 { - font-size: 1.9rem; -} - -h2 { - font-size: 1.7rem; -} - -h3 { - font-size: 1.3rem; -} - -h4 { - font-size: 1.1rem; -} - .custom-control-input:checked ~ .custom-control-label::before { background-color: #000; } @@ -74,7 +58,6 @@ body { height: 100vh; overflow: hidden; line-height: 1.2; - font-size: 0.7rem; } .container-fluid { @@ -97,3 +80,59 @@ body { font-size: 0.8rem; margin-bottom: 2px; } + +@media (max-width: 250px) { + body { + font-size: 0.7rem; + } + + .media-body h5 { + font-size: 0.8rem; + } + + h1 { + font-size: 1.9rem; + } + + h2 { + font-size: 1.7rem; + } + + h3 { + font-size: 1.3rem; + } + + h4 { + font-size: 1.1rem; + } +} + +@media (max-width: 200px) { + body { + font-size: 0.5rem; + } + + .navbar-brand { + font-size: 0.9rem; + } + + .media-body h5 { + font-size: 0.6rem; + } + + h1 { + font-size: 1.7rem; + } + + h2 { + font-size: 1.5rem; + } + + h3 { + font-size: 1.1rem; + } + + h4 { + font-size: 0.9rem; + } +} diff --git a/src/windows/main-window.html b/src/windows/main-window.html index a4e23ea..d03322a 100644 --- a/src/windows/main-window.html +++ b/src/windows/main-window.html @@ -62,10 +62,11 @@
- All the things we can track + Last played character
+