Giter Site home page Giter Site logo

webcretaire / livesplitanalyzer Goto Github PK

View Code? Open in Web Editor NEW
9.0 9.0 3.0 29.38 MB

Simple online tool to analyse LiveSplit's .lss files

Home Page: https://Webcretaire.github.io/LiveSplitAnalyzer/

License: GNU General Public License v3.0

SCSS 0.94% Vue 76.10% JavaScript 4.61% TypeScript 18.35%
nuxt speedrun vue website

livesplitanalyzer's Introduction

Github stats

livesplitanalyzer's People

Contributors

cerpintext avatar virga2942 avatar webcretaire avatar webhead3893 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

livesplitanalyzer's Issues

Add PB plot in attempt stats

Add a PB plot to the line plot for global attempt stats (first tab), which only displays PBs instead of all finished runs

Remove all attempts before a certain number

Thanks @cerpintext for the idea

After a re-route people might want to remove all their attempts with the old route, so we could make it possible to delete all attempts before some number (kind of like the "fixing gold" button but in bulk, either for a specific split or the whole run)

Analyze pace

Thanks Fabio for the idea

Currently individual split analysis only shows the time for the current split in isolation. It could be interesting to show the best pace up to a certain split (or plot all paces up to a certain split, which is probably equivalent to the "cumulate time" that we have on comparisons, but displayed on graphs in individual splits tab)

Display Game Icon

On rare occasion the splitfile could countain a game icon, which we could extract and display. If it does not, maybe we could try getting the image from speedrun.com?

Merge split into next

Thanks @cerpintext for the idea

When a re-route happens, a split could get deleted, in which case it's sad to loose all the history (could also happen if someone made lots of subsplits and wants to delete some). We could add a feature to merge all attempts for one split into the next or the previous one

EDIT: merging a split into the previous one doesn't make any sense for many reason, as an example : If you merge split N+1 into N, you don't want to add N+1 times to N, because you're literally lying: the times in N do not represent the time it took you to reach the N point of your run any more, it just represent N+1 times that are renamed into N, so in the end we'll just keep the "merge into next" feature, which makes more sense (also not being able to merge the last split is good, because modifying the last split means you're literally playing a different category now)

Save settings to local storage

Settings could be saved to local storage and then loaded back when the user comes back to the website. This way some general parameters (like the page width) could be remembered, and users wouldn't have to change them each time

I'm not sure how useful it would be since most parameters would probably vary depending on the splitfile that's loaded, but it's an idea that's worth thinking about at least I think

Reset rate graph

Thanks @cerpintext for the idea

Have a graph (maybe 2 graphs?) to show on which split users reset the most

It could either be a plot of how far each run got (so bars would be smaller and smaller until the last one which represents the number of finished runs), or it could plot where resets happen (in which case the highest bar is not the first split but the one where most resets happen). Ideally we could do both and toggle with a switch (or just display both)

Splits with identical names cause issues

When opening / closing individual split graphs, if there exist a split with the same name it will get opened or closed too, because of how the collapse names are generated

Option to extract a subset of splits

split split time sgmnt time best time
1 3:35.02 3:35.02 3:32.05
2 5:26.50 1:51.48 1:45.20
3 7:58.51 2:32.01 2:32.01
4 9:45.32 1:46.81 1:44.20
5 11:43.76 1:58.44 1:50.34
6 13:23.54 1:39.78 1:28.70
7 14:37.63 1:14.08 1:09.52
8 16:25.28 1:47.64 1:45.18

if you have the above lss-data and want to practice individual parts of it (ie. splits 3-5), you could extract those splits and make it available for download in to its own lss-file:

split split time sgmnt time best time
3 2:32.01 2:32.01 2:32.01
4 4:28.82 1:46.81 1:44.20
5 6:17.26 1:58.44 1:50.34

this would be useful for making segment comparison splits for comparison data during segment practice, especially with longer runs with more points of data to handle manually.

Small UI glitches in "move time" modal

Fix horizontal scrollbar that shouldn't exist

image

Also we should be more reactive when input changes, currently if you type a time you need to focus out of the input for the component to detect that the value has changed

Manually edit comparisons

Now that comparisons can be displayed / compared, and can be created using the "balanced comparison maker" modal, it would be nice to have a way to make more basic changes (edit specific values for example, or create a blank comparison for people to fill manually)

There is no difficulty from a programming perspective (it's basic CRUD), the only hard problem is how to make this ergonomic and easy to use: currently the card and the modal are already kind of full, I don't know how I'm going to add the other features yet (maybe transform values into an input when you click on them? Not sure)

Import splits from splits.io

Thanks beninswe/livesplitanalysis for the inspiration (just realized this project tried to do some of what we're doing, very interesting, though sadly it doesn't look very actively maintained currently)

We could allow users to provide a splits.io URL instead of uploading a splitfile, and then download it in LiveSplit format to load our tool

Deleting fake golds to update best time doesn't stick

I reworked my route and deleted the "best" and "split" times in the LiveSplit splits editor, but later discovered (after I set up a balanced PB for comparison) I still had some fake golds in the splits file. Using the tool, I was able to remove them. However, creating a new comparison still used the old times, and the fake golds all reappeared.

  1. Have fake golds (an attempt -1 with the best time) and delete them.
    fake gold to be deleted

  2. Switching to Comparisons tab and back doesn't make them reappear.
    doesn't reappear if you just switch tabs

  3. Creating a new Comparison does (and relies on it). Stats here are shown uncumulative.
    resulted in fake gold reappearing

Edit: I just attempted to do them separately, and it looks like deleting fake golds and saving doesn't work either...

Different plot type in split analysis tab

Thanks Gwonkee for the idea

maybe for split analysis graphs, idk if bar graphs might be better. the up and down lines make it harder to see the tiny points, or just no lines

We could add an option to switch the graph type for [Sub]Split graphs (to have bars, maybe line with no point, point with no line, etc.) because when there are many attempts plots are hard to read

Load splits.io file from URL parameter

When the website initially loads we could check if a URL parameter is set (like https://webcretaire.github.io/LiveSplitAnalyzer?splitsio=9axe for example) and load the corresponding splitfile if it's present, which would make sharing easier (you could just send a like to someone and have the page display the corresponding split)

This also means that we should rewrite the URL when manually loading a splits.io file from the form (again, to facilitate sharing)

Fix attempt count

Thanks Gwonkee for the idea

Sometimes the hardcoded AttemptCount doesn't match the actual number of attempts, we could add a button in the toolbox to fix it

Performance

Big split files (thousands of attempts) cause the whole page to lag for a long time, to the point where the browser might think that the whole thing is hanging (even though it's not). I don't know how we could optimize the processing but we should definitely have a look at our options (I thought about offloading some of the processing to webassembly functions which would probably have a better performance, but this seems very complex and it wouldn't allow us to offload any of the re-rendering that Vue is doing automatically)

Attempt detail tab

Add a new tab with synthetic details for each attempt. Currently the attempt selector isn't that useful because people probably don't know attempt IDs from the top of their head, so having a tab with basic info about each attempt (date and time, if the run finished or reset, what time it got, etc.) could help find a specific run

More filters on data

Thanks Lep for the idea:

Add filters to ignore runs that are slower than some amount of time. Would be useful in particular for full runs data (see #8) but it could potentially be extended to more things? We could also add an option to filter out unfinished runs for any graph (that would combine well with the other filter)

Plot stuff according to date

LiveSplit stores the date and wall-clock time at which attempts are started, but currently we're not using this info, which is sad because plotting stuff according to this data could highlights different periods (before and after some IRL breaks) in a splitfile.

What we could do is add an option to replace the X-axis for every run that is currently plotted according to the attempt number, and replace that by the date. It should be a simple lookup in the AttemptHistory to fetch the date instead of @_id, with a bit of formatting in the layout maybe.

The only potential difficulty is if data is not coherent: for example if we have split times for a run that is not present in the attempt history (which shouldn't happen technically but I'm sure we can find splitfiles like that). I'm not sure it's worth trying to do anything clever with such attempts but the case should at least be handled so that the whole website doesn't crash when it happens

Filter runs based on time for a specific split

Thanks Fabio for the idea

We could add a filter on runs similar to the one in attempts stats but that are based on the time of a specific split : for example in Hollow Knight "only display time of runs that have a sub 3:35 Vengeful Spirit". This filter could apply to any of the tabs I guess, and maybe be combined if used on several splits ? If we apply it to several tabs then we would need a way to show it visually from any tab, maybe as a floating thing somewhere, to remind users that there is a filter active

Improve "download splits" button

Currently the "download splits" button is in the scary "Experimental toolbox" card, which made sense when this toolbox was the only thing that actually modified the splits, but now that a lots of features can make changes to the data it would be great if this button was more visible (also we should warn people that try to exit the website if they have unsaved modifications in their splits)

Rename comparison

Not the most useful feature, but since we can create / delete comparisons we might as well be able to fully edit them. So add a button near the "main comparison select" to be able to rename it (probably in a modal or something)

Full run graphs

Thanks Lep for the idea:

Right now we have detailed line graphs for each split, but for some reason we forgot to make one for the whole run. There are 2 ways we could add this:

  • Add a new card before the splits detail, with full run infos
  • Add a switch in options to make individual split graphs cumulated, so that they don't represent the time of this split alone, but the cumulated time so far (in which case the full run time corresponds to the last split time)

Second option would be way harder to program probably, but it would be more powerful because it would also allow people to see their best pace at any point in the run, which is nice. Maybe start with the first one and I'll think about the other one later

Fix duplication SplitDisplay <-> SubsplitsDisplay

To make subsplits work properly I duplicated most of SplitDisplay into a new component SubsplitsDisplay (which I should have cleaned before pushing but I didn't stop bullying me)

What we should do is extract everything that's in common (mostly all the Plotly things, and data processing to make the graphs work) into a separate component and instanciate that twice, which will make the code way easier to understand and will also greatly please Sonar

Move time between splits

Thanks @cerpintext for the idea

Allow users to specify some amount of time they want to move from one split to the next (or previous maybe, not sure it's useful), maybe for some range of attempts

The idea is if you start implementing a strat at the end of a split (like early control quitout at Claw in Hollow Knight), it is going to lose a bit of time in claw but save more time in the next split, so moving some amount of time between splits will prevent fake golds and stuff

Support more icon formats

Currently split icons are only extracted and displayed if they are PNG, but LiveSplit also supports JPEG and GIF for example, so we could make several "image extractors" and try them all. It's not an extremely important feature because the vast majority of speedrunners use PNG icons or no icons at all, but it would be nice just for completeness (also looking at how image formats work is fun)

Add tests

Add integration/E2E tests using Cypress: as we add more and more features, and options that affect the whole page, it becomes harder to track if something is broken somewhere, so tests could help with that (and run in CI before the automated deployment)

More save and load options

Currently we only know how to read files from local filesystem or split.io, and we can only save them to local filesystem. What we could do is use splits.io's API to save splits (it's probably impossible to update them but we could make a new upload and possibly delete the old one), and we could also add more "adapters", especially to more standard file storage services (Dropbox, Google Drive, etc.)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.