NFIC VPON Network SDK Training VPON CGI & Webpage SDK Vincent Hao [email protected] M2CA, NFIC.

NFIC VPON Network SDK TrainingVPON CGI & Webpage SDK

Vincent Hao

[email protected]

M2CA, NFIC

VPON Network SDK Training - CGI & Webpage

2

CGI SDK: Introduction• Use CGI (URL Request) to:

– Rretrieve Video/Audio Stream– Get/Set System Parameters & Information– Access GPIO– Camera Control– Read/Write COM2 Port– Design Your Own Page (+Webpage SDK)

• CGI SDK Reference– Document: “VPON URL Request Syntax”


3

CGI SDK: Invoke CGI(1)• How to invoke CGI Request to VPON?

– Manually invoked in URL address field of browser• Open a browser and view camera 1 of VPON• Open another browser and enter: http://10.11.1.221/camera.htm?

Video_Source=0&Brightness=15


4

CGI SDK: Invoke CGI(2)• How to invoke CGI Request to VPON(Cont.)?

– Invoked in a webpage (by HTML Form): – Ex1: this example will display a page for setting

brightness of video========= EX1.HTM =========

<HTML><HEAD></HEAD><BODY>

<FORM METHOD="GET" ACTION="http://10.11.1.221/camera.htm">

<INPUT TYPE="HIDDEN" NAME="Video_Source" VALUE="0">

<SELECT NAME="Brightness">

<OPTION VALUE="20">20



</SELECT>

<INPUT TYPE="submit" VALUE="Done">

</FORM></BODY></HTML>


5

CGI SDK: Invoke CGI(3)• Invoked in a webpage (by JavaScript):

======= EX2.HTM =======

<HTML><HEAD><TITLE>Example</TITLE></HEAD>

<FRAMESET ROWS="100%,*">

<FRAME NAME="ex2a" SRC="ex2a.htm">

<FRAME NAME="dummy" SRC="dummy">

</FRAMESET>

</HTML>

======= EX2A.HTM ======= <HTML><HEAD><TITLE></TITLE>

<script LANGUAGE="JavaScript">



</script>

</HEAD>

<BODY>

<FORM NAME="theForm">

<EMBED type="video/x-nficwmh263" src="http://10.11.1.221/pushall.htm;0?noinput=1&exclusive_camctrl=1&zzw=12" width=320 height=240 align="center"></EMBED><BR>

<IMG SRC="BRIGHT.GIF" WIDTH="16" HEIGHT="16">

<SELECT NAME="Brightness" OnChange="do_brightness()">




</SELECT>

</FORM>

</BODY></HTML>


6

CGI SDK: Video Stream(1)• Embed Video Stream in Your Page======= EX3 =======

<HTML>

<HEAD><TITLE>EXAMPLE</TITLE></HEAD>

<BODY>

<EMBED type="video/x-nficwmh263" SRC="http://10.11.1.221/pushall.htm;0?noinput=1" align="left" width=320 height=240>

<EMBED type="video/x-nficwmh263" SRC="http://10.11.1.221/pushall.htm;1" align="left" width=320 height=240>

</BODY></HTML>

• EMBED

• type– H.263: “video/x-nficwmh263”

– MJPEG/JPEG: “video/x-nficwmjpeg”

• src

• noinput

• width/height


7

CGI SDK: Video Stream(2)• Embed Video Stream

(JavaApplet)– Use JavaApplet to Decode,

No More Plugins.• liveview.class (.cla)

– Snapshot JPEG Image• VIDEOSOURCE

• WIDTH

• HEIGHT

• QUERYSTRING

======== EX4 ========

<HTML>


<BODY>

<APPLET align=baseline code="liveview.class" codebase="http://10.11.1.221/" width=320 height=240>

<PARAM NAME="VIDEOSOURCE" VALUE="0">

<PARAM NAME="WIDTH" VALUE="320">

<PARAM NAME="HEIGHT" VALUE="240">

<PARAM NAME="QUERYSTRING" VALUE="">

</APPLET>

</BODY></HTML>


8

CGI SDK: Audio Stream• Embed Audio Stream in Your Page======= EX5 =======

<HTML>


<BODY>

<EMBED type="audio/x-nficwmado0" SRC="http://10.11.1.221/pushado.htm;?Audio_Source=0" WIDTH=237 HEIGHT=34 align="left">

</BODY></HTML>

• type– audio/x-nficwmado0

