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

Last change on this file since 17323 was 14181, checked in by rvelices, 13 years ago

rv_gmaps - small template updates
  • Property svn:eol-style set to LF
File size: 7.4 KB
Line 
1<!DOCTYPE html>
2<html>
3<head>
4<meta http-equiv="content-type" content="text/html; charset={$CONTENT_ENCODING}" />
5<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
6<meta name="robots" content="noindex,nofollow" />
7<title>{$GALLERY_TITLE}</title>
8
9<script src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;language={$lang_info.code}&amp;libraries=places" type="text/javascript"></script>
10{combine_script id='jquery' load='header' path='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'}
11{combine_script id='jquery.nyroModal' load='async' path="`$PLUGIN_LOCATION`/template/nyroModal/jquery.nyroModal-1.6.2.js" version='1.6.2'}
12{combine_css path="`$PLUGIN_LOCATION`/template/style.css" version=$RVM_PLUGIN_VERSION}
13{combine_css path="`$PLUGIN_LOCATION`/template/nyroModal/nyroModal.css" version=$RVM_PLUGIN_VERSION}
14{combine_script id='rvm.dl' load='header' path="`$PLUGIN_LOCATION`/template/data_loader.js" version=$RVM_PLUGIN_VERSION}
15{combine_script id='rvm.dh' load='header' path="`$PLUGIN_LOCATION`/template/data_handler.js" version=$RVM_PLUGIN_VERSION}
16{combine_script id='rvm.pl' load='header' path="`$PLUGIN_LOCATION`/template/page_linker.js" version=$RVM_PLUGIN_VERSION}
17{combine_script id='rvm.st' load='header' path="`$PLUGIN_LOCATION`/template/styler.js" version=$RVM_PLUGIN_VERSION}
18{combine_script id='core.scripts' load='header' path='themes/default/js/scripts.js'}
19{get_combined_css}
20{get_combined_scripts load='header'}
21<!--[if lt IE 7]>
22<style type="text/css">
23        #map {ldelim} position:auto; height: 100%; }
24</style>
25<![endif]-->
26
27<script type="text/javascript">{literal}
28//<![CDATA[
29var map;
30
31document.is_debug = false;
32if ( document.location.search.match(/[\?&]debug/) ) {
33        document.is_debug = true;
34}
35
36function glog(msg) {
37        if (console)
38        {
39                var b = map.getBounds();
40                if (b)
41                        console.log(msg + " b="+b.toUrlValue() + " c="+map.getCenter().toUrlValue() + " z="+map.getZoom() );
42                else
43                        console.log(msg);
44        }
45}
46
47function load()
48{
49        var mapOptions = {
50                mapTypeId: google.maps.MapTypeId.ROADMAP,
51                overviewMapControl: true,
52                overviewMapControlOptions: {opened: true}
53        }
54
55        if (!PageLinker.url2Map(mapOptions))
56        {
57{/literal}
58                {if isset($initial_bounds)}
59                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}) );
60                mapOptions.center = mapOptions.iniBounds.getCenter();
61                {else}
62                        mapOptions.center = new google.maps.LatLng(0,0);
63                        mapOptions.zoom = 2;
64                {/if}
65{literal}
66        }
67
68        map = new google.maps.Map( document.getElementById("map"), mapOptions );
69       
70        if (mapOptions.iniBounds)
71                map.fitBounds(mapOptions.iniBounds);
72
73        if (document.is_debug)
74        {
75                google.maps.event.addListener(map, "idle", function() { glog("idle"); });
76                google.maps.event.addListener(map, "bounds_changed", function() { glog("bounds_changed");} );
77                google.maps.event.addListener(map, "center_changed", function() { glog("center_changed");} );
78                google.maps.event.addListener(map, "maptypeid_changed", function() { glog("maptypeid_changed");} );
79                google.maps.event.addListener(map, "zoom_changed", function() { glog("zoom_changed");} );
80                google.maps.event.addListener(map, "drag", function() { glog("drag");} );
81        }
82
83        pwgPageLinker = new PageLinker(map, "aLinkToThisPage" );
84
85        var pwgStyler = {/literal}{$MAP_MARKER_ICON_JS}{literal};
86
87        map.pwgDataLoader = new PwgDataLoader(map, {rectangle_of_confusion: pwgStyler.roc} );
88        google.maps.event.addListener(map.pwgDataLoader, "dataloading", function() {
89                var pre = '<img src="{/literal}{$PLUGIN_ROOT_URL}{literal}/icons/progress_s.gif" width="16" height="16" alt="~"> ';
90                document.getElementById("dataLoadStatus").innerHTML = pre + Localization.get("Loading");
91                }
92        );
93 
94        google.maps.event.addListener(map.pwgDataLoader, "dataloadfailed", function(responseCode) {
95                document.getElementById("dataLoadStatus").innerHTML = Localization.get("Failed") + " "+responseCode;
96                }
97                );
98
99        map.pwgDataHandler = new PwgDataHandler(map, {styler: pwgStyler, show_all_img_src: "{/literal}{$PLUGIN_ROOT_URL}{literal}/icons/pic_s.gif" } );
100        google.maps.event.addListener(map.pwgDataLoader, "dataloaded", pwgBind(map.pwgDataHandler, map.pwgDataHandler.handle) );
101
102        map.pwgDataLoader.start( "{/literal}{$U_MAP_DATA}{literal}" );
103       
104        var ac = new google.maps.places.Autocomplete( document.getElementById('q') );
105        ac.bindTo('bounds', map);
106        google.maps.event.addListener(ac, 'place_changed', function() {
107                var place = ac.getPlace();
108                if (place.geometry.viewport) {
109                        map.fitBounds(place.geometry.viewport);
110                } else {
111                        map.setCenter(place.geometry.location);
112                        map.setZoom(17);  // Why 17? Because it looks good.
113                }
114        } );
115}
116
117function unload()
118{
119        if (map)
120        {
121                !map.pwgDataLoader || map.pwgDataLoader.terminate();
122                !map.pwgDataHandler || map.pwgDataHandler.terminate();
123        }
124}
125
126
127var Localization =
128{
129  _strings: {
130{/literal}
131"go to %s": "{'go to %s'|@translate|@escape:javascript}",
132"Next": "{'Next'|@translate|@escape:javascript}",
133"Prev": "{'Prev'|@translate|@escape:javascript}",
134"out of %d": "{'out of %d'|@translate|@escape:javascript}",
135"Loading": "{'Loading'|@translate|@escape:javascript}",
136"Failed": "{'Failed'|@translate|@escape:javascript}",
137"Show all": "{'Show all'|@translate|@escape:javascript}",
138"show all photos around this location": "{'show all photos around this location'|@translate|@escape:javascript}",
139"displays %s on a map" : "{'displays %s on a map'|@translate|@escape:javascript}",
140"opens %s in Google Earth" : "{'opens %s in Google Earth'|@translate|@escape:javascript}",
141"%d photos" : "{'%d photos'|@translate|@escape:javascript}",
142{literal}
143dontMindTheComma: ""
144    },
145
146  get: function( str ) {
147                var lang_str = this._strings[str];
148                if (lang_str == undefined)
149                {
150                        if (document.is_debug) glog("Language string undefined '"+ str+"'");
151                        return str;
152                }
153                return lang_str;
154        },
155
156  getQ: function( str ) {
157                return '"'+this.get(str)+'"';
158        },
159
160  fmt1: function () {
161                var str = arguments[0];
162                str = this.get(str);
163                str = str.replace( '%s', "%" ).replace( '%d', "%" ).replace('%', arguments[1]);
164                return str;
165               
166        }
167}
168{/literal}
169//]]>
170</script>
171</head>
172
173<body onload="load()" onunload="unload()">
174
175<div id="titlebar">
176  <div class="titlebar_links" >
177    <span id="dataLoadStatus"></span>
178    <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>
179    <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>
180    <a id="aBlowup" href="" onclick="return PwgDataHandler.blowupUrl(this.href);" class="gmnoprint" title="{'show all photos around this location'|@translate}">
181                        <img src="{$PLUGIN_ROOT_URL}/icons/pic_s.gif" alt="" title="{'show all photos around this location'|@translate}">
182                        <span>{'Show all'|@translate}</span>
183                </a>
184    <span class="gmnoprint">
185                        <input type="text" size="48" id="q">
186                </span>
187  </div>
188  <div class="titlebar_title">
189    <a href="{$U_HOME}" class="gmnoprint">{'Home'|@translate}</a>
190    <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>
191    {'Viewing'|@translate}: <a id="aPageUrl" href=""></a>
192  </div>
193</div>
194
195<div id="map"> </div>
196{get_combined_scripts load='footer'}
197</body>
198</html>
Note: See TracBrowser for help on using the repository browser.