source: extensions/rv_gmaps/trunk/template/map.tpl @ 12700

Last change on this file since 12700 was 12700, checked in by rvelices, 12 years ago

rv_gmaps towards full maps api v3 migration

  • Property svn:eol-style set to LF
File size: 8.0 KB
RevLine 
[12698]1<!DOCTYPE html>
[3447]2<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
3<head>
4<meta http-equiv="content-type" content="text/html; charset={$CONTENT_ENCODING}" />
[12698]5<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
[3447]6<meta name="robots" content="noindex,nofollow" />
7<title>{$GALLERY_TITLE}</title>
[8304]8
[12698]9<script src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;language={$lang_info.code}" type="text/javascript"></script>
[8304]10
[12367]11{combine_script id='jquery' load='header' path='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js'}
[8304]12{combine_script id='jquery.nyroModal' load='async' path="`$PLUGIN_LOCATION`/template/nyroModal/jquery.nyroModal-1.6.2.js" version='1.6.2'}
13{combine_css path="`$PLUGIN_LOCATION`/template/style.css" version=$RVM_PLUGIN_VERSION}
14{combine_css path="`$PLUGIN_LOCATION`/template/nyroModal/nyroModal.css" version=$RVM_PLUGIN_VERSION}
15
16{combine_script id='rvm.dl' load='header' path="`$PLUGIN_LOCATION`/template/data_loader.js" version=$RVM_PLUGIN_VERSION}
17{combine_script id='rvm.dh' load='header' path="`$PLUGIN_LOCATION`/template/data_handler.js" version=$RVM_PLUGIN_VERSION}
18{combine_script id='rvm.pl' load='header' path="`$PLUGIN_LOCATION`/template/page_linker.js" version=$RVM_PLUGIN_VERSION}
19{combine_script id='core.scripts' load='header' path='themes/default/js/scripts.js'}
20
21{get_combined_css}
22{get_combined_scripts load='header'}
23
[3447]24<!--[if IE]>
25<style type="text/css">
26v\:* {ldelim}
27  behavior:url(#default#VML);
28}
29</style>
30<![endif]-->
31<!--[if lt IE 7]>
32<style type="text/css">
33        #map {ldelim} position:auto; height: 100%; }
34</style>
35<![endif]-->
36
[8039]37
38
[3447]39<script type="text/javascript">{literal}
40//<![CDATA[
41var map;
42var geocoder;
43
44document.is_debug = false;
45if ( document.location.search.match(/[\?&]debug/) ) {
[5018]46        document.is_debug = true;
47        document._window = window;
[3447]48}
[12698]49
50function glog(msg) {
51        if (console)
52        {
53                console.debug(msg + " b="+map.getBounds().toUrlValue() + " c="+map.getCenter().toUrlValue() + " z="+map.getZoom() );
54        }
55}
56
[3447]57function load()
58{
[12698]59        var mapOptions = {
60                mapTypeId: google.maps.MapTypeId.ROADMAP,
[12700]61                overviewMapControl: true,
62                overviewMapControlOptions: {opened: true}
[12698]63        }
[3447]64
[12700]65        if (!PageLinker.url2Map(mapOptions))
[3447]66        {
67{/literal}
68                {if isset($initial_bounds)}
[12698]69                mapOptions.iniBounds = new google.maps.LatLngBounds( new google.maps.LatLng({$initial_bounds.s},{$initial_bounds.w}), new google.maps.LatLng({$initial_bounds.n},{$initial_bounds.e}) );
70                mapOptions.center = mapOptions.iniBounds.getCenter();
71                {else}
72                        mapOptions.center = new google.maps.LatLng(0,0);
73                        mapOptions.zoom = 2;
[3447]74                {/if}
75{literal}
[5018]76        }
[3447]77
[12698]78        map = new google.maps.Map( document.getElementById("map"), mapOptions );
79       
80        if (mapOptions.iniBounds)
81                map.fitBounds(mapOptions.iniBounds);
82
83        if (document.is_debug)
84        {
85                google.maps.event.addListener(map, "idle", function() { glog("idle"); });
86                google.maps.event.addListener(map, "bounds_changed", function() { glog("bounds_changed");} );
87                google.maps.event.addListener(map, "center_changed", function() { glog("center_changed");} );
88                google.maps.event.addListener(map, "maptypeid_changed", function() { glog("maptypeid_changed");} );
89                google.maps.event.addListener(map, "zoom_changed", function() { glog("zoom_changed");} );
90                google.maps.event.addListener(map, "drag", function() { glog("drag");} );
[5018]91        }
92
[12698]93        pwgPageLinker = new PageLinker(map, "aLinkToThisPage" );
[5018]94
[12698]95        var pwgMarkerOptions = (function(){ {/literal}{$MAP_MARKER_ICON_JS}{literal} }).call(null);
[3447]96
[12698]97        map.pwgDataLoader = new PwgDataLoader(map, {rectangle_of_confusion: pwgMarkerOptions.roc} );
98        google.maps.event.addListener(map.pwgDataLoader, "dataloading", function() {
[3447]99                var pre = '<img src="{/literal}{$PLUGIN_ROOT_URL}{literal}/icons/progress_s.gif" width="16" height="16" alt="~" /> ';
100                document.getElementById("dataLoadStatus").innerHTML = pre + Localization.get("Loading");
101                }
102        );
103 
[12698]104        google.maps.event.addListener(map.pwgDataLoader, "dataloadfailed", function(responseCode) {
[3447]105                document.getElementById("dataLoadStatus").innerHTML = Localization.get("Failed") + " "+responseCode;
106                }
107                );
108
[12700]109        map.pwgDataHandler = new PwgDataHandler(map, {markerOptions: pwgMarkerOptions, show_all_img_src: "{/literal}{$PLUGIN_ROOT_URL}{literal}/icons/pic_s.gif" } );
[12698]110        google.maps.event.addListener(map.pwgDataLoader, "dataloaded", pwgBind(map.pwgDataHandler, map.pwgDataHandler.handle) );
[3447]111
112        map.pwgDataLoader.start( "{/literal}{$U_MAP_DATA}{literal}" );
113}
114
115function unload()
116{
117        if (map)
118        {
119                !map.pwgDataLoader || map.pwgDataLoader.terminate();
120                !map.pwgDataHandler || map.pwgDataHandler.terminate();
121        }
122}
123
124function searchLocation(q)
125{
126        if (!q.length) return false;
127        if (!geocoder)
[12698]128                geocoder = new google.maps.Geocoder();
129        geocoder.geocode(q, function(results, status) {
130                document._geoResponse = results;
131                if ( status == google.maps.GeocoderStatus.OK )
[5018]132                {
[12698]133                        map.fitBounds( results[0].geometry.viewport );
[5018]134                }
[12698]135          else
136                        alert("This address has not been found\nCode: "+status);
137        });
[3447]138        return false;
139}
140
141
142var Localization =
143{
144  _strings: {
145{/literal}
146"go to %s": "{'go to %s'|@translate|@escape:javascript}",
147"Next": "{'Next'|@translate|@escape:javascript}",
148"Prev": "{'Prev'|@translate|@escape:javascript}",
149"out of %d": "{'out of %d'|@translate|@escape:javascript}",
150"Loading": "{'Loading'|@translate|@escape:javascript}",
151"Failed": "{'Failed'|@translate|@escape:javascript}",
152"Show all": "{'Show all'|@translate|@escape:javascript}",
[8724]153"show all photos around this location": "{'show all photos around this location'|@translate|@escape:javascript}",
[3447]154"displays %s on a map" : "{'displays %s on a map'|@translate|@escape:javascript}",
155"opens %s in Google Earth" : "{'opens %s in Google Earth'|@translate|@escape:javascript}",
[8666]156"%d photos" : "{'%d photos'|@translate|@escape:javascript}",
[3447]157{literal}
158dontMindTheComma: ""
159    },
160
161  get: function( str ) {
162                var lang_str = this._strings[str];
163                if (lang_str == undefined)
164                {
[6609]165                        if (document.is_debug) google.maps.Log.write("Language string undefined '"+ str+"'");
[3447]166                        return str;
167                }
168                return lang_str;
169        },
170
171  getQ: function( str ) {
172                return '"'+this.get(str)+'"';
173        },
174
175  fmt1: function () {
[8039]176                var str = arguments[0];
[3447]177                str = this.get(str);
[8039]178                str = str.replace( '%s', "%" ).replace( '%d', "%" ).replace('%', arguments[1]);
179                return str;
180               
[3447]181        }
182}
183{/literal}
184//]]>
185</script>
186</head>
187
188<body onload="load()" onunload="unload()">
189
190<div id="titlebar">
191  <div class="titlebar_links" >
192    <span id="dataLoadStatus"></span>
193    <a id="aKml" href="" type="application/vnd.google-earth.kml+xml" class="gmnoprint"><img src="http://maps.google.com/mapfiles/ms/view_as_kml.png" width="16" height="16" alt="kml" /> <span>KML</span></a>
194    <a id="aLinkToThisPage" href="" class="gmnoprint"><img src="http://maps.google.com/mapfiles/bar_icon_link.gif" alt="&lt;-&gt;" width="16" height="16" /> <span>{'Link to this page'|@translate}</span></a>
[8724]195    <a id="aBlowup" href="" onclick="return PwgDataHandler.blowupUrl(this.href);" class="gmnoprint" title="{'show all photos around this location'|@translate}">
196                        <img src="{$PLUGIN_ROOT_URL}/icons/pic_s.gif" alt="" title="{'show all photos around this location'|@translate}" />
[3447]197                        <span>{'Show all'|@translate}</span>
198                </a>
199    <span class="gmnoprint">
200                        <form action="#" onsubmit="if (this.q.value!='' &amp;&amp; this.q.value!='{'Search a location...'|@translate|@escape:javascript}') searchLocation(this.q.value);return false;">
201                                <input type="text" size="32" name="q"
202                                        value="{'Search a location...'|@translate}"
203                                        onfocus="if (value=='{'Search a location...'|@translate|@escape:javascript}') value='';"
204                                        onblur="if (value=='') value='{'Search a location...'|@translate|@escape:javascript}'" />
205                                <input type="submit" value="{'Search'|@translate}"/>
206                        </form>
207                </span>
208  </div>
209  <div class="titlebar_title">
[8636]210    <a href="{$U_HOME}" class="gmnoprint">{'Home'|@translate}</a>
[8724]211    <a href="{$U_HOME_MAP}" title="{'displays all photos on a map'|@translate}"><img src="{$PLUGIN_ROOT_URL}/icons/map_sw.gif" width="32" height="17" alt="map"/></a>
[3447]212    {'Viewing'|@translate}: <a id="aPageUrl" href=""></a>
213  </div>
214</div>
215
216<div id="map"> </div>
217</body>
[8304]218{get_combined_scripts load='footer'}
[3447]219</html>
Note: See TracBrowser for help on using the repository browser.