diff --git a/src/Profile/Profile.js b/src/Profile/Profile.js index 9603eb6..d9f60eb 100644 --- a/src/Profile/Profile.js +++ b/src/Profile/Profile.js @@ -1,4 +1,4 @@ -import server from "../_/code/bridge/server"; +import server from "../_/code/bridge/serverFunctions"; import util from "../util"; css(` diff --git a/src/apps/Announcements/Announcements.js b/src/apps/Announcements/Announcements.js index 1b13d69..b281b2d 100644 --- a/src/apps/Announcements/Announcements.js +++ b/src/apps/Announcements/Announcements.js @@ -83,7 +83,11 @@ class Announcements extends Shadow { .display("none") .visibility("hidden") .onChange((e) => { - this.handleUpload(e.target.files[0]); + const file = e.target.files[0] + if (!file) return + this.stagedImage = file + this.stagedImageURL = URL.createObjectURL(file) + this.rerender() }) div("+") @@ -138,8 +142,8 @@ class Announcements extends Shadow { this.style.backgroundColor = "var(--accent)" } else { setTimeout(() => { - $("appmenu-").display("none") + this.focus() }, 20) console.log($("appmenu-")) this.style.backgroundColor = "var(--searchbackground)" @@ -169,6 +173,31 @@ class Announcements extends Shadow { }) } + async handleUpload(file) { + try { + const body = new FormData(); + body.append('image', file); + const res = await util.authFetch(`${util.HOST}/profile/upload-image`, { + method: "POST", + credentials: "include", + headers: { + "Accept": "application/json" + }, + body: body + }); + + if(res.status === 401) { + return res.status + } + if (!res.ok) return res.status; + const data = await res.json() + global.profile = data.member + console.log(global.profile) + } catch (err) { // Network error / Error reaching server + console.error(err); + } + } + addPhoto() { console.log("hey") } diff --git a/src/apps/People/PeopleCard.js b/src/apps/People/PeopleCard.js index b7fdbae..9797316 100644 --- a/src/apps/People/PeopleCard.js +++ b/src/apps/People/PeopleCard.js @@ -10,7 +10,6 @@ class PeopleCard extends Shadow { render() { HStack(() => { HStack(() => { - console.log(this.imgSrc) if (this.imgSrc && !this.imgSrc.includes("null")) { img(this.imgSrc, "3em", "3em") .borderRadius(100, pct) diff --git a/src/components/AppMenu.js b/src/components/AppMenu.js index caf35de..cc36658 100644 --- a/src/components/AppMenu.js +++ b/src/components/AppMenu.js @@ -3,35 +3,33 @@ import util from "../util.js" class AppMenu extends Shadow { selected = "" + apps = global.currentNetwork.apps + darkMode = window.matchMedia('(prefers-color-scheme: dark)').matches - images = { - "Dashboard": {src: ["home-src", "home-selected-src"]}, - "People": {src: ["people-src", "people-selected-src"]}, - "Settings": {src: ["settings-src", "settings-selected-src"]}, - "Events": {src: ["events-src", "events-selected-src"]}, - "Jobs": {src: ["jobs-src", "jobs-selected-src"]} + getImageURL(appName) { + let imgUrl = `${util.HOST}/db/apps/${appName}/icons/${appName}` + if(this.darkMode) { + imgUrl += "light" + } + imgUrl += ".svg" + imgUrl = imgUrl.toLowerCase() + return imgUrl } onNewSelection() { this.$$("img").forEach((image) => { image.style.borderBottom = "1px solid transparent" - const app = image.attributes.app.value - if (app === global.currentApp()) { + const appName = image.attributes.app.value + if (appName === global.currentApp()) { image.style.borderBottom = "1px solid var(--text)" - image.src = util.cssVariable(this.images[app].src[1]) - } else { - image.src = util.cssVariable(this.images[app].src[0]) } + image.src = this.getImageURL(appName) }) } render() { - // let apps = global.currentNetwork.apps - let apps = [ - "Dashboard", "Jobs", "Events", "People" - ] - - let appCount = apps.filter(a => a !== "Settings").length + let apps = this.apps + let appCount = apps.filter(app => app !== "Settings").length let horizontalMargin = { 1: 50, 2: 10, @@ -45,7 +43,8 @@ class AppMenu extends Shadow { for(let i = 0; i < apps.length; i++) { let app = apps[i] if (app === "Settings") continue; - img(util.cssVariable(global.currentApp() === app ? this.images[app].src[1] : this.images[app].src[0]), "1.3em") + + img(this.getImageURL(app), "1.3em") .attr({app: app}) .padding(0.5, em) .borderBottom(global.currentApp() === app ? "1px solid var(--text)" : "1px solid transparent") @@ -59,7 +58,7 @@ class AppMenu extends Shadow { } }) .display("grid") - .gridTemplateColumns(`repeat(${apps.filter(a => a !== "Settings").length}, 1fr)`) + .gridTemplateColumns(`repeat(${apps.filter(app => app !== "Settings").length}, 1fr)`) .placeItems("center") .borderTop("0.5px solid var(--divider)") .height("auto") diff --git a/src/components/AppWindow.js b/src/components/AppWindow.js index 6f3a680..51e6519 100644 --- a/src/components/AppWindow.js +++ b/src/components/AppWindow.js @@ -4,6 +4,7 @@ import "../apps/Jobs/Jobs.js" import "../apps/People/People.js" import "../apps/Events/Events.js" import "../apps/Announcements/Announcements.js" +import util from "../util.js" class AppWindow extends Shadow { render() { @@ -13,14 +14,6 @@ class AppWindow extends Shadow { case "Dashboard": Announcements() break; - - case "Messages": - Messages() - break; - - case "People": - People() - break; case "Jobs": Jobs() @@ -29,6 +22,18 @@ class AppWindow extends Shadow { case "Events": Events() break; + + case "People": + People() + break; + + default: + if(window[app]) { + window[app]() + } else { + this.getCustomApp(app) + } + break; } }) .height(100, pct) @@ -37,6 +42,11 @@ class AppWindow extends Shadow { this.rerender() }) } + + async getCustomApp(app) { + await import(`${util.HOST}/apps/${app.toLowerCase()}/${app.toLowerCase()}.js`); + this.rerender() + } } register(AppWindow) \ No newline at end of file