var HomeMarksBase = {
  
  flashMoods: $A(['good','bad','indif']),
  flashMoodColors: $H({ good:'spring_green', bad:'red', indif:'aqua' }),
  
  getRequestMood: function(request) {
    return (request.status >= 200 && request.status < 300) ? 'good' : 'bad';
  },
  
  linkToDelete: function(event) {
    event.stop();
    var e = event.element();
    var a = e.readAttribute('href') ? e : e.up('a');
    var form = FORM({action:a.href, method:'post'},[
      INPUT({type:'hidden',name:'_method',value:'delete'}),
      INPUT({type:'hidden',name:'authenticity_token',value:authParams.get('authenticity_token')})]
    );
    var container = new Element('div').update(form).down().hide();
    a.insert({bottom:container});
    form.submit();
    return false;
  },
  
  messagesToAlert: function(request) {
    var messages = request.responseJSON;
    var alertText = messages.join(".\n");
    if (alertText.endsWith('.')) { alert(alertText); } else { alert(alertText+'.'); };
  },
  
  messagesToList: function(request) {
    var messages = request.responseJSON;
    var messageList = UL();
    messages.each(function(message){ 
      messageList.appendChild( LI(message.escapeHTML()) );
    });
    return messageList;
  },
  
  redirectToUserHome: function() {
    window.location = '/myhome';
  },
  
  scroll: function() { return document.viewport.getScrollOffsets(); },
  
  viewSize: function() { return document.viewport.getDimensions(); },
  
  pageSize: function() { 
    var xScroll, yScroll;
    if (window.innerHeight && window.scrollMaxY) {	
  		xScroll = window.innerWidth + window.scrollMaxX;
  		yScroll = window.innerHeight + window.scrollMaxY;
  	} else if (document.body.scrollHeight > document.body.offsetHeight){
  		xScroll = document.body.scrollWidth;
  		yScroll = document.body.scrollHeight;
  	} else {
  		xScroll = document.body.offsetWidth;
  		yScroll = document.body.offsetHeight;
  	}
	  var windowWidth, windowHeight;
  	if (self.innerHeight) {
  		if(document.documentElement.clientWidth){
  			windowWidth = document.documentElement.clientWidth; 
  		} else {
  			windowWidth = self.innerWidth;
  		}
  		windowHeight = self.innerHeight;
  	} else if (document.documentElement && document.documentElement.clientHeight) {
  		windowWidth = document.documentElement.clientWidth;
  		windowHeight = document.documentElement.clientHeight;
  	} else if (document.body) { 
  		windowWidth = document.body.clientWidth;
  		windowHeight = document.body.clientHeight;
  	}	
  	if(yScroll < windowHeight){
  		pageHeight = windowHeight;
  	} else { 
  		pageHeight = yScroll;
  	}
  	if(xScroll < windowWidth){	
  		pageWidth = xScroll;		
  	} else {
  		pageWidth = windowWidth;
  	}
  	return { width: pageWidth, height: pageHeight };
  }
  
};


document.observe('dom:loaded', function(){
  $$('a[data-method=delete]').each(function(a){ a.observe('click', HomeMarksBase.linkToDelete); });
});





var HomeMarksModalClass = Class.create(HomeMarksBase,{
  
  initialize: function() {
    this.build();
    this.mask = $('modalmask'); 
    this.progress = $('modal_progress');
    this.apWrapper = $('modal_html_ap-wrapper');
    this.relWrapper = $('modal_html_rel-wrapper');
    this.topShadow = $('modal_html_top');
    this.contentWrap = $('modal_html');
    this.content = $('modal_content');
    this.initButtons();
    this.queue = {position:'end', scope:'modalscope'};
  },
  
  build: function() {
    var body = $$('body').first();
    var maskHTML = DIV({id:'modalmask',style:'display:none;'},[DIV({id:'modal_progress',style:'display:none;',onclick:'location.reload();'})]);
    var modalHTML = DIV({id:'modal_html_ap-wrapper'},[
      DIV({id:'modal_html_rel-wrapper',style:'display:none;'},[
        DIV({id:'modal_html_border'},[
          DIV({id:'modal_html'},[
            DIV({id:'modal_content'}),
            DIV({id:'modal_buttons',className:'clearfix'},[
              DIV({id:'modal_button_save',style:'display:none;'}),
              DIV({id:'modal_button_cancel',style:'display:none;'})
            ])
          ]),
        ]),
        DIV({id:'modal_html_top'})
      ])]
    );
    body.insert({top:modalHTML});
    body.insert({top:maskHTML});
  },
  
  show: function(content) {
    var options = Object.extend({contentFor:'misc',color:'timberwolf',showProgress:false}, arguments[1] || {});
    this.contentFor = options.contentFor;
    this.color = options.color;
    this.updateContent(content);
    this.showContentButtons();
    this.toggleMask('on');
    if (options.showProgress) { this.toggleProgress('on') };
    this.toggleObservers('on');
    this.toggleModal('on');
    // TODO: Account for action area.
    // document.stopObserving('keypress', actionAreaHelper);
    // if (this.action_bar().hasClassName('barout')) { toggleActionArea('inbox'); }
  },
  
  showBookmarkModal: function(content) {
    this.show(content,{contentFor:'bookmark',showProgress:true});
    this.bmLoading = $('loadinghomemarks');
    this.bmForm = $('savehomemarks_form');
    this.bmName = $('savehomemarks_name');
    if (this.bmLoading) { 
      this.bmLoading.remove();
      this.bmName.value = document.title;
    };
    this.bmForm.observe('submit',this.saveBookmarkModal.bindAsEventListener(this));
    this.saveButton.observe('click',this.saveBookmarkModal.bindAsEventListener(this));
  },
  
  saveBookmarkModal: function(event) {
    event.stop();
    var rjsCreate = document.createElement('script');
    rjsCreate.type = 'text/javascript';
    rjsCreate.src = this.bmForm.action + '&' + this.bmForm.serialize();
    this.bmForm.disable();
    document.body.appendChild(rjsCreate);
    return false;
  },
  
  startHide: function() {
    this.toggleObservers('off');
    this.toggleProgress('on');
    this.toggleModal('off');
  },
  
  completeHide: function() {
    this.toggleProgress('off');
    this.toggleMask('off');
  },
  
  hide: function() {
    this.startHide();
    this.completeHide();
    if (this.contentFor == 'bookmark' && !this.bmLoading) {
      setTimeout(function(){ 
        window.location.href = $('savehomemarks_url').value;
      },0650);
    };
    // TODO: Account for action area.
    // document.observe('keypress', actionAreaHelper);
  },

  updateContent: function(content) {
    this.topShadow.setStyle({width:this.dimensions().topWidth+'px'});
    this.contentWrap.setStyle({width:this.dimensions().contentWidth, height:this.dimensions().contentHeight});
    this.contentWrap.className = this.color;
    if (content) { this.content.update(content); };
    this.center();
  },
  
  showContentButtons: function() {
    this.allButtons.invoke('hide');
    switch (this.contentFor) { 
      case 'misc'     : $A([this.cancelButton]).invoke('show'); break;
      case 'box'      : $A([this.cancelButton,this.saveButton]).invoke('show'); break; 
      case 'bookmark' : $A([this.cancelButton,this.saveButton]).invoke('show'); break; 
    }
  },
  
  center: function() {
    this.mask.setStyle({height: this.pageSize().height + 'px'});
    this.progress.setStyle({top: (this.scroll().top + 60) + 'px'});
    var total = this.pageSize().width - this.dimensions().topWidth;
    var left = (total/2).ceil();
    if (left < 0) left = 0;
    this.apWrapper.setStyle({left:left+'px'});
  },
  
  dimensions: function() {
    switch (this.contentFor) { 
      case 'misc'     : return { topWidth:452, contentWidth:'400px', contentHeight:'auto' };
      case 'box'      : return { topWidth:652, contentWidth:'600px', contentHeight:'300px' }; 
      case 'bookmark' : return { topWidth:352, contentWidth:'300px', contentHeight:'145px' }; 
    }
  },
  
  toggleMask: function(toggle) {
    var options = { duration:0.2, queue:this.queue };
    if (toggle == 'on') { this.mask.appear(Object.extend(options,{from:0.0,to:0.9})); }
    else { this.mask.fade(options); };
  },
  
  toggleObservers: function(toggle) {
    if (toggle == 'on') {
      this.modalResizeObserver = this.center.bindAsEventListener(this);
      Event.observe(window,'resize', this.modalResizeObserver);
      Event.observe(window,'scroll', this.modalResizeObserver);
      this.keypressObserver = this.keypress.bindAsEventListener(this);
      document.observe('keypress', this.keypressObserver);
    }
    else {
      Event.stopObserving(window,'resize',this.modalResizeObserver);
      Event.stopObserving(window,'scroll',this.modalResizeObserver);
      document.stopObserving('keypress',this.keypressObserver);
    };
  },
  
  toggleProgress: function(toggle) {
    var options = {duration:0.2, queue:this.queue}
    if (toggle == 'on') { this.progress.appear(options); } else { this.progress.fade(options); };
  },
  
  toggleModal: function(toggle) {
    var options = { duration:0.4 }; // Helps speed by removing: queue:this.queue} 
    if (toggle == 'on') { this.relWrapper.slideDown(options); } else { this.relWrapper.slideUp(options); };
  },
  
  keypress: function(event) {
    if (event.keyCode == Event.KEY_ESC) { this.hide(); };
  },
  
  initButtons: function() {
    this.cancelButton = $('modal_button_cancel');
    this.cancelButton.observe('click',this.hide.bindAsEventListener(this))
    this.saveButton = $('modal_button_save');
    this.allButtons = $A([this.cancelButton,this.saveButton]);
  }
  
  
});


document.observe('dom:loaded', function(){
  HomeMarksModal = new HomeMarksModalClass();
});