Project

General

Profile

1
<?xml version="1.0" encoding="UTF-8"?>
2
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
3
      
4
<html  xmlns:vml="urn:schemas-microsoft-com:vml" 
5
  xmlns:svg="http://www.w3.org/2000/svg" 
6
  xmlns:xlink="http://www.w3.org/1999/xlink"
7
  xmlns="http://www.w3.org/1999/xhtml" >
8
  <head>
9
    <title>Mapbuilder Flickr Live Feed Viewer</title>
10
    <link rel='StyleSheet' type='text/css' href='../../lib/skin/default/demoStyles.css'/>
11
		<link rel='StyleSheet' type='text/css' href='../../lib/skin/default/mapStyle.css'>
12
    <script>
13
    // URL of Mapbuilder configuration file.
14
     var mbConfigUrl='./flickrconfig.xml';   
15
      var OLbubbleImageDir="../../lib/util/overlibmws"; 
16
    </script>
17
    <!-- This points to the core mapbuilder library, replaces this with MapbuilderCompressed.js when you want to use the compressed version -->
18
    <script type="text/javascript" src="../../lib/Mapbuilder.js"></script>
19
  </head>
20
  <!-- This onload event starts mapbuilder -->
21
  <body onload="mbDoLoad()" >
22
	  <div id="header">  	<!-- The header of the page -->
23
            <h1><a href="http://communitymapbuilder.org">MapBuilder</a> <!--Version-->1.5-rc2<!--VersionEnd--> Flickr Live Feed Viewer</h1>
24
            <!-- The version tag will be inserted into the comment tags above
25
            during the build process. -->
26
	  </div><!-- /header -->
27
  	<div id="middle"><!-- The center piece of the page with left menubar and right mainbody -->
28
	    	    <div id="exampleList"></div><!-- this is the container where the menubar will be drawn -->
29
			<div id="mainbody"><!-- right side of the middle div, is also divided into two areas -->
30
			  <div class="left">
31
				  <h3>Explanation</h3>
32
					Flickr Demo using the <a href="http://www.flickr.com/photos/15435549@N00/" >Community MapBuilder</a> Flickr 
33
			    <a href="http://www.flickr.com/services/feeds/photos_public.gne?id=15435549@N00&format=rss2">Feed</a><br/>
34
     			Note: Requires Server/proxy support to access Flickr (Assuming it is up).  It takes a few minutes to load the pictures from Flickr...<br/>
35
     			The demo uses a custom widget (FlickRest2Wfs) with a complex XSL stylesheet. It first parses the list of pictures from the Flick REST api, then fetches the detailled description of each picture, and outputs it all into a WFS FeatureCollection. The resulting feature collection is displayed on the map and as a list with picture thumbnails below. The list is connected to the map, so when the mouse is over a list entry, the according point will be highlighted on the map. <br/>
36
				The SLD file for this demo uses an OpenLayers extension to the ExternalGraphic element, which allows us to show thumbnails of the images with urls from a feature attribute.<br/>
37
     			<b>Note</b> This example does not use the new GeoRSS feature of Flickr, because our Mapbuilder images are not tagged in a way that allows the Flickr GeoRSS processor to determine the positions.
38
		    </div><!-- /left -->
39
		  	<div class="right">
40
		  	  <div id="rssRendererTip"></div>
41
		  	  <div id="mainMapPane">
42
			  	  <noscript>
43
      			  this page requires Javascript to be enabled
44
			      </noscript>
45
			    </div><!-- /mainMapPane -->
46
          <!--div id="loading">
47
			      <p>Loading Program<br/>
48
      				<img src="../../lib/skin/default/images/Loading.gif"/>
49
			      </p>
50
			    </div-->
51
			    <table>
52
			    	<tr><td id="mainButtonBar" style="width: 120px"></td>
53
		          <td align="right" id="cursorTrack"></td>
54
		      	</tr>
55
       	  </table>
56
        	<div id="eventsListing"></div>
57
	     	</div><!-- /right -->
58
			</div><!-- /mainbody -->
59
		</div><!-- /middle -->
60
  	<div id="footer"><!-- The footer of the page -->
61
	  	<div class="right">
62
				<a href="http://communitymapbuilder.org/" title="powered by community mapbuilder"><img src="../../lib/skin/default/images/Icon.gif"/></a>	  	
63
				<a href="https://www.osgeo.org/" title="member of OSgeo"><img src="../../lib/skin/default/images/Osgeo.png"/></a>
64
      </div><!-- /right -->
65
	  </div><!-- /footer -->
66
	</body>
67
</html>
(9-9/13)