Camera toggle does not work

[Doridian]

The camera toggle button simply does nothing (latest version of plugin and OctoPrint)

See right side for HTML inspector, as you can see the tag for the camera has no (or an empty) src attribute.

If I manually add the right URL (copied straight from "Stream URL" in OctoPrint settings) into there, it makes it work perfectly.

[Kragrathea]

I was unable to reproduce this. Usually bugs like this are a result of a plugin conflict. What other ones do you have installed? Can you try disabling anything that might also use the camera to see if it fixes the problem?

[Doridian]

@Kragrathea After experimenting, I found out the camera toggle works fine if I disable the Dashboard plugin, but then obviously I lose the dashboard feature of PrettyGCode.

If I enable the Webcam widget in Dashboard, then suddenly the Camera toggle works, but of course then I also have the camera in dashboard, which means I can't see the dashboard at all anymore, because of the sizing.

See picture below:

[Kragrathea]

Ah, I think this is a known conflict between Dashboard and PGC. We are both trying to do very similar hacky things with the camera.

It isn't working quite right in the screen shot you sent either. The camera view is in the Dashboard window instead of on the right side.

I will try to come up for a fix for this...

[Doridian]

@Kragrathea If I use the camera toggle, the camera is on the right side (which seems to be correct). This is when I open the dashboard itself. That screenshot was more highlighting that I cannot see the dashboard when I enable the camera widget (which I have to for the camera toggle to work)

[steadyaero]

A similar problem happens for me. I'm running octoprint in windows using a local instance of yawcam for my video stream source.

When I try to open the camera in fullscreen mode, i get a 404 error trying to use /webcam/?action=stream&0.9432590153233715 for the url instead of /video.mjpg as set in the octoprint webcam settings.

But as Doridian said, I can put in the correct url in devtools and it will show up. Albeit, the size is huge so I also have to set a max-height css property.

And yes I use the Dashboard plugin.

-- Edit: I just found the custom css properties to fix the size issue, but the img src is still an issue I don't know how to solve automatically

-- Edit2: i found i can use content:url('') in the custom css and paste in the correct video stream url and it works

[ArmoredCavalry]

@steadyaero - thanks, your 2nd edit is what worked for me. Just for reference in case anyone else stumbles on this, this is the custom CSS that worked for me -

#pg_webcam_image {
     content:url('http://your-url-to-mjpeg-stream');
}

Added to 'Additional CSS' section at bottom of plugin page, hit 'Add CSS' then go fullscreen.

Edit: It seems that maybe the CSS injection is just stored locally on browser? Noticed if I open on mobile for instance, the custom CSS is no longer there.