Difference between revisions of "ActiveX/HTML"

From VideoLAN Wiki
Jump to navigation Jump to search
m (+{{Example code}})
 
(12 intermediate revisions by 7 users not shown)
Line 1: Line 1:
{{howto| use the [[ActiveX]] control within a webpage}}
+
{{howto| use the [[ActiveX]] control within a webpage|nosort=yes}}
 +
{{Example code}}
  
 
==Embedding Activex using Javascript==
 
==Embedding Activex using Javascript==
Line 5: Line 6:
 
You can insert the [[ActiveX]] control in your HTML pages like this :
 
You can insert the [[ActiveX]] control in your HTML pages like this :
  
   <OBJECT classid="clsid:E23FE9C6-778E-49D4-B537-38FCDE4887D8"
+
<syntaxhighlight lang="html4strict">
     codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab"
+
   <OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"
 +
     codebase="https://downloads.videolan.org/pub/videolan/contrib/win32/axvlc.cab"
 
         width="640" height="480" id="vlc" events="True">
 
         width="640" height="480" id="vlc" events="True">
 
   <param name="Src" value="" />
 
   <param name="Src" value="" />
Line 13: Line 15:
 
   <param name="AutoPlay" value="False" />
 
   <param name="AutoPlay" value="False" />
 
   </OBJECT>
 
   </OBJECT>
 +
</syntaxhighlight>
  
Then, using Javascript, you can select another source, or change the audio track :
+
Then, using JavaScript, you can select another source, or change the audio track :
  
 +
<syntaxhighlight lang="javascript">
 
   document.vlc.playlistClear();
 
   document.vlc.playlistClear();
 
   var options=[":audio-track=5"]; // select audio track 5 (=6th, 1st is 0)
 
   var options=[":audio-track=5"]; // select audio track 5 (=6th, 1st is 0)
 
   document.vlc.addTarget("...",options,2,0); // replace entry 0
 
   document.vlc.addTarget("...",options,2,0); // replace entry 0
 
   document.vlc.play();
 
   document.vlc.play();
 +
</syntaxhighlight>
 +
 +
See [https://web.archive.org/web/20081218063905/http://people.videolan.org/~damienf/plugin-0.8.6.html http://people.videolan.org/~damienf/plugin-0.8.6.html (Internet Archive)] for a complete demo.
  
 
==Embedding ActiveX using m3u Playlists==
 
==Embedding ActiveX using m3u Playlists==
Maybe a better to show VLC in an HTML Website is to use m3u Playlists. It has got the advantage that users with turned-off Javascript can also use this plugin, since document.vlc.addTarget won't work with javascript turned off.
+
Maybe a better to show VLC in an HTML Website is to use [[m3u]] Playlists. It has got the advantage that users with turned-off JavaScript can also use this plugin, since <code>document.vlc.addTarget()</code> won't work with JavaScript turned off.
  
 
* Step 1: Create the HTML website with the VLC-Object linked to the m3u playlist
 
* Step 1: Create the HTML website with the VLC-Object linked to the m3u playlist
 
* Step 2: Create your m3u playlist with all options, save and upload it to your webspace.
 
* Step 2: Create your m3u playlist with all options, save and upload it to your webspace.
* Step 3 (optional): Create buttons and other objects to control VLC (like document.vlc.play();)
+
* Step 3 (optional): Create buttons and other objects to [[control VLC]] (like <code>document.vlc.play();</code>)
  
  
 
'''Step 1: Creating the website to embed ActiveX Control'''
 
'''Step 1: Creating the website to embed ActiveX Control'''
 +
<syntaxhighlight lang="html4strict">
 
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
 
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
  <HTML>
+
  < HTML >
 
   <BODY marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
 
   <BODY marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
 
     <OBJECT classid="clsid:E23FE9C6-778E-49D4-B537-38FCDE4887D8"
 
     <OBJECT classid="clsid:E23FE9C6-778E-49D4-B537-38FCDE4887D8"
         codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab"
+
         codebase="https://downloads.videolan.org/pub/videolan/contrib/win32/axvlc.cab"
 
         width="400" height="300" id="vlc" events="True">
 
         width="400" height="300" id="vlc" events="True">
 
       <param name="Src" value="myplaylist.m3u" />
 
       <param name="Src" value="myplaylist.m3u" />
Line 43: Line 51:
 
     </OBJECT>
 
     </OBJECT>
 
   </BODY>
 
   </BODY>
  </HTML>
+
  < /HTML >
You should modify the values of width, height and volume (0-100) fitting to your desires. If you don't know them, simply delete them (e.g. remove ''width="640"'' from the code).
+
</syntaxhighlight>
  
 +
You should modify the values of width, height and volume (0-100) fitting to your desires. If you don't know them, simply delete them (e.g. remove <code>width="640"</code> from the code).
  
 
'''Step 2: Creating the m3u playlist'''
 
'''Step 2: Creating the m3u playlist'''
  
 
Open Notepad, create your playlist and save it as 'myplaylist.m3u' for this example.
 
Open Notepad, create your playlist and save it as 'myplaylist.m3u' for this example.
 +
 
  #EXTM3U                                    // Required to identify this file as m3u file
 
  #EXTM3U                                    // Required to identify this file as m3u file
 
  #EXTVLCOPT--input-repeat=-1                // repeat the following file/playlist
 
  #EXTVLCOPT--input-repeat=-1                // repeat the following file/playlist
Line 56: Line 66:
 
  #EXTINF:0, Test Description                // set the title for the following file shown in your playlist
 
  #EXTINF:0, Test Description                // set the title for the following file shown in your playlist
 
  video.mpg                                // the actual file to be displayed
 
  video.mpg                                // the actual file to be displayed
 
  
 
'''Annotations:'''
 
'''Annotations:'''
Line 77: Line 86:
 
'''Solution'''
 
'''Solution'''
  
You have to lower the security settings on your PC. '''Do this at your own risk! Use [http://www.getfirefox.com Firefox] to browse the web!'''
+
* Use the "other" ClassID in your HTML-Source as shown above:
 +
:<syntaxhighlight lang="html4strict">
 +
<OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921" ...
 +
</syntaxhighlight>
 +
 
 +
* You have to lower the security settings on your PC. '''Do this at your own risk! Use [https://www.getfirefox.com Firefox] to browse the web!'''
  
In Internet Explorer select [Tools], [Internet Options]. The "Internet Options" window opens. Select the Tab "Advanced". Scroll down until you see the main point "Security".  
+
* In Internet Explorer select [Tools], [Internet Options]. The "Internet Options" window opens. Select the Tab "Advanced". Scroll down until you see the main point "Security".  
  
Check the following entries:
+
* Check the following entries:
* Allow active content to CDs to run on My Computer
+
** Allow active content to CDs to run on My Computer
* Allow active content to run in files on My Computer
+
** Allow active content to run in files on My Computer
* Allow software to run or install even if the signature is invalid
+
** Allow software to run or install even if the signature is invalid
  
'''Solution 2'''
+
* Instead of lowering security level, you can add the website address to the right security area.
Instead of lowering security level, you can add the website address to the right security area.
 
  
 
==See also==
 
==See also==
* [[ActiveX/Delphi|Delphi Implementation]]
+
* [[ActiveX/Delphi]] for a Delphi implementation
* [[ActiveX|ActiveX Description]]
+
* [[ActiveX]] for a description of ActiveX
  
[[Category:Embedded]]
+
[[Category:Development‏‎]]

Latest revision as of 02:40, 19 March 2019

This page describes how to use the ActiveX control within a webpage. Other "how to" pages
This page contains example code.

Embedding Activex using Javascript

You can insert the ActiveX control in your HTML pages like this :

  <OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"
     codebase="https://downloads.videolan.org/pub/videolan/contrib/win32/axvlc.cab"
        width="640" height="480" id="vlc" events="True">
  <param name="Src" value="" />
  <param name="ShowDisplay" value="True" />
  <param name="AutoLoop" value="False" />
  <param name="AutoPlay" value="False" />
  </OBJECT>

Then, using JavaScript, you can select another source, or change the audio track :

  document.vlc.playlistClear();
  var options=[":audio-track=5"]; // select audio track 5 (=6th, 1st is 0)
  document.vlc.addTarget("...",options,2,0); // replace entry 0
  document.vlc.play();

See http://people.videolan.org/~damienf/plugin-0.8.6.html (Internet Archive) for a complete demo.

Embedding ActiveX using m3u Playlists

Maybe a better to show VLC in an HTML Website is to use m3u Playlists. It has got the advantage that users with turned-off JavaScript can also use this plugin, since document.vlc.addTarget() won't work with JavaScript turned off.

  • Step 1: Create the HTML website with the VLC-Object linked to the m3u playlist
  • Step 2: Create your m3u playlist with all options, save and upload it to your webspace.
  • Step 3 (optional): Create buttons and other objects to control VLC (like document.vlc.play();)


Step 1: Creating the website to embed ActiveX Control

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
 < HTML >
   <BODY marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
     <OBJECT classid="clsid:E23FE9C6-778E-49D4-B537-38FCDE4887D8"
         codebase="https://downloads.videolan.org/pub/videolan/contrib/win32/axvlc.cab"
         width="400" height="300" id="vlc" events="True">
       <param name="Src" value="myplaylist.m3u" />
       <param name="ShowDisplay" value="True" />
       <param name="AutoLoop" value="True" />
       <param name="AutoPlay" value="True" />
       <param name="Volume" value="100">
     </OBJECT>
   </BODY>
 < /HTML >

You should modify the values of width, height and volume (0-100) fitting to your desires. If you don't know them, simply delete them (e.g. remove width="640" from the code).

Step 2: Creating the m3u playlist

Open Notepad, create your playlist and save it as 'myplaylist.m3u' for this example.

#EXTM3U                                     // Required to identify this file as m3u file
#EXTVLCOPT--input-repeat=-1                 // repeat the following file/playlist
#EXTVLCOPT--http-reconnect=true             // required for a streaming-client to enable repeat
#EXTVLCOPT--any further parameter goes here // see also VLC command-line help
#EXTINF:0, Test Description                 // set the title for the following file shown in your playlist
video.mpg                                // the actual file to be displayed

Annotations:

  • For actual looping of the entire playlist, the user has to have check 'Repeat all' under Preferences --> Playlist --> General
  • Mind that options have different names if you play a file locally or if you want to stream it (--sub-filter --> --s-filter)


Mind the different Options-styles:

 --option  A global option that is set for the duration of the program.
  -option  A single letter version of a global --option.
  :option  An option that only applies to the playlistitem directly before it
           and that overrides previous settings.

Known Problems and how to solve them

Problem

A know problem is, that the VLC-Plugin won't be displayed. Instead, you are asked whether you want to install the VLC-ActiveX-Component. "Don't install" cancels the installation and nothing happens. "Install" runs the usual VLC-Setup (mind to install the ActiveX-Plugin), but after reopening an HTML-page with the VLC-Plugin, it's the same situation as before.

Solution

  • Use the "other" ClassID in your HTML-Source as shown above:
 <OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921" ...
  • You have to lower the security settings on your PC. Do this at your own risk! Use Firefox to browse the web!
  • In Internet Explorer select [Tools], [Internet Options]. The "Internet Options" window opens. Select the Tab "Advanced". Scroll down until you see the main point "Security".
  • Check the following entries:
    • Allow active content to CDs to run on My Computer
    • Allow active content to run in files on My Computer
    • Allow software to run or install even if the signature is invalid
  • Instead of lowering security level, you can add the website address to the right security area.

See also