mirror of
https://github.com/FoggedLens/iD.git
synced 2026-04-29 15:16:07 +02:00
Merge branch 'PaulAnnekov-full-screen-mode'
This commit is contained in:
+25
-4
@@ -29,7 +29,6 @@ body {
|
||||
.id-container {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
min-width: 768px;
|
||||
}
|
||||
|
||||
@@ -58,14 +57,12 @@ body {
|
||||
|
||||
.spinner {
|
||||
opacity: .5;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.spinner img {
|
||||
position: absolute;
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
border-radius: 4px;
|
||||
margin-right: 10px;
|
||||
background: black;
|
||||
@@ -555,6 +552,9 @@ button.save.has-count .count::before {
|
||||
.icon.back.blue { background-position: -420px -20px;}
|
||||
.icon.forward.blue { background-position: -440px -20px;}
|
||||
|
||||
.icon.full-screen { background-position: -620px -20px;}
|
||||
.active .icon.full-screen { background-position: -640px -20px;}
|
||||
|
||||
button[disabled] .icon.alert { background-position: 0 -40px;}
|
||||
button[disabled] .icon.add-point { background-position: -20px -40px;}
|
||||
button[disabled] .icon.add-line { background-position: -40px -40px;}
|
||||
@@ -1740,6 +1740,27 @@ img.wiki-image {
|
||||
background: rgba(0,0,0,.8);
|
||||
}
|
||||
|
||||
/* Fullscreen button */
|
||||
div.full-screen {
|
||||
float: right;
|
||||
width: 40px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
div.full-screen .tooltip {
|
||||
min-width: 160px;
|
||||
}
|
||||
|
||||
div.full-screen > button, div.full-screen > button.active {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
div.full-screen > button:hover {
|
||||
background-color: rgba(0, 0, 0, .8);
|
||||
}
|
||||
|
||||
/* Map Controls */
|
||||
|
||||
.map-controls {
|
||||
|
||||
@@ -401,6 +401,7 @@ en:
|
||||
in: Zoom In
|
||||
out: Zoom Out
|
||||
cannot_zoom: "Cannot zoom out further in current mode."
|
||||
full_screen: Toggle Full Screen
|
||||
gpx:
|
||||
local_layer: "Local GPX file"
|
||||
drag_drop: "Drag and drop a .gpx file on the page, or click the button to the right to browse"
|
||||
|
||||
Vendored
+74
-6
@@ -13,7 +13,7 @@
|
||||
width="800"
|
||||
height="560"
|
||||
id="svg12393"
|
||||
inkscape:version="0.48.5 r10040"
|
||||
inkscape:version="0.48.4 r9939"
|
||||
sodipodi:docname="sprite.svg">
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
@@ -28,11 +28,11 @@
|
||||
inkscape:window-height="856"
|
||||
id="namedview392"
|
||||
showgrid="true"
|
||||
inkscape:zoom="1"
|
||||
inkscape:cx="475.13394"
|
||||
inkscape:cy="495.7147"
|
||||
inkscape:window-x="276"
|
||||
inkscape:window-y="71"
|
||||
inkscape:zoom="16"
|
||||
inkscape:cx="641.185"
|
||||
inkscape:cy="531.10386"
|
||||
inkscape:window-x="285"
|
||||
inkscape:window-y="196"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="svg12393"
|
||||
showguides="true"
|
||||
@@ -2106,4 +2106,72 @@
|
||||
style="color:#000000;fill:#8cd05f;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
|
||||
inkscape:connector-curvature="0"
|
||||
sodipodi:nodetypes="cccccccccccccccccsscsscssccscccccccccccccccccccccccccccssssssssssssssscccccccccsccsssssssssssssss" />
|
||||
<g
|
||||
id="g3387"
|
||||
transform="translate(642.0625,21.9785)"
|
||||
style="fill:#ffffff">
|
||||
<g
|
||||
style="fill:#ffffff"
|
||||
transform="scale(0.5,0.5)"
|
||||
id="Layer_1" />
|
||||
<g
|
||||
style="fill:#ffffff"
|
||||
transform="scale(0.5,0.5)"
|
||||
id="fullscreen_x5F_exit_x5F_alt">
|
||||
<g
|
||||
style="fill:#ffffff"
|
||||
id="g6">
|
||||
<polygon
|
||||
id="polygon8"
|
||||
style="fill:#ffffff"
|
||||
points="25.414,22.586 28,20 20,20 20,28 22.586,25.414 29.172,32 32,29.172 " />
|
||||
<polygon
|
||||
id="polygon10"
|
||||
style="fill:#ffffff"
|
||||
points="12,4 9.375,6.543 2.828,0 0,2.828 6.547,9.371 4,12 11.961,11.957 " />
|
||||
<polygon
|
||||
id="polygon12"
|
||||
style="fill:#ffffff"
|
||||
points="12,28 12,20 4,20 6.586,22.586 0,29.172 2.828,32 9.414,25.414 " />
|
||||
<polygon
|
||||
id="polygon14"
|
||||
style="fill:#ffffff"
|
||||
points="29.164,0 22.598,6.566 20,3.971 20,12 28.031,12 25.438,9.404 32,2.838 " />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
id="g3407"
|
||||
transform="translate(622.082,22.043)"
|
||||
style="fill:#ffffff">
|
||||
<g
|
||||
style="fill:#ffffff"
|
||||
transform="scale(0.5,0.5)"
|
||||
id="Layer_1-1" />
|
||||
<g
|
||||
style="fill:#ffffff"
|
||||
transform="scale(0.5,0.5)"
|
||||
id="fullscreen_x5F_alt">
|
||||
<g
|
||||
style="fill:#ffffff"
|
||||
id="g6-8">
|
||||
<polygon
|
||||
id="polygon8-1"
|
||||
style="fill:#ffffff"
|
||||
points="20,22.828 26.586,29.414 24,32 32,32 32,24 29.414,26.586 22.828,20 " />
|
||||
<polygon
|
||||
id="polygon10-6"
|
||||
style="fill:#ffffff"
|
||||
points="12,9.172 5.414,2.586 8,0 0,0 0,8 2.586,5.414 9.172,12 " />
|
||||
<polygon
|
||||
id="polygon12-0"
|
||||
style="fill:#ffffff"
|
||||
points="22.828,12 29.414,5.414 32,8 32,0 24,0 26.586,2.586 20,9.172 " />
|
||||
<polygon
|
||||
id="polygon14-3"
|
||||
style="fill:#ffffff"
|
||||
points="2.586,26.586 0,24 0,32 8,32 5.414,29.414 12,22.828 9.172,20 " />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 179 KiB After Width: | Height: | Size: 181 KiB |
Vendored
+1
@@ -484,6 +484,7 @@
|
||||
"out": "Zoom Out"
|
||||
},
|
||||
"cannot_zoom": "Cannot zoom out further in current mode.",
|
||||
"full_screen": "Toggle Full Screen",
|
||||
"gpx": {
|
||||
"local_layer": "Local GPX file",
|
||||
"drag_drop": "Drag and drop a .gpx file on the page, or click the button to the right to browse",
|
||||
|
||||
@@ -99,6 +99,7 @@
|
||||
<script src='js/id/ui/flash.js'></script>
|
||||
<script src='js/id/ui/feature_info.js'></script>
|
||||
<script src='js/id/ui/save.js'></script>
|
||||
<script src='js/id/ui/full_screen.js'></script>
|
||||
<script src='js/id/ui/scale.js'></script>
|
||||
<script src='js/id/ui/splash.js'></script>
|
||||
<script src='js/id/ui/spinner.js'></script>
|
||||
|
||||
@@ -60,6 +60,10 @@ iD.ui = function(context) {
|
||||
.attr('class', 'button-wrap col1')
|
||||
.call(iD.ui.Save(context));
|
||||
|
||||
bar.append('div')
|
||||
.attr('class', 'full-screen')
|
||||
.call(iD.ui.FullScreen(context));
|
||||
|
||||
bar.append('div')
|
||||
.attr('class', 'spinner')
|
||||
.call(iD.ui.Spinner(context));
|
||||
|
||||
@@ -0,0 +1,73 @@
|
||||
iD.ui.FullScreen = function(context) {
|
||||
var element = context.container().node(),
|
||||
keybinding = d3.keybinding('full-screen');
|
||||
// button;
|
||||
|
||||
function getFullScreenFn() {
|
||||
if (element.requestFullscreen) {
|
||||
return element.requestFullscreen;
|
||||
} else if (element.msRequestFullscreen) {
|
||||
return element.msRequestFullscreen;
|
||||
} else if (element.mozRequestFullScreen) {
|
||||
return element.mozRequestFullScreen;
|
||||
} else if (element.webkitRequestFullscreen) {
|
||||
return element.webkitRequestFullscreen;
|
||||
}
|
||||
}
|
||||
|
||||
function getExitFullScreenFn() {
|
||||
if (document.exitFullscreen) {
|
||||
return document.exitFullscreen;
|
||||
} else if (document.msExitFullscreen) {
|
||||
return document.msExitFullscreen;
|
||||
} else if (document.mozCancelFullScreen) {
|
||||
return document.mozCancelFullScreen;
|
||||
} else if (document.webkitExitFullscreen) {
|
||||
return document.webkitExitFullscreen;
|
||||
}
|
||||
}
|
||||
|
||||
function isFullScreen() {
|
||||
return document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement ||
|
||||
document.msFullscreenElement;
|
||||
}
|
||||
|
||||
function isSupported() {
|
||||
return !!getFullScreenFn();
|
||||
}
|
||||
|
||||
function fullScreen() {
|
||||
d3.event.preventDefault();
|
||||
if (!isFullScreen()) {
|
||||
// button.classed('active', true);
|
||||
getFullScreenFn().apply(element);
|
||||
} else {
|
||||
// button.classed('active', false);
|
||||
getExitFullScreenFn().apply(document);
|
||||
}
|
||||
}
|
||||
|
||||
return function() { // selection) {
|
||||
if (!isSupported())
|
||||
return;
|
||||
|
||||
// var tooltip = bootstrap.tooltip()
|
||||
// .placement('left');
|
||||
|
||||
// button = selection.append('button')
|
||||
// .attr('title', t('full_screen'))
|
||||
// .attr('tabindex', -1)
|
||||
// .on('click', fullScreen)
|
||||
// .call(tooltip);
|
||||
|
||||
// button.append('span')
|
||||
// .attr('class', 'icon full-screen');
|
||||
|
||||
keybinding
|
||||
.on(iD.ui.cmd('f11'), fullScreen)
|
||||
.on(iD.ui.cmd('⌘⇧F'), fullScreen);
|
||||
|
||||
d3.select(document)
|
||||
.call(keybinding);
|
||||
};
|
||||
};
|
||||
Reference in New Issue
Block a user