The VideoLAN Forums

Posted: **18 Feb 2016 10:14**

Hello

I need to create stupidly simple local web page that shows video stream from my Dahua ip cams. The simple code works very well, but the problem is in the aspect ratio.

Code: Select all

<embed
	type="application/x-vlc-plugin"
	pluginspage="http://www.videolan.org"version="VideoLAN.VLCPlugin.2"
	width="704px"
	height="576px"       
	id="vlc"
	loop="yes"
	autoplay="yes"
	target="rtsp://username:passwd@cam_ip/cam/realmonitor?channel=1&subtype=1">
</embed></td>

As a result I get black video window size 704 × 576 and the video is in the middle [of the window] far less than 704px (even less than 576 actually) so the black bars appear in both sides of video and it is badly distorted horizontally.

If I play the same URL in a VLC player the aspect ratio is correct and no black bars on sides. The problem is with my code and the VLC web plugin in the Firefox. I have tried to find simple way to tell to the VLC plugin to use correct aspect ratio but without any luck. No matter what values I give for width and height, the video is always distorted. I'm not a coder so I'm looking for the simplest possible solution.

This html code is meant to be used only in one local computer that is connected only to intranet, not to the internet.

If anyone could show a simple example how to solve the problem, I would be very grateful.

Posted: **18 Feb 2016 10:28**

What is the resolution of your video?
The best way should be to use the video resolution as width/height for your code, if these values aren't very big. Then the black bars should be gone.

If the aspect ratio is still wrong at this point, you can set it manually:

Code: Select all

...
...
</embed>
<script type="text/javascript">
var vlc = document.getElementById("vlc");
vlc.video.aspectRatio = "16:9"; //For example
</script>

But if it's shown correctly in the VLC GUI, it should also be correct in the plugins.

Posted: **18 Feb 2016 11:37**

Thanks da2424 for your answer. The video resolution is 704 × 576. I tried the javascript you gave me but it did not change anything. The html code I'm using to test is as follows:

Code: Select all

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
	<title></title>
	<meta name="generator" content="LibreOffice 5.0.3.2 (Linux)"/>
	<meta name="created" content="2016-02-17T07:59:59.788678277"/>
	<meta name="changed" content="2016-02-17T08:00:39.020506899"/>
	<style type="text/css">
		@page { margin: 2cm }
		p { margin-bottom: 0.25cm; line-height: 120% }
	</style>
</head>
<body lang="fi-FI" dir="ltr">
<p style="margin-bottom: 0cm; line-height: 100%">************** </p>
</body>


<embed
	type="application/x-vlc-plugin"
	pluginspage="http://www.videolan.org"version="VideoLAN.VLCPlugin.2"
	width="704px"
	height="576px"       
	id="vlc"
	loop="yes"
	autoplay="yes"
	target="rtsp://username:passwd@cam_ip/cam/realmonitor?channel=1&subtype=1">
</embed>

<script type="text/javascript">
var vlc = document.getElementById("vlc");
vlc.video.aspectRatio = "16:9";
</script>
   
</html>

Is there something wrong in this simple html file? Should'nt it work ok? As I told GUI VLC plays stream just fine and the aspect ratio is ok, in addition I can change aspect ratio via GUI but with plugin no way...

Posted: **18 Feb 2016 11:51**

Ok, if 704x576 is the real resolution, try "4:3" as aspect ratio.

Posted: **18 Feb 2016 12:16**

Tried but no help...

Posted: **18 Feb 2016 18:47**

I have just tested your html file, it works fine for me with Firefox...

Do you use the latest version of VLC?

Nevertheless, I have optimized your code:

Code: Select all

<!DOCTYPE html>
<html>
<head>
   <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
   <title>VLC</title>
</head>

<body onload="start()">

<embed
   type="application/x-vlc-plugin"
   width="704"
   height="576"       
   id="vlc"
   loop="yes"
   autoplay="yes"
   src="rtsp://username:passwd@cam_ip/cam/realmonitor?channel=1&subtype=1"
/>

<script type="text/javascript">
function start(){
	var vlc = document.getElementById("vlc");
	vlc.video.aspectRatio = "4:3";
}
</script>

</body>
</html>

Posted: **19 Feb 2016 08:09**

Thanks da2424

I solved the problem. Actually your question "Do you use the latest version of VLC?" started to ring my bells.

In the Firefox about:plugins everything appeared to be fine but reading more carefully revealed that in the Linux Mint default plugin is "VLC Multimedia plugin (Compatible videos 3.10.1)" but the plugin binary is actually libtotem-cone-plugin.so.

Replacing "false VLC plugin" with official VLC plugin made everything work ok, even with my original html code. I'm a bit ashamed for not to check that first.

Thank you very much for your participation.

The VideoLAN Forums

[Solved] Newbie question about VLC plugin aspect ratio

[Solved] Newbie question about VLC plugin aspect ratio

Re: Newbie question about VLC plugin aspect ratio

Re: Newbie question about VLC plugin aspect ratio

Re: Newbie question about VLC plugin aspect ratio

Re: Newbie question about VLC plugin aspect ratio

Re: Newbie question about VLC plugin aspect ratio

Re: Newbie question about VLC plugin aspect ratio