Allow attachMediaStream() to detach stream by passing null

[ekzobrain]

It is often needed to not only attach, but also detach media stream from video/audio element. Detaching code looks almost like attaching one, and logically it might be a good decision to use attachMediaStream() for it like this: attachMediaStream(element, null)

The only thing that needs to be changed in attachMediaStream() is line "element.src = URL.createObjectURL(stream);" to "element.src = (stream === null ? "" : URL.createObjectURL(stream));", and also disable video.play() in Firefox-specific attachMediaStream() version. It may also be done via a separate function, but it will be just code duplicate.

[serrynaimo]

Cool. Sounds like a good idea. Something to put into our next release.

[ekzobrain]

Hm, I also notices, that this trick will not work in Safari/IE when using plugin. In general - plugin replaces original video tag with an object tag. I suppose, that new implementation should also return an original video tag back to it's initial state (need to fix plugin-related version of attachMediaStream())

[johache]

Pull request sent: https://github.com/Temasys/AdapterJS/pull/53

[ekzobrain]

Ok, I see your point about element restore, but why dont't you want to go a simpler way? It is general practice to hide the orignal element with style="display:none", not remove completely. Then you could restore it easily, and all of it's properties (even changed while working with plugin) would be preserved. Currently, yes, we have such a use case: by default video tag is opaque and user sees a picture behind it. When a call starts - peer's stream it attached to this video element. When a call ends video tag should becomes opaque again (that's why we need to detach media stream from it). And between calls some video files may be played in this video tag. Of course we could just replace video tag with a new one every time, but i think it is a bad approach. Please, think about my suggestion about hiding original video tag, and then restoring it back to visible state. But if you reject it either - let me know how to correctly remove an object tag, created by your plugin. I think, that some cleanup shoul be done on it prior to removing an element itself? In there any "destruct" method available?

[ekzobrain]

Also, this approach might be helpful in listening to video element events. For example, you hide video element and listen to it's "volumechange" event to enable/disable stream audio tracks. That would solve #34. So generally, user interracts with original video element, and you just proxy it's events to your plugin in some way. Of couse this approach needs investigation and testing, but i find it possible and perspective.

[johache]

@serrynaimo @ncurrier Setting style="display:none" instead of removing the video element. What do you guys think of that. I think it might be a good idea. I read it should work fine on older version of IE: http://stackoverflow.com/questions/17462209/style-displaynone-not-working-in-ie8-ie9-ie10-compatibility-view

My only concern is about the element ID management. We are copying the

[ekzobrain]

Usually it is done this way: you leave original ID on it's place, and set ID of your inserted content to something like 'ID_plugin'. Then, when user want to manipulate original element some way - he can get it by original ID and does not get any mess. But when he uses attachMediaStream(), for example (calls one of your API methods), this method transparetly converts ID to ID_plugin and takes actions in favor of your inserted content. General idea here is that you transparently insert some new content and user (developer) even doesn't notice that, when working with original element's or your plugin's public API. For example, in method "attachMediaStream" it could look like this:

function attachMediaStream(element, stream) { var object_element = document.getElementById(element.id + '_plugin'); element = object_element; ...

[johache]

Hi, We release a version of AdapterJS supporting attachMediaStream(element, null) yesterday. We are still interested in the idea of hiding the

I am going to close this issue as your first request was managed. Could you make a separate issue for hiding VS deleting? (it makes it easier for us to track issue)

[ekzobrain]

Ok

[qbolec]

Not sure if that's a known issue, but it seems to me that there is no way to "set src to nothing". For example setting it to null does not work in Chrome: https://code.google.com/p/chromium/issues/detail?id=378433 Setting it to an empty string "" did the trick for a while, but today I've noticed that Chrome "resolves" empty string to the address of the current page, while null is converted to "/null" subpage: http://jsfiddle.net/Lrvjbh7n/

[dongkai1993-zz]

attachMediaStream(element, null) still not work in Safari/IE, the version is v0.15.0

[johache]

I just tested against this sample, it works for me : https://plugin.temasys.com.sg/demo/src/content/getusermedia/gum/

[Fi1osof]

@dongkai1993 @johache Confirm, not work.

[johache]

@Fi1osof it still works for me on the sample I provided. Please provide a sample where the issue happens so we can have a look.

[Fi1osof]

@johache Windows 10 IE 11.2125 Safari 5.1.7 TypeError: 'undefined' is not an object (evaluating 'constraints.video.width.exact')

[johache]

That's your getUserMedia failing. Do you have a camera available on your machine ? Note that Safari is no longer officially supported on Windows.

[Fi1osof]

Yes, have. Not work not on safari only, IE 11 too.

[Fi1osof]

When i use this with webrtc/adapter, it`s broken in any browsers. Without this working.

[johache]

Ok, well, this error is before attachMediaStream. GetUserMedia is failing on your machine for some reason. I could be having no cameras, or your camera being used by another process, or something else entirely.