var previewBox = null;
var previewBoxImg = null;

Event.observe(window, 'load', function() {
    previewBox = new Element('div', {'id': 'previewBox', 'class': 'preview-box'});    
    previewBoxImg = new Element('img');
    previewBox.appendChild(previewBoxImg);    
    previewBox.setStyle({
        display: 'none',
        position: 'absolute',
        left: 0,
        top: 0
    });

    document.body.appendChild(previewBox);
});

function pi_showimage(img) {    
    previewBox.show();
    previewBoxImg.src = img;    

    Event.observe(document, 'mousemove', function(e) {
        var left = (Event.pointerX(e) + 5) + 'px';
        var top = (Event.pointerY(e) - 5 - previewBox.getHeight()) + 'px';
        previewBox.setStyle({
            'left': left,
            'top': top
        });
    });
}

function pi_hideimage() {
    previewBox.hide();
}