08-26-2013 01:39 AM - edited 08-26-2013 01:42 AM
Thought I would share my latest Captive Portal creation :)
By using existing JS libraries, it is possible to force the user to watch a video before he is able to log on to the guest network.
This is a great opportunity for some advertising or similar that some end-customers are interested in.
In my example, I am using 2 readily available JS libraries:
The video.js is a library that utilizes the html5 video possibilities. So since this is html5 you need to be aware that this method requires relatively new browsers.
It should be compatible with at least:
Internet Explorer 9+, Firefox, Opera, Chrome, and Safari.
jQuery is used for easy DOM manipulation of the page. In this case it means that it is the library that we use when the video is done playing and we are displaying the login form.
This code is saved as a *.html file and uploaded as Captive Portal Login:
Download jquery HERE and save as "jquery.js" - upload as "content"
Download video.js as a .zip file HERE. Extract the "video.js" and "video-js.min.css" files - upload as "content"
For the example video to work. you need to remember to allow traffic to "video-js.zencoder.com" in your logon-role. That should be IP: 18.104.22.168. This is taken straight from the official video.js demo, so the video and/or server is not mine. For your setup, the best thing to do is to put this video files in a server on your network.
If you need more info about the jquery and/or video.js library, go to their web site and read the Docs. :smileywink:
Remember to Kudo if a post helped you! || Problem Solved? Click "Accept as Solution" in a post!