Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
Browse the repository at this point in the history
HTML5 - new page model - Map
git-svn-id: https://xerteonlinetoolkits.googlecode.com/svn/trunk@717 912cdd6b-5c7d-d5a7-a2ba-d0f0cdb91641
- Loading branch information
Showing
1 changed file
with
84 additions
and
0 deletions.
There are no files selected for viewing
84 changes: 84 additions & 0 deletions
84
modules/xerte/parent_templates/Nottingham/models_html5/map.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,84 @@ | ||
<script type="text/javascript"> | ||
|
||
// pageChanged & sizeChanged functions are needed in every model file | ||
// other functions for model should also be in here to avoid conflicts | ||
var map = new function() { | ||
|
||
// function called every time the page is viewed after it has initially loaded | ||
this.pageChanged = function() { | ||
|
||
} | ||
|
||
// function called every time the size of the LO is changed | ||
this.sizeChanged = function() { | ||
if ($("#mapHolder iframe").length > 0) { | ||
var $panel = $("#mapHolder .panel"); | ||
$panel.height($x_pageHolder.height() - parseInt($x_pageDiv.css("padding-top")) * 2 - parseInt($panel.css("padding-top")) * 2 - 15); | ||
} | ||
} | ||
|
||
this.init = function() { | ||
$("#textHolder").html(x_addLineBreaks(x_currentPageXML.getAttribute("text"))); | ||
|
||
var $panel = $("#mapHolder .panel"); | ||
if (x_currentPageXML.getAttribute("align") == "right") { | ||
$panel.addClass("x_floatLeft"); | ||
} else { | ||
$panel.addClass("x_floatRight"); | ||
} | ||
|
||
var mapUrl = x_currentPageXML.getAttribute("mapurl"); | ||
|
||
if (x_currentPageXML.getAttribute("link") != "false" || x_browserInfo.iOS == true) { // iframe | ||
var mapType = "m"; // roadmap | ||
if (x_currentPageXML.getAttribute("maptype") == "satellite") { | ||
mapType = "k"; | ||
} else if (x_currentPageXML.getAttribute("maptype") == "terrain") { | ||
mapType = "t"; | ||
} else if (x_currentPageXML.getAttribute("maptype") == "hybrid") { | ||
mapType = "h"; | ||
} | ||
|
||
if (mapUrl.indexOf("&t=") != -1) { | ||
mapUrl = mapUrl.substring(0, mapUrl.indexOf("&t=") + 3) + mapType + mapUrl.substring(mapUrl.indexOf("&t=") + 4); | ||
} | ||
|
||
$panel | ||
.addClass("width60") | ||
.append('<iframe width="100%" height="100%" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="' + mapUrl + '&output=embed&ie=UTF8" title="' + x_currentPageXML.getAttribute("tooltip") + '"></iframe>'); | ||
|
||
} else { // image | ||
var ll = x_currentPageXML.getAttribute("mapurl").split("ll=")[1].split("&")[0]; | ||
var z = x_currentPageXML.getAttribute("mapurl").split("z=")[1].split("&")[0]; | ||
var maxWH = [$x_pageHolder.width() * 0.6, 400]; | ||
|
||
$panel.append('<img src="http://maps.google.com/maps/api/staticmap?sensor=false&format=png&size=' + maxWH[0] + 'x' + maxWH[1] + '¢er=' + ll + '&zoom=' + z + '&maptype=' + x_currentPageXML.getAttribute("maptype") + '" alt="' + x_currentPageXML.getAttribute("tooltip") + '"/>'); | ||
} | ||
|
||
if (x_currentPage != 0) { | ||
this.sizeChanged(); | ||
} | ||
|
||
// call this function in every model once everything's loaded | ||
x_pageLoaded(); | ||
} | ||
} | ||
|
||
map.init(); | ||
|
||
</script> | ||
|
||
<style type="text/css"> | ||
|
||
</style> | ||
|
||
<div id="pageContents"> | ||
|
||
<div id="mapHolder" class="mobileAlign"> <!-- this tag is only used when viewed on mobiles to change layout --> | ||
<div class="panel inline"> | ||
</div> | ||
</div> | ||
|
||
<div id="textHolder"></div> | ||
|
||
</div> |