mpv.js icon indicating copy to clipboard operation
mpv.js copied to clipboard

Using nwjs

Open jdauthre opened this issue 4 years ago • 1 comments

Not so much an issue, more a how to, I would like to use mpv.js with nwjs but I can find no examples or explanation on how to do this, examples seem to always use electron. There was a non react example in the issues but it just produced a "plugin not supported" error Any help appreciated Thanks

jdauthre avatar Nov 27 '20 14:11 jdauthre

See this: https://github.com/Kagami/mpv.js/issues/76#issuecomment-773546338 for building the latest mpv.js compatible with the latest mpv dll. (You have to follow the build steps in the mpv.js README first to setup the environment). This might be fixed sometime, but I'm leaving this here to know that the latest mpv libraries weren't compatible with mpv.js at the time of this comment.

In nw.js you need to register the pepper plugin in your package.json.

"chromium-args": "--register-pepper-plugins='./node_modules/mpv.js/build/Release/mpvjs.node;application/x-mpvjs'"

Then in your program you use it:

const mpv = document.createElement('object');
mpv.type = 'application/x-mpvjs';
mpv.width = width;
mpv.height = height;
mpv.addEventListener('message', msg => {
	if (msg.data.type === 'ready') {
		// this.setProperty(..., ...); to set mpv properties
		this.setProperty('pause', false);
		
		// For blackmagic you'd call like:
		this.setPropertyString('demuxer', 'lavf');
		const avOptions = `video_size=${inputwidth}x${inputheight}:pixel_format=${inputpixelformat}:framerate=${inputframerate}:rtbufsize=702000k`;
		this.setPropertyString('demuxer-lavf-o', avOptions);
		this.runCommand('loadfile', 'av://dshow:video=Decklink Video Capture:audio=Decklink Audio Capture');
		// For RTSP you can just call
		this.runCommand('loadfile', url);
	}
});

There's a lot of various mpv settings for different scenarios. (Like turning on subtitles). You can also setup a socket and listen for logs from mpv.

sirisian avatar Feb 05 '21 00:02 sirisian