• src

• width/height– Fixed size: width=237 height=34


9

CGI SDK: GPI & GPO• Read GPI

– ex: http://10.11.1.221/gpi

• Read Latched GPI Status– ex: http://10.11.1.221/gpi_latch

– ex: http://10.11.1.221/gpi_latch?reset=1, this will read and clear the latched state

• Control GPO– ex: http://10.11.1.221/gp0?write=A, this will turn GPO4 & GPO2 close circuit,

and make GPO1 & GPO3 open circuit.

• Read GPO Status– ex: http://10.11.1.221/gpo_state


10

CGI SDK: Read/Write COM2• Read & Write COM2 of VPON

http://10.11.1.221/com2?command_line– “write=hex_string”--- ex: “write=80000102FF” means writing 5 hex values to

COM2, they are: 0x80, 0x00, 0x01, 0x02 and 0xFF

– “flush=1”---flush the com2 read buffer

– “wait=delay”---wait for delay milli-seconds

– “read=size”---read size values from com2 read buffer

– ex: http://10.11.1.221/com2?flush=1&write=80000102FF&wait=1000&read=1024

• Flush COM2 read buffer

• Write 0x80, 0x00, 0x01, 0x02, 0xFF to COM2

• Wait for 1000 milli-seconds

• Read COM2 buffer with maximum size of 1024.


11

CGI SDK: Camera Control• Camera Control

– cam_ctrl.htm– ex: http://10.11.1.221/cam_ctrl.htm?Video_Source=1&Speed=1&camctrl_right=1

– This will make PTZ camera # 1 to turn right with a normal speed

– Video_Source starts from 1, not the commonly used 0


12

CGI SDK: Other Requests(1)• Redetect Camera

– http://10.11.1.221/detect_cam.htm

• Snapshot Image– http://10.11.1.221/snapshot0.jpg

• Reboot– http://10.11.1.221/reboot

• Query Firmware Version– http://10.11.1.221/fw_version.htm

• Camera Settings– http://10.11.1.221/camera.htm?

Video_Source=0&Brightness=50&Contrast=….

• Motion Detection– http://10.11.1.221/detect_cam.htm

• Date & Time– http://10.11.1.221/settime.htm

• System Configuration– http://10.11.1.221/setcfig.htm?

MASTERCODE=1&IpAddr=192.168.10.10&name=webmonitor&passwd=…...

• Alarm Status & Remote Control– http://10.11.1.221/alarm.htm


13

CGI SDK: Other Requests(2)• Set Names & On-Screen-Display

– http://10.11.1.221/camera_name.htm

• Set User’s Authority– http://10.11.1.221/limitusr.htm


14

Webpage SDK: Introduction• Use Webpage SDK to:

– Upload/Download Webpages to/from VPON.– Design your own webpages– Use a set of “Tokens” to retrieve system parameters and

embed them in the pages you designed. – Design pages that required different access rights– Use a Text Editor, Do not use MS Word or HTML Editor

• Webpage SDK Reference– Document: “VPON Webpage Syntax”


15

Webpage SDK: Introduction• Directory Architecture of FTP Server

• Login as administrator, root will be C:\WWW

• Login as user, root will be C:\WWW\USER • C:\WWW\

– Used to store webpages require no password

C:\

USER

ADMINWWW


16

Webpage SDK: Introduction• C:\WWW\USER\

– Used to store webpages require user password

• C:\WWW\ADMIN\– Used to store webpages require admin password

• Webpage Search Policy:– Find in C:\WWW\

– Find in C:\WWW\USER

– Find in C:\WWW\ADMIN

– Find in FW Embedded Webpages


17

Webpage SDK: Introduction• Support DOS 8.3 Filename Format

– .class -> .cla

– .jpeg -> .jpe

– .html -> .htm

• Use FTP Application or FTP Command under DOSBOX to Upload/Download Webpages

• Before Modification, Backup First!


18

Webpage SDK:Token• Token

– Special tag enclosed by ‘<$’ and ‘$>’ – Number of these special tag is finite– Token will be parsed by FW and will be replaced by a

string– Only HTML file will be parsed– Ex: Assume the current time of VPON is 10:36:54, token

<$Date$> will be replaced by “10:36:54”


19

Webpage SDK:Token• Token

– Token can have parameter, separate by colon, ex: <$CameraName:0$> will be replaced by the name of camera # 1

