﻿
/*
    Flowen
    Javascript Object Library
    Dynamic Classes
*/


/*
    Position Class
*/

var CXPosition = new Class({

    initialize: function() {

        this.CenterPoint = function(contObj, w, h) {
            if(contObj == null)
                contObj = window;
            
            var offsetx = $(contObj).getScroll().x;
            var offsety = $(contObj).getScroll().y;
    
            var wx = $(contObj).getCoordinates().width;
            var wy = $(contObj).getCoordinates().height;
                        
            return({x:parseInt((wx - w)/2) + offsetx, 
                y: parseInt((wy - h)/2) + offsety});
        }

        this.Center = function(contObj, slobj) {
            if(contObj == null)
                contObj = window;
            
            var wdx = $(slobj).getCoordinates(contObj).width;
            var wdy = $(slobj).getCoordinates(contObj).height;
            
            $(slobj).setStyle('left', this.CenterPoint(contObj, wdx, wdy).x + 'px');
            $(slobj).setStyle('top', this.CenterPoint(contObj, wdx, wdy).y + 'px');
        }

    }
});


/*
    Loader Class
*/

var CXLoader = new Class({
    Implements: Events,
    initialize: function(slobj) {

        this.Duration = 1000;        
        this.ShowLoader = function(loadObj)
        {
            $(loadObj).set('tween', {duration: 1000, transition:'linear'});
            $(slobj).tween('opacity', '1');
        }        
    }
});


