Axis | M1103 | TECHNICAL NOTES - Amazon Web Services

TECHNICAL NOTES
Using a networked BrightSign player to display multiple
IP camera streams
BrightSign, LLC. 16795 Lark Ave., Suite 200 Los Gatos, CA 9503
408-852-9263 | www.brightsign.biz
TABLE OF CONTENTS
INTRODUCTION ..........................................................................................1
HARDWARE ................................................................................................2
CAMERA SETUP.........................................................................................3
RTSP Camera ............................................................................................................ 3
MJPEG Camera.......................................................................................................... 7
PRESENTATION CREATION ...................................................................14
Creating a Picture-in-Picture Video Presentation ..................................................... 14
Creating a Dual-Picture Presentation ....................................................................... 16
Creating an Interactive Presentation using a BP200/900 USB Button Panel............ 18
Creating a Touch-Screen Interactive Presentation ................................................... 20
ADVANCED: Using More than Two Axis Cameras in a Presentation ....................... 22
APPENDIX OF SCREENSHOTS ...............................................................29
INTRODUCTION
You can use a networked BrightSign player (HD220, HD1020, XD230,
XD1030, XD1230) combined with the Axis M1103 or M1113 Network
Camera, to create a surveillance or monitoring network similar to a CCTV
(closed-circuit television) system. You will be able to display two live-video
streams from a local, networked source on one screen. Here are a few
cases where a system like this would be helpful:
• You need to monitor both the front and back entrance of a store,
building, or warehouse.
• You want to maintain the quality of customer-cashier interactions at a
retail location, so you need to see both the customer and cashier in
action at the same time.
The applications of a dual-video monitoring system are numerous.
Furthermore, you can utilize many Axis cameras, linked together on the
same local network, to scale your monitoring system as large as you would
like.
This technical note will describe in detail how to set up dual live-video
streams for the BrightSign HD220 or HD1020. First, we will outline how the
hardware should be set up and how the different devices work together.
Second, we will go through the steps of configuring the Axis M1103 or
M1113 cameras for use with the BrightSign player. Finally, we will explain
how to create BrightAuthor presentations that will utilize two live-video
streams.
Note If you have any questions, please contact technical support.
1
HARDWARE
You will need the following hardware to complete this project:
• 1x BrightSign player (HD220, HD1020, XD230, XD1030, or XD1230)
• 2x Axis M1103 (or M1113) Network Cameras
Note: One camera will use RTSP streaming and the other will use MJPEG streaming.
• 1x home or small office network router
• 3x RJ45 Ethernet cable
• 1x digital monitor or display
**An XD player can also connect to a router wirelessly if a Wireless Module is installed on the player.
2
CAMERA SETUP
You will need to configure the settings of the Axis cameras separately: the first will be set up as an
RTSP source; the second will be set up as an MJPEG source. Changes to the camera will not be
recognized by the BrightSign player until the power supply of the player is unplugged and then
plugged in again.
If you accidently lose the default settings for the Axis camera, refer to the Appendix of Screenshots
for a complete catalogue of screenshots for the Axis camera settings pages.
RTSP Camera
To access the web interface for your Axis Network Camera, enter its IP address into the address bar
of your web browser. You can designate the IP address with the setup utility that comes with the
camera. All RTSP cameras in this guide use this address: 192.168.1.15
1. Log in to the web interface for the network camera. If you have not set up a user name or
password for the interface yet, provide the default credentials:
a. User Name: root
b. Password: admin
2. Click the Setup tab on the top right of the screen. Then navigate to System Options >
Maintenance in the left-hand directory.
3. Click the Restore button (avoid selecting either Restart or Default).
4. Wait 3 minutes for the network camera to restore and restart.
3
5. Set the password to “dtcamera”.
4
6. Click the Setup tab on the top right of the screen. Then navigate to Basic Setup > Video Stream
in the left-hand directory. Make sure the following properties are set correctly and then click the
Save button at the bottom of the page:
a. The Resolution is set to “640x480 (4:3)”.
b. The Mirror image box is unchecked.
c. The Rotate image field is set to 0 degrees.
7. Navigate to Basic Setup > Users in the left-hand directory.
8. Under User Settings, check the Enable anonymous viewer login box.
9. Click the Save button at the bottom of the page.
10. Navigate to the Live View page located on the top right of the screen to ensure that the video is
displayed correctly.
5
6
MJPEG Camera
To access the web interface for your Axis Network Camera, enter its IP address into the address bar
of your web browser. You can designate the IP address with the setup utility that comes with the
camera. All MJPEG cameras in this guide use the following address: 192.168.1.13
1. Log in to the Web interface for the network camera. If you have not set up a user name or
password for the interface yet, provide the default credentials:
a. User Name: root
b. Password: admin
2. Click the Setup tab on the top right of the screen. Then navigate to System Options >
Maintenance in the left-hand directory.
3. Click the Restore button (avoid selecting either Restart or Default).
4. Wait 3 minutes for the network camera to restore and restart.
5. Set the password to “dtcamera”.
7
8
6. Click the Setup tab on the top right of the screen. Then navigate to Basic Setup > Video Stream
in the left-hand directory.
a. Set Resolution to “640x480 (4:3)”.
b. Leave the Mirror image box unchecked.
c. Set Rotate image to 0 degrees.
d. Click the Save button at the bottom of the page.
7. Navigate to Basic Setup > Users in the left-hand directory.
8. Under User Settings, check the Enable anonymous viewer login box.
9. Click the Save button at the bottom of the page.
10. Navigate to Video > Stream Profiles.
9
10
11. Click Add to bring up the Stream Profile Settings window.
a. Type “mjpeg” into the Profile name field.
b. Set the Video encoding option to “MJPEG”.
c. Set the Resolution to 160x120(4:3).
Optional
The Resolution is set to 160x120 to ensure an optimal framerate. The resolution in this profile must
match the Mjpeg streaming zone created in your BrightAuthor presentation. Therfore, if you want a
larger Mjpeg video window in your presentation, you must increase the resolution in the Stream
Profile Settings window as well.
11
d. Enter 30 into the Compression field.
e. Set Mirror image to “Off”.
f. Set the Maximum frame rate to “Unlimited”.
Note
Make sure the box next to each option is checked. Otherwise, you will not be able to modify the
settings.
12. Select the MJPEG tab located above Image Appearance.
a. Make sure the Maximum frame size is set to Default.
b. Click OK at the bottom to close the Stream Profile Settings window.
Note
You should now see a new stream profile called “mjpeg” at the bottom of the Stream Profile List.
12
13. Click the Live View tab located on the top right of the screen. The displayed image should be
rotated 90 degrees counterclockwise.
13
PRESENTATION CREATION
This chapter will guide you through the process of creating BrightAuthor presentations that utilize both
the RTSP and MJPEG video streams. The first sections outline how to set up basic presentations
with two video windows. Subsequent sections will describe some of the advanced presentation
features you can add to this basic functionality. For additional information on creating presentations in
BrightAuthor, refer to the BrightAuthor User Guide.
Creating a Picture-in-Picture Video Presentation
1. Start a new presentation in BrightAuthor for your networked BrightSign player.
2. Create a Video Only zone and an Images zone.
a. Expand the Video Only zone so that it covers the entire area.
b. Define the width of the Images zone as 160 and the height as 120.
Note
A display resolution of 160x120 ensures the best video quality for the MJPEG stream. You can
increase or decrease the size to achieve the overlap you most prefer. However, for best results, you
must have the same resolution that you entered during the Mjpeg profile setup.
14
3. Navigate to the Edit > Playlist tab.
4. While editing the Video zone, do the following:
a. Click the Other tab in the Media Library.
b. Drag and drop the Video Stream icon into the playlist.
c. Enter a name of your choosing in the State name field.
d. Enter the following URL exactly as follows into the URL for video stream field (unless you
assigned a different IP address when you set up the camera):
rtsp://192.168.1.15/axis-media/media.amp?videocodec=h264
e. Type “0” in the Time on screen field. This will make the RTSP stream a permanent object
in the presentation.
f. Click OK.
5. While editing the Images zone, do the following:
a. Click the Other tab in the Media Library.
b. Drag and drop the Mjpeg Stream icon into the playlist.
c. Enter a name of your choosing in the State name field.
d. Enter the following URL exactly as follows into the URL for video stream field (unless you
assigned a different IP address when you set up the camera):
http://192.168.1.13/mjpg/video.mjpg?streamprofile=mjpeg
e. Set the Rotation to 0 degrees using the dropdown menu.
f. Type “0” in the Time on screen field. This will make the MJPEG steam a permanent object
in the presentation.
g. Click OK.
6. Navigate to the Publish tab.
7. Publish the presentation to your BrightSign player using your desired method.
Optional
You can schedule the presentation so that it only displays during a certain time (for example, during
work hours or during a certain employee’s shift) while working in the Publish tab. Note that this will
only turn off the presentation, not the Axis camera or the monitor.
15
Creating a Dual-Picture Presentation
This section will show you how to create a two-video presentation without overlap. This presentation
uses a portrait monitor orientation to get the largest video resolutions possible. You also can use a
landscape orientation, but the resolutions for both videos will be significantly smaller.
Note
This setup requires you to physically orient the monitor so that it displays like a portriat, rather than a
landscape. This may be difficult to do with many brands of monitors.
1. Begin a new presentation in BrightAuthor for your networked BrightSign player.
2. Set the Monitor orientation to “Portrait” in the New project window, which appears when you
choose to create a new presentation.
3. Create a Video Only zone and an Images zone.
4. Set the width and height of each zone to 480 by 640. Change the Mjpeg stream profile so that it
matches this resolution.
5. Set the position of the video window you want on top to 20(X) and 65(Y).
16
6. Set the position of the video window you want on the bottom to 524(X) and 65(Y).
7. Navigate to the Edit > Playlist tab.
8. While editing the Video zone, do the following:
a. Click the Other tab in the Media Library.
b. Drag and drop the Video Stream icon into the playlist.
c. Enter a name of your choosing in the State name field.
d. Enter the following URL exactly as follows into the URL for video stream field (unless you
assigned a different IP address when you set up the camera):
rtsp://192.168.1.15/axis-media/media.amp?videocodec=h264
e. Type “0” in the Time on screen field. This will make the RTSP stream a permanent object
in the presentation.
f. Click OK.
9. While editing the Images zone, do the following:
a. Click the Other tab in the Media Library.
b. Drag and drop the Mjpeg Stream icon into the playlist.
c. Enter a name of your choosing in the State name field.
d. Enter the following URL exactly as follows into the URL for video stream field (unless you
assigned a different IP address when you set up the camera):
http://192.168.1.13/mjpg/video.mjpg?streamprofile=mjpeg
e. Set the Rotation to 0 degrees using the dropdown menu.
f. Type “0” in the Time on screen field. This will make the MJPEG steam a permanent object
in the presentation.
g. Click OK.
8. Navigate to the Publish tab.
9. Publish the presentation to your BrightSign player using your desired method.
17
Optional
You can schedule the presentation so that it only displays during a certain time (for example, during
work hours or during a certain employee’s shift) while working in the Publish tab. Note that this will
only turn off the presentation, not the Axis camera or the monitor.
Creating an Interactive Presentation using a BP200/900 USB Button Panel
This section will show you how to create an interactive presentation that works with a BP200
or BP900. This presentation will be nearly identical to the one demonstrated in the Creating a Picturein-Picture Presentation section, but this presentation will allow the viewer to toggle the MJPEG video
on and off at will by pressing a button on the BP device.
Note
The BP200 and BP900 devices connect to a BrightSign player through USB. Therefore, you must
have the HD1020, XD1030, or XD1230 in order to create this presentation.
1. Start a new presentation in BrightAuthor for your networked BrightSign player.
2. Create a Video Only zone and an Images zone.
a. Expand the Video Only zone so that it covers the entire area.
b. Define the width of the Images zone as 160 and the height as 120.
3. Navigate to the Edit > Playlist tab.
4. While editing the Video zone, do the following:
a. Click the Other tab in the Media Library.
b. Drag and drop the Video Stream icon into the playlist.
c. Enter a name of your choosing in the State name field.
d. Enter the following URL exactly as follows into the URL for video stream field (unless you
assigned a different IP address when you set up the camera):
rtsp://192.168.1.15/axis-media/media.amp?videocodec=h264
e. Type “0” in the Time on screen field. This will make the RTSP stream a permanent object
in the presentation.
f. Click OK.
5. While editing the Images zone, do the following:
a. Change the Playlist type of the images zone to interactive.
b. Click the Other tab in the Media Library.
c. Drag and drop the Mjpeg Stream icon into the playlist.
d. Enter a name of your choosing in the State name field.
e. Enter the following URL exactly as follows into the URL for video stream field (unless you
assigned a different IP address when you set up the camera):
http://192.168.1.13/mjpg/video.mjpg?streamprofile=mjpeg
f. Set the Rotation to 0 degrees using the dropdown menu.
g. Type “0” in the Time on screen field. This will make the MJPEG steam a permanent object
in the presentations.
18
h. Click OK.
i. Drag and drop the Event Handler icon into the playlist area. Make sure to set it as the initial
state.
j. Click the Events tab in the Media Library.
k. Drag and drop the BP900A or BP200A event (depending on which button board you are
using) onto the Event Handler icon.
l. Specify the desired BP number and touch characteristics to bring up the picture-in-picture.
m. Select Transition to new state and choose the MJPEG Stream event from the drop-down
menu.
n. Click OK.
o. Drag and drop a second BP900A or BP200A event onto the MJPEG stream event.
p. Select the number and touch characteristics and set the event to Return to prior state.
q. Click OK.
19
You are now ready to publish a presentation that will switch between a single video stream and a
picture-in-picture video stream with the touch of a BP200A or BP900A button panel.
Creating a Touch-Screen Interactive Presentation
This section will show you how to create an interactive presentation that works with a touch-screen
monitor. This presentation will be nearly identical to the one demonstrated in the Creating a DualPicture Presentation section, but the presentation outlined here will allow the viewer to toggle the
MJPEG video on and off at will by pressing an area on the lower half of the touch screen.
Note
Some touch-screen monitors use a serial connection through VGA, which works on with any
BrightSign player, while others require a USB 2.0 port, which is only available on the HD1020,
XD1030, or XD1230.
1. Create a new presentation for your networked BrightSign player.
20
2. Set the Monitor orientation to “Portrait” in the New project window, which appears when you
choose to create a new presentation.
3. Create a Video Only zone and an Images zone.
4. Set the width and height of each zone to 480 by 640. Change the Mjpeg stream profile so that
it matches this resolution
5. Set the position of the video window you want on top to 20(X) and 65(Y).
6. Set the position of the video window you want on the bottom to 524(X) and 65(Y).
7. Navigate to the Edit > Playlist tab.
8. While editing the Video zone, do the following:
a. Click the Other tab in the Media Library.
b. Drag and drop the Video Stream icon into the playlist.
c. Enter a name of your choosing in the State name field.
d. Enter the following URL exactly as follows into the URL for video stream field (unless you
assigned a different IP address when you set up the camera):
rtsp://192.168.1.15/axis-media/media.amp?videocodec=h264
e. Type “0” in the Time on screen field. This will make the RTSP stream a permanent object
in the presentation.
f. Click OK.
10. While editing the Images zone, do the following:
a. Change the Playlist type of the images zone to interactive.
b. Click the Other tab in the Media Library.
c. Drag and drop the Mjpeg Stream icon into the playlist.
d. Enter a name of your choosing in the State name field.
e. Enter the following URL exactly as follows into the URL for video stream field (unless you
assigned a different IP address when you set up the camera):
http://192.168.1.13/mjpg/video.mjpg?streamprofile=mjpeg
f. Set the Rotation to 0 degrees using the dropdown menu.
g. Type “0” in the Time on screen field.
h. Click OK.
i. Drag and drop the image that you want the user to touch to bring up the MJPEG stream.
j. Check the Set as initial state box.
k. Drag and drop a Rectangular Touch event onto the image.
l. Set the Size and Position of the boundaries for the touch event.
m. Select Transition to new state and choose the MJPEG Stream event from the drop-down
menu.
n. Click OK.
21
o. Drag and drop another Rectangular Touch event onto the MJPEG Stream.
p. Set the Size and Position of the boundaries for the touch event and set the event to
Return to prior state.
ADVANCED: Using More than Two Axis Cameras in a Presentation
Presentation Overview
You can create a BrightSign presentation that utilizes as many Axis Network Cameras as you would
like. You must have a piece of hardware that will allow the viewer to switch between cameras (a
touch screen or a BP200/BP900 USB device, for example). The following setup utilizes the
22
same Picture-in-Picture presentation outlined above. Refer to that section for the basic setup details.
These advanced instructions assume some basic familiarity with the BrightAuthor software. See
the BrightAuthor User Guide for more details.
The presentation created in this section will allow viewers to cycle through the picture-in-picture
camera streams and toggle between showing and hiding the picture-in-picture zone. They will also be
able to make any picture-in-picture stream into a full-size video with the press of a button.
Finding Stream URLs
To set up each Axis Network Camera, follow the steps outlined in the MJPEG Camera section. The
BrightAuthor presentation will require both the RTSP and MJPEG source for each camera. The
following steps explain how to find them.
Note
In order to find the URLs for both video streams, you will need to use the “developer” tools offered by
Google Chrome or Mozilla Firefox.
Repeat the following steps for each Axis Network Camera you plan to use in your monitoring network.
1. Navigate to the configuration page of your Axis Network Camera (see the beginning of
the Camera Setup section if you forget how to reach this page).
2. Click the Live View tab located on the top right of the screen of the Axis Network Camera
configuration page.
3. Select the Stream Profile dropdown menu in the upper-left side of the screen.
4. First, select the “H.264” option:
a. Right-click the video pane at the center of the screen.
b. Select Inspect Element. You should see a separate screen that outlines the HTML
code of the Live View page. The video element should already be selected for you.
c. Copy the URL between the quote marks after qtsrc=. This is the URL for the RTSP
video stream. Remember that the address for your camera will most likely be different
from the address in the above screenshot.
5. Select the Stream Profile dropdown menu again.
6. Change the option to “mjpeg” (this is the profile you created while setting up the camera):
a. Right-click the video pane at the center of the screen.
b. Select Inspect Element. You should see a separate screen that outlines the HTML
code of the Live View page. The video element should already be selected for you.
23
c. Copy the URL between the quote marks after rsc=. This is the URL for the MJPEG
video stream. Remember that the address for your camera will most likely be different
from the address in the above screenshot.
d. You will have to append the IP address of the camera to the front of this URL. For
example, if the IP address of your camera is 192.168.1.13 (as in the MJPEG Setup
example), then the complete URL will be the following :
http://192.168.1.13/mjpg/video.mjpg?streamprofile=mjpeg
Configuring the Images Zone
Once you have the RTSP and MJPEG URLs for each Axis Network Camera, you will now be able to
create your BrightAuthor presentation:
Note
The BP200 and BP900 devices connect to a BrightSign player through USB. Therefore, you must
have the HD1020, XD1030, or XD1230 in order to create this presentation.
1. Start a new presentation in BrightAuthor for your networked BrightSign player.
2. Create a Video Only zone and an Images zone.
a. Expand the Video Only zone so that it covers the entire area.
b. Define the width of the Images zone as 160 and the height as 120.
3. Navigate to the Edit > Playlist tab.
4. Select the Images zone.
5. Create an Event Handler state and make it the home screen.
6. Create as many Mjpeg Stream states as you have Axis Network Cameras (in this example, there
are four).
Hint
Giving each camera a number, and naming the Mjpeg Stream events according to these numbers,
will help you keep track the cameras while linking them across zones.
24
7. Enter each Mjpeg URL into each corresponding state.
8. Create a new BP200A Event for the Event Handler state.
a. Set the button number to 3.
b. Set the event to transition to the first Mjpeg Stream state.
9. Create a new BP200A event for each of the Mjpeg Stream states. Do the following for each:
a. Set the button number to 3.
b. Set the event to transition to the Event Handler state. This setup will allow the user to turn
the picture-in-picture on and off at will by pressing 3 on the button board.
25
10. Create another new BP200A event for each of the Mjpeg Stream states.
a. Set the button number to 1.
b. Set the event to transition to the next Mjpeg Stream state. For example, the button event on
Stream 2 transitions to Stream 3, and Stream 4 (the last stream) transitions back to Stream
1 (the first stream).
11. Create a third new BP200A event for each of the Mjpeg Stream states.
a. Set the button number to 4.
b. Set the event to transition to the previous Mjpeg Stream state. For example, the button
event on Stream 2 transitions to Stream 1, and Stream 1 (the first stream) transitions to
Stream 4 (the last stream).
12. Create a fourth new BP200A event for each of the Mjpeg Stream states.
a. Set the button number to 2.
b. Set the event to remain on the current state.
c. Click the Add Command button located at the bottom of the window and choose Send
Zone Message from the dropdown menu. You can set the Parameters to whatever you
would like, but it will be easier to keep track of each Zone Message by including the
number of the Mjpeg Stream state to which it is attached (for example, the BP200A Event
attached to MJPEG Stream 2 could send a Zone Message with the parameters “Stream2”).
Viewers can now cycle backward and forward through the picture-in-picture streams using the left (1)
and right (4) BP buttons. They can also toggle between showing and hiding the picture-in-picture
using the down (3) button. Finally, they can use the up (4) button to take the small picture-in-picture
video zone and make it full screen. The next section outlines setting up the full screen video zone.
26
Configuring the Video Only Zone
Switch to the Video Only zone to create the full-screen portion of this presentation.
1. Create as many Video Stream states as you have Axis Network Cameras. Naming and
numbering these states similarly to the Mjpeg Stream states will make linking them easier. For
example, Video Stream 2 and Mjpeg Stream 2 will each use a URL you retrieved from the
same camera configuration page.
2. Enter each RTSP URL into each corresponding state.
3. For each Video Stream state, complete the following steps:
a. Drag and drop a Zone Message event onto the Video Stream state.
b. Set the event to transition to another Video Stream. In the Specify zone message field,
enter the parameter that you created for the Send Zone Message command you
created for the Mjpeg Stream state that corresponds to this Video Stream state.
Example
Notice in the above screenshot that the Zone Message Event is changing the state from RTSP
Stream 2 to RTSP Stream 4, and that this event occurs when the zone message “Stream4” is sent
from the Images zone. Therefore, the order of events is Mjpeg Stream 4>zone message “Stream4” >
Video Stream 4.
In other words, if the picture-in-picture is showing Mjpeg Stream 4, and the full screen is showing
RTSP Stream 2, then pressing the up (2) button on the BP200A will cause the full screen to change
to RTSP Stream 4, which is simply a higher quality video stream (H.264 vs. motion jpeg) from the
same camera.
27
4. Create a new Zone Message event for each other Video Stream in the Video Only zone. If you
have four Video Streams in total, for example, you will need to create three Zone Message
events for the state.
5. Remember to repeat this process for each Video Stream state you control. This will allow
viewers to switch from any stream to any other stream via button press.
28
APPENDIX OF SCREENSHOTS
The following is a comprehensive list of screen shots of all configuration pages for the Axis
M1103/M1113 Network Camera (excluding those shown in the sections above):
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
Download PDF

advertising