Poll for SVG

by Joel Lubrano

HTML

<div id="thissun"></div>
<div id="ta-da"></div>
<div class="hidden" id="tooltip"></div>

CSS

svg {
    background: #000;
}

.hidden {
    display: none;
}

#tooltip {
    position: absolute;
}

JavaScript

var SVG_NS = 'http://www.w3.org/2000/svg';

function simSvg() {
    var thissun = document.getElementById('thissun');
    var svg = document.createElementNS(SVG_NS, 'svg');
    svg.setAttribute('width', 300);
    svg.setAttribute('height', 300);
    thissun.appendChild(svg);
}

function setupHover(svg) {
 	// I don't want to write this code though...   
}

// simulate svg being generated after 2 seconds
setTimeout(simSvg, 2000);

function findSvg() {
    var svg = document.getElementById('thissun').getElementsByTagNameNS(SVG_NS, 'svg');
    if(!svg.length) return false;
    
    // get hacky
    svg = svg[0];
    
    setupHover(svg);
    
    var tada = document.getElementById('ta-da');
    tada.innerHTML = "Width: " + svg.getAttribute('width') + ", Height: " + svg.getAttribute('height');
    
    return true;
}

var poll = setInterval(function() {
    if(findSvg()) clearInterval(poll);
}, 100); // 100 is arbitrary