vuvideo-net

vuvideo-net, vuaudio-net and vuimg-net are custom html tags designed by vusys. They allow an easy and immediate integration of the vusys protocol into a web page, as easily as using the default <video>, <audio> or <img> tags.

They are designed to easily increase and optimize the efficiency of data intensive web pages.

vuvideo-net and vuaudio-net bring the following additional features when compared to simple <video> and <audio> tags:

for live or on-demand,
unlimited duration,
around the world, even in challenging network conditions,
multiple audio tracks,
subtitle tracks,
ads insertions, should this be needed,
regional or local blackouts, should this be needed,
timed interactive overlays,
encryption for digital copy protection,
restriction to urls allowed to play the video, should this be needed,
any stronger restrictions based on authentication for instance.

vuvideo-net is not an i-frame and gets all the benefits of an inner tag. And it supports most, if not all, css layouts.

vuimg-net brings the following additional features when compared to a simple <img> tag:

memory management by displaying images only in the view port,
prefetch and cache images for a fast display,
stronger resilience to difficult networks, especially for large pages,
link an image to a future video or audio stream.

One can host his own vucell.net server to stream videos using the resilient vusys protocol or leverage services from one of the certified partners.

A first integration in a web page can be extremely easy:

        <!-- at the very beginning of the page: -->
        
        <link href="//cache.vuvideo.net/vuvideo.css" rel="stylesheet" />

        <script src="//cache.vuvideo.net/vuvideo.js" ></script>

        <!-- ... then your own and usual html code here, defines the body, etc. -->
        
        <!-- ... and when ready, as it would be with a regular video tag: -->
        
        <vuvideo-net src="STREAMURL" ></vuvideo-net>
        
        <!-- STREAMURL would be the URL of the video to play, as made available by the cdn host. -->
        
        <!-- ... then keep going with your usual html code here ... -->

In essence, just link the vuvideo.css stylesheet and instantiate the vuvideo.js script, which will define the tags. The tags can then be added to the page as usual when compared to regular <video>, <audio> or <img> tags.

With one little restriction though, which is due to browsers' parsers: the tags can not be self closing.

The css and js files can also be fetched from your own vucell.net server instead of cache.vuvideo.net.

The tags can be instantiated multiple times on the same page with different images or videos. Attributes can be used to add immediate customizations.

They also supports a javascript based programatic approach, also in a similar way as the usual <video>, <audio> or <img> tags.

Please check below for more integration and programming details.

Here is a simple hello world example. Just post the following example in a web page.
Attention: because the video is DRM protected, the page will need to be accessed via https.

        
        <html>

        <head>

        <link href="https://cache.vuvideo.net/vuvideo.css" rel="stylesheet" />

        <script src="https://cache.vuvideo.net/vuvideo.js" ></script>

        </head>

        <body>

        <vuvideo-net src="https://cdn.vuvideo.net/vusys/stream/1/file/000000/0000/demo/sample.webm" ></vuvideo-net>
        
        </body>

        </html>

The url used for the "src" tag is the one specified by the cdn partner implementing the vusys protocol. In this example, this is using the "/file/" interface which allows giving the name of the source file as it was uploaded: this is a virtual url because the content was indeed transcoded and encrypted and is not available anymore in its original format. The method for the url can be "http:", "https:", or any relative url, such as starting directly with "//" for instance. Another example for the src value could be something like: "https://cdn.cdnpartner.net/vusys/stream/1/file/123456/1234/myfolder/myfile.mp4". A last and recommended example would use scrambled links: "https://othercdn/vusys/stream/1/a/d53ace45-6f06-265c-391a-30f80e31bbf7-71a68a9a/5c79cef8-36be-11ee-bcaa-dff71a14646a-63ef0964". The url for the content can only be used by a vuvideo-net tag, a direct access to the url would return an error.

documentation manual

vuvideo-net

description

requirements

properties

methods

events

examples

vuimg-net

description

properties

methods

examples