cst1/openstreetmap-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix resizing of the map area in RTL layouts

Browse source
This commit is contained in:
Tom Hughes 2011-07-02 16:19:47 +01:00
parent aca299ecee
commit 599843c72d
3 changed files with 63 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

41
app/views/site/_resize.html.erb Normal file
View file

@ -0,0 +1,41 @@
<script type="text/javascript">
var brokenContentSize = $("content").offsetWidth == 0;
function resizeContent() {
var content = $("content");
var leftMargin = parseInt(getStyle(content, "left"));
var rightMargin = parseInt(getStyle(content, "right"));
var bottomMargin = parseInt(getStyle(content, "bottom"));
<% if t('html.dir') == "ltr" -%>
content.style.width = document.documentElement.clientWidth - content.offsetLeft - rightMargin;
<% else -%>
content.style.width = document.documentElement.clientWidth - content.offsetRight - leftMargin;
<% end -%>
content.style.height = document.documentElement.clientHeight - content.offsetTop - bottomMargin;
}
function resizeMap() {
var sidebar_width = $("sidebar").offsetWidth;
if (sidebar_width > 0) {
sidebar_width = sidebar_width + 5
}
<% if t('html.dir') == "ltr" -%>
$("map").style.left = (sidebar_width) + "px";
<% else -%>
$("map").style.right = (sidebar_width) + "px";
<% end -%>
$("map").style.width = ($("content").offsetWidth - sidebar_width) + "px";
$("map").style.height = ($("content").offsetHeight - 2) + "px";
}
function handleResize() {
if (brokenContentSize) {
resizeContent();
}
resizeMap();
}
</script>

42
app/views/site/edit.html.erb
View file

@ -18,46 +18,22 @@
<%= render :partial => 'sidebar', :locals => { :onopen => "resizeMap();", :onclose => "resizeMap();" } %>
<%= render :partial => 'search' %>
<%= render :partial => 'resize' %>
<%= render :partial => preferred_editor %>
<script type="text/javascript" defer="defer">
function resizeContent() {
var content = $("content");
var rightMargin = parseInt(getStyle(content, "right"));
var bottomMargin = parseInt(getStyle(content, "bottom"));
content.style.width = document.documentElement.clientWidth - content.offsetLeft - rightMargin;
content.style.height = document.documentElement.clientHeight - content.offsetTop - bottomMargin;
}
function resizeMap() {
var sidebar_width = $("sidebar").offsetWidth;
if (sidebar_width > 0) {
sidebar_width = sidebar_width + 5
}
$("map").style.left = (sidebar_width) + "px";
$("map").style.width = ($("content").offsetWidth - sidebar_width) + "px";
$("map").style.height = ($("content").offsetHeight - 2) + "px";
}
function handleResize() {
if (brokenContentSize) {
resizeContent();
}
resizeMap();
}
function maximiseMap() {
$("left").style.display = "none";
$("greeting").style.display = "none";
$("tabnav").style.display = "none";
$("content").style.top = "10px";
<% if t('html.dir') == "ltr" -%>
$("content").style.left = "10px";
<% else -%>
$("content").style.right = "10px";
<% end -%>
handleResize();
}
@ -68,14 +44,18 @@
$("tabnav").style.display = "";
$("content").style.top = "35px";
<% if t('html.dir') == "ltr" -%>
$("content").style.left = "192px";
<% else -%>
$("content").style.right = "192px";
<% end -%>
handleResize();
}
handleResize();
window.onload = handleResize;
window.onresize = handleResize;
Event.observe(window, "load", handleResize);
Event.observe(window, "resize", handleResize);
</script>
<% end %>

52
app/views/site/index.html.erb
View file

@ -118,9 +118,9 @@ end
<%= javascript_include_tag '/openlayers/OpenStreetMap.js' %>
<%= javascript_include_tag 'map.js' %>
<%= render :partial => 'resize' %>
<script type="text/javascript" defer="defer">
<!--
var brokenContentSize = $("content").offsetWidth == 0;
var marker;
var map;
@ -237,43 +237,6 @@ end
document.cookie = "_osm_location=" + lonlat.lon + "|" + lonlat.lat + "|" + zoom + "|" + layers + "; expires=" + expiry.toGMTString();
}
function resizeContent() {
var content = $("content");
var rightMargin = parseInt(getStyle(content, "right"));
var bottomMargin = parseInt(getStyle(content, "bottom"));
content.style.width = document.documentElement.clientWidth - content.offsetLeft - rightMargin;
content.style.height = document.documentElement.clientHeight - content.offsetTop - bottomMargin;
}
function resizeMap() {
var centre = map.getCenter();
var zoom = map.getZoom();
var sidebar_width = $("sidebar").offsetWidth;
if (sidebar_width > 0) {
sidebar_width = sidebar_width + 5
}
<% if t('html.dir') == "ltr" -%>
$("map").style.left = (sidebar_width) + "px";
<% else -%>
$("map").style.right = (sidebar_width) + "px";
<% end -%>
$("map").style.width = ($("content").offsetWidth - sidebar_width) + "px";
$("map").style.height = ($("content").offsetHeight - 2) + "px";
map.setCenter(centre, zoom);
}
function handleResize() {
if (brokenContentSize) {
resizeContent();
}
resizeMap();
}
function remoteEditHandler(event) {
var extent = getMapExtent();
var loaded = false;
@ -304,10 +267,17 @@ end
Event.observe(window, "load", installEditHandler);
Event.observe(window, "load", handleResize);
Event.observe(window, "resize", handleResize);
Event.observe(window, "resize", function() {
var centre = map.getCenter();
var zoom = map.getZoom();
handleResize();
map.setCenter(centre, zoom);
});
<% if params['action'] == 'export' %>
<%= remote_function :url => { :controller => 'export', :action => 'start' } %>
<% end %>
// -->
</script>