myWindow = {
width : 800,
height : 600,
boxFadeInTime : 5,
boxFadeInStep : 20,
boxFadeOutTime : 5,
boxFadeOutStep : 20,

navImgClose : 'close.png',

idBox : 'windowViewBox',
idView : 'windowViewArea',
idControl : 'windowViewControl',
idInfo : 'windowViewInfo',
idNav : 'windowViewNav',
box : null,
view : null,
control : null,
};

myWindow.screenSize = function() {
    var w, h;
    w = (window.innerWidth ? window.innerWidth : (document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.offsetWidth));
    h = (window.innerHeight ? window.innerHeight : (document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.offsetHeight));
    return {width:w, height:h};
}

myWindow.init = function(options) {
    if (options.navImgClose) this.navImgClose = options.navImgClose;
    if (options.width >= 0) this.width = options.width;
    if (options.height >= 0) this.height = options.height;
};

myWindow.open = function(title, content) {
    var box = document.getElementById(this.idBox);
    if (!box) box = this.createBox();
    if (!box) return;
    // Заголовок.
    var info = document.getElementById(this.idInfo);
    if (!info) return;
    info.innerHTML = title;
    // Содержание.
    var view = document.getElementById(this.idView);
    if (!view) return;
    view.innerHTML = content;
     // Установка интервала высплывания окна. 
    box.fadeInTimer = setInterval(function() { myWindow.boxFadeIn(); } , this.boxFadeInTime);
};

myWindow.createBox = function(options) {
    if (typeof options == 'object') myWindow.init(options);
    
    // Координаты окна просмотра.
    var screenSize = this.screenSize();
    if (this.width > screenSize.width) this.width = screenSize.width - 5;
    if (this.height > screenSize.height) this.height = screenSize.height - 5;
    var left = Math.ceil((screenSize.width - this.width) / 2);
    var top = Math.ceil((screenSize.height - this.height) / 2);
    if (left < 0) left = 0;
    if (top < 0) top = 0;
    
    // Создание окна просмотра.
    var box = document.createElement('div');
    box.id = this.idBox;
    box.style.width = this.width + 'px';
    box.style.height = this.height + 'px';
    box.style.position = 'fixed';
    box.style.zIndex = 1000;
    box.style.top = top + 'px';
    box.style.left = left + 'px';
    box.style.opacity = 0;
    box.style.filter = 'alpha(opacity=0)';
    
    var controlHeight = 40;
    
    // Создание области просмотра.
    var view = document.createElement('div');
    view.id = this.idView;
    var heightView = this.height - controlHeight;
    view.style.position = 'relative';
    view.style.height = (heightView - 30) + 'px';
    view.style.margin = '2px';
        
    // Создание области управления.
    var control = document.createElement('div');
    control.id = this.idControl;
    control.style.height = controlHeight + 'px';
    control.style.position = 'static';
    control.style.margin = '2px';
    
    // Создание информационной области.
    var info = document.createElement('div');
    info.id = this.idInfo;
    info.style.height = 30 + 'px';
    //info.style.border = '1px solid #000';
    info.style.position = 'static';
    info.style.padding = '0px';
    info.style.paddingTop = '10px';
    info.style.paddingLeft = '10px';
    
    // Создание области навигации.
    var nav = document.createElement('div');
    nav.id = this.idNav;
    nav.style.height = 35 + 'px';
    //nav.style.border = '1px solid #000';
    nav.style.position = 'static';
    nav.style.margin = '2px';
    nav.style.width = '140px';
    nav.style.styleFloat = 'right';
    nav.style.cssFloat = 'right';
    nav.innerHTML = '<a href="#" onclick="myWindow.close(); return false;"><img src="' + this.navImgClose + '" style="border: 0px; float: right;"></a>';
    
    // Создание структуры документа.
    box.appendChild(view);
    box.appendChild(control);
    control.appendChild(nav);
    control.appendChild(info);
    var docbody = document.getElementsByTagName('body');
    docbody[0].appendChild(box);
    
    return box;
};

myWindow.boxFadeIn = function() {
    var box = document.getElementById(this.idBox);
    if (!box) return;
    
    if (box.style.opacity < 1) {
        var step = this.boxFadeInStep;
        var newOpacity = (100 * box.style.opacity) + step;  
        box.style.opacity = newOpacity / 100;
        box.style.filter = 'alpha(opacity=' + newOpacity + ')';
    } else {
        clearInterval(box.fadeInTimer);
    }
};

myWindow.boxFadeOut = function() {
    var box = document.getElementById(this.idBox);
    if (!box) return;
    
    if (box.style.opacity > 0) {
        var step = this.boxFadeOutStep;
        var newOpacity = (100 * box.style.opacity) - step;  
        box.style.opacity = newOpacity / 100;
        box.style.filter = 'alpha(opacity=' + newOpacity + ')';
    } else {
        clearInterval(box.fadeOutTimer);
        this.destroy();
    }
};

/** Удалить объект просмотра. **/
myWindow.destroy = function() {
    var box = document.getElementById(this.idBox);
    if (box) box.parentNode.removeChild(box);
}

/** Закрыть окно просмотра. **/
myWindow.close = function() {
    var box = document.getElementById(this.idBox);
    if (!box) return; 
    box.fadeOutTimer = setInterval(function() {myWindow.boxFadeOut();}, this.boxFadeOutTime);
};