Publishing pictures on your website

I would like to publish pictures from EYE-02 or EyeSee camera on website. How can I do this?

You can use Web camera to publish your pictures. Web camera is one of JabloTool services. It uses URL link to publish pictures of events which camera reported to the Cloud storage. JabloTool will show you the link when you activate Web camera. You will embed camera pictures into your website via this link.

Web camera is useful in a number of situations. You can show your clients the current state of construction site, free parking lots in front of your shop, traffic situation, current weather or the length of a queue.

Please note that publishing of camera pictures can be regulated by national legislation. Make sure you do not breach the law of your country.

Switch Web camera ON

First, switch Web camera ON and obtain the URL link. Follow these steps:

  1. Connect to the camera in JabloTool,
  2. Select Settings, Change Data plan,
  3. Activate.Cloud

  4. a new window will appear. Select the first or second option, camera will start reporting events to JabloTool Cloud storage.
  5. Select Reporting on the top of the page, scroll down to Web camera.
  6. Switch Web camera ON. JabloTool will show URL link (see picture below).
  7. Activate Cloud

  8. Copy this link, you will use it later.
  9. You can activate Secure camera and protect the published pictures. Tick the option on the picture above and choose your user name and password. Next time browser will always ask you to fill in this user name and password before you see the picture.

Secure.Camera

Insert current picture into your web

Now, we will work with the URL picture link which we saved in the previous chapter (in step 6). Your link will look approximately as follows:

https://www.jablotool.com/webcameraIXCUJTK1AZ/1/

The link contains three variable parts:

https:// It is secured communication protocol so no other person can wiretap the flow of data.
You can also use an open protocol http:// simply by deleting the “s” letter. But we do not recommend it – even when you protect your pictures by the Secure Web camera your login name and password will be sent without encryption.
IXCUJTK1AZ/ It is a hash (sequence of characters) which uniquely identifies your camera. By this hash, the server will recognize which account you request the picture from.
1/ It is index number. It stands for the position of the picture which you request. Number 1 marks the most recent picture. So anytime the Web camera will publish the last picture which arrived to the Cloud storage. Number 2 indicates the previous picture, and so on.
As you can see we can easily use this parameter to go through pictures.

If you wish to insert always the newest picture available, the HTML code for your website will be:

<img src="https://www.jablotool.com/webcamera/JVG5LYMVK7/1/" name="eye02photo">

If you wish to insert two newest pictures available, your HTML code for your website will look the following way. Please note that particular links differ only in their index number.

<img src="https://www.jablotool.com/webcamera/JVG5LYMVK7/1/" name="eye02photo">
<img src="https://www.jablotool.com/webcamera/JVG5LYMVK7/2/" name="eye02photo">

Now you know how to implement images from Web camera into your website. It is time to see the pictures. Simply open your browser and go to your website. You will see the pictures. If you activated the Secure Web camera (step 7 above) the browser will prompt you to enter your user name and password first.

Setting of messages sent from the camera

At this moment, you can already see recent camera pictures in your website. Now you have to consider which pictures you wish to publish. All of them? Some of them? Or do you wish to update the picture for example twice a day only?

A model situation will show you the way of setting the camera so that it meets your expectations. Each report with picture which camera sends to the Cloud storage means a new picture published by the Web camera.

Case study: Regular reports

Assignment: You use your camera as a security and monitoring device. During the day, the camera is in „SLEEP“ mode, in the evening and at night it guards in the „WATCH“ mode. You have set camera, its detectors and your reports (MMS, e-mail) and you are satisfied with it.

Now you wish to have on your website a regularly updated picture showing the progress on your construction site. Let us say new picture every four hours is what you need. You are not interested in receiving these “web update” pictures on you mobile phone and in your e-mail.

Solution: This example can help you in the majority of situations. We will demonstrate the way of setting the camera using JabloTool. Now we assume that we are logged into our JabloTool account and connected to the camera.

  1. Choose the Reporting tab. Here, you will find the block marked „Periodical reports“. In the item „Period“, set the time how often the picture should be sent. On other words, how often you wish to update this picture on your web. In our case we choose „Every 4 hour(s)“. In the item „From“ you set the time when reporting should begin. We enter for example 16:00. So, the picture will be updated every day at 16:00, 20:00, 00:00, 04:00, 08:00 and 12:00.
  2. Periodical.reports

  3. As you are still on the Reporting tab in JabloTool, choose Advanced, Reported events and click on Others. A list of lines will unfold. On the last line you will see Periodical report. You select here how you wish to be informed about periodical reports. If you wish to send the reports only to the Cloud storage you will unselect all the fields on the line Periodical report (see picture below). Periodical reports will now be sent to the Cloud storage but you will not be disturbed by them in your phone and e-mail box.
  4. Reported.events

  5. Now click on „Save changes“. This makes the settings for our solution finished.

Your camera will now be publishing pictures from periodical reports every 4 hours. Web camera will also publish pictures from alarms because camera will also send them to the Cloud storage.

11. 7. 2014 EYE-02 EyeSee