// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults
Event.observe(window, "load", initialize);

function initialize(){
  hide_feedback_after('success', 5, 2)
  hide_feedback_after('failure', 10, 2)

  if ($('user_password_confirmation')){
    Event.observe('user_password_confirmation', 'keyup', check_user_password_alikeness);
  }

  if ($('choose_mask_id')){
    Event.observe('choose_mask_id', 'change', put_on_mask);
  }
}

function put_on_mask(){
  new Ajax.Request("/gateway/wear_mask", {
    parameters: $('choose_mask_form').serialize(true),
    onSuccess: function(transport) {
      show_feedback('success', "transformation complete");
      hide_feedback_after('success', 5, 2);
    }
  });
}

function show_feedback(type, message){
  $('feedback').show();
  $(type).innerHTML = message;
  $(type).show();
}

function hide_feedback_after(type, wait, duration){
  setTimeout("hide_feedback('"+type+"', '"+duration+"');", wait);
}

function hide_feedback(type, duration){
  new Effect.Fade($(type), { duration: duration });
}

function check_user_password_alikeness(){
  if($F('user_password') == $F('user_password_confirmation')){
    $('user_password_success').innerHTML = "YES" 
  }else{
    $('user_password_success').innerHTML = "NO" 
  }
}