/*

MoDi - for modal dialogues

*/
var MoDi = new Class({
	Implements: [Events, Options],
	options: {
			backgroundOpacity: 0.8,
           panelStyles: {
               width: 600,
               height: 400,
               backgroundColor: '#323232',
           },
           backStyles: {
              backgroundColor: '#000000',

           },
		   closeImage: "url('assets/whtacctg/img/close.png')"
	},
	initialize: function(options) {
         this.setOptions(options);
      this.createElements();

	},
   show: function() {
      //panel math
      var panel = {};
      panel.height = this.elements.moDiPanel.getSize();
      panel.height = panel.height.y;
      panel.from = (panel.height / 2) * -1;
      panel.to = window.getSize();
      panel.to = (panel.to.y / 2)
      this.elements.moDiBack.setStyles({
         'visibility': 'visible',
         'opacity': 0,
      });
      this.elements.moDiPanel.setStyles({
         'visibility': 'visible',
         'top': panel.from,
      });
      var fx = {
         moDiBack: new Fx.Tween(this.elements.moDiBack, {
            complete: function() {
               
            },
            duration: '500',
            property: 'opacity'
         }),
         moDiPanel: new Fx.Tween(this.elements.moDiPanel, {
            complete: function() {
               
            },
            duration: '750',
            property: 'top',
         transition: Fx.Transitions.Quad.easeOut
         })
      };
      fx.moDiBack.start(0,this.options.backgroundOpacity);
      fx.moDiPanel.start(panel.from, panel.to);
   },
   hide: function(event) {
      if ((event) && (this.modal)) {
	 if (
	    (event.target == this.elements.moDiBack) ||
	    (event.target == this.elements.moDiClose)
	 ) return;
      }
      //panel math
      var panel = {};
      panel.height = this.elements.moDiPanel.getSize();
      panel.height = panel.height.y;
      panel.from = this.elements.moDiPanel.getStyle('top');
      panel.to = (panel.height / 2) * -1;

      var fx = {
         moDiBack: new Fx.Tween(this.elements.moDiBack, {
            complete: function() {
               this.elements.moDiBack.setStyles({
                  'visibility': 'hidden',
               });
            }.bind(this),
            duration: '750',
            property: 'opacity'
         }),
         moDiPanel: new Fx.Tween(this.elements.moDiPanel, {
            complete: function() {
               this.elements.moDiPanel.setStyles({
                  'visibility': 'hidden',
                  'top': panel.from,
               });
            },
            duration: '500',
            property: 'top',
            transition: Fx.Transitions.Quad.easeIn
         })
      };
      fx.moDiBack.start(this.options.backgroundOpacity,0);
      fx.moDiPanel.start(panel.from, panel.to);

   },
   setContent: function(content, modal) {
      this.modal = modal ? true : null;
      this.elements.moDiPanel.empty();
      if (!modal) this.elements.moDiPanel.grab(this.elements.moDiClose);
      this.elements.moDiPanel.adopt(content);
   },
   spin: function() {
      this.spinner = new Spinner(this.elements.moDiPanel);
      this.spinner.show();
   },
   unspin: function() {
      this.spinner.hide();
      this.spinner.destroy();
      this.spinner = null;
   },
	createElements: function() {
		this.options.panelStyles.marginTop = this.options.panelStyles.height * -0.5;
		this.options.panelStyles.marginLeft = this.options.panelStyles.width * -0.5;
		this.elements.moDiBack = render([
			'div#moDiBack.moDi',
			{
				styles: this.options.backStyles,
				events: { click: this.hide.bind(this) }
			}
		]);
		this.elements.moDiPanel = render([
			'div#moDiPanel.moDi',
			{
				styles: this.options.panelStyles
			}
		]);
      this.elements.moDiClose = render([
		'div#moDiClose.moDi',
		{ 
			styles: { backgroundImage: this.options.closeImage },
			events: { click: this.hide.bind(this) }
		}
		]);
      $$('body').adopt(this.elements.moDiBack);
      $$('body').adopt(this.elements.moDiPanel);
	  utils.styleSheet(this.moDiStyles);
   },
	moDiStyles: {
		'#moDiBack': {
			visibility: 'hidden',
			position: 'fixed',
			display: 'block',
			width: '100%',
			height: '100%',
			left: 0,
			top: 0,
			zIndex: 50
		},
		'#moDiPanel': {
			visibility: 'hidden',
			position: 'fixed',
			display: 'block',
			left: '50%',
			zIndex: '51'
		},
		'#moDiClose': {
			position: 'absolute',
			display: 'block',
			right: '0px',
			top: '0px',
			margin: '-18px',
			width: '36px',
			height: '36px',
			//backgroundImage: closeImage,
			zIndex: 100
		}
	},
   elements: {},
   spinner: null,
});

