dlamkins / new.blishhud.com Goto Github PK
View Code? Open in Web Editor NEWThe source for the Blish HUD website.
Home Page: https://blishhud.com
The source for the Blish HUD website.
Home Page: https://blishhud.com
The existing pathing documentation found at https://blishhud.com/docs/markers/ will be moved to its own site. It doesn't make sense that one random module has its entire documentation showcased on the main site (even if it is the largest module). We'll be moving that documentation to its own site and then need to add redirects for the old URLs to point to it so that users don't end up completely lost.
URLs will need to also be updated:
The new wiki site needs to go live first before we can begin pointing things over.
gw2pathing.wiki
).Currently clicking an image in the troubleshooting guides does not do anything. On some pages, like the module pages, clicking on an image can result in opening the direct link to the image which is seldom, if ever, the desired behavior.
For module pages, at a minimum, we should be showing larger versions of the image to allow users to inspect the images that does not redirect away from the page and instead show it in a model window.
Need a new troubleshooting overview page to link to from the home page instead of the old combined troubleshooting doc.
Currently module pages are loaded via querystring by namespace. Currently:
/modules/?namespace=module.namespace
Would be nicer if they got their own page:
/modules/module.namespace
I'm not sure how easy this is to do with Docusaurus' routing.
Consider making the side cards for module and author info "sticky" so that they move as you scroll down the module's profile details.
Currently requests to /modules/ appear to spawn multiple requests to our external json blobs. The state information is triggering the useEffect
when I do not expect it to. I currently am retriggering it because there were issues with loading the page when navigating between /modules/ and /modules/?namespace= since the page itself wasn't actually reloading.
Simply a lack of React experience on my part here to determine the best path forward.
The current actions are not very efficient. Some items could be removed to make it progress much faster. The push to gh-pages is also quite jank at the moment.
https://github.com/dlamkins/new.blishhud.com/blob/master/.github/workflows/update-site.yml
Module docs for controls could be auto-generated in part by the source itself.
It would be good to have it exported in some kind of json blob or otherwise that we can then load in with a react component that helps to standardize the majority of the content and auto-populate details while leaving some room for manual descriptions, remarks, tips, etc.
While not a priority, some mobile devices become too skinny to properly show the module tiles.
We should display the module icons a different way when the tile becomes skinny enough to warrant it. Likely including it in the header of the tile and then transitioning to tile to be shown more vertical.
Looks like I've just forgotten to reinclude the reference to FA5's CSS to allow for those icons.
https://new.blishhud.com/docs/user/ has a troubleshooting section which is now populated by discussion posts in https://github.com/blish-hud/Blish-HUD/discussions/categories/troubleshooting-common-guides
One of the build steps should perform this work instead of requiring it to be manually done and committed. Then a discussion hook can be added to the Blish-HUD repo to trigger new builds.
Consider showing contributors to modules.
This will require some effort on the SSRD side to pull those users, and since they are semi-free-form in the manifest, we may not be able to easily pull avatar graphics for them.
In modules.js there is a dropdown that is currently hidden. When porting from blazor to React I was unsure of the best way to implement the sort feature. It should be added back as the default sort is arbitrary and based on the order generated by SSRD.
When loading external content for /modules/ etc. we currently show a big hero "Loading..." and also a "Wait..." with no formatting around it.
We should not jump the page layout like this and instead show the full layout with either:
The latter will cause the page to jump less.
Site metadata and title info isn't updated for module pages like it probably should. We need to determine how well we want those pages indexed. If well, we likely need to have something return additional metadata so that it displays nicely in Google and in previews in Discord, etc.
Additionally, title bar just shows "Blish HUD" instead of perhaps the module name or something.
Currently, we only show the download count of the very latest release. This is not always representative as recent releases can make this number very small.
We should likely include a "total" downloads indicator or some sort of an average number of downloads per release to better convey the download count in addition to the per-release download count.
We may also wish to embed charts from dashboards.blishud.com onto the page.
Modules can list multiple contributors. We currently credit the author as being the owner of the module in SSRD, but this is not always the case when there are multiple major contributors.
Consider sourcing multiple contributors in a different way.
It would look nicer if the redash embeds went all the way to the edge of the card and if we somehow used a dark mode. The hight is also kind of a random guess.
Perhaps Redash has an API that we can query this data from to give us better control in displaying it.
Example embed URL:
https://dashboards.blishhud.com/embed/query/21/visualization/32?api_key=WgbLIl20YAQQvaGy8khDWnCQSJ3dRt3loEJ1boip&p_$module_namespaces=${namespace}&p_RelativeDaysSince=15&hide_parameters=true&hide_header=true&hide_link=true
For a brief moment, before the js runs, it appears that the site is shown in light mode before suddenly switching the dark mode. We want it to be in dark mode at all times.
Currently we are forcing dark mode in the docusaurus.config.js:
colorMode: {
defaultMode: "dark",
disableSwitch: true,
respectPrefersColorScheme: false
},
Currently, we don't show module prereleases for a module unless the module only has a prerelease available. We might want to reconsider how / when this is shown, but if we have a prerelease version, we need to indicate that it is a prerelease version regardless of why we are showing it.
URL should not include the "auto-generated" if possible and Troubleshooting should be lowercase.
Example:
https://new.blishhud.com/docs/user/auto-generated/Troubleshooting/731
Should preferably be:
https://new.blishhud.com/docs/user/troubleshooting/731
Large numbers don't currently have a delimiter. A ,
or .
should be shown to be delimited based on the browser locale.
If module images remain too abstract, it may be best to make them show smaller.
Current repo references are:
https://ficsit.app/mods?p=1 (4 are visible at 1080p with good big image and semi-short description)
https://www.curseforge.com/minecraft/mc-mods (4 are visible at 1080p but with small icons and very short descriptions)
https://www.nexusmods.com/mods/trending/ (3 are visible at 1080p)
Need to decide on the relationship between image space, space for details, and number of modules visible on screen.
Module download counts are currently populated by the json blob that SSRD generates when a module is updated in SSRD. That means that the download count is immediately outdated. We need a different source to pull the live download count from.
Currently, we are pulling module details from a staticly hosted blob generated by SSRD.
As more modules are added to the repo, we need to transition to not storing it all in a single blob to allow for paging. This will require changes on the SSRD side as well.
Consider providing a way to show a video/image gallery for module pages.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.