– Token may have more than 1 parameters, ex: <IfSel_GPI:0:1>, 0 is the first parameter, point to GPI1. 1 is the second parameter, means NC (Normal Close). This token will be replaced by “selected” if GPI1 is now set as NC, otherwise it will be replaced as an empty string.


20

Webpage SDK:Token• IfSel_xxxx

– Used with selection of a form– If the statement is TRUE, this token will be evaluate as

“selected”, otherwise an empty string is used.

• IfChk_xxxx– Used with checkbox and radio button of a form – If the statement is TRUE, this token will be evaluate as

“checked”, otherwise an empty string is used.


21

Webpage SDK:Token• All the tokens can be found in the webpages shipped

with VPON.

• When you designing your own page, find the use of tokens in the VPON pages as a good reference.


22

Webpage SDK:Useful Tokens• Date • Time• ServerName• CameraName• IpAddr• CurrIpAddr• VideoMimeType• AudioMimeType• Example: ex10.htm

• EtherAddr• FirmwareVersion• FirmwareDate• UserName• UserPass• AdminName• AdminPass• GPI_State• Example: ex11.htm


23

Webpage SDK:Useful Tokens• Edit ex10.htm & ex11.htm

• Login VPON FTP server

• Upload ex10.htm & ex11.htm to C:\WWW\USER

• Use browser to view these two pages

• Use browser to view the source of the page– You will find all the tokens have been replaced by system

parameters.


24

Webpage SDK:Useful Tokens========= EX10.HTM =========

<HTML><HEAD><TITLE>Example</TITLE>

</HEAD><BODY>

Date:<$Date$><br>

Time:<$Time$><br>

ServerName:<$ServerName$><br>

Camera 1 Name:<$CameraName:0$><br>




IP Address in System Configuration:<$IpAddr$><br>

Current System IP Address:<$CurrIpAddr$><br>

Video MIME Type:<$VideoMimeType$><br>

Audio MIME Type:<$AudioMimeType$><br>

</BODY></HTML>

====== EX10.HTM Result =======

Date:2001/02/01

Time:18:24:09

ServerName:VPON Camera Server

Camera 1 Name:Camera 1




IP Address in System Configuration:10.11.1.221

Current System IP Address:10.11.1.221

Video MIME Type:video/x-nficwmh263

Audio MIME Type:audio/x-nficwmado0


25

Webpage SDK:Useful Tokens======== EX11.HTM ========

<HTML><HEAD><TITLE>Example</TITLE></HEAD>

<BODY>

Ethernet Address:<$EtherAddr$><br>

Firmware Version:<$FirmwareVersion$><br>

Firmware Date:<$FirmwareDate$><br>

User's Name:<$UserName$><br>

User's Password:<$UserPass$><br>

Administrator's Name:<$AdminName$><br>

Administrator's Password:<$AdminPass$><br>

GPI1 State:<$GPI_State:0$><br>




</BODY>

</HTML>

====== EX11.HTM Result ========

Ethernet Address:00:40:CA:81:1E:BA

Firmware Version:3.02

Firmware Date: Jan 19 2001 11:43:09

User's Name:1

User's Password:1

Administrator's Name:2

Administrator's Password:2

GPI1 State:

GPI2 State:

GPI3 State:

GPI4 State:


26

Webpage SDK:Tokens for Selected Camera

• Some tokens depends on which camera now is selected:– VidSrcSel– CameraNameSel– IfSel_VidSrc– IfSel_CamCtrlSpeed

• Pass Video_Source=xx in the query string

• Example:ex12.htm


27

<html><head></head>

<body><form><br>

Name of Camera <$VidSrcSel$> is <$CameraNameSel$>.<SELECT NAME="Video_Source">

<OPTION VALUE="0" <$IfSel_VidSrc:0$> ><$CameraName:0$>




</SELECT><br>

The Current PTZ speed of <$CameraNameSel$> is:<SELECT>

<OPTION VALUE="0" <$IfSel_CamCtrlSpeed:0$> >Slow

<OPTION VALUE="1" <$IfSel_CamCtrlSpeed:1$> >Normal

<OPTION VALUE="2" <$IfSel_CamCtrlSpeed:2$> >Fast

</SELECT><br>

</form></body></html>

Webpage SDK:Tokens for Selected Camera


28

Webpage SDK:Other Tokens • AdoSrcSel, IfSel_AdoSrc, IfSel_MicGain,

IfSel_SpkVol, also, should pass Audio_Source=xxx in query string

• Other Tokens are relatively not so frequently used, for the detailed reference, please see “VPON Webpage Syntax”


29

CGI Example-test1.htm• This example, test1.htm & testf1.htm will demostrate

how to use CGI to do camera control and camera settings

• This example does not use tokens, thus it’s not a dynamic page.


30

CGI Example-test1.htm

========= TESTF1.HTM =========<html><head><title>Example</title></head><FRAMESET ROWS="100%,*"><FRAME NAME="ptz" SRC="test1.htm"><FRAME NAME="dummy" SRC="dummy"></FRAMESET></HTML>

========= TEST1.HTM =========<HTML><HEAD><TITLE></TITLE><script LANGUAGE="JavaScript"></script></HEAD>

<BODY BGCOLOR="#C0C0C0"><FORM NAME="theForm">Server:VP300<BR>Camera:Camera 1<BR><HR><TABLE BORDER=0 CELLSPACING=0 CELLPADDING=3> <TR> <TD VALIGN="TOP" ALIGN="CENTER" ROWSPAN="4"> <EMBED type="video/x-nficwmh263" src="http://10.11.1.221/push.htm;0?noinput=1" width=320 height=240 align="center"></EMBED> </TD> <TD ALIGN="RIGHT"><IMG SRC="BRIGHT.GIF" WIDTH="16" HEIGHT="16"></TD> <TD><SELECT NAME="Brightness" OnChange="do_brightness()"> <OPTION VALUE="15">15 <OPTION VALUE="20">20 <OPTION VALUE="25">25 <OPTION VALUE="30">30 <OPTION VALUE="35">35 <OPTION VALUE="40">40 <OPTION VALUE="45">45 <OPTION VALUE="50">50 <OPTION VALUE="55">55 <OPTION VALUE="60">60 <OPTION VALUE="65">65 <OPTION VALUE="70">70 <OPTION VALUE="75">75 <OPTION VALUE="80">80 <OPTION VALUE="85">85 <OPTION VALUE="90">90 <OPTION VALUE="95">95 </SELECT></TD> </TR> <TR> <TD ALIGN="RIGHT"><IMG SRC="CONT.GIF" WIDTH="16" HEIGHT="16"></TD> <TD><SELECT NAME="Contrast" OnChange="do_contrast()"> <OPTION VALUE="15">15 <OPTION VALUE="20">20 <OPTION VALUE="25">25 <OPTION VALUE="30">30

<OPTION VALUE="35">35 <OPTION VALUE="40">40 <OPTION VALUE="45">45 <OPTION VALUE="50">50 <OPTION VALUE="55">55 <OPTION VALUE="60">60 <OPTION VALUE="65">65 <OPTION VALUE="70">70 <OPTION VALUE="75">75 <OPTION VALUE="80">80 <OPTION VALUE="85">85 <OPTION VALUE="90">90 <OPTION VALUE="95">95 </SELECT></TD> </TR> <TR> <TD ALIGN="RIGHT"><IMG SRC="SATU.GIF" WIDTH="16" HEIGHT="16"></TD> <TD><SELECT NAME="Saturation" OnChange="do_saturation()"> <OPTION VALUE="15">15 <OPTION VALUE="20">20 <OPTION VALUE="25">25 <OPTION VALUE="30">30 <OPTION VALUE="35">35 <OPTION VALUE="40">40 <OPTION VALUE="45">45 <OPTION VALUE="50">50 <OPTION VALUE="55">55 <OPTION VALUE="60">60 <OPTION VALUE="65">65 <OPTION VALUE="70">70 <OPTION VALUE="75">75 <OPTION VALUE="80">80 <OPTION VALUE="85">85 <OPTION VALUE="90">90 <OPTION VALUE="95">95 </SELECT></TD> </TR>

<TR> <TD ALIGN="RIGHT"> <IMG SRC="HUE.GIF" WIDTH="16" HEIGHT="16"></TD> <TD><SELECT NAME="Hue" OnChange="do_hue()"> <OPTION VALUE="15">15 <OPTION VALUE="20">20 <OPTION VALUE="25">25 <OPTION VALUE="30">30 <OPTION VALUE="35">35 <OPTION VALUE="40">40 <OPTION VALUE="45">45 <OPTION VALUE="50">50 <OPTION VALUE="55">55 <OPTION VALUE="60">60 <OPTION VALUE="65">65 <OPTION VALUE="70">70 <OPTION VALUE="75">75 <OPTION VALUE="80">80 <OPTION VALUE="85">85 <OPTION VALUE="90">90 <OPTION VALUE="95">95 </SELECT></TD> </TR></TABLE>

<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=3>

<TR>

<TD><TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 > <TR><TD></TD> <TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_up" VALUE=" UP " OnClick="do_tilt_up()"></CENTER></TD> <TD></TD></TR> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_left" VALUE="LEFT " OnClick="do_pan_left()"></CENTER></TD> <TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_stoppt" VALUE="STOP "></CENTER></TD> <TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_right" VALUE="RIGHT" OnClick="do_pan_right()"></CENTER></TD></TR>

<TR><TD></TD> <TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_down" VALUE="DOWN " OnClick="do_tilt_down()"></CENTER></TD> <TD></TD></TR> </TABLE></TD>

<TD><TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_zoomin" VALUE="Zoom+" OnClick="do_zoom_in()"></CENTER></TD></TR> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_stopz" VALUE="STOP "</CENTER></TD></TR> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_zoomout" VALUE="Zoom-" OnClick="do_zoom_out()"></CENTER></TD></TR> </TABLE></TD>

<TD><TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_fnear" VALUE="Focus+" OnClick="do_focus_near()"></CENTER></TD></TR> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_stopf" VALUE="STOP "></CENTER></TD></TR> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_ffar" VALUE="Focus-" OnClick="do_focus_far()"></CENTER></TD></TR> </TABLE></TD>

</TR>

</TABLE>

</FORM></body></html>


34

CGI Example-test1.htm• testf1.htm create two frames, test1.htm will be displayed in

the visible one, ptz frame. And the invisible one, dummy frame, will be used to send request and receive response.

• test1.htm– do_request() will invoke the request thru dummy frame– do_pan_xxx, do_tilt_xxx, do_zoom_xxx, do_focus_xxx

invoke cam_ctrl.htm CGI request via do_request.– do_brightness, do_contrast, do_hue, do_saturation invoke

camera.htm CGI request.


35

CGI Example-test1.htm• test1.htm

– This page can only control camera 1, to control other cameras, more pages are required.

– Camera settings cannot be initialized– The name of server and camera are hard-coded.– The MIME type is hardcoded– The IP address is hardcoded, can be solved by put this

page onto VPON.

• To solve these problems, use Webpage SDK.


36

Token & CGI Example-test2.htm

• This example, test2.htm & testf2.htm will demostrate how to use CGI and Tokens to do camera control and camera settings

• This example shows how to write a dynamic page using tokens.

• This example is directly modify from the previous example - test1.htm.– We change some parameters of test1.htm with tokens that

when we put test2.htm onto VPON, we can make this page more flexible.


37


========= TESTF2.HTM =========<html><head><title>Example</title></head><FRAMESET ROWS="100%,*"><FRAME NAME="ptz" SRC="test2.htm?Video_Source=<$VidSrcSel$>&zzw=<$CamCtrlToken$>"><FRAME NAME="dummy" SRC="dummy"></FRAMESET></HTML>

========= TEST2.HTM =========<HTML><HEAD><TITLE></TITLE><script LANGUAGE="JavaScript"></script></HEAD><BODY BGCOLOR="#C0C0C0"><FORM NAME="theForm">Server:<$ServerName$><BR>Camera:<$CameraNameSel$><BR><HR><TABLE BORDER=0 CELLSPACING=0 CELLPADDING=3> <TR> <TD VALIGN="TOP" ALIGN="CENTER" ROWSPAN="5"> <EMBED type="<$VideoMimeType$>" src="push.htm;<$VidSrcSel$>?noinput=1" width=320 height=240 align="center"></EMBED> </TD>

<TD ALIGN="RIGHT">Camera:</TD> <TD><SELECT NAME="Video_Source" OnChange="change_source()"> <OPTION VALUE="0" <$IfSel_VidSrc:0$> ><$CameraName:0$> <OPTION VALUE="1" <$IfSel_VidSrc:1$> ><$CameraName:1$> <OPTION VALUE="2" <$IfSel_VidSrc:2$> ><$CameraName:2$> <OPTION VALUE="3" <$IfSel_VidSrc:3$> ><$CameraName:3$> </SELECT></TD> </TR> <TR> <TD ALIGN="RIGHT"><IMG SRC="BRIGHT.GIF" WIDTH="16" HEIGHT="16"></TD> <TD><SELECT NAME="Brightness" OnChange="do_brightness()"> <OPTION VALUE="15" <$IfSel_Brightness:15$> >15 <OPTION VALUE="20" <$IfSel_Brightness:20$> >20 <OPTION VALUE="25" <$IfSel_Brightness:25$> >25 <OPTION VALUE="30" <$IfSel_Brightness:30$> >30 <OPTION VALUE="35" <$IfSel_Brightness:35$> >35 <OPTION VALUE="40" <$IfSel_Brightness:40$> >40 <OPTION VALUE="45" <$IfSel_Brightness:45$> >45 <OPTION VALUE="50" <$IfSel_Brightness:50$> >50 <OPTION VALUE="55" <$IfSel_Brightness:55$> >55 <OPTION VALUE="60" <$IfSel_Brightness:60$> >60 <OPTION VALUE="65" <$IfSel_Brightness:65$> >65 <OPTION VALUE="70" <$IfSel_Brightness:70$> >70 <OPTION VALUE="75" <$IfSel_Brightness:75$> >75 <OPTION VALUE="80" <$IfSel_Brightness:80$> >80 <OPTION VALUE="85" <$IfSel_Brightness:85$> >85 <OPTION VALUE="90" <$IfSel_Brightness:90$> >90 <OPTION VALUE="95" <$IfSel_Brightness:95$> >95 </SELECT></TD> </TD> <TR>

<TD ALIGN="RIGHT"><IMG SRC="CONT.GIF" WIDTH="16" HEIGHT="16"></TD> <TD><SELECT NAME="Contrast" OnChange="do_contrast()"> <OPTION VALUE="15" <$IfSel_Contrast:15$> >15 <OPTION VALUE="20" <$IfSel_Contrast:20$> >20 <OPTION VALUE="25" <$IfSel_Contrast:25$> >25 <OPTION VALUE="30" <$IfSel_Contrast:30$> >30 <OPTION VALUE="35" <$IfSel_Contrast:35$> >35 <OPTION VALUE="40" <$IfSel_Contrast:40$> >40 <OPTION VALUE="45" <$IfSel_Contrast:45$> >45 <OPTION VALUE="50" <$IfSel_Contrast:50$> >50 <OPTION VALUE="55" <$IfSel_Contrast:55$> >55 <OPTION VALUE="60" <$IfSel_Contrast:60$> >60 <OPTION VALUE="65" <$IfSel_Contrast:65$> >65 <OPTION VALUE="70" <$IfSel_Contrast:70$> >70 <OPTION VALUE="75" <$IfSel_Contrast:75$> >75 <OPTION VALUE="80" <$IfSel_Contrast:80$> >80 <OPTION VALUE="85" <$IfSel_Contrast:85$> >85 <OPTION VALUE="90" <$IfSel_Contrast:90$> >90 <OPTION VALUE="95" <$IfSel_Contrast:95$> >95 </SELECT></TD> </TR> <TR> <TD ALIGN="RIGHT"><IMG SRC="SATU.GIF" WIDTH="16" HEIGHT="16"></TD> <TD><SELECT NAME="Saturation" OnChange="do_saturation()"> <OPTION VALUE="15" <$IfSel_Saturation:15$> >15 <OPTION VALUE="20" <$IfSel_Saturation:20$> >20 <OPTION VALUE="25" <$IfSel_Saturation:25$> >25 <OPTION VALUE="30" <$IfSel_Saturation:30$> >30 <OPTION VALUE="35" <$IfSel_Saturation:35$> >35 <OPTION VALUE="40" <$IfSel_Saturation:40$> >40 <OPTION VALUE="45" <$IfSel_Saturation:45$> >45 <OPTION VALUE="50" <$IfSel_Saturation:50$> >50 <OPTION VALUE="55" <$IfSel_Saturation:55$> >55 <OPTION VALUE="60" <$IfSel_Saturation:60$> >60 <OPTION VALUE="65" <$IfSel_Saturation:65$> >65 <OPTION VALUE="70" <$IfSel_Saturation:70$> >70 <OPTION VALUE="75" <$IfSel_Saturation:75$> >75 <OPTION VALUE="80" <$IfSel_Saturation:80$> >80 <OPTION VALUE="85" <$IfSel_Saturation:85$> >85

<OPTION VALUE="90" <$IfSel_Saturation:90$> >90 <OPTION VALUE="95" <$IfSel_Saturation:95$> >95 </SELECT></TD> </TR> <TR> <TD ALIGN="RIGHT"> <IMG SRC="HUE.GIF" WIDTH="16" HEIGHT="16"></TD> <TD><SELECT NAME="Hue" OnChange="do_hue()"> <OPTION VALUE="15" <$IfSel_Hue:15$> >15 <OPTION VALUE="20" <$IfSel_Hue:20$> >20 <OPTION VALUE="25" <$IfSel_Hue:25$> >25 <OPTION VALUE="30" <$IfSel_Hue:30$> >30 <OPTION VALUE="35" <$IfSel_Hue:35$> >35 <OPTION VALUE="40" <$IfSel_Hue:40$> >40 <OPTION VALUE="45" <$IfSel_Hue:45$> >45 <OPTION VALUE="50" <$IfSel_Hue:50$> >50 <OPTION VALUE="55" <$IfSel_Hue:55$> >55 <OPTION VALUE="60" <$IfSel_Hue:60$> >60 <OPTION VALUE="65" <$IfSel_Hue:65$> >65 <OPTION VALUE="70" <$IfSel_Hue:70$> >70 <OPTION VALUE="75" <$IfSel_Hue:75$> >75 <OPTION VALUE="80" <$IfSel_Hue:80$> >80 <OPTION VALUE="85" <$IfSel_Hue:85$> >85 <OPTION VALUE="90" <$IfSel_Hue:90$> >90 <OPTION VALUE="95" <$IfSel_Hue:95$> >95 </SELECT></TD> </TR></TABLE>

<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=3>

<TR>

<TD><TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 > <TR><TD></TD> <TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_up" VALUE=" UP " OnClick="do_tilt_up()"></CENTER></TD> <TD></TD></TR> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_left" VALUE="LEFT " OnClick="do_pan_left()"></CENTER></TD>

<TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_stoppt" VALUE="STOP "></CENTER></TD> <TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_right" VALUE="RIGHT" OnClick="do_pan_right()"></CENTER></TD></TR> <TR><TD></TD> <TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_down" VALUE="DOWN " OnClick="do_tilt_down()"></CENTER></TD> <TD></TD></TR> </TABLE></TD>

<TD><TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_zoomin" VALUE="Zoom+" OnClick="do_zoom_in()"></CENTER></TD></TR> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_stopz" VALUE="STOP "</CENTER></TD></TR> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_zoomout" VALUE="Zoom-" OnClick="do_zoom_out()"></CENTER></TD></TR> </TABLE></TD>

<TD><TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_fnear" VALUE="Focus+" OnClick="do_focus_near()"></CENTER></TD></TR> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_stopf" VALUE="STOP "></CENTER></TD></TR> <TR><TD><CENTER><INPUT TYPE="BUTTON" NAME="camctrl_ffar" VALUE="Focus-" OnClick="do_focus_far()"></CENTER></TD></TR> </TABLE></TD>

</TR>

</TABLE>

</FORM></body></html>


42


• testf2.htm– Put <$VidSrcSel$> token in query string to pass the

current selected camera into test2.htm– Put <$CamCtrlToken$> token to pass an allocated camera

control token (handle) for ptz control.

• test2.htm– do_pan_xxx, do_tilt_xxx, do_zoom_xxx, do_focus_xxx

use <$VidSrcSel$> and increase by 1 as the video source parameters to cam_ctrl.htm, thus can control any one camera.


43


• test2.htm– do_brightness, do_contrast, do_hue, do_saturation will

read the current selected value from the form then invoke camera.htm CGI request.

– setTimeout("do_request('dummy')",1000); is used to break the video stream on the returned page in dummy frame, because this will decrease the performance.

– We add a new video source selection in the form which will call change_source(). This function will read the selected video source and pass to testf2.htm.


44


• test2.htm– Video MIME type and video source now are dynamic, one

page can serve all the camera and various codec type.– Server name and camera name and IP are also dynamic.– Camera settings can be initialized by <$IfSel_xxx:nn$>

tokens

Date post:	30-Dec-2015
Category:	Documents
Upload:	arron-stanley
View:	222 times
Download:	2 times

NFIC VPON Network SDK Training VPON CGI & Webpage SDK Vincent Hao [email protected] M2CA, NFIC.

Documents