Apex Live Overlay

Status

Team name display UI
Live-update Team name (test by emulate*.py)
Test in Apex Legend (I need my friend to test it b/c I run Apex with Steam error on my PC)
Show rank and score from DGS API
Calculate rank and score (Unknown Implementability)
Improve project structure

Setup

The tutorial is modified by https://apexliveapi.com/docs/quickstart/python/

Install Python 3.9 or higher and Enable Add Python to PATH in installer
Click [<> Code] and [Download ZIP] and Extract it or git clone https://github.com/YuevUwU/apex-live-overlay.git if you have downloaded git
Modify team_data to what you want to display
Run Terminal by tapping [Win-R] and entering cmd
Navigate to Project with cd /path/to/apex-live-overlay

Run these command:

# Upgrade pip (a package-management system in Python) (Do it only once)
python -m ensurepip --upgrade

# Create Virtual Environment (Do it only once)
python -m venv .venv

# Active Virtual Enviroment
.venv\Scripts\activate.bat

# Install requirements (Do it only once)
pip install -r requirements.txt

Check Set Launch Options written in apex-liveapi-documentation
(Optional) You can update events_pb2.py with that tutorial or not
Run:
```
python main.py
```

OBS Setup

Add a Browser Source
Make sure "Local Files" is checked
[Browse] and Open index.html in this project.
Press [OK]
(Optional) If you want to show only team, you can paste this code in [Your Browser Source] > Custom CSS

body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }
.line, .rank, .score {display: none}
.team-name {width: 100%; text-align: center; margin-right: 0.9em}
.live-overlay-shadow {top: 3px; left: 5px}
.live-overlay {
  width: 5em;
  clip-path: polygon(
    0.4287187078898em 1.6em,
    0em 0.5em,
    0.3em 0em,
    5.1em 0em,
    5.5555em 1.1em,
    5.2em 1.6em
  )
}

(Replace .live-overlay-shadow {...} with .live-overlay-shadow {display: none} if you don't want to see the red shadow.)

Special Thanks

Difficulty

About I chose File I/O

Solved since 0.2.0:: With sending data to another port, it's no longer to use file i/o

I have tried to use Flask and/or raw javascript, but they didn't return anything to html.
As a last resort, I can only implement it with File I/O, so the project is not support Browser Source 😣

Why I hope users install font to local

Solved since 0.2.0:: With sending data to another port, it's no longer need to use web font while frequent refreshing by live.js.

Disable Cache can avoid refresh delay (~3-20s) during idling for 2 minutes. ^[ref1]
Local font can avoid font switching flashes.
Maybe it can be solved by periodically adding junk comments to index.html 🤔

Why I use PY file to save data instead of JSON

~~Just want to use int as key~~
I don't want to spend too much code on File I/O.

Relative Import

I have tried to use sys.path but it was not working again, why... Maybe pyproject.toml is the only method I can improve the project structure...^[ref2]

YuevUwU/apex-live-overlay