// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults

var TWEET_SIZE = 140;
var INSERTED_TEXT_SIZE = 16;
var SIZE_LIMIT = TWEET_SIZE - INSERTED_TEXT_SIZE;
var HELP_STATE = 'closed';
var BOTTOM_FOLD_OPEN_HEIGHT = '400px';
var BOTTOM_FOLD_CLOSE_HEIGHT = '58px';

// Set up headers for javascript
jQuery.ajaxSetup({
  'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")}
});
 
 
// Provide a message to the user showing how many chars they have left before
// reaching the request size limit.
function limitRequestAreaChars(){
  var requestText = $('#tweet_request').val();
  var totalLength = (requestText + $('#tweet_screen_name').val()).length;
  var remainingCount = SIZE_LIMIT-totalLength;
  
  //display characters remaining
  $('#request_limit_info').html("" + remainingCount);
  
  //disable submit button if we have exceeded the limit
  if (remainingCount < 0) {
    $('#tweet_it_submit').attr('disabled', true);
    $('#tweet_it_submit').attr('src', '/images/tweet_it_disabled.png');
  }
  else {
    $('#tweet_it_submit').removeAttr('disabled');
    $('#tweet_it_submit').attr('src', '/images/tweet_it_btn.png');
  }
  
  //alter text color depending on characters remaining
  if(remainingCount > 20){
    $('#request_limit_info').css("color","#cccccc");
  }
  else if(remainingCount > 10){
    $('#request_limit_info').css("color","#5c0002");
  }
  else {
    $('#request_limit_info').css("color","#d40d12");
  }
};

//Show all images 
function showImages() {
  $('img').show();
};
 
$(document).ready(function() {
//  jQuery.validator.messages.required = "We're sorry, but your tweet can not be empty.";
 
  //initialize char count display
  limitRequestAreaChars();
 
  //tooltip for user images
  $('#latest_tweets .thumb').tooltip({
    bodyHandler: function() {
      return $(this).children('#info').html();      
    },
    showURL: false,
    track: true,
    delay: 0,
    opacity: 1,
    top: -80,
    left: 0
  });

  $("#popup").click(
    function ()
    {
      $(this).fadeOut();
    }); 
 
  $(function() {
    $('#tweet_request').keypress(function() {
      limitRequestAreaChars();
    });
  });
 
  $('#tweet_request').focus(function() {
    if($(this).val() == $(this).attr("default_value"))
    {
      $('#tweet_request').val(""); 
      limitRequestAreaChars();
    }
    return false;
  });
    
  $('#tweet_request').keyup(function() {
    limitRequestAreaChars();
  });
  
  //set up validator plugin for new_tweet form
  $("#new_tweet").validate({
    debug: true,
    rules: {
      'tweet[request]': {'required': true}
    },
    messages: {
      'tweet[request]': ""
    },
    invalidHandler: function(form, validator) {
      var errors = validator.numberOfInvalids();
      if (errors) {
        var message = "Sorry Dave, but your message can not be empty.";
        $("#popup_txt").text(message);
        $("#popup").fadeIn("slow");
      }
      else {
        //do nothing        
      }
    },
    submitHandler: function(form) {
      if ($('#tweet_request').val() != $('#tweet_request').attr("default_value")) {
        $('#tweet_it_sending').css('display', 'inline');
        $('#tweet_it_submit').attr('disabled', 'disabled');
      
        jQuery(form).ajaxSubmit({
          resetForm: true,
          complete: function() {
            $('#tweet_it_sending').css('display', 'none');
            $('#tweet_it_submit').removeAttr('disabled');
          },
          success: limitRequestAreaChars,
          dataType: 'script'
        });
      }
    }
  });

  $("#how_it_works span").text("(click for instructions)");

  $("#how_it_works").click(function() {
    if(HELP_STATE == 'closed') {
      $("#bottomFold").animate({height: BOTTOM_FOLD_OPEN_HEIGHT});
      $("#how_it_works span").text("(click to hide)");
      HELP_STATE = 'open';
    } else {
      $("#bottomFold").animate({height: BOTTOM_FOLD_CLOSE_HEIGHT});
      $("#how_it_works span").text("(click for instructions)");
      HELP_STATE = 'closed';
    }
  });
});