// ---------------------------------------------------------
// ImageViewer class
// 
// ---------------------------------------------------------

ImageViewer.prototype._element;
ImageViewer.prototype._image;
ImageViewer.prototype._isMousedown;
ImageViewer.prototype._mouseCoords;


function ImageViewer(element, src) {
    this._element = element;
    this._element.style.position = 'relative';
    this._element.style.overflow = 'hidden';
    //this._element.style.border = '1px dotted black';
    this._element.style.zIndex = '1';

    this._image = document.createElement('img');
    this._image.src = src;
    this._image.style.left = '0px';
    this._image.style.top = '0px';
    this._image.style.position = 'relative';
    this._image.style.zIndex = '0';
    
    this._element.appendChild(this._image);

    var _this = this;
    this._isMousedown = false;
    this._mouseCoords = {};

    this._element.onmousedown = function(e) {
        if(!e) e = window.event;

        _this._isMousedown = true;

        _this._mouseCoords.x = e.clientX;
        _this._mouseCoords.y = e.clientY;

        if (e.stopPropagation) e.stopPropagation();
        else e.cancelBubble = true;
        if (e.preventDefault) e.preventDefault();
        else e.returnValue = false;
    }

    this._element.onmousemove = function(e) {
        if (!_this._isMousedown) return;

        if(!e) e = window.event;

        _this._image.style.left = _this._image.offsetLeft + (e.clientX - _this._mouseCoords.x) + 'px';
        _this._image.style.top = _this._image.offsetTop + (e.clientY - _this._mouseCoords.y) + 'px';

        _this._mouseCoords.x = e.clientX;
        _this._mouseCoords.y = e.clientY;

        if (e.stopPropagation) e.stopPropagation();
        else e.cancelBubble = true;
        if (e.preventDefault) e.preventDefault();
        else e.returnValue = false;
    }

    this._element.onmouseup = function(e) {
        if(!e) e = window.event;

        _this._isMousedown = false;
        
        if (e.stopPropagation) e.stopPropagation();
        else e.cancelBubble = true;
        if (e.preventDefault) e.preventDefault();
        else e.returnValue = false;
    }
    
    return this;
}