r/alleswatikvoel
r/alleswatikvoel
1
0
Fork 0
Code Pull requests Releases Activity

Workarounds for IE

Browse source
This commit is contained in:
Ruben 2017-03-11 22:27:00 +01:00
parent 355bc28db0
commit 3281952c0a
2 changed files with 16 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
charts.py
View file

@ -51,7 +51,7 @@ def describeArc(x, y, radius, startAngle, endAngle):
largeArcFlag = "0" if endAngle - startAngle <= 180 else "1"; largeArcFlag = "0" if endAngle - startAngle <= 180 else "1";
d = " ".join([ d = " ".join([
"M", start['x'], start['y'], "M", start['x'], str(round(float(start['y']) - 0.0001,4)), # make sure we don't get crazy small number IE cannot handle
"A", str(radius), str(radius), "0", largeArcFlag, "0", end['x'], end['y'] "A", str(radius), str(radius), "0", largeArcFlag, "0", end['x'], end['y']
]); ]);

22
templates/index.html
View file

@ -121,8 +121,8 @@
#detail{ #detail{
position:absolute; position:absolute;
width:20em; width:15em;
margin-left:-10em; margin-left:-7.5em;
background:rgba(0,0,0,0.8); background:rgba(0,0,0,0.8);
border-radius: 1em; border-radius: 1em;
display: none; display: none;
@ -277,10 +277,11 @@
{ {
var div = document.createElement('div'); var div = document.createElement('div');
div.innerHTML = evt.target.response; div.innerHTML = evt.target.response;
// document.getElementById('colourImage').innerHTML = div.children[0].innerHTML; // document.getElementById('colourImage').innerHTML = div.children[0].innerHTML; // this doesn't work in bloody IE!!
document.getElementById('works').innerHTML = div.children[1].innerHTML; document.getElementById('works').innerHTML = div.children[1].innerHTML;
document.getElementById('stats').innerHTML = div.children[2].innerHTML; document.getElementById('stats').innerHTML = div.children[2].innerHTML;
// workaround for IE:
let svgEl = document.getElementById('colourImage'); let svgEl = document.getElementById('colourImage');
svgEl.parentNode.replaceChild(div.children[0], svgEl); svgEl.parentNode.replaceChild(div.children[0], svgEl);
@ -332,22 +333,29 @@
loadResults("no", "thing"); loadResults("no", "thing");
// workaround IE: https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollY
var supportPageOffset = window.pageXOffset !== undefined;
var isCSS1Compat = ((document.compatMode || "") === "CSS1Compat");
function triggerover(layerId, el) function triggerover(layerId, el)
{ {
// workaround IE for window.scrollY: https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollY
// let x = supportPageOffset ? window.pageXOffset : isCSS1Compat ? document.documentElement.scrollLeft : document.body.scrollLeft;
let scrollY = supportPageOffset ? window.pageYOffset : isCSS1Compat ? document.documentElement.scrollTop : document.body.scrollTop;
let url = '/images/'+layerId+'.png'; let url = '/images/'+layerId+'.png';
let position = el.getBoundingClientRect(); let position = el.getBoundingClientRect();
let detailEl = document.getElementById('detail'); let detailEl = document.getElementById('detail');
document.getElementById('detail-img').src = url; document.getElementById('detail-img').src = url;
el.onmouseout = triggerout; el.onmouseout = triggerout;
// show below icon if higher item, otherwise above it. // show below icon if higher item, otherwise above it.
if(el.attributes.cy.value <= 0) { if(el.attributes.cy.value <= 0) {
detailEl.style.top = (position.top + position.height + window.scrollY) + 'px'; detailEl.style.top = (position.top + position.height + scrollY) + 'px';
detailEl.style.bottom = 'auto'; detailEl.style.bottom = 'auto';
} else { } else {
detailEl.style.top = 'auto'; detailEl.style.top = 'auto';
detailEl.style.bottom = 'calc(100% - ' + ( position.top + window.scrollY ) + 'px)'; detailEl.style.bottom = 'calc(100% - ' + ( position.top + scrollY ) + 'px)';
} }
detailEl.style.left = (position.left - position.width/2) + 'px'; detailEl.style.left = (position.left - position.width/2) + 'px';
detailEl.classList.add('active'); detailEl.classList.add('active');