acmucsd / acm-ai-site Goto Github PK

• need data stored on website (some big json)
• pick a reasonable thumbnail and store it on website perhaps
• add projects description
• turn the card into a modal to contain the content. Click card, opens modal with description, github, and slides link. Tags and cover image remain on the original card.

Before submission on competition submission page, allow user to select from a fixed list of tags, as well as a write a corresponding description for their submission

https://ai.acmucsd.com/competitions/wi22nn/upload <- current look

https://www.notion.so/acmucsd/Landing-Page-layout-25ad4444f3fb4feaa2e1b937aec9f5ac

Jonah has drafted some content here, will ask for a markdown version. But going forward we should just auto render markdown content instead of custom writing all the divs and stuff.

Other metadata we will leave out of markdown (e.g. start/end dates)

Add Ant UI Carousel

• should automatically scroll between content (10seconds delay)
• need three cards with info (what is acm ai, model your path, acm general stuff)

Our events card has some strange border, we would like to fix the CSS for that.

https://ai.acmucsd.com/competitions/:comp_id ->

• fetch competition information from one of the new api routes
• display the relevant text: competition name, start and end date, leaderboard, a refresh leaderboard button, and a upload button

https://ai.acmucsd.com/competitions/:comp_id/upload ->

• page for uploading predictions / submissions.
• code should mostly be the same
• fix up the css a bit

• Restructure paragraphs
• Add links and new icons for social media

Example:
https://d2l.ai/chapter_linear-networks/linear-regression.html#basic-elements-of-linear-regression

• Take jupyter notebook code from a workshop, port it to our website like documentation

Basically same code as NN but

Text:

Reinforcement Learning Competition Winter 2021
Description: TBA

Button: Upload Agent, Refresh Leaderboard

Table is the exact same, Username, Latest Score, Score History

Fix weird card widths

Submission Page:

Title: Submit Agent
Subtext: You must submit your agent.py file for evaluation on our servers to then show up on the leaderboard
Click to submit .py file

• Fixed size list (3 max) of event cards
• Show "no data" if no events are live
• "Browse all" button should navigate to Events page
• Responsive size and layout?

• Ant Badges
• Timeline layout
• Empty component (no upcoming events)

• If there is an upcoming event, display it as a card on the front banner of the home page

User should be able to click a register button, read some text and then click accept and join. For now just leave the text as a temporary one like.

"By registering and joining this competition, you agree to abide by all competition rules. Note that once registered, you must make a team first (even if it's just you) on the teams page for this competition in order to make submissions"

API route is POST /v1/competitions/:competitionName/:username/register with empty body.

Moreover if user is not registered yet (has not competitionUser entry in DB), then we should only show them the Leaderboard button to the leaderboard page an the registration button

If user is registered, we show leaderboard button, teams button, and submission button.

Add individual pages/drawers/modals for each event with more details? Figure out if needed

API is /:competitionName/leaderboard
data returned is just

{ scoreHistory: team.scoreHistory,
            bestScore: team.bestScore,
            teamName: team.teamName}

On this page /competitions/:competition_id/teams

display a create team form. Upon submission, create a new team with your user in it.

the list style can be the same as the leaderboard.

should only be shown to members in the team.

• Show user information
  • name,
  • UCSD student or not
• show profile picture
• have a button for resume upload
• profile picture upload

• Page should one, describe what ACM AI projects are
• 2 column format ish? Picture on one side, information / introduction of a project on other side and relevant links
• Have a link to the application form. Have 2 displays, one when it is open, one when it is not
• Showcase past projects (in the near future)
• Pictures

• Talk to marketing and sponsorship about what info to include
• Use Ant UI accordion component

/competitions/:comp_name/teams/:team_name/submissions/:submission_id

This should be a general submissions page for this particular team

Use this API route /:competitionName/entry/:submissionId to find all matches from this submission

Display the raw data for now.

Also need a button on /competitions/:comp_name/teams/:team_name/ page to click to go to submission page (with a back button to the team page)./

• on small screens, put only one profile per row
• make descriptions expandable on small screens
• [optional] - add social media links on each profile if provided, e.g. github, twitter, email, website

can copy the back button in http://localhost:3000/competitions/TestCompetition1/upload (in the upload page code)

Need to clean up navbar

• white background
• shadow
• tab group
• add new buttons

show username, and latest top score, and somehow score history

Should be a page at ai.acmcsd.com/resetpassword?code={somecode}&username={username} that takes a query param code and username (username is same as userID)

and submits new (validated) password along with the code by posting to /v1/:userID/resetpassword

• Display basic team information (Team name, team members)
• Buttons to leave team
• Joining the team via a team invite code link.
• Team creation button

Uses this API route: https://github.com/acmucsd/acm-ai-api/blob/master/src/routes/v1/teams/index.ts#L95

On the all teams page, in addition to team creation form you can also copy paste a join code and click join and attempt to join a team. Should be a simple input element / form and should use the /:competitionName/add-to-team/ route to join a team with the join code.

This should also do error handling. E.g. if joining is unsuccessful, list out reason (e.g. server error or wrong join code).

Add a link to wiki.ai.acmucsd.com. We would like to have one on the header component at least. On the events page, we should also add that to the "Where to find our workshops?" section.

This page should at the minimum have:

• General blurb about what workshops we host
• Pictures from our workshops if possible
• Add new tab to header for this page
• Links

• Fix the bug to show the next event