Payload

Front end for the Captain Draft & Mix PUG Service under HLPugs.tf. The goal of this project is to create a tool for Captain Draft & Mix PUGs in Team Fortress 2 that is customizable and extendable.

Getting Started

Prerequisites

• Node.js
• npm (this comes with Node.js now)
• TypeScript installed: Run npm i -g typescript from a command prompt
• Intel - The accompanying back end to Payload

Installing

1. Clone the repository
2. Within the repository execute npm i

Developing

1. Start your Intel instance
2. Run npm start inside of Payload

Now you should be able to start editing any .tsx or .ts file and get instant feedback through localhost:3000

Customizing

If you are just interested in customizing your own instance of Payload, here are a few simple things you can do.

1. Edit /src/style.scss's variables to get colors and other simple visuals changed
2. Edit /public files to your liking. This includes favicon.ico, index.html, and manifest.json
3. Replace /src/img/logo.svg with your respective logo

Deployment

After customizing/developing your changes, you can deploy Payload to a static webhost.

1. Run npm run build to create the static files necessary
2. Add these files to your static host such as NGINX

Built With

• React (React TS Scripts) - User interface library
• Typescript - Type system
• Socket.io - Back end communications
• Emoji Mart - Emoji picker

Authors

• Nicell - Main Developer and Designer
• Kala - UI/UX Contributor

See the contributors page for more people who've helped with the project.

License

This project is licensed under the MIT License. See LICENSE.md for details.

Acknowledgements

• Sickday and Qixalite for the TF2 Class Icons
• erynn for helping with technical questions when building the legacy version of HLPugs.tf