added a discord integration section to the settings page

This commit is contained in:
Jack 2020-07-07 16:39:48 +01:00
parent 5e83f01e25
commit b0939c4d4d
6 changed files with 137 additions and 4 deletions

View file

@ -1333,6 +1333,33 @@ key {
grid-area: buttons;
}
&.discordIntegration {
.code {
justify-content: center;
display: grid;
.top {
font-size: 1rem;
line-height: 1rem;
color: var(--sub-color);
}
.bottom {
font-size: 2rem;
line-height: 2rem;
}
}
.info {
text-align: center;
}
.howto {
margin-top: 1rem;
color: var(--text-color);
}
}
&.tags {
.tagsList {
display: grid;

View file

@ -382,6 +382,27 @@
<div class="addTagButton"><i class="fas fa-plus"></i></div>
</div>
</div>
<div class="section discordIntegration">
<h1>discord integration</h1>
<div class="text">When you connect your monkey-type account to your Discord account, you will be automatically
assigned a new role every time you achieve a new personal best in a 60 second test. <div
class="howto hidden">To
pair your accounts, direct message 'monkey-bot' on Discord with the message '!verify <span
class="howtocode">-</span>'.</div>
</div>
<div class="buttons">
<div class="button generateCodeButton">Generate pairing code</div>
</div>
<div class="info hidden">
<div><i class="fas fa-check"></i> Your accounts are paired!</div>
</div>
<div class="code hidden">
<div style="width: min-content;white-space: nowrap;">
<div class="top">code</div>
<div class="bottom">-</div>
</div>
</div>
</div>
<div class="section layouts">
<h1>layout override</h1>
<div class="buttons">

View file

@ -204,6 +204,7 @@ firebase.auth().onAuthStateChanged(function (user) {
}
});
refreshTagsSettingsSection();
updateDiscordSettingsSection();
if (cookieConfig === null) {
applyConfig(dbSnapshot.config);
// showNotification('Applying db config',3000);

View file

@ -47,13 +47,16 @@ async function db_getUserSnapshot() {
.collection("users")
.doc(user.uid)
.get()
.then((data) => {
.then((res) => {
// console.log('getting data from db!');
let data = res.data();
try {
if (data.data().personalBests !== undefined) {
snap.personalBests = data.data().personalBests;
if (data.personalBests !== undefined) {
snap.personalBests = data.personalBests;
}
snap.config = data.data().config;
snap.discordId = data.discordId;
snap.pairingCode = data.discordPairingCode;
snap.config = data.config;
} catch (e) {
//
}

View file

@ -38,6 +38,9 @@ const editTag = firebase.functions().httpsCallable("editTag");
const removeTag = firebase.functions().httpsCallable("removeTag");
const updateResultTags = firebase.functions().httpsCallable("updateResultTags");
const saveConfig = firebase.functions().httpsCallable("saveConfig");
const generatePairingCode = firebase
.functions()
.httpsCallable("generatePairingCode");
function smooth(arr, windowSize, getter = (value) => value, setter) {
const get = getter;
@ -1005,6 +1008,7 @@ function showResult(difficultyFailed = false) {
blindMode: config.blindMode,
theme: config.theme,
tags: activeTags,
discordId: dbSnapshot.discordId,
};
if (
config.difficulty == "normal" ||

View file

@ -60,6 +60,8 @@ function updateSettingsPage() {
setActiveThemeTab();
setCustomThemeInputs();
updateDiscordSettingsSection();
if (config.showKeyTips) {
$(".pageSettings .tip").removeClass("hidden");
} else {
@ -246,6 +248,61 @@ function toggleTag(tagid, nosave = false) {
if (!nosave) saveActiveTagsToCookie();
}
function updateDiscordSettingsSection() {
//no code and no discord
if (firebase.auth().currentUser == null) {
$(".pageSettings .section.discordIntegration").addClass("hidden");
} else {
$(".pageSettings .section.discordIntegration").removeClass("hidden");
if (
dbSnapshot.pairingCode === undefined &&
dbSnapshot.discordId === undefined
) {
//show button
$(".pageSettings .section.discordIntegration .howto").addClass("hidden");
$(".pageSettings .section.discordIntegration .buttons").removeClass(
"hidden"
);
$(".pageSettings .section.discordIntegration .info").addClass("hidden");
$(".pageSettings .section.discordIntegration .code").addClass("hidden");
} else if (
dbSnapshot.pairingCode !== undefined &&
dbSnapshot.discordId === undefined
) {
//show code
$(".pageSettings .section.discordIntegration .code .bottom").text(
dbSnapshot.pairingCode
);
$(".pageSettings .section.discordIntegration .howtocode").text(
dbSnapshot.pairingCode
);
$(".pageSettings .section.discordIntegration .howto").removeClass(
"hidden"
);
$(".pageSettings .section.discordIntegration .buttons").addClass(
"hidden"
);
$(".pageSettings .section.discordIntegration .info").addClass("hidden");
$(".pageSettings .section.discordIntegration .code").removeClass(
"hidden"
);
} else if (
dbSnapshot.pairingCode !== undefined &&
dbSnapshot.discordId !== undefined
) {
$(".pageSettings .section.discordIntegration .howto").addClass("hidden");
$(".pageSettings .section.discordIntegration .buttons").addClass(
"hidden"
);
$(".pageSettings .section.discordIntegration .info").removeClass(
"hidden"
);
$(".pageSettings .section.discordIntegration .code").addClass("hidden");
}
}
}
//smooth caret
$(".pageSettings .section.smoothCaret .buttons .button.on").click((e) => {
setSmoothCaret(true);
@ -489,6 +546,26 @@ $(".pageSettings .section.randomTheme .buttons .button.off").click((e) => {
setSettingsButton("randomTheme", config.randomTheme);
});
//discord
$(
".pageSettings .section.discordIntegration .buttons .generateCodeButton"
).click((e) => {
showBackgroundLoader();
generatePairingCode({ uid: firebase.auth().currentUser.uid }).then((ret) => {
hideBackgroundLoader();
if (ret.data.status === 1 || ret.data.status === 2) {
dbSnapshot.pairingCode = ret.data.pairingCode;
$(".pageSettings .section.discordIntegration .code .bottom").text(
ret.data.pairingCode
);
$(".pageSettings .section.discordIntegration .howtocode").text(
ret.data.pairingCode
);
updateDiscordSettingsSection();
}
});
});
//tags
$(document).on(
"click",