MMM-RTSPStream Snapshot image resolution appears low, and blurry.

[shbatm]

Sorry you’re having issues. To give a brief background: showing snapshots instead of video was an afterthought in this module. I created the module because there were modules to show MJPEG streams and to show snapshots, but nothing that could play the video from an RTSP source which is what my cameras put out. I added snapshots in because the original ffmpeg version was a CPU and RAM hog and I needed to show something when I didn’t need to stream the video (sounds like the situation described above). Now fast-forward a year, and I’ve found that all I really need for my main mirror is snapshots. :(

Anyways, when I added the snapshots to get around some CORS issue I was having, the module grabs the snapshots from the node_helper.js on the “server” end, converts the jpeg to base64 and sends over the socket to the front end/browser, where it draws the image on the canvas (relevant code) trying to make use of the same elements which the original ffmpeg version used to draw the video on the canvas. I am sure this is not the most efficient or best way to render the images correctly which I’m sure is why you’re seeing some quality issues.

If you guys want to take a look at the code and have a solution, I’d be happy to accept a PR and correct the problem.

[peterh]

@sdetweil @shbatm Thanks for the info. i’ll have a look at integrating/fixing it then figuring out how to do a pull request… or i might cheat and just use another module for the snapshot and use MMM-RTSPStream to render over the top using the omxplayer, that way the remote virwer( if any) can always see a higher res snapshot that keeps updating, and the the local viewer gets live video and audio.

[shbatm]

Some options I’ve thought about or tried but did not fully implement:

1. node_helper grabs image and saves to disk, front end grabs the image. This was the first method, but I went away from it because it involves (a) repeatedly writing to the SD card and (b) requires two timed actions to stay relatively in sync (front and back end).
2. Directly accessing the image from camera via the front end. Works for some, and would also allow MJPEG streams to be used, but for certain cameras this gives a CORS violation error. This is what I did in my Octoprint module.
3. Use an iframe overlay/underlay in the same position as the canvas tag, and then same as #2. Should get around CORS and would be the best option that I know of, just haven’t gone back and implemented.

[sdetweil]

@shbatm said in MMM-RTSPStream Snapshot image resolution appears low, and blurry.:

requires two timed actions to stay relatively in sync (front and back end).

you can use event handlers for both… so don’t need to do timed…

[peterh]

@sdetweil @shbatm
Well it seems this is a bit beyond me at this point, I have a bit of a learning curve to get past if want to sort it out. Im more of a hardware guy. :-) At this point I’ve got an separate iframe MMM-module pulling the cam image and the omx player overlay covers it when called. not the best solution but it’s within my skill set. thank you all for your input.