Ambrosia - Web Application

As the window gets thinner, the items within top sticky menu will collapse and compact. This will provide the user all the features even with a smaller resolution.

To create an account the standard email, username, and password inputs are provided. All information is stored in MongoDB. Passwords are hashed on signup.

Each input has a validation process in which errors will be displayed to the user on failure. Inputs are first validated on the client side, once cleared the inputs will be validated in the backend. Depending on the input requirements and client side validation it may never send requests to the server. This will make the app faster as the user will not have to wait for a response from the backend.

On successful signup, the user will be redirected to the login page.

The login inputs are obviously validated as well. The login inputs go through the same validation process as the signup. Passwords will be compared to the hash passwords stored in the database.

With the correct account information, once logged in the user session will expire after a certain amount of time and they will have to re-enter their information. By checking the "Remember Me" box the user may stay logged for an extended amount of time.

A login modal will be displayed to the user most of the time to avoid redirection and create a seamless experience. In certain situations the user will be redirected to a login page. This will happen when the user is trying to access user sensitive information to prevent any information leaks. With the correct information the user will be redirected back to the page in which they were trying to access.

Once logged in the user may quickly access their profile, user settings, or logout.

In profile section the user, as well as other may see certain information such as the user activity, user comments, and other public statistics.

Users may comment on each others profiles and the number of comments are shown. By using cetain queries the exact number is obtained, excluding all irrelevant information that could have been collected during the request and repsonse phase. Comments are limited to a number of characters. User inputs are validated client side before backend validation.

Once the user posts a comment, a pop up will be displayed to notify the user.

Usernames are linked to their profiles for quick access. Timestamps are provided to display when the comment was posted.

Hovering over a comment will give you the option to either delete your own comment or another users comment if it is on your own profile. Every comment may be reported other than your own.

Once a comment section has more than 6 comments, a new "page" will be created. Only a limit of 6 comments will be retrieved each page to prevent too much unnecessary information to be gathered from the database.

A floating circle is always displayed to easily and quickly create a post.

Clicking this button will redirect the user to a page where they will fill out inputs for their post.

Tags can be added or deleted.

After a post is posted it will be displayed as a link on the users profile activity. As well as when it was posted.

Clicking the report button on a comment will prompt the user to a report modal which the user must fill in to submit a report for various reasons.

A successful report submittion will provide the following feedback.

Within the administrator dashboard, reports are recieved and displayed for easy management.

New categories may be added or deleted. As well as subcategories may be added or deleted from the main category, or its name edited.

All actions requiring database connectivity are validated both client side as well as backend.