Thermal Camera Graph Improvements

[WilliamsJack]

Is your feature request related to a problem? Please describe.
While implementing the MLX9064x wrappers I realised that the sensors mirror the image. To fix this, I mirrored the output in the wrapper before sending it to the web interface. This isn't a great solution, since it sets the precedent that all sensors that do something odd like this need to have fixes implemented within the wrapper.

It also made me think about other issues, such as what happens if you need to mount the thermal camera on its side or upside down in your robot - output in Sights would be on its side or upside down respectively.

Describe the solution you'd like
Instead, I would prefer to do all this in the interface.
In addition to horizontal and vertical scaling when overlayed (which already exists), we should implement horizontal and vertical shift so one can move the thermal camera on top of the visible light camera (since, of course, you cannot have a thermal camera mounted in exactly the same point in space as your regular camera).

Like the existing thermal camera options, one should be able to set default values in the config. That means this is probably best suited as a Sights 2.0 feature, since configuration will be much easier in Sights 2.0

• Mirror thermal camera toggle
• Rotate thermal camera cycle
• Vertical and horizontal shift sliders
• Specify range of hues used to represent temperatures
• Specify auto-scale (current system) or hard minimum and maximum temperature range

Describe alternatives you've considered
There is no alternative. This is a good idea and should be implemented.

[WilliamsJack]

Default min (10 degrees Celsius) and max (40 degrees Celsius) range is also hardcoded in the thermal camera graph
https://github.com/SFXRescue/sights/blob/master/interface/js/graphs/thermalcamera.js#L157

Ideally, we would like some way for the user to configure the range of hues that appear on each thermal camera graph. Some improvements could be made to this code.

[Conr86]

Speaking of, the thermal camera graph is currently a HTML table (gasp) which is generated when the page loads. Surely there's a better way to do this?

[WilliamsJack]

A HTML canvas is definitely the way to go. I've never used them before, but they would be far more performant (and easier to shift around on the page as well) than what we're using.

[WilliamsJack]

Also added to the list of to-dos: Allow the user to specify whether they want the thermal camera to auto-scale (the current system) or use a preset minimum and maximum temperature range

[WilliamsJack]

Sometimes, green creeps into the colours displayed on the thermal camera graph. I found this map in a YouTube video:

It would be better to implement this than my current hue-based system.