/**

 * Sexy Alert Box - for mootools 1.2 - jQUery 1.3

 * @name sexyalertbox.v1.2.js

 * @author Eduardo D. Sada - http://www.coders.me/web-js-html/javascript/sexy-alert-box

 * @version 1.2.1

 * @date 27-Feb-2009

 * @copyright (c) 2009 Eduardo D. Sada (www.coders.me)

 * @license MIT - http://es.wikipedia.org/wiki/Licencia_MIT

 * @example http://www.coders.me/ejemplos/sexy-alert-box/

 * @based in <PBBAcpBox> (Pokemon_JOJO, <http://www.mibhouse.org/pokemon_jojo>)

 * @thanks to Pokemon_JOJO!

 * @features:

 * * Chain Implemented (Cola de mensajes)

 * * More styles (info, error, alert, prompt, confirm)

 * * ESC would close the window

 * * Focus on a default button

*/



/*

Class: SexyAlertBox

	Clone class of original javascript function : 'alert', 'confirm' and 'prompt'



Arguments:

	options - see Options below



Options:

	name - name of the box for use different style

	zIndex - integer, zindex of the box

	onReturn - return value when box is closed. defaults to false

	onReturnFunction - a function to fire when return box value

	BoxStyles - stylesheets of the box

	OverlayStyles - stylesheets of overlay

	showDuration - duration of the box transition when showing (defaults to 200 ms)

	showEffect - transitions, to be used when showing

	closeDuration - Duration of the box transition when closing (defaults to 100 ms)

	closeEffect - transitions, to be used when closing

	onShowStart - a function to fire when box start to showing

	onCloseStart - a function to fire when box start to closing

	onShowComplete - a function to fire when box done showing

	onCloseComplete - a function to fire when box done closing

*/

$(document).ready(function(){

  Sexy.initialize();

});



jQuery.bind = function(object, method){

  var args = Array.prototype.slice.call(arguments, 2);  

  return function() {

    var args2 = [this].concat(args, $.makeArray( arguments ));  

    return method.apply(object, args2);  

  };  

};  



jQuery.fn.delay = function(time,func){

	return this.each(function(){

		setTimeout(func,time);

	});

};





jQuery.fn.extend({

  $chain : [],

  chain: function(fn) {

    this.$chain.push(fn);

    return this;

  },

  callChain: function(context) {

    return (this.$chain.length) ? this.$chain.pop().apply(context, arguments) : false;

  },

  clearChain: function(){

    this.$chain.empty();

    return this;

  }

});



(function($) {



  Sexy = {

    getOptions: function() {

      return {

        name            : 'SexyAlertBox',

        zIndex          : 65555,

        onReturn        : false,

        onReturnFunction: function(e) {},

        BoxStyles       : { 'width': 500 },

        OverlayStyles   : { 'backgroundColor': '#9c9e95', 'opacity': 0.7 },

        showDuration    : 200,

        closeDuration   : 100,

        moveDuration    : 500,

        onCloseComplete : $.bind(this, function() {

          this.options.onReturnFunction(this.options.onReturn);

        })

      };

    },





    initialize: function(options) {

      this.i=0;

      this.options = $.extend(this.getOptions(), options);

			$('body').append('<div id="BoxOverlay"></div><div id="'+this.options.name+'-Box"><div id="'+this.options.name+'-InBox"><div id="'+this.options.name+'-BoxContent"><div id="'+this.options.name+'-BoxContenedor"></div></div></div></div>');

			

			this.Content    = $('#'+this.options.name+'-BoxContenedor');

			this.Contenedor = $('#'+this.options.name+'-BoxContent');

			this.InBox      = $('#'+this.options.name+'-InBox');

			this.Box        = $('#'+this.options.name+'-Box');

			

			$('#BoxOverlay').css({

        position        : 'absolute',

        top             : 0,

        left            : 0,

				opacity         : this.options.OverlayStyles.opacity,

				backgroundColor : this.options.OverlayStyles.backgroundColor,

				'z-index'       : this.options.zIndex,

        height          : $(document).height(),

				width           : $(document).width()

			}).hide();

			

			this.Box.css({

        display         : 'none',

        position        : 'absolute',

        top             : 0,

        left            : 0,

				'z-index'       : this.options.zIndex + 3,

				width           : this.options.BoxStyles.width + 'px'

			});



      this.preloadImages();



      $(window).bind('resize', $.bind(this, function(){

        if(this.options.display == 1) {

          $('#BoxOverlay').css({

            height          : 0,

            width           : 0

          });
		  
          $('#BoxOverlay').css({
               
            height          : $(document).height(),

            width           : $(document).width()

          });

          this.replaceBox();

        }

      }));



      this.Box.bind('keydown', $.bind(this, function(obj, event){

        if (event.keyCode == 27){

          this.options.onReturn = false;

          this.display(0);

        }      

      }));



      $(window).bind('scroll', $.bind(this, function(){

        this.replaceBox();

      }));

			

    },



    replaceBox: function() {

      if(this.options.display == 1) {

        

        this.Box.stop();

        

        this.Box.animate({

          left  : ( ($(document).width() - this.options.BoxStyles.width) / 2),

          top   : ( $(document).scrollTop() + ($(window).height() - this.Box.outerHeight()) / 2 )

        }, {

          duration  : this.options.moveDuration,

          easing    : 'easeOutBack'

        });



        $(this).delay(this.options.moveDuration, $.bind(this, function() {

          $('#BoxAlertBtnOk').focus();

          $('#BoxPromptInput').focus();

          $('#BoxConfirmBtnOk').focus();

        }));

      }

    },



    display: function(option) {

      if(this.options.display == 0 && option != 0 || option == 1) {





        if (!$.support.maxHeight) { //IE6

          $('embed, object, select').css({ 'visibility' : 'hidden' });

        }





        this.togFlashObjects('hidden');



        this.options.display = 1;





        $('#BoxOverlay').stop();

        $('#BoxOverlay').fadeIn(this.options.showDuration, $.bind(this, function(){

          this.Box.css({

            display         : 'block',

            left            : ( ($(document).width() - this.options.BoxStyles.width) / 2)

          });

          this.replaceBox();

        }));

      

      } else {



        this.Box.css({

          display         : 'none',

          top             : 0

        });



        this.options.display = 0;



        $(this).delay(500, $.bind(this, this.queue));



        $(this.Content).empty();

        this.Content.removeClass();



        if(this.i==1) {

          $('#BoxOverlay').stop();

          $('#BoxOverlay').fadeOut(this.options.closeDuration, $.bind(this, function(){

            $('#BoxOverlay').hide();

            if (!$.support.maxHeight) { //IE6

              $('embed, object, select').css({ 'visibility' : 'visible' });

            }



            this.togFlashObjects('visible');



            this.options.onCloseComplete.call();

          }));

        }

      }

    },



    messageBox: function(type, message, properties, input) {

        

        $(this).chain(function () {



        properties = $.extend({

          'textBoxBtnOk'        : 'OK',

          'textBoxBtnCancel'    : 'Cancelar',

          'textBoxInputPrompt'  : null,

          'password'            : false,

          'onComplete'          : function(e) {}

        }, properties || {});



        this.options.onReturnFunction = properties.onComplete;



        this.Content.append('<div id="'+this.options.name+'-Buttons"></div>');

        if(type == 'alert' || type == 'info' || type == 'error')

        {

            $('#'+this.options.name+'-Buttons').append('<input id="BoxAlertBtnOk" type="submit" />');

            

            $('#BoxAlertBtnOk').val(properties.textBoxBtnOk).css({'width':70});

            

            $('#BoxAlertBtnOk').bind('click', $.bind(this, function(){

              this.options.onReturn = true;

              this.display(0);

            }));

                      

            if(type == 'alert') {

              clase = 'BoxAlert';

            } else if(type == 'error') {

              clase = 'BoxError';

            } else if(type == 'info') {

              clase = 'BoxInfo';

            }

            

            this.Content.addClass(clase).prepend(message);

            this.display(1);



        }

        else if(type == 'confirm')

        {



            $('#'+this.options.name+'-Buttons').append('<input id="BoxConfirmBtnOk" type="submit" /> <input id="BoxConfirmBtnCancel" type="submit" />');

            $('#BoxConfirmBtnOk').val(properties.textBoxBtnOk).css({'width':70});

            $('#BoxConfirmBtnCancel').val(properties.textBoxBtnCancel).css({'width':70});



            $('#BoxConfirmBtnOk').bind('click', $.bind(this, function(){

              this.options.onReturn = true;

              this.display(0);

            }));



            $('#BoxConfirmBtnCancel').bind('click', $.bind(this, function(){

              this.options.onReturn = false;

              this.display(0);

            }));



            this.Content.addClass('BoxConfirm').prepend(message);

            this.display(1);

        }

        else if(type == 'prompt')

        {



            $('#'+this.options.name+'-Buttons').append('<input id="BoxPromptBtnOk" type="submit" /> <input id="BoxPromptBtnCancel" type="submit" />');

            $('#BoxPromptBtnOk').val(properties.textBoxBtnOk).css({'width':70});

            $('#BoxPromptBtnCancel').val(properties.textBoxBtnCancel).css({'width':70});

                        

            type = properties.password ? 'password' : 'text';



            this.Content.prepend('<input id="BoxPromptInput" type="'+type+'" />');

            $('#BoxPromptInput').val(properties.input);

            $('#BoxPromptInput').css({'width':250});



            $('#BoxPromptBtnOk').bind('click', $.bind(this, function(){

              this.options.onReturn = $('#BoxPromptInput').val();

              this.display(0);

            }));



            $('#BoxPromptBtnCancel').bind('click', $.bind(this, function(){

              this.options.onReturn = false;

              this.display(0);

            }));



            this.Content.addClass('BoxPrompt').prepend(message + '<br />');

            this.display(1);

        }

        else

        {

            this.options.onReturn = false;

            this.display(0);		

        }



      });



      this.i++;



      if(this.i==1) {

        $(this).callChain(this);

      }

    },



    queue: function() {

      this.i--;

      $(this).callChain(this);

    },



    chk: function (obj) {

      return !!(obj || obj === 0);

    },



    togFlashObjects: function(state) {

      var hideobj=new Array("embed", "iframe", "object");

      for (y = 0; y < hideobj.length; y++) {

       var objs = document.getElementsByTagName(hideobj[y]);

       for(i = 0; i < objs.length; i++) {

        objs[i].style.visibility = state;

       }

      }

    },



    preloadImages: function() {

      var img = new Array(2);

      img[0] = new Image();img[1] = new Image();img[2] = new Image();

      img[0].src = this.Box.css('background-image').replace(new RegExp("url\\('?([^']*)'?\\)", 'gi'), "$1");

      img[1].src = this.InBox.css('background-image').replace(new RegExp("url\\('?([^']*)'?\\)", 'gi'), "$1");

      img[2].src = this.Contenedor.css('background-image').replace(new RegExp("url\\('?([^']*)'?\\)", 'gi'), "$1");

    },

    



    /*

    Property: alert

      Shortcut for alert

      

    Argument:

      properties - see Options in messageBox

    */		

    alert: function(message, properties) {

      this.messageBox('alert', message, properties);

    },



    /*

    Property: info

      Shortcut for alert info

      

    Argument:

      properties - see Options in messageBox

    */		

    info: function(message, properties){

      this.messageBox('info', message, properties);

    },



    /*

    Property: error

      Shortcut for alert error

      

    Argument:

      properties - see Options in messageBox

    */		

    error: function(message, properties){

      this.messageBox('error', message, properties);

    },



    /*

    Property: confirm

      Shortcut for confirm

      

    Argument:

      properties - see Options in messageBox

    */

    confirm: function(message, properties){

      this.messageBox('confirm', message, properties);

    },



    /*

    Property: prompt

      Shortcut for prompt

      

    Argument:

      properties - see Options in messageBox

    */	

    prompt: function(message, input, properties){

      this.messageBox('prompt', message, properties, input);

    }



  };



})(jQuery);
