diff options
| -rw-r--r-- | package.json | 3 | ||||
| -rw-r--r-- | pages/settings.tsx | 30 | ||||
| -rw-r--r-- | yarn.lock | 40 |
3 files changed, 64 insertions, 9 deletions
diff --git a/package.json b/package.json index 5abd5fb..3f67c52 100644 --- a/package.json +++ b/package.json @@ -10,12 +10,15 @@ "@testing-library/jest-dom": "^5.11.4", "@testing-library/react": "^11.1.0", "@testing-library/user-event": "^12.1.10", + "@types/pica": "^5.1.2", "@types/react-cookies": "^0.1.0", "@types/uuid": "^8.3.0", "axios": "^0.21.1", "email-validator": "^2.0.4", "friendly-time": "^1.1.1", + "image-blob-reduce": "^2.2.2", "next": "^10.0.5", + "pica": "^6.1.1", "react": "^17.0.1", "react-cookies": "^0.1.1", "react-dom": "^17.0.1", diff --git a/pages/settings.tsx b/pages/settings.tsx index bbc4672..99a87d1 100644 --- a/pages/settings.tsx +++ b/pages/settings.tsx @@ -1,6 +1,8 @@ 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'; @@ -19,19 +21,29 @@ var SettingsSubsectionStyle: CSSProperties = { minHeight: 40 }; -function uploadNewProfileImage() { +async function uploadNewProfileImage() { if (!this.result) return; + var result = this.result.split(";"); var mimeType = result[0].substr(5); - var data = result[1].substr(7); + if (!["image/png", "image/jpeg"].includes(mimeType)) return; - axios.request({ - method: "post", - url: `/api/user/avatar`, - headers: {"content-type": "image/png"}, - data: data - }) - .then(() => window.location.reload()); //TODO: this is straight garbage + + 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() { @@ -2028,6 +2028,11 @@ resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0" integrity sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA== +"@types/pica@^5.1.2": + version "5.1.2" + resolved "https://registry.yarnpkg.com/@types/pica/-/pica-5.1.2.tgz#d96cf3efbb7d839109d5a43c0733886e70cdd9fd" + integrity sha512-KJPg2vGt1l03VaDK1SPKDcm/I5RVexO5Jyo/kGPlaS7SqVOkY83O3f1iyff981UnSzbF3Tg1Zw0r6vX6vB6JxA== + "@types/prettier@^2.0.0": version "2.1.5" resolved "https://registry.yarnpkg.com/@types/prettier/-/prettier-2.1.5.tgz#b6ab3bba29e16b821d84e09ecfaded462b816b00" @@ -5986,6 +5991,11 @@ globby@^6.1.0: pify "^2.0.0" pinkie-promise "^2.0.0" +glur@^1.1.2: + version "1.1.2" + resolved "https://registry.yarnpkg.com/glur/-/glur-1.1.2.tgz#f20ea36db103bfc292343921f1f91e83c3467689" + integrity sha1-8g6jbbEDv8KSNDkh8fkeg8NGdok= + graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.4: version "4.2.4" resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.4.tgz#2256bde14d3632958c465ebc96dc467ca07a29fb" @@ -6381,6 +6391,13 @@ ignore@^5.1.4: resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.8.tgz#f150a8b50a34289b33e22f5889abd4d8016f0e57" integrity sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw== +image-blob-reduce@^2.2.2: + version "2.2.2" + resolved "https://registry.yarnpkg.com/image-blob-reduce/-/image-blob-reduce-2.2.2.tgz#0c1c1817ee8666bcd174f191a125ea70a2f041d2" + integrity sha512-4pfusXGLRfMyASVr/nvHxHoYDcB+VbfYnOrLdK2VWO56yhkLvSP9l2HXwYIJUFBw4bPqQoZPWFm7rz01lgaOgA== + dependencies: + pica "^6.1.1" + immer@7.0.9: version "7.0.9" resolved "https://registry.yarnpkg.com/immer/-/immer-7.0.9.tgz#28e7552c21d39dd76feccd2b800b7bc86ee4a62e" @@ -8162,6 +8179,14 @@ multicast-dns@^6.0.1: dns-packet "^1.3.1" thunky "^1.0.2" +multimath@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/multimath/-/multimath-2.0.0.tgz#0d37acf67c328f30e3d8c6b0d3209e6082710302" + integrity sha512-toRx66cAMJ+Ccz7pMIg38xSIrtnbozk0dchXezwQDMgQmbGpfxjtv68H+L00iFL8hxDaVjrmwAFSb3I6bg8Q2g== + dependencies: + glur "^1.1.2" + object-assign "^4.1.1" + nan@^2.12.1: version "2.14.2" resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.2.tgz#f5376400695168f4cc694ac9393d0c9585eeea19" @@ -8952,6 +8977,16 @@ performance-now@^2.1.0: resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b" integrity sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns= +pica@^6.1.1: + version "6.1.1" + resolved "https://registry.yarnpkg.com/pica/-/pica-6.1.1.tgz#5219d70265bf34926f656e42268b14ddba5c734b" + integrity sha512-dmjQheDGFOl+30rQhN3NM3MyDNjeOZvco6IL3ZVYgyVDmhgvcSCGOAsydRCIaZ36mcXO7ci0XFeD+h6unEcBvA== + dependencies: + inherits "^2.0.3" + multimath "^2.0.0" + object-assign "^4.1.1" + webworkify "^1.5.0" + picomatch@^2.0.4, picomatch@^2.0.5, picomatch@^2.2.1, picomatch@^2.2.2: version "2.2.2" resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad" @@ -12518,6 +12553,11 @@ websocket-extensions@>=0.1.1: resolved "https://registry.yarnpkg.com/websocket-extensions/-/websocket-extensions-0.1.4.tgz#7f8473bc839dfd87608adb95d7eb075211578a42" integrity sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg== +webworkify@^1.5.0: + version "1.5.0" + resolved "https://registry.yarnpkg.com/webworkify/-/webworkify-1.5.0.tgz#734ad87a774de6ebdd546e1d3e027da5b8f4a42c" + integrity sha512-AMcUeyXAhbACL8S2hqqdqOLqvJ8ylmIbNwUIqQujRSouf4+eUFaXbG6F1Rbu+srlJMmxQWsiU7mOJi0nMBfM1g== + whatwg-encoding@^1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-1.0.5.tgz#5abacf777c32166a51d085d6b4f3e7d27113ddb0" |