A webapp designed for tracking big fish and arranging them by which fish are less often available rather than just available right now.
This repo makes use of submodules. When cloning, please include the --recurse-submodules
option.
git clone --recurse-submodules https://github.com/icykoneko/ff14-fish-tracker-app.git
If you forgot to include the submodules during cloning, don't worry. Assuming you haven't checked them out yet, running git submodule update --recursive --init
should take care of it.
If you've already checked out the submodules and are running into issues with the SaintCoinach module, the repo address recently changed. Unfortunately, it's a pain to fix... You'll most likely need to run git submodule sync --recursive
after pulling the latest changes. After that, the git submodule update --recursive --remote
command should work right. Sorry it's such a pain.
The management of fish data is done using Python. It's recommended you create a virtual environment.
py -m venv pyvirt
pyvirt\Scripts\activate
pip install -r private/python-requirements.txt
The webapp itself is completely static. At this time, some of the development environment functions are manually driven. Recommended you install FNM.
winget install Schniz.fnm
lts-dubnium
.npm install
sprity
.
npm i sprity-cli -g
npm i sprity-jimp -g
NOTE: Sprity doesn't seem to work in newer versions of Node due to dependencies... I've only had success running it via Node v10.24.1 on Windows.
This application uses GitHub Pages to host the site, but the branch isn't a perfect copy of the main branch... I highly recommend using a worktree to have the gh-pages
branch checked out in a folder named dist
.
git worktree add --track ./dist gh-pages
Sometimes you forget how to do this after several months... Clearly the TODO list isn't getting done...
python ./private/manageFishData.py addnew -p <NEW_PATCH_NUMBER> -x ./private/ignoredFish.txt
private/fishData.yaml
with the new additions (or changes).
private/fishDataTemplate.yaml
as a template for adding new records. For new patches, include a comment before the start of the patch additions (for readability-sake, I dunno...).SaintCoinach
master branch, then compare with the my-current branch for changes.
git diff -U20 my-current
saintcoinach-py
project to reflect any recent changes and comment to the local repo there. (Yes, that's right, I ported SaintCoinach to Python!)git merge master
or use the GitDesktop app to make life easier...git submodule update --recursive --remote
command to checkout the updates.python ./private/manageFishData.py rebuild -i ./private/fishData.yaml -o ./js/app/data.js --with-icons
index.html
, fishtrain.html
, and trainpass/index.html
for js/app/data.js
. Use the format: ?${ver}_YYYYMMDD_HHMM
.python ./private/rebuildFishGuide.py -o ./js/app/fish_info_data.js --with-icons
index.html
, fishtrain.html
, and trainpass/index.html
for js/app/fish_info_data.js
. Use the format: ?${ver}_YYYYMMDD_HHMM
.SiteSettings::filters::patch
in viewmodel.js
and fishtrain.js
.LATEST_PATCH
to the new patch number (only needed for M.m patches, not M.mm) in viewmodel.js
only.SHOW_LATEST_PATCH_AFTER
to patch release date, plus 2 weeks to prevent spoilers.index.html
for js/app/viewmodel.js
. Use the format: ?YYYYMMDD_HHMM
.fishtrain.html
and trainpass/index.html
for js/app/fishtrain.js
. Use the format: ?YYYYMMDD_HHMM
.disabled
class from the new patch version with active
in index.html
and fishtrain.html
.disabled
at first.index.html
, fishtrain.html
, and trainpass/index.html
for public/images/sprite.css
. Use the format ?${ver}_YYYYMMDD
.sprity create ./public/images/ ./private/images/**/*.png -c . -s sprite.css --prefix sprite-icon --margin 2 --orientation binary-tree --engine jimp
public/images/sprite.css
file and add a cache buster to the main image. Use the format: ?YYYYMMDD
.public/images/sprite.png
file using https://tinypng.com/. This should reduce its size by ~67% and that reduces bandwidth, and costs.date-fns
using the npm run build
command.npm start
then open http://localhost:3000/.git push
all changes to GitHub as well.gh-pages
branch under _data/videoGuides.yaml
.Instead of manually updating the pages each time, before committing changes, you can use the updateCacheBuster Python script on the list of modified files.
python ./private/updateCacheBusters.py -p ${ver} $(git status -uno --porcelain=v1 | cut -c4-)
date-fns
using the npm run build
command.gh-pages
branch (or cd dist
.)master
branch in. You'll need to remove the entries that only exist in master... it's annoying, sorry.sprite.png
and sprite.css
files in public/images/
for the gh-pages
branch. This is not included in the master branch!public/js
from master to the gh-pages
branch as well.npm run build
# Assuming you've created a "workspace" folder dist that's tied to the gh-pages branch...
cd dist
# Merge master branch (deal with any "missing" files...)
git merge master
for f in $(git status --porcelain | grep "^DU" | cut -f2 -d' '); do git rm $f; done
# In case anything changed, copy files from public into the branch too.
cp -vrf ../public/images/sprite.* ./public/images/
cp -vrf ../public/js/* ./public/js/
# Remember to add them.
git add public/images/ public/js/
# Always do one final check of the site to be sure nothing got messed up in the merge.
# (This is especially important when making large changes.)
bundle exec jekyll serve
# If everything's good, commit and push.
git commit
git push
There's lots of features waiting to be implemented if you feel you have an idea for tackling them. Please follow existing code patterns with regards to style, and when possible, utilize the Semantic UI widgets so everything meshes nicely. Keep PRs simple to ensure they get merged sooner.
For changes to availability of specific fish, please contact me directly via Discord (via Fish'cord). Please do not open issues here for that purpose.