if (typeof UPOC == "undefined" || !UPOC) {
    var UPOC = {};
}

UPOC.Popup = {};

UPOC.Popup.width = undefined;
UPOC.Popup.height = undefined;
UPOC.Popup.open = function(targetEl,successFn){

    //reset form
    $('signInErrorMsg').setText('');
    $('signInUsername').setProperty('value','Username');
    $('signInPassword').setProperty('value','password');


    //create background
    var grey = new Element('iframe',{'id' : 'Popup_HideSelect'}).injectInside(document.body);
    grey.setOpacity(0.7);
    var grey2 = new Element('div',{'id' : 'Popup_overlay'}).injectInside(document.body);
    grey2.setOpacity(0);
    UPOC.Popup.sizeOverlay();
    //*&* new Fx.Style('Popup_overlay', 'opacity',{duration: 400, transition: Fx.Transitions.sineInOut}).start(0,0.6);
    //grey2.setOpacity(0.6);
    new Fx.Tween($('Popup_overlay'), 'opacity',{duration: 'normal', transition: Fx.Transitions.Sine.easeInOut}).start(0,0.6);
    $("Popup_overlay").onclick=function(){UPOC.Popup.close()};

    //create popup window
    new Element('div').setProperty('id', 'Popup_window').injectInside(document.body);
	$('Popup_window').setOpacity(0);

    //display hidden div, inject
    $(targetEl).setStyle('display','block');
    $(targetEl).injectInside($('Popup_window'));

    //measure hidden div
    //*&* UPOC.Popup.width = $('Popup_window').getSize()['size']['x'];
    //*&* UPOC.Popup.height = $('Popup_window').getSize()['size']['y'];
    UPOC.Popup.width = $('Popup_window').getSize().x;
    UPOC.Popup.height = $('Popup_window').getSize().y;

    UPOC.Popup.position();

    //display div, properly sized and positioned
    //*&* new Fx.Style('Popup_window', 'opacity',{duration: 400, transition: Fx.Transitions.sineInOut}).start(0,1);
    //$('Popup_window').setOpacity(1);
    new Fx.Tween($('Popup_window'), 'opacity',{duration: 'normal', transition: Fx.Transitions.Sine.easeInOut}).start(0,1);

    window.onscroll=UPOC.Popup.positionFx;

    if(targetEl === "signIn"){
        $('signInFormBtn').removeEvents('click');
        if((typeof successFn) === "function"){
            $('signInFormBtn').addEvent('click', function(){
                UPOC.Auth.loginAttempt(successFn);
                //setTimeout(successFn,1000);
                //event = new Event(event).stop();
            });
        }else{
            $('signInFormBtn').addEvent('click', function(){
                UPOC.Auth.loginAttempt();
                //event = new Event(event).stop();
            });
        }
    }

};
/*
UPOC.Popup.openLogin = function(targetEl,successFn){
    //alert("removing events");
    //$('signInFormBtn').removeEvents('click');
    //alert("events removed");
    UPOC.Popup.open(targetEl);



    //$('signInFormBtn').addEvent('click', function(){alert("added event"); return false;});
    if((typeof successFn) === "function"){
        $('signInFormBtn').addEvent('click', function(){
            setTimeout(successFn,1000);
            return false;
        });
    }

}
 */
UPOC.Popup.close = function(){

    //remove events to prevent leaks
    $("Popup_overlay").onclick=null;
	document.onkeyup=null;
	document.onkeydown=null;

    //fade out
    //*&* new Fx.Style('Popup_window', 'opacity',{duration: 250, transition: Fx.Transitions.sineInOut, onComplete:function(){
    new Fx.Tween($('Popup_window'), 'opacity',{duration: 250, transition: Fx.Transitions.Sine.easeInOut, onComplete:function(){

        $('Popup_window').getFirst().setStyle('display','none');
        $('Popup_window').getFirst().injectInside($('wrap'));
        $('Popup_window').remove();
    } }).start(1,0);
	//*&* new Fx.Style('Popup_overlay', 'opacity',{duration: 400, transition: Fx.Transitions.sineInOut, onComplete:function(){$('Popup_overlay').remove();} }).start(0.6,0);
    new Fx.Tween($('Popup_overlay'), 'opacity',{duration: 400, transition: Fx.Transitions.Sine.easeInOut, onComplete:function(){$('Popup_overlay').remove();} }).start(0.6,0);

    //remove more events
	window.onscroll=null;
	window.onresize=null;

    $('Popup_HideSelect').remove();
	return false;

};

UPOC.Popup.positionFx = function(){
	//new Fx.Styles('Popup_window', {duration: 75, transition: Fx.Transitions.sineInOut}).start({
	//	'left':(window.getScrollLeft() + (window.getWidth() - UPOC.Popup.width)/2)+'px',
	//	'top':(window.getScrollTop() + (window.getHeight() - UPOC.Popup.height)/2)+'px'});
     //TODO add trasition
    $('Popup_window').setStyles({"left":(window.getScrollLeft() + (window.getWidth() - UPOC.Popup.width)/2)+'px',
    'top':(window.getScrollTop() + (window.getHeight() - UPOC.Popup.height)/2)+'px'
    });
};

UPOC.Popup.position = function(){
  //alert('popup - width:'+UPOC.Popup.width+' height:'+UPOC.Popup.height);
  //alert('window - width:'+window.getWidth()+' scrollleft:'+window.getScrollLeft()+' height:'+window.getHeight()+' scrolltop:'+window.getScrollTop());
    $("Popup_window").setStyles({width: UPOC.Popup.width+'px',
	    //left: (window.getScrollLeft() + (window.getWidth() - UPOC.Popup.width)/2)+'px',
	    left: '250px',
		//top: (window.getScrollTop() + (window.getHeight() - UPOC.Popup.height)/2)+'px'});
		top: '200px'});
};

UPOC.Popup.sizeOverlay = function(){
	// we have to set this to 0px before so we can reduce the size / width of the overflow onresize
	$("Popup_overlay").setStyles({"height": '0px', "width": '0px'});
    $("Popup_HideSelect").setStyles({"height": '0px', "width": '0px'});
	$("Popup_overlay").setStyles({"height": window.getScrollHeight()+'px', "width": window.getScrollWidth()+'px'});
    $("Popup_HideSelect").setStyles({"height": window.getScrollHeight()+'px',"width": window.getScrollWidth()+'px'});
};

UPOC.Popup.basic = function(text){
   UPOC.Popup.open('miscError');
   $('miscErrorBody').setHTML(text);
};