Java development call Hai Kang Wei video camera web side page development experience __web

Source: Internet
Author: User

Recently in the development process need to use the sea-Conway camera on the Web side display in a variety of Baidu found online difficult to find a simple, reliable tutorial

After fumbling to finish the project, decided to write a strategy for the benefit of a small partner in need


Anyway

First need to download a Hai Kang Wei development package (Baidu search "Hai Kang Granville as the Web Development package") can also give me a message for 3.0 development Kits


Step One: Open the downloaded file and find the Demo folder codebase

Click on the WebComponents.exe installation note version number and 32-bit 64-bit (there are 64 bits of wood here)

If there is no suitable please go to the website to download


Step two: In the folder

Demo.js

Demo.css

Webvideoctrl.js

These 3 files are imported into your project and you need jquery without a small partner can guide the development package inside of the 1.7

This is when the HTML file that is imported into the development package can open such a page





OK Demo Opens the login to enter your camera configuration address and Account password port number Click Login

You can find the login device click on the Device selected window click Preview

This time the screen can come out (the introduction of JS Note address OH)


The first step is done, and we're connected to the camera.


The following is a Web development package that starts to do what we need to do, and we need to use the API to do what we want to do in the webvideoctrl.js.


For example, what I need is a monitor that opens an event match when the page is open and displays it on the page, opening a certain window based on the number of monitors.


1. Open Page Initialization plugin

Initializing Plug-ins

Global Save the currently selected window
var g_iwndindex = 0; You can not set this variable, there are window parameters of the interface, do not have to pass the value, the development package will default to use the current selection window
$ (function () {
Check if the plugin has been installed
if ( -1 = Webvideoctrl.i_checkplugininstall ()) {
Alert ("You have not installed the plugin yet, download the WebComponents.exe installation.") ");
Return
}

Initializing plug-in parameters and inserting plug-ins
Webvideoctrl.i_initplugin (951.5, 360, {
Iwndowtype:2,
Cbselwnd:function (xmldoc) {
G_iwndindex = $ (xmldoc). Find ("Selectwnd"). EQ (0). text ();
var szinfo = "Currently selected window number:" + g_iwndindex;
Showcbinfo (Szinfo);
}
});
Webvideoctrl.i_insertobjectplugin ("Divplugin");

Check to see if the plugin is up to date
if ( -1 = Webvideoctrl.i_checkpluginversion ()) {
Alert ("A new version of the plug-in has been detected, please upgrade the WebComponents.exe.") ");
Return
}

Window Event Bindings
$ (window). Bind ({
Resize:function () {
var $Restart = $ ("#restartDiv");
if ($Restart. length > 0) {
var osize = Getwindowsize ();
$Restart. CSS ({
Width:oSize.width + "px",
Height:oSize.height + "px"
});
}
}
});
Initialization Date Time
var szcurtime = DateFormat (New Date (), "yyyy-mm-dd");
$ ("#starttime"). Val (szcurtime + "00:00:00");
$ ("#endtime"). Val (szcurtime + "23:59:59");

Here to invoke the login and preview method with settimeout, if the direct call will not open the window, because it takes time to load the

Window.settimeout (Clicklogin (), 1000);
Window.settimeout (Clickstartrealplay (), 1000);

});




2 Write a login method


var ce02m=new Array ();
var ce03m=new Array ();
var ce04m=new Array ();
var ce05m=new Array ();
<c:foreach items= "${monitor}" var= "Monitor11" >
Ce02m.push ("${monitor11.ce02}");
Ce03m.push ("${monitor11.ce03}");
Ce04m.push ("${monitor11.ce04}");
Ce05m.push ("${monitor11.ce05}");
</c:forEach>

var szip = ce02m;
var szport = ce05m;
var szusername = ce03m;
var szpassword = ce04m;

Login
function Clicklogin () {
for (Var i=0;i<szip.length;i++) {
var iRet = Webvideoctrl.i_login (Szip[i], 1, szport[i], szusername[i], Szpassword[i], {
});
}

}


Webvideoctrl.i_login () need to pass 4 value account address password port port default is 80 can not pass


I received a list<model> from the background in JS with a foreach traversal into array ()


3. Open the page


function Clickstartrealplay () {
for (Var i=0;i<szip.length;i++) {
Iwndindex=i;
var iRet = Webvideoctrl.i_startrealplay (Szip[i], {
Iwndindex:iwndindex
});
}

Several accounts open several windows

if (ce02m.length>9) {
Changewndnum (4);
}else{
if (ce02m.length>4) {
Changewndnum (3);
}else{
Changewndnum (2);
}
}

Webvideoctrl.i_startrealplay need to send an address, it's a must.

Iwndindex is the selected window number, in the case of the default is 0, I said, you can press the loop to open the fixed window number Changewndnum This method is to open several Windows default 4 formats 1*1 2*2

3*3 4*4 according to the respective corresponding parameters 1 2 3 4


The remaining JSP only needs to call the window style and the JS CSS file reflected


<div id= "Divplugin" class= "plugin" ></div>


If you need to resize the window to find plugin in CSS


/* Plugin * *
. Plugin
{
width:951.5px;
height:360px;
}


Note that you have to make adjustments when loading, or the window is unchanged.


Initializing plug-in parameters and inserting plug-ins
Webvideoctrl.i_initplugin (951.5, 360, {}



OK function Perfect Implementation








Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.