From: stronk7 <stronk7>
Date: Mon, 3 Sep 2007 23:25:35 +0000 (+0000)
Subject: Global change in the way to calculate widths and heights to
X-Git-Url: http://git.mjollnir.org/gw?a=commitdiff_plain;h=57da8fd51aa053c4d255504c7c1310eeff1d4462;p=moodle.git
Global change in the way to calculate widths and heights to
render the IMS iframe properly. Should be working ok both under
normal and rounded-corner themes and under FF, Safari and IE
---
diff --git a/mod/resource/type/ims/javascript.php b/mod/resource/type/ims/javascript.php
index e91488c71f..e5666453de 100644
--- a/mod/resource/type/ims/javascript.php
+++ b/mod/resource/type/ims/javascript.php
@@ -28,12 +28,13 @@
};
window.name='ims-cp-page';
- // Set Interval until ims-contentframe or ims-contentframe-no-nav is available
+ // Set Interval until ims-containerdiv and (ims-contentframe or ims-contentframe-no-nav) is available
function waiting() {
+ var cd = document.getElementById('ims-containerdiv');
var cf = document.getElementById('ims-contentframe');
var cfnv = document.getElementById('ims-contentframe-no-nav');
- if (cf || cfnv) {
+ if (cd && (cf || cfnv)) {
resizeiframe($jsarg, $customcorners);
clearInterval(ourInterval);
return true;
diff --git a/mod/resource/type/ims/resize.js b/mod/resource/type/ims/resize.js
index b05a768cb1..c5a8d3f5fe 100644
--- a/mod/resource/type/ims/resize.js
+++ b/mod/resource/type/ims/resize.js
@@ -17,7 +17,9 @@ function getElementStyle(obj, prop, cssProp) {
return ret;
}
-function resizeiframe (hasNav, customCorners) {
+function resizeiframe (hasNav, customCorners) {
+
+/// Calculate window width and height
var winWidth = 0, winHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
@@ -32,57 +34,83 @@ function resizeiframe (hasNav, customCorners) {
winWidth = document.body.clientWidth;
winHeight = document.body.clientHeight;
}
-
- var header = document.getElementById('header');
- var divs = document.getElementsByTagName('div');
- var n = divs.length;
-
-
- var content = document.getElementById('content');
+
+/// Calculate margins
+ var topMargin = parseInt(getElementStyle(document.getElementsByTagName('body')[0], 'marginTop', 'margin-top'));
+ var bottomMargin = parseInt(getElementStyle(document.getElementsByTagName('body')[0], 'marginBottom', 'margin-bottom'));
+ var leftMargin = parseInt(getElementStyle(document.getElementsByTagName('body')[0], 'marginLeft', 'margin-left'));
+ var rightMargin = parseInt(getElementStyle(document.getElementsByTagName('body')[0], 'marginRight', 'margin-right'));
+
+/// Calculate heights
+ var header = document.getElementById('content');
var headerHeight = 0;
- if (content) {
- headerHeight = content.offsetTop;
+ if (header) {
+ headerHeight = header.offsetTop + parseInt(getElementStyle(header, 'marginTop', 'margin-top')) + parseInt(getElementStyle(header, 'marginBottom', 'margin-bottom'));
}
-
+
+ var contentbt = document.getElementById('content-bt');
+ var contentbtHeight = 0;
+ if (contentbt) {
+ contentbtHeight = contentbt.offsetHeight + parseInt(getElementStyle(contentbt, 'marginTop', 'margin-top')) + parseInt(getElementStyle(contentbt, 'marginBottom', 'margin-bottom'));
+ }
+
+ var contentbb = document.getElementById('content-bb');
+ var contentbbHeight = 0;
+ if (contentbb) {
+ contentbbHeight = contentbb.offsetHeight + parseInt(getElementStyle(contentbb, 'marginTop', 'margin-top')) + parseInt(getElementStyle(contentbb, 'marginBottom', 'margin-bottom'));
+ }
+
+ var navbar = document.getElementById('ims-nav-bar');
+ var navbarHeight = 0;
+ if (navbar) {
+ navbarHeight = navbar.offsetHeight + parseInt(getElementStyle(navbar, 'marginTop', 'margin-top')) + parseInt(getElementStyle(navbar, 'marginBottom', 'margin-bottom'));;
+ }
+
var footer = document.getElementById('footer');
- var imsnavbar = document.getElementById('ims-nav-bar');
var footerHeight = 0;
- var imsnavHeight = 0;
if (footer) {
footerHeight = footer.offsetHeight + parseInt(getElementStyle(footer, 'marginTop', 'margin-top')) + parseInt(getElementStyle(footer, 'marginBottom', 'margin-bottom'));
}
- if (imsnavbar) {
- imsnavHeight = imsnavbar.offsetHeight;
- }
- var topMargin = parseInt(getElementStyle(document.getElementsByTagName('body')[0], 'marginTop', 'margin-top'));
- var bottomMargin = parseInt(getElementStyle(document.getElementsByTagName('body')[0], 'marginBottom', 'margin-bottom'));
- var leftMargin = parseInt(getElementStyle(document.getElementsByTagName('body')[0], 'marginLeft', 'margin-left'));
- var rightMargin = parseInt(getElementStyle(document.getElementsByTagName('body')[0], 'marginRight', 'margin-right'));
- var totalHeight = headerHeight +
- footerHeight +
- imsnavHeight +
- topMargin +
- bottomMargin;
+/// Calculate the used height
+ var usedHeight = headerHeight +
+ contentbtHeight +
+ navbarHeight +
+ contentbbHeight +
+ footerHeight +
+ bottomMargin + 15; /// Plus 15 points to avoid the wrong vertical scroll bar on some browsers
- if (hasNav == true) {
- var navBarWidth = document.getElementById('ims-menudiv').offsetWidth;
- var iframeWidth = (winWidth - navBarWidth - leftMargin - rightMargin - 4)+'px'; // -4 for two divs borders I hope
- document.getElementById('ims-menudiv').style.height = (winHeight - totalHeight)+'px';
+/// Calculate widths
+ var menu = document.getElementById('ims-menudiv');
+ var menuWidth = 0;
+ var menuLeft = 0;
+ if (menu) {
+ menuLeft = menu.offsetLeft;
+ menuWidth = menu.offsetWidth + parseInt(getElementStyle(menu, 'marginLeft', 'margin-left')) + parseInt(getElementStyle(menu, 'marginRight', 'margin-right')) + 2; /// +2 to leave 1px menu borders
}
- else {
- var iframeWidth = (winWidth - leftMargin - rightMargin - 2)+'px'; // -2 for one div borders I hope
+
+ var container = document.getElementById('ims-containerdiv');
+ var containerWidth = 0;
+ if (container) {
+ containerWidth = container.offsetWidth - 2; /// -2 to leave some right margin in the container div
}
+/// Calculate the used width
+ var usedWidth = winWidth - containerWidth + menuWidth;
+
+/// Set contentframe dimensions
if (hasNav == true) {
- document.getElementById('ims-contentframe').style.height = (winHeight - totalHeight)+'px';
- document.getElementById('ims-contentframe').style.width = iframeWidth;
+ document.getElementById('ims-contentframe').style.height = (winHeight - usedHeight)+'px';
+ document.getElementById('ims-contentframe').style.width = (winWidth - usedWidth)+'px';
+ document.getElementById('ims-contentframe').style.left = (menuLeft + menuWidth)+'px';
} else {
- document.getElementById('ims-contentframe-no-nav').style.height = (winHeight - totalHeight)+'px';
- document.getElementById('ims-contentframe-no-nav').style.width = iframeWidth;
+ document.getElementById('ims-contentframe-no-nav').style.height = (winHeight - usedHeight)+'px';
+ document.getElementById('ims-contentframe-no-nav').style.width = (winWidth - usedWidth)+'px';
}
- document.getElementById('ims-containerdiv').style.height = (winHeight - totalHeight)+'px';
+
+/// Set containerdiv dimensions
+ document.getElementById('ims-containerdiv').style.height = (winHeight - usedHeight)+'px';
}