update user profile stuff
This commit is contained in:
MathMan05
parent
3eaa1c425e
commit
ae76f2636e
11 changed files with 544 additions and 182 deletions
|
|
@ -165,7 +165,7 @@ document.addEventListener('paste', async (e) => {
|
|||
});
|
||||
setTheme();
|
||||
function userSettings() {
|
||||
thisuser.usersettings.show();
|
||||
thisuser.showusersettings();
|
||||
}
|
||||
document.getElementById("settings").onclick = userSettings;
|
||||
function userConnections() {
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
import { Guild } from "./guild.js";
|
||||
import { Direct } from "./direct.js";
|
||||
import { Voice } from "./audio.js";
|
||||
import { User } from "./user.js";
|
||||
import { Fullscreen } from "./fullscreen.js";
|
||||
import { setTheme } from "./login.js";
|
||||
import { SnowFlake } from "./snowflake.js";
|
||||
import { Message } from "./message.js";
|
||||
import { Member } from "./member.js";
|
||||
import { Settings } from "./settings.js";
|
||||
import { MarkDown } from "./markdown.js";
|
||||
const wsCodesRetry = new Set([4000, 4003, 4005, 4007, 4008, 4009]);
|
||||
class Localuser {
|
||||
lastSequence = null;
|
||||
|
|
@ -636,71 +636,67 @@ class Localuser {
|
|||
typingtext.classList.add("hidden");
|
||||
}
|
||||
}
|
||||
genusersettings() {
|
||||
const hypotheticalProfile = document.createElement("div");
|
||||
let file = null;
|
||||
let newprouns = null;
|
||||
let newbio = null;
|
||||
let hypouser = this.user.clone();
|
||||
function regen() {
|
||||
hypotheticalProfile.textContent = "";
|
||||
const hypoprofile = hypouser.buildprofile(-1, -1);
|
||||
hypotheticalProfile.appendChild(hypoprofile);
|
||||
}
|
||||
regen();
|
||||
this.usersettings = new Fullscreen(["hdiv",
|
||||
["vdiv",
|
||||
["fileupload", "upload pfp:", function (e) {
|
||||
console.log(this.files[0]);
|
||||
file = this.files[0];
|
||||
const blob = URL.createObjectURL(this.files[0]);
|
||||
hypouser.avatar = blob;
|
||||
hypouser.hypotheticalpfp = true;
|
||||
regen();
|
||||
}],
|
||||
["textbox", "Pronouns:", this.user.pronouns, function (e) {
|
||||
console.log(this.value);
|
||||
hypouser.pronouns = this.value;
|
||||
newprouns = this.value;
|
||||
regen();
|
||||
}],
|
||||
["mdbox", "Bio:", this.user.bio.rawString, function (e) {
|
||||
console.log(this.value);
|
||||
hypouser.bio = this.value;
|
||||
newbio = this.value;
|
||||
regen();
|
||||
}],
|
||||
["button", "update user content:", "submit", () => {
|
||||
if (file !== null) {
|
||||
this.updatepfp(file);
|
||||
}
|
||||
if (newprouns !== null) {
|
||||
this.updatepronouns(newprouns);
|
||||
}
|
||||
if (newbio !== null) {
|
||||
this.updatebio(newbio);
|
||||
}
|
||||
}],
|
||||
["select", "Theme:", ["Dark", "Light", "WHITE"], e => {
|
||||
localStorage.setItem("theme", ["Dark", "Light", "WHITE"][e.target.selectedIndex]);
|
||||
setTheme();
|
||||
}, ["Dark", "Light", "WHITE"].indexOf(localStorage.getItem("theme"))],
|
||||
["select", "Notification sound:", Voice.sounds, e => {
|
||||
Voice.setNotificationSound(Voice.sounds[e.target.selectedIndex]);
|
||||
Voice.noises(Voice.sounds[e.target.selectedIndex]);
|
||||
}, Voice.sounds.indexOf(Voice.getNotificationSound())]
|
||||
],
|
||||
["vdiv",
|
||||
["html", hypotheticalProfile]
|
||||
]
|
||||
], _ => { }, function () {
|
||||
console.log(this);
|
||||
hypouser = this.user.clone();
|
||||
showusersettings() {
|
||||
const settings = new Settings("Settings");
|
||||
this.usersettings = settings;
|
||||
{
|
||||
const userOptions = settings.addButton("User Settings", { ltr: true });
|
||||
const hypotheticalProfile = document.createElement("div");
|
||||
let file = null;
|
||||
let newpronouns = null;
|
||||
let newbio = null;
|
||||
let hypouser = this.user.clone();
|
||||
function regen() {
|
||||
hypotheticalProfile.textContent = "";
|
||||
const hypoprofile = hypouser.buildprofile(-1, -1);
|
||||
hypotheticalProfile.appendChild(hypoprofile);
|
||||
}
|
||||
regen();
|
||||
file = null;
|
||||
newprouns = null;
|
||||
newbio = null;
|
||||
}.bind(this));
|
||||
const settingsLeft = userOptions.addOptions("");
|
||||
const settingsRight = userOptions.addOptions("");
|
||||
settingsRight.addHTMLArea(hypotheticalProfile);
|
||||
const finput = settingsLeft.addFileInput("Upload pfp:", _ => {
|
||||
if (file) {
|
||||
this.updatepfp(file);
|
||||
}
|
||||
});
|
||||
finput.watchForChange(_ => {
|
||||
if (_.length) {
|
||||
file = _[0];
|
||||
const blob = URL.createObjectURL(file);
|
||||
hypouser.avatar = blob;
|
||||
hypouser.hypotheticalpfp = true;
|
||||
regen();
|
||||
}
|
||||
});
|
||||
const pronounbox = settingsLeft.addTextInput("Pronouns", _ => {
|
||||
if (newpronouns) {
|
||||
this.updatepronouns(newpronouns);
|
||||
}
|
||||
}, { initText: this.user.pronouns });
|
||||
pronounbox.watchForChange(_ => {
|
||||
hypouser.pronouns = _;
|
||||
newpronouns = _;
|
||||
regen();
|
||||
});
|
||||
const bioBox = settingsLeft.addMDInput("Bio:", _ => {
|
||||
if (newbio) {
|
||||
this.updatebio(newbio);
|
||||
}
|
||||
}, { initText: this.user.bio.rawString });
|
||||
bioBox.watchForChange(_ => {
|
||||
newbio = _;
|
||||
hypouser.bio = new MarkDown(_, this);
|
||||
regen();
|
||||
});
|
||||
}
|
||||
settings.show();
|
||||
}
|
||||
/**
|
||||
@deprecated
|
||||
This should be made to not be used anymore
|
||||
**/
|
||||
genusersettings() {
|
||||
const connectionContainer = document.createElement("div");
|
||||
connectionContainer.id = "connection-container";
|
||||
this.userConnections = new Fullscreen(["html",
|
||||
|
|
@ -942,7 +938,8 @@ class Localuser {
|
|||
//---------- resolving members code -----------
|
||||
waitingmembers = new Map();
|
||||
async resolvemember(id, guildid) {
|
||||
console.warn("this function is currently non-functional, either due to a bug in the client or the server, it's currently unclear, use at your own risk");
|
||||
console.warn("this function is currently non-functional due to it not being implemented in the server");
|
||||
throw new Error("Not implemented on the server side and not fully implemented, do not use");
|
||||
if (!this.waitingmembers.has(guildid)) {
|
||||
this.waitingmembers.set(guildid, new Map());
|
||||
}
|
||||
|
|
|
|||
|
|
@ -101,7 +101,6 @@ class Member {
|
|||
}
|
||||
const prom1 = fetch(guild.info.api.toString() + "/users/" + id + "/profile?with_mutual_guilds=true&with_mutual_friends_count=true&guild_id=" + guild.snowflake, { headers: guild.headers });
|
||||
prom1.catch(_ => { console.log(_); });
|
||||
guild.localuser.resolvemember(id?.id, guild.id);
|
||||
const promoise = prom1.then(_ => _.json()).then(json => {
|
||||
const memb = new Member(json, guild);
|
||||
Member.already[guild.id][id] = memb;
|
||||
|
|
|
|||
|
|
@ -23,6 +23,7 @@ class Buttons {
|
|||
bigtable.classList.add("flexltr");
|
||||
this.bigtable = bigtable;
|
||||
const htmlarea = document.createElement("div");
|
||||
htmlarea.classList.add("flexgrow");
|
||||
const buttonTable = document.createElement("div");
|
||||
buttonTable.classList.add("flexttb", "settingbuttons");
|
||||
for (const thing of this.buttons) {
|
||||
|
|
@ -63,6 +64,8 @@ class Buttons {
|
|||
this.bigtable.append(html);
|
||||
}
|
||||
save() { }
|
||||
submit() {
|
||||
}
|
||||
}
|
||||
class PermissionToggle {
|
||||
rolejson;
|
||||
|
|
@ -130,6 +133,122 @@ class PermissionToggle {
|
|||
}
|
||||
return div;
|
||||
}
|
||||
submit() {
|
||||
}
|
||||
}
|
||||
class TextInput {
|
||||
label;
|
||||
owner;
|
||||
onSubmit;
|
||||
textContent;
|
||||
input;
|
||||
constructor(label, onSubmit, owner, { initText = "" } = {}) {
|
||||
this.label = label;
|
||||
this.textContent = initText;
|
||||
this.owner = owner;
|
||||
this.onSubmit = onSubmit;
|
||||
}
|
||||
generateHTML() {
|
||||
const div = document.createElement("div");
|
||||
const span = document.createElement("span");
|
||||
span.textContent = this.label;
|
||||
div.append(span);
|
||||
const input = document.createElement("input");
|
||||
input.value = this.textContent;
|
||||
input.type = "text";
|
||||
input.oninput = this.onChange.bind(this);
|
||||
this.input = new WeakRef(input);
|
||||
div.append(input);
|
||||
return div;
|
||||
}
|
||||
onChange(ev) {
|
||||
this.owner.changed();
|
||||
const value = this.input.deref().value;
|
||||
this.onchange(value);
|
||||
this.textContent = value;
|
||||
}
|
||||
onchange = _ => { };
|
||||
watchForChange(func) {
|
||||
this.onchange = func;
|
||||
}
|
||||
submit() {
|
||||
this.onSubmit(this.textContent);
|
||||
}
|
||||
}
|
||||
class MDInput {
|
||||
label;
|
||||
owner;
|
||||
onSubmit;
|
||||
textContent;
|
||||
input;
|
||||
constructor(label, onSubmit, owner, { initText = "" } = {}) {
|
||||
this.label = label;
|
||||
this.textContent = initText;
|
||||
this.owner = owner;
|
||||
this.onSubmit = onSubmit;
|
||||
}
|
||||
generateHTML() {
|
||||
const div = document.createElement("div");
|
||||
const span = document.createElement("span");
|
||||
span.textContent = this.label;
|
||||
div.append(span);
|
||||
div.append(document.createElement("br"));
|
||||
const input = document.createElement("textarea");
|
||||
input.value = this.textContent;
|
||||
input.oninput = this.onChange.bind(this);
|
||||
this.input = new WeakRef(input);
|
||||
div.append(input);
|
||||
return div;
|
||||
}
|
||||
onChange(ev) {
|
||||
this.owner.changed();
|
||||
const value = this.input.deref().value;
|
||||
this.onchange(value);
|
||||
this.textContent = value;
|
||||
}
|
||||
onchange = _ => { };
|
||||
watchForChange(func) {
|
||||
this.onchange = func;
|
||||
}
|
||||
submit() {
|
||||
this.onSubmit(this.textContent);
|
||||
}
|
||||
}
|
||||
class FileInput {
|
||||
label;
|
||||
owner;
|
||||
onSubmit;
|
||||
input;
|
||||
constructor(label, onSubmit, owner, {} = {}) {
|
||||
this.label = label;
|
||||
this.owner = owner;
|
||||
this.onSubmit = onSubmit;
|
||||
}
|
||||
generateHTML() {
|
||||
const div = document.createElement("div");
|
||||
const span = document.createElement("span");
|
||||
span.textContent = this.label;
|
||||
div.append(span);
|
||||
const input = document.createElement("input");
|
||||
input.type = "file";
|
||||
input.oninput = this.onChange.bind(this);
|
||||
this.input = new WeakRef(input);
|
||||
div.append(input);
|
||||
return div;
|
||||
}
|
||||
onChange(ev) {
|
||||
this.owner.changed();
|
||||
if (this.onchange) {
|
||||
this.onchange(this.input.deref().files);
|
||||
}
|
||||
}
|
||||
onchange = null;
|
||||
watchForChange(func) {
|
||||
this.onchange = func;
|
||||
}
|
||||
submit() {
|
||||
this.onSubmit(this.input.deref().files);
|
||||
}
|
||||
}
|
||||
class RoleList extends Buttons {
|
||||
permissions;
|
||||
|
|
@ -174,28 +293,73 @@ class RoleList extends Buttons {
|
|||
this.onchange(this.curid, this.permission);
|
||||
}
|
||||
}
|
||||
class HtmlArea {
|
||||
submit;
|
||||
html;
|
||||
constructor(html, submit) {
|
||||
this.submit = submit;
|
||||
this.html = html;
|
||||
}
|
||||
generateHTML() {
|
||||
if (this.html instanceof Function) {
|
||||
return this.html();
|
||||
}
|
||||
else {
|
||||
return this.html;
|
||||
}
|
||||
}
|
||||
}
|
||||
class Options {
|
||||
name;
|
||||
haschanged = false;
|
||||
options;
|
||||
owner;
|
||||
constructor(name, owner) {
|
||||
ltr;
|
||||
constructor(name, owner, { ltr = false } = {}) {
|
||||
this.name = name;
|
||||
this.options = [];
|
||||
this.owner = owner;
|
||||
this.ltr = ltr;
|
||||
}
|
||||
addPermissionToggle(roleJSON, permissions) {
|
||||
this.options.push(new PermissionToggle(roleJSON, permissions, this));
|
||||
}
|
||||
addOptions(name, { ltr = false } = {}) {
|
||||
const options = new Options(name, this, { ltr });
|
||||
this.options.push(options);
|
||||
return options;
|
||||
}
|
||||
addFileInput(label, onSubmit, {} = {}) {
|
||||
const FI = new FileInput(label, onSubmit, this, {});
|
||||
this.options.push(FI);
|
||||
return FI;
|
||||
}
|
||||
addTextInput(label, onSubmit, { initText = "" } = {}) {
|
||||
const textInput = new TextInput(label, onSubmit, this, { initText });
|
||||
this.options.push(textInput);
|
||||
return textInput;
|
||||
}
|
||||
addMDInput(label, onSubmit, { initText = "" } = {}) {
|
||||
const mdInput = new MDInput(label, onSubmit, this, { initText });
|
||||
this.options.push(mdInput);
|
||||
return mdInput;
|
||||
}
|
||||
addHTMLArea(html, submit = () => { }) {
|
||||
const htmlarea = new HtmlArea(html, submit);
|
||||
this.options.push(htmlarea);
|
||||
return htmlarea;
|
||||
}
|
||||
generateHTML() {
|
||||
const div = document.createElement("div");
|
||||
div.classList.add("titlediv");
|
||||
const title = document.createElement("h2");
|
||||
title.textContent = this.name;
|
||||
div.append(title);
|
||||
title.classList.add("settingstitle");
|
||||
if (this.name !== "") {
|
||||
const title = document.createElement("h2");
|
||||
title.textContent = this.name;
|
||||
div.append(title);
|
||||
title.classList.add("settingstitle");
|
||||
}
|
||||
const table = document.createElement("div");
|
||||
table.classList.add("flexttb", "flexspace");
|
||||
table.classList.add(this.ltr ? "flexltr" : "flexttb", "flexspace");
|
||||
for (const thing of this.options) {
|
||||
table.append(thing.generateHTML());
|
||||
}
|
||||
|
|
@ -203,6 +367,10 @@ class Options {
|
|||
return div;
|
||||
}
|
||||
changed() {
|
||||
if (this.owner instanceof Options) {
|
||||
this.owner.changed();
|
||||
return;
|
||||
}
|
||||
if (!this.haschanged) {
|
||||
const div = document.createElement("div");
|
||||
div.classList.add("flexltr", "savediv");
|
||||
|
|
@ -215,11 +383,19 @@ class Options {
|
|||
this.haschanged = true;
|
||||
this.owner.changed(div);
|
||||
button.onclick = _ => {
|
||||
this.owner.save();
|
||||
if (this.owner instanceof Buttons) {
|
||||
this.owner.save();
|
||||
}
|
||||
div.remove();
|
||||
this.submit();
|
||||
};
|
||||
}
|
||||
}
|
||||
submit() {
|
||||
for (const thing of this.options) {
|
||||
thing.submit();
|
||||
}
|
||||
}
|
||||
}
|
||||
class Settings extends Buttons {
|
||||
static Buttons = Buttons;
|
||||
|
|
@ -228,8 +404,8 @@ class Settings extends Buttons {
|
|||
constructor(name) {
|
||||
super(name);
|
||||
}
|
||||
addButton(name) {
|
||||
const options = new Options(name, this);
|
||||
addButton(name, { ltr = false } = {}) {
|
||||
const options = new Options(name, this, { ltr });
|
||||
this.add(name, options);
|
||||
return options;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue