LBS Quickstart: Images, Video and Sound

Scan this marker with
junaio to see what you are
getting in this tutorial.

    What should you have done by now?

    Georeference POI
    Click on POI
    See fullscreen image
    See fullscreen video
    1. You should have followed the "Hello World" – Tutorial
    2. You should have made yourself familiar with the PHP Helper Library. This is the last Tutorial where plain XML is described additionally to the Helper Library commands ;-)
    3. Download the PHP Helper Library if you have not done so yet

    What will you learn?

    Scan the QR Code on the right with junaio to see what you are getting.

    • Working with the PHP Helper Library
    • Creating multiple geo located POIs
    • Link movies, image and sounds to your POI

    Download

    Get started

    1. This Tutorial is based on your knowledge of the "Hello World" – Tutorial. We want to start with explaining the PHP Helper Library and what happens.

      The request will go through the index.php as seen in the previous Tutorial where the search.php from the src folder is included. In your search.php, write the following lines (you can remove anything else if there is something there):

    require_once '../library/poibuilder.class.php';

//get the position of the user
if(!empty($_GET['l']))
$position = explode(",", $_GET['l']);

//use the poiBuilder class
$jPoiBuilder = new JunaioBuilder($position, MAX_DISTANCE);

    1. The current user’s position is taken into account (see pois/search request) as well as a maximum distance in meters that shall be considered (define this in the config.php).
      Only the POIs being within MAX_DISTANCE to the current user’s position will be returned from your server.

    define('MAX_DISTANCE', 5000);
    1. Add the start command next. This will send the xml definition back to the junaio server as well start the output buffer streaming on your server.
    //create the xml start
$jPoiBuilder->start();
    1. We will add three POIs, one holding the path to an image, one with a video and a last one holding a MP3 Sound.
      You can see that the POIs have very similar structure with the Helper Library, so you just need to change the method name according to the POI you want to create, the file that is referenced and the ID (we also change the position slightly). Make sure that each POI has a unique ID, otherwise it will be overwritten.
      Also note, the $poi variable is overwritten everytime a new POI is defined. Since the POI is send off to junaio when the $jPoiBuilder->outputPOI($poi); - Command is called, after this line we do not need the previous $poi anymore.
    //create the xml start
$jPoiBuilder->start();

We will add three POIs, one holding the path to an image, one with a video and a last one holding a MP3 Sound.

//the image POI:
$poi = new SinglePOI();
$poi = $jPoiBuilder->createImageLocationBasedPOI(
	"Hello Image POI", //name
	"48.12310,11.218648,0", //position
	"http://farm5.static.flickr.com/4104/5206110815_7ea891be0b.jpg", //image Link 
	"My image POI\n\nSource: http://www.flickr.com/photos/ediamjunaio/5206110815/", //description
	"http://www.junaio.com/publisherDownload/tutorial/icon_map.png", //icon
	"http://www.junaio.com/publisherDownload/tutorial/thumb.jpg", //thumbnail 
	"image1", //id
	"true" //allow routing
);
$jPoiBuilder->outputPOI($poi);

//video POI
$poi = new SinglePOI();
$poi = $jPoiBuilder->createVideoLocationBasedPOI(
	"Hello Movie POI", //name
	"48.12325,11.218691,0", //position
	"http://www.junaio.com/publisherDownload/tutorial/movie.mp4", //image Link 
	"My video POI", //description
	"http://www.junaio.com/publisherDownload/tutorial/icon_map.png", //icon
	"http://www.junaio.com/publisherDownload/tutorial/thumb.jpg", //thumbnail 
	"video1", //id
	"true" //allow routing
);
									
$jPoiBuilder->outputPOI($poi);

//sound POI
$poi = new SinglePOI();
$poi = $jPoiBuilder->createSoundLocationBasedPOI(
	"Hello Sound POI", //name
	"48.12307,11.218636,0", //position
	"http://www.junaio.com/publisherDownload/tutorial/test.mp3", //image Link 
	"My sound POI", //description
	"http://www.junaio.com/publisherDownload/tutorial/icon_map.png", //icon
	"http://www.junaio.com/publisherDownload/tutorial/thumb.jpg", //thumbnail 
	"sound1", //id
	"true" //allow routing
);
									
$jPoiBuilder->outputPOI($poi);
    1. After the last POI has been returned to junaio, the output has to be declared as finished. This command will end the XML declaration and close the output buffer (streaming).
      The exit command is not mandatory, it just avoids possible white characters behind the output which will cause an error.
    $jPoiBuilder->end();
exit;
    1. When you have created the channel and validate it, of course make sure you have added your API key to the config.php, but also that you validate your channel at a position close to what you have stated here. With the maxdistance define, your pois/search return will be empty if your validation position is more than 5000m away from the POIs.

      FYI: This is the plain XML output that will be generated by the PHP Helper library:
    <?xml version="1.0" encoding="UTF-8"?>
<results>
	<poi id="image1" interactionfeedback="none">
		<name>
			<![CDATA[Hello Image POI]]>
		</name>
		<description>
			<![CDATA[My image POI]]>
		</description>
		<l>48.12310,11.218648,0</l>
		<o>0,0,0</o>
		<mime-type>image/jpeg</mime-type>
		<mainresource>
			<![CDATA[http://farm5.static.flickr.com/4104/5206110815_7ea891be0b.jpg]]>
		</mainresource>
		<thumbnail>http://www.junaio.com/publisherDownload/tutorial/thumb.jpg</thumbnail>
		<icon>http://www.junaio.com/publisherDownload/tutorial/icon_map.png</icon>
		<route>true</route>
	</poi>
	<poi id="video1" interactionfeedback="none">
		<name>
			<![CDATA[Hello Video POI]]>
		</name>
		<description>
			<![CDATA[My video POI]]>
		</description>
		<l>48.12325,11.218691,0</l>
		<o>0,0,0</o>
		<mime-type>video/mp4</mime-type>
		<mainresource>
			<![CDATA[http://www.junaio.com/publisherDownload/tutorial/movie.mp4]]>
		</mainresource>
		<thumbnail>http://www.junaio.com/publisherDownload/tutorial/thumb.jpg</thumbnail>
		<icon>http://www.junaio.com/publisherDownload/tutorial/icon_map.png</icon>
		<route>true</route>
	</poi>
	<poi id="sound1" interactionfeedback="none">
		<name>
			<![CDATA[Hello Sound POI]]>
		</name>
		<description>
			<![CDATA[My sound POI]]>
		</description>
		<l>48.12307,11.218636,0</l>
		<o>0,0,0</o>
		<mime-type>audio/mp3</mime-type>
		<mainresource>
			<![CDATA[http://www.junaio.com/publisherDownload/tutorial/test.mp3]]>
		</mainresource>
		<thumbnail>http://www.junaio.com/publisherDownload/tutorial/thumb.jpg</thumbnail>
		<icon>http://www.junaio.com/publisherDownload/tutorial/icon_map.png</icon>
		<route>true</route>
	</poi>	
</results>
    © metaio Inc. 2013