Hi, this PR handles #64 , some of #51, and has a few smaller UI enhancements.
There are a couple screenshots for the HTML file warning showing what it looks like for mobile and desktop in #64. It could be extended to handle other file types too.
It was hard to understand what the haptics buttons were for so I added HTML title attributes to them. After hovering for a couple seconds the title message will be displayed to inform the user what the button does. Here's a screenshot of that in action with a new button.
I noticed that when the video was paused multiple haptic nodes could be added to the same X coordinate on the line graph display. Since only one value can actually be set for any point in time I changed this so it clears existing values at that point before setting a new one. The time was in milliseconds so I made the window for each point 999ms but that could be shrunk down to something smaller. I wasn't sure how fast devices could move so I just left it at that, it should be easy to bump the window size down to 100ms or 250ms though.
Deletion of haptic nodes was added through a hotkey. When the graph playhead is within 999ms of a haptics node, that node gets deleted from the graph. It uses the Mousetrap library since that was already being used.
The ticks on the x-axis label of the graph were a bit scrunched together which could make it hard to read. I dropped the number of ticks down from 50 to 25 to give the tick labels more space.
Before:
After:
A file export option was also added to save the current haptics commands to a Funscript file. There's a new export button for this on the haptics button area in the lower left. Clicking it will pop a modal with a download link to the file. To generate the file it basically does the opposite of what haptic-movie-file-reader does and saves that to an object. Then the object is put into a Blob and linked to from the download button in the modal. If no commands are loaded yet it will throw this error to make it obvious:
Here's what the export modal looks like in action:
Hi, this PR handles #64 , some of #51, and has a few smaller UI enhancements.
There are a couple screenshots for the HTML file warning showing what it looks like for mobile and desktop in #64. It could be extended to handle other file types too.
It was hard to understand what the haptics buttons were for so I added HTML title attributes to them. After hovering for a couple seconds the title message will be displayed to inform the user what the button does. Here's a screenshot of that in action with a new button.
I noticed that when the video was paused multiple haptic nodes could be added to the same X coordinate on the line graph display. Since only one value can actually be set for any point in time I changed this so it clears existing values at that point before setting a new one. The time was in milliseconds so I made the window for each point 999ms but that could be shrunk down to something smaller. I wasn't sure how fast devices could move so I just left it at that, it should be easy to bump the window size down to 100ms or 250ms though.
Deletion of haptic nodes was added through a hotkey. When the graph playhead is within 999ms of a haptics node, that node gets deleted from the graph. It uses the Mousetrap library since that was already being used.
The ticks on the x-axis label of the graph were a bit scrunched together which could make it hard to read. I dropped the number of ticks down from 50 to 25 to give the tick labels more space. Before:
After:
A file export option was also added to save the current haptics commands to a Funscript file. There's a new export button for this on the haptics button area in the lower left. Clicking it will pop a modal with a download link to the file. To generate the file it basically does the opposite of what
haptic-movie-file-reader
does and saves that to an object. Then the object is put into a Blob and linked to from the download button in the modal. If no commands are loaded yet it will throw this error to make it obvious:Here's what the export modal looks like in action: