sam/ForumMobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improving styling, fixing bugs with profile, login error handling

Browse Source
This commit is contained in:
metacryst
2026-03-19 07:41:18 -05:00
parent 3a5214ed45
commit 5a56dfa051
9 changed files with 107 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
capacitor.config.json
View File

@@ -5,6 +5,10 @@
"ios": {
"allowsBackForwardNavigationGestures": true
},
"server": {
"url": "http://sam.local:5173",
"cleartext": true
},
"plugins": {
"SplashScreen": {
"launchAutoHide": true

5
src/Home/AuthPage/AuthPage.js
View File

@@ -44,7 +44,7 @@ class AuthPage extends Shadow {
this.rerender();
})
p("Signup")
p("Sign Up")
.fontWeight(this.selectedPage === 2 ? "bold" : "normal")
.padding(0.75, em)
.borderRadius(12, px)
@@ -54,6 +54,7 @@ class AuthPage extends Shadow {
this.rerender();
})
})
.fontFamily("Arial")
.padding(0.25, em)
.borderRadius(12, px)
.background("var(--accent)")
@@ -61,7 +62,7 @@ class AuthPage extends Shadow {
.horizontalAlign("center")
.margin("auto")
.marginTop(7.5, em)
.marginBottom(0, em)
.marginBottom(2, em)
.gap(0.5, em)
switch (this.selectedPage) {

49
src/Home/AuthPage/Login.js
View File

@@ -29,12 +29,14 @@ class Login extends Shadow {
.marginVertical(1, em)
.padding(1, em)
.styles(this.inputStyles)
input("Password", "70vw")
.attr({ name: "password", type: "password" })
.margin("auto")
.marginVertical(1, em)
.padding(1, em)
.styles(this.inputStyles)
HStack(() => {
button("==>")
.padding(1, em)
@@ -44,6 +46,13 @@ class Login extends Shadow {
.color("var(--text)")
.border("1px solid var(--accent)")
.boxSizing("border-box")
.onTouch(function (start) {
if (start) {
this.style.backgroundColor = "var(--accent)"
} else {
this.style.backgroundColor = "var(--searchbackground)"
}
})
})
.width(70, vw)
.margin("auto")
@@ -52,23 +61,57 @@ class Login extends Shadow {
.paddingRight(2, em)
.marginVertical(1, em)
.border("1px solid transparent")
p("")
.dynamicText("errortype", "Please enter a valid {{}}.")
.margin("auto")
.marginTop(1, em)
.color("var(--text)")
.fontFamily("Arial")
.opacity(.7)
.padding(0.5, em)
.backgroundColor("var(--darkred)")
.display("none")
})
})
.height(100, pct)
.onSubmit(async (e) => {
e.preventDefault();
const data = new FormData(e.target);
const data = {
email: e.target.$('[name="email"]').value,
password: e.target.$('[name="password"]').value,
};
await this.requestLogin(data);
})
}
isValidEmail = (email) => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
isValidPassword = (password) => password.length >= 7;
async requestLogin(data) {
const emailValid = this.isValidEmail(data.email.trim() || "");
const passValid = this.isValidPassword(data.password.trim() || "");
if (!emailValid || !passValid) {
console.log("invalid", emailValid)
const errorType = !emailValid ? 'email' : 'password';
this.$("p")
.display("")
.attr({ errorType });
return;
} else {
this.$("p").style.display = "none"
}
const res = await fetch(`${util.HOST}/login`, {
method: "POST",
headers: { "Content-Type": "application/json", "X-Client": "mobile" },
body: JSON.stringify({
email: data.get("email"),
password: data.get("password")
email: data["email"],
password: data["password"]
})
});

11
src/Profile/Profile.js
View File

@@ -25,12 +25,13 @@ class Profile extends Shadow {
render() {
ZStack(() => {
p("X")
.color("var(--quillred")
.fontSize(4, em)
p("< Back")
.color("var(--darkred)")
.fontSize(1.5, em)
.position("absolute")
.top(0.5, rem)
.right(2, rem)
.fontFamily("Arial")
.top(2, rem)
.left(2, rem)
.zIndex(1001)
.onClick(() => {
$("appwindowcontainer-").closeProfile()

1
src/_/code/shared.css
View File

@@ -87,6 +87,7 @@ html,
body {
padding: 0;
margin: 0;
font-family: Arial;
}
body {

1
src/apps/Jobs/Jobs.js
View File

@@ -118,7 +118,6 @@ class Jobs extends Shadow {
}
checkForUpdates(currentJobs, fetchedJobs) {
console.log(currentJobs, fetchedJobs)
if (currentJobs.length !== fetchedJobs.length) return true;
const currentMap = new Map(currentJobs.map(job => [job.id, job]));

10
src/components/AppWindowContainer.js
View File

@@ -15,9 +15,9 @@ class AppWindowContainer extends Shadow {
.width(100, pct)
.gap(0)
if (this.isProfileOpen) {
Profile()
}
.display("none")
.zIndex(3)
})
.height(100, pct)
.overflowY("hidden")
@@ -26,13 +26,11 @@ class AppWindowContainer extends Shadow {
}
openProfile() {
this.isProfileOpen = true
this.rerender()
this.$("profile-").display("")
}
closeProfile() {
this.isProfileOpen = false
this.rerender()
this.$("profile-").display("none")
}
}

15
src/components/Sidebar.js
View File

@@ -6,14 +6,11 @@ class Sidebar extends Shadow {
return p(text)
.fontSize(1.5, em)
.fontWeight("bold")
.fontFamily("Sedan SC")
.fontFamily("Arial")
.marginLeft(2, em)
.fontStyle("italic")
.onClick(function () { // BUG -- Fires twice every time
if(this.innerText === "Home") {
window.navigateTo("/")
return
} else if (this.innerText === "Logout") {
.onClick(function (done) {
if(done) {
if (this.innerText === "Logout") {
$("sidebar-").close()
global.onLogout()
return
@@ -22,15 +19,13 @@ class Sidebar extends Shadow {
$("sidebar-").close()
return
}
window.navigateTo(this.innerText.toLowerCase().replace(/\s+/g, ""))
}
})
}
render() {
VStack(() => {
this.SidebarItem("Profile")
this.SidebarItem("Home")
this.SidebarItem("Map")
this.SidebarItem("Logout")
})
.gap(2, em)

20
src/public/_/code/quill.js
View File

@@ -1,6 +1,7 @@
/*
Sam Russell
Captured Sun
2.19.26 - Adding dynamicText()
2.16.26 - Adding event objects to the onTouch callbacks
1.16.26 - Moving nav event dispatch out of pushState, adding null feature to attr()
1.5.26 - Switching verticalAlign and horizontalAlign names, adding borderVertical and Horizontal
@@ -691,6 +692,24 @@ HTMLElement.prototype.horizontalAlign = function (value) {
/* Elements */
HTMLElement.prototype.dynamicText = function(attr, template) {
// Set initial text if attr already has a value
if (attr !== attr.toLowerCase()) {
throw new Error(`quill: dynamicText() attr "${attr}" must be lowercase`);
}
if (this.getAttribute(attr)) {
this.innerText = template.replace('{{}}', this.getAttribute(attr));
}
new MutationObserver(() => {
console.log("mutateing")
const value = this.getAttribute(attr);
this.innerText = template.replace('{{}}', value ?? '');
}).observe(this, { attributes: true, attributeFilter: [attr] });
return this
};
quill.setChildren = function(el, innerContent) {
if(typeof innerContent === "string") {
el.innerText = innerContent
@@ -1204,5 +1223,6 @@ HTMLElement.prototype.attr = function(attributes) {
this.setAttribute(key, value);
}
}
return this;
};