$(function() {
  $('.hoverable').live('mouseover mouseout', function(event) {
    if (event.type == 'mouseover') {
      $(this).addClass('hover');
    } else {
      $(this).removeClass('hover');
    }
  });
});

var Router = {
  url: function() {
    var result = BASE_URL;
    for(var i = 0; i < arguments.length; ++i) {
      result += arguments[i] + '/';
    }
    return result;
  }
};

var Utility = {
  slug: function(text) {
    return $.trim(text).toLowerCase()
                       .replace(/'/g, '')
                       .replace(/[^a-z0-9\-]+/g, '-')
                       .replace(/-{2,}/g, '-')
                       .replace(/(^-+|-+$)/, '');
  }
};

var Analytics = {
  record: function(type) {
    $.post(Router.url('analytics', type));
  }
};

var Tab = {
  type: null,
  collapsed: true,
  
  heights: {'login': 100,
            'register': 100,
            'profile': 160},
  
  toggle: function(type) {
    if(this.collapsed) {
      this.pane(type);
      this.expand(type);
    } else {
      if(this.type == type) {
        this.collapse(type);
      } else {
        this.pane(type);
      }
    }
  },
  
  pane: function(type) {
    var form = $('#tab-form');
    var tabs = $('#tabs, #tabs-background');
    var tab = $('#' + type + '-tab');
    var pane = $('#' + type + '-pane');
    var height = this.heights[type];
    
    if(this.collapsed) {      
      $('.tab-pane').hide();
      
      form.css('top', -height + 'px');
      pane.css('top', -height + 'px');
      tabs.css('top', height + 'px');
      
      pane.show();
    } else {
      var currentHeight = this.heights[this.type];
      var difference = currentHeight - height;
      
      
      if(difference < 0) {
        //The current pane is shorter than the new pane, swap panes, then animate
        form.css('top', difference + 'px');
        
        $('.tab-pane').hide();
        pane.show();
        
        tabs.css('top', height + 'px');
        form.animate({top: 0});
      } else if(difference > 0) {
        //The current pane is taller than the new pane, animate, then swap panes
        form.animate({top: -difference}, 'normal', 'swing', function() {
          $('.tab-pane').hide();
          pane.show();
          
          tabs.css('top', height + 'px');
          form.css('top', 0 + 'px');
        });
      } else {
        $('.tab-pane').hide();
        pane.show();
      }
    }
    
    $('.tab').removeClass('active');
    tab.addClass('active');
    this.type = type;
  },
  
  expand: function(type) {
    $('#tab-form').animate({top: 0});
    this.collapsed = false;
  },
  
  collapse: function(type) {
    $('.tab').removeClass('active');
    $('#tab-form').animate({top: -this.heights[type]});
    this.collapsed = true;
  }
};

var Facebook = {
  login: function(url) {
    var  screenX    = typeof window.screenX != 'undefined' ? window.screenX : window.screenLeft,
         screenY    = typeof window.screenY != 'undefined' ? window.screenY : window.screenTop,
         outerWidth = typeof window.outerWidth != 'undefined' ? window.outerWidth : document.body.clientWidth,
         outerHeight = typeof window.outerHeight != 'undefined' ? window.outerHeight : (document.body.clientHeight - 22),
         width    = 1040,
         height   = 580,
         left     = parseInt(screenX + ((outerWidth - width) / 2), 10),
         top      = parseInt(screenY + ((outerHeight - height) / 2.5), 10),
         features = (
            'width=' + width +
            ',height=' + height +
            ',left=' + left +
            ',top=' + top
          );
    
    var handle = window.open(url, 'Login_by_facebook', features);
    
    if (window.focus) {
      handle.focus();
    }
    return false;
  }
};

/**
 * This function is included in base because the rail poll is a global element
 */
function submitPoll(pollId, width) {
  var option = $('.poll-options-' + pollId + ':checked');
  
  if(!option.length) {
    alert('To vote you must select an option');
  } else {
    $.post(Router.url('poll', pollId, 'vote', option.val()), {'width': width},
      function(result) {
        if(result.status == 'success') {
          $('#poll-' + pollId).html(result.message);
        } else {
          alert(result.message);
        }
      }, 'json');
  }
}

function loginUserAccount() {
  $.post(Router.url('login'), {'identifier': $('#login-identifier').val(),
                               'password':   $('#login-password').val()   },
    function(result) {
      if(result.status == 'success') {
        window.location.reload();
      } else {
        alert(result.message);
      }
    }, 'json'
  );
}

function registerUserAccount() {
  if($('#register-agree:checked').length == 0) {
    alert('You must agree to the Terms of Service to Register');
    return;
  }
  
  $.post(Router.url('register'), {'email':    $('#register-email').val(),
                                  'password': $('#register-password').val() },
    function(result) {
      if(result.status == 'success') {
        window.location.reload();
      } else {
        Tab.expand('register');
        alert(result.message);
      }
    }, 'json'
  );
}

function updateUserAccount() {
  $.post(Router.url('user', 'account'), {'username':  $('#profile-username').val(),
                                         'firstname': $('#profile-firstname').val(),
                                         'lastname':  $('#profile-lastname').val(),
                                         'gender':    $('#profile-gender').val()    },
    function(result) {
      if(result.status == 'success') {
        $('#profile-tab').html(result.profile);
        Tab.collapse('profile');
      } else {
        alert(result.message);
      }
    }, 'json'
  );
}

function updateUserAvatar(avatar) {
  $('#avatar-container').fadeTo('fast', 0.2);
  $.post(Router.url('user', 'avatar'), {'avatar': avatar},
    function(result) {
      if(result.status == 'success') {
        $('#avatar-container').html(result.avatar);
        $('#profile-tab').html(result.profile);
        $('#avatar-container').fadeTo('fast', 1.0);
      } else {
        alert(result.message);
        $('#avatar-container').fadeTo('fast', 1.0);
      }
    }, 'json'
  );
}

function profileCheckUsername() {
  $.post(Router.url('user', 'check-username'), {'username': $('#profile-username').val()},
    function(result) {
      if(result.status == 'success') {
        if($('#profile-username-failure:visible').length) {
          $('#profile-username-failure').fadeOut('normal', function() {
            $('#profile-username-success').fadeIn();
          });
        } else {
          $('#profile-username-success').fadeIn();
        }
      } else if(result.status == 'error') {
        if($('#profile-username-success:visible').length) {
          $('#profile-username-success').fadeOut('normal', function() {
            $('#profile-username-failure').fadeIn();
            $('#profile-username').val(result.message);
          });
        } else {
          $('#profile-username-failure').fadeIn();
          $('#profile-username').val(result.message);
        }
      } else if(result.status == 'clear') {
        $('.profile-username-status').fadeOut();
      }
    }, 'json'
  );
}

$(function() {
  $('.tab-handle').click(function() {
    Tab.toggle(this.id.split('-')[0]);
  });
  
  $('#login-identifier,#login-password').keypress(function(event) {
    if(event.keyCode == 13) {
      loginUserAccount();
    }
  });
  
  $('#register-email,#register-password').keypress(function(event) {
    if(event.keyCode == 13) {
      registerUserAccount();
    }
  });
  
  $('#profile-username,#profile-firstname,#profile-lastname').keypress(function(event) {
    if(event.keyCode == 13) {
      updateUserAccount();
    }
  });
});