var CXPopup = new Class({
    Implements: Events,
    initialize: function(slobj) {

        this.Duration = 1000;
        this.Width = 0;
        this.Height = 0;
        //
        this.Left = 0;
        this.Top = 0;
        // Effects
        //      1. appear (defaul)  ... from center fade and grow in size
        //      2. hslide           ... from right
        this.Effect = "appear";
        
        this.Init = function() {
            $(slobj).setStyle ('visibility', 'hidden');
            $(slobj).setStyle ('opacity', '0');
        }
        
        this.Open = function (w, h)
        {
            var _pos = new CXPosition();
            var _cont = document;
            
            var PosX = _pos.CenterPoint(_cont, w, h).x;
            var PosY = _pos.CenterPoint(_cont, w, h).y;            
            $(slobj).setStyle ('width', w + 'px');
            $(slobj).setStyle ('height', h + 'px');
            $(slobj).setStyle ('left', PosX + 'px');
            $(slobj).setStyle ('top', PosY + 'px');
            $(slobj).setStyle ('opacity', '1');        
        }
        
        this.Hide = function()
        {
            $(slobj).setStyle ('opacity', '0'); 
        }
        
        this.ShowPopup = function(w, h)
        {
            var myEffect = new Fx.Morph(slobj, 
                {duration: 1000, transition: Fx.Transitions.Sine.easeOut});    
            
            var _pos = new CXPosition();
            var _cont = document;
            
            var leftStart = 0
            var topStart = 0
            //
            switch(this.Effect)
            {
                case "appear":
                    // Starting Point
                    leftStart = _pos.CenterPoint(_cont, this.Width,  this.Height).x;
                    topStart = _pos.CenterPoint(_cont, this.Width,  this.Height).y;
                    myEffect.start({  
                        'visibility': 'visible',  
                        'width': [this.Width, w], //Morphs the 'width' style
                        'height': [this.Height, h],  //Morphs the 'height' style
                        'left': [leftStart, _pos.CenterPoint(_cont, w, h).x],
                        'top': [topStart,_pos.CenterPoint(_cont, w, h).y]
                    });

                    this.Width = w;
                    this.Height = h;

                    $(slobj).set('tween', {duration: 100, transition:'linear'});
                    $(slobj).tween('opacity', '1');
                    
                    break;
                case "cinema":
                    // Starting Point
                    // leftStart = _pos.CenterPoint(_cont, this.Width,  this.Height).x;
                    $(slobj).setStyle("width", $(window).getCoordinates().width);
                    $(slobj).setStyle("left", '0px');
                    topStart = _pos.CenterPoint(_cont, this.Width,  this.Height).y;
                    myEffect.start({  
                        'visibility': 'visible',  
                        'height': [this.Height, h],  //Morphs the 'height' style
                        'top': [topStart,_pos.CenterPoint(_cont, w, h).y]
                    });

                    this.Width = w;
                    this.Height = h;

                    $(slobj).set('tween', {duration: 100, transition:'linear'});
                    $(slobj).tween('opacity', '1');
                    
                    break;
                case "hslide":
                    $(slobj).setStyle('width', w + 'px');
                    $(slobj).setStyle('height', h + 'px');
                    if(this.Left != 0) 
                    {
                        leftStart = this.Left;
                    }
                    else
                        leftStart = _pos.CenterPoint(_cont, w, h).x;
                    if(this.Top != 0)
                        topStart = this.Top;
                    else 
                        topStart = _pos.CenterPoint(_cont, w,  h).y;
                
                    myEffect.start({  
                        'visibility': 'visible',  
                        'left': [leftStart, _pos.CenterPoint(_cont, w, h).x],
                        'top': [topStart,_pos.CenterPoint(_cont, w, h).y]
                    });

                    this.Width = w;
                    this.Height = h;

                    $(slobj).set('tween', {duration: 100, transition:'linear'});
                    $(slobj).tween('opacity', '1');

                    break;
            }
        }        

        this.ShowBack = function(backObj, op)
        {
            var wx = $(document).getCoordinates().width;
            var wy = $(document).getCoordinates().height;
            var offsetx = 0; //$(document.body).getScroll().x;
            var offsety = 0; //$(document.body).getScroll().y;
        
            // Opacity
            $(backObj).setStyle('width', wx + 'px'); 
            $(backObj).setStyle('height', $(document.body).getScrollSize().y + 'px'); 
            $(backObj).setStyle('opacity', op); 
            $(backObj).setStyle('left', offsetx + 'px'); 
            $(backObj).setStyle('top', offsety + 'px'); 
        }
        
        this.LoadUrl = function(url, htmlObj)
        {
            var myHTMLRequest = new Request({method: 'post', evalScripts:true, evalResponse:false, url: url});
            myHTMLRequest.addEvent("onSuccess", function (responseText, responseXML) {   
                $(htmlObj).set('html', responseText);
                $(htmlObj).fade('hide');
                $(htmlObj).fade('in');
            });
            myHTMLRequest.send();

//            var myHTMLRequest = new Request.HTML();
//            myHTMLRequest.onSuccess = function (responseTree, responseElements, responseHTML, responseJavaScript) {
//            }
//            myHTMLRequest.post(url);
        }
        
        this.Close = function()
        {
            var myEffect = new Fx.Morph(slobj, 
                {duration: 1000, transition: Fx.Transitions.Sine.easeOut});    
            
            var _pos = new CXPosition();
            var _cont = document;
            
            //
            switch(this.Effect)
            {
                case "appear":
                    var w = 0; var h = 0;
                    myEffect.start({  
                        'width': [this.Width, w], //Morphs the 'width' style
                        'height': [this.Height, h],  //Morphs the 'height' style
                        'left': [_pos.CenterPoint(_cont, this.Width,  this.Height).x, _pos.CenterPoint(_cont, w, h).x],
                        'top': [_pos.CenterPoint(_cont, this.Width,  this.Height).y ,_pos.CenterPoint(_cont, w, h).y]
                    });

                    this.Width = w;
                    this.Height = h;

                    $(slobj).set('tween', {duration: 1000, transition:'linear'});
                    $(slobj).tween('opacity', '0');
                    
                    break;
                case "cinema":
                    var w = 0; var h = 0;
                    myEffect.start({  
                        'height': [this.Height, h],  //Morphs the 'height' style
                        'top': [_pos.CenterPoint(_cont, this.Width,  this.Height).y ,_pos.CenterPoint(_cont, w, h).y]
                    });

                    this.Width = w;
                    this.Height = h;
                    
                    window.setTimeout("$(" + slobj + ").setStyle('opacity', '0')", 980);
                    break;
                case "hslide":
                
                    var w = this.Width; var h = this.Height;
                    if(this.Left != 0) 
                        leftStart = (-1) * this.Left;
                    else
                        leftStart = _pos.CenterPoint(_cont, this.Width,  this.Height).x;
                    if(this.Top != 0) 
                        topStart = (-1) * this.Left;
                    else 
                        topStart = _pos.CenterPoint(_cont, this.Width,  this.Height).y;

                    myEffect.start({  
                        'left': [_pos.CenterPoint(_cont, this.Width,  this.Height).x, leftStart],
                        'top': [_pos.CenterPoint(_cont, this.Width,  this.Height).y ,topStart]
                    });

                    break;
            }
        }              
        
        this.CloseBack = function(backObj)
        {
            $(backObj).set('tween', {duration: 400, transition:'linear'});
            $(backObj).tween('opacity', '0');  
 
        }
    }
    
});