Window.implement('render', function(template) {
	var elements = [];
	template.each(function(item, index) {
		if (typeOf(item) == 'element') elements.push(item);
		else if (typeOf(item) == 'array') elements[elements.length - 1].adopt(render(item));
		else if (typeOf(item) == 'object') elements[elements.length - 1].set(item);
		else if ((typeOf(item) == 'string') && (item.substr(0,1) == '"')) elements.push(document.createTextNode(item.substr(1)));
		else if (typeOf(item) == 'string') elements.push(new Element(item));
		else return null; //items must be string or array.
	});
	if (elements.length == 1) return elements[0];
	else return elements;
});
var utils = {};
utils.styleSheet = function(styles) {
	this.temp = new Element('div');
	var style = new Element('style').inject(document.head);
	style = style.styleSheet || style.sheet;
	Object.each(styles, function(rules, selector){
		this.temp.setStyles(rules);
		if (style.addRule) style.addRule(selector, this.temp.style.cssText);   
		else style.insertRule(selector+'{'+this.temp.style.cssText+'}', sheet.cssRules.length);
		this.temp.style.cssText = '';
	}, this);
};

var AjaxMailStuff = new Class({
   Implements: [Events, Options],
   options: {
      requestUrl: '/46', 
      debug: 1,
   },
   initialize: function(options) {
      this.setOptions(options);
      this.createRequest();
   },
   createRequest: function() {
      this.request = new Request.JSON({
         url: this.options.requestUrl,
         onSuccess: function(response) {
            this.response(response);
         }.bind(this),
         onError: function(text, error) {
            if (this.options.debug) console.log(error);
            if (this.options.debug) console.log(text);
            this.response({'flag':8});
         }.bind(this),
         onFailure: function(response) {
			if (this.options.debug) console.log(response);
			if (this.options.debug) console.log('onFailure triggered');
            this.response({'flag':9});
         }.bind(this)
      });      
   },
   response: function(flag) {
      var codesConsole = {
         1: 'Successfully subscribed',
         2: 'Error: Already Subscribed',
         3: 'Error: Not Subscribed (cannot unsub)',
         4: 'Successfully unsubscribed',
         5: 'Nothing to do.. no action specified',
         6: 'Email sent successfully',
         7: 'Email not sent',
         8: 'data could not be JSON encoded',
         9: 'no response - ajax error',
      };
      var codesUser = {
         1: 'Thankyou! You have been added to our mailing list.',
         2: 'It looks like you were already on our mailing list!',
         3: 'We do not seem to have that email address on our list.',
         4: 'You are no longer subscribed to our mailing list. Sorry to see you go.',
         5: 'Oh dear. Some error has occurred - our trained monkeys have been notified and are working to resolve the problem, please try again later.',
         6: 'Thankyou! Your email has been sent, someone will be in touch as soon as possible.',
         7: 'Oh dear. Some error has occurred - our trained monkeys have been notified and are working to resolve the problem, please try again later.',
         8: 'Oh dear. Some error has occurred - our trained monkeys have been notified and are working to resolve the problem, please try again later.',
         9: 'Oh dear. Some error has occurred - our trained monkeys have been notified and are working to resolve the problem, please try again later.',
      };
      //if (this.options.debug) console.log(codesConsole[flag['flag']]);
      this.callback(codesUser[flag['flag']]);
   },
   request: null,
});