import { CSSProperties, useContext } from 'react'; import * as cookies from 'react-cookies'; import axios from 'axios'; import pica from 'pica'; import reduce from 'image-blob-reduce'; import { NavBar } from '../components/navbar'; import { CenteredPage, PageTitle } from '../components/page'; import { Vierkant, IconLabelButton, CheckBox, ColorPicker } from '../components/ui'; import { AccountAvatar } from '../components/account'; import { CurrentGameSettings } from '../components/gameSettings'; import PreferencesContext from '../components/preferencesContext'; import EditOutlinedIcon from '@material-ui/icons/EditOutlined'; import VisibilityOutlinedIcon from '@material-ui/icons/VisibilityOutlined'; import ExitToAppOutlinedIcon from '@material-ui/icons/ExitToAppOutlined'; import PublishOutlinedIcon from '@material-ui/icons/PublishOutlined'; var SettingsSubsectionStyle: CSSProperties = { marginTop: 24, minHeight: 40 }; async function uploadNewProfileImage() { if (!this.result) return; var result = this.result.split(";"); var mimeType = result[0].substr(5); if (!["image/png", "image/jpeg"].includes(mimeType)) return; var blob = await (await fetch(this.result)).blob() var image = await new reduce().toBlob(blob, { max: 256 }); var reader = new FileReader(); reader.readAsBinaryString(image); reader.onload = async () => { await axios.request({ method: "post", url: `/api/user/avatar`, headers: {"content-type": "image/png"}, data: btoa(reader.result as string) }); window.location.reload(); //TODO: this is straight garbage } } export default function SettingsPage() { var { preferences, updatePreference } = useContext(PreferencesContext); return (
Instellingen

Account

{ var file = event.target.files[0]; if (!file) return; var reader = new FileReader(); reader.onload = uploadNewProfileImage; reader.readAsDataURL(file); }}/>
}/>

Gebruikersnaam

Hier staat hij dan

}/> }/>

Email

******@example.com

}/>

Wachtwoord

Kleuren

Schijfjes

Achtergrond

updatePreference({"darkMode": state}) }/>

Donkere modus

Standaard spelregels

Uitloggen

} text="Uitloggen" style={{ float: "none", marginLeft: 0 }} onclick={() => { cookies.remove("token") window.location.pathname = "/"; }}/>
); }