Difference between revisions of "ActiveX/HTML"

From VideoLAN Wiki
Jump to navigation Jump to search
(Removed spam)
m (+{{Example code}})
 
(19 intermediate revisions by 11 users not shown)
Line 1: Line 1:
 +
{{howto| use the [[ActiveX]] control within a webpage|nosort=yes}}
 +
{{Example code}}
 +
 
==Embedding Activex using Javascript==
 
==Embedding Activex using Javascript==
  
 
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 11: 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 41: 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 54: 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 66: Line 77:
 
   :option  An option that only applies to the playlistitem directly before it
 
   :option  An option that only applies to the playlistitem directly before it
 
             and that overrides previous settings.
 
             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:
 +
:<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".
 +
 +
* 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==
 
==See also==
−
*[[ActiveX/Delphi|Delphi Implementation]]
+
* [[ActiveX/Delphi]] for a Delphi implementation
 +
* [[ActiveX]] for a description of ActiveX
  
−
* [[ActiveX|ActiveX Description]]
+
[[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

Retrieved from "https://wiki.videolan.org/index.php?title=ActiveX/HTML&oldid=59918"