From: Robert Kaiser Date: Sun, 7 Oct 2012 21:23:50 +0000 (+0200) Subject: support full screen mode X-Git-Tag: legacy-preGL~55 X-Git-Url: https://git-public.kairo.at/?a=commitdiff_plain;h=c537874767ee78334e65c6a0532358ac724f857f;p=lantea.git support full screen mode --- diff --git a/TODO b/TODO index 708a0bd..2bd847b 100644 --- a/TODO +++ b/TODO @@ -16,7 +16,6 @@ Required: * Smoother animations for panning * Smooth animations for zooming, probably using some canvas magic * Use available larger/smaller tiles with resizing as loading placeholders while zooming in/out -* Full screen mode * Save GPX tiles to the web (OSM? Public cloud service? Private service?) * Better GPX saving implementation [blocked by missing web APIs] ** Set file name to save into to a good default (date + maybe some location name) diff --git a/index.html b/index.html index 2bfb6b5..d4b17c9 100644 --- a/index.html +++ b/index.html @@ -15,7 +15,7 @@ - +

Lantea Map

@@ -53,6 +53,12 @@ Map style: onclick="zoomOut();">

+ + +

diff --git a/js/ui.js b/js/ui.js index 65992f7..6566a86 100644 --- a/js/ui.js +++ b/js/ui.js @@ -115,6 +115,30 @@ function toggleSettings() { } } +function toggleFullscreen() { + if ((document.fullScreenElement && document.fullScreenElement !== null) || + (document.mozFullScreenElement && document.mozFullScreenElement !== null) || + (document.webkitFullScreenElement && document.webkitFullScreenElement !== null)) { + if (document.cancelFullScreen) { + document.cancelFullScreen(); + } else if (document.mozCancelFullScreen) { + document.mozCancelFullScreen(); + } else if (document.webkitCancelFullScreen) { + document.webkitCancelFullScreen(); + } + } + else { + var elem = document.getElementById("body"); + if (elem.requestFullScreen) { + elem.requestFullScreen(); + } else if (elem.mozRequestFullScreen) { + elem.mozRequestFullScreen(); + } else if (elem.webkitRequestFullScreen) { + elem.webkitRequestFullScreen(); + } + } +} + var uiEvHandler = { handleEvent: function(aEvent) { var touchEvent = aEvent.type.indexOf('touch') != -1; diff --git a/style/lantea.css b/style/lantea.css index 23bd32d..1459ff0 100644 --- a/style/lantea.css +++ b/style/lantea.css @@ -27,6 +27,14 @@ h1 { text-align: center; } +#fullscreenArea { + position: absolute; + right: 1%; + bottom: 2em; + z-index: 5; + text-align: center; +} + .overlayArea { transition-property: opacity; transition-duration: .2s; @@ -52,7 +60,6 @@ h1 { padding: 0 3px; } - #settingsArea, #trackArea { display: none; @@ -70,10 +77,10 @@ h1 { #map { border: 0; - top: 1px; - left: 1px; - right: 1px; - bottom: 1px; + top: 0; + left: 0; + right: 0; + bottom: 0; z-index: 1; } @@ -121,6 +128,10 @@ h1 { top: 1px; right: 1px; } + #fullscreenArea { + right: 1px; + bottom: 10px; + } #copyright { bottom: 1px; right: 1px;