$(document).ready( function() {

  $('.usage').click( function( event ) {

    // Disable all vote buttons, show them, hide all their siblings (check mark)
    //
    $('.usage').attr( 'disabled', true );
    $('.usage').show();
    $('.usage').siblings().hide();
    
    var data = $(event.target).parents('form').serialize();
    
    if( $('#map-me-automatically').length > 0 ) {
      
      var data2 = $('#map-me-automatically').serialize();
      
      if( data2.length > 0 ) {
        
        data = data + '&' + data2;
      }
    }
    
    $.ajax( {
      type: 'POST',
      url: '/api/vote/usage/',
      data: data,
      dataType: 'text',
      complete: function( XMLHttpRequest, textStatus ) {

        // Enable all voting buttons
        //
        $('.usage').attr( 'disabled', false );
      },
      success: function(data, textStatus){

        // Hide the "vote" button they clicked on, show its siblings (check mark), show thanks message
        //
        $(event.target).hide();
        $(event.target).siblings().show();
        $("#thanks-for-voting-usage").html( data ).show('normal');
        
        try {
          //alert( $(event.target).parents('form').find('#vote').val() );
          pageTracker._trackEvent( 'Terms', 'Vote - Usage', term_name );
        }
        catch(err) {}
      },
      error: function( XMLHttpRequest, textStatus, errorThrown ){

        $("#thanks-for-voting-usage").html( XMLHttpRequest.responseText );
        $("#thanks-for-voting-usage").show('normal');
      }
    } );

    event.preventDefault();
  } );

  $("#pepper").mousemove( function( e ) {

    var pepperWidth = $("#pepper").width();
    var xOffset = e.pageX - this.offsetLeft;

    $("#pepper-cover").width( pepperWidth - xOffset );
  } );

  $("#pepper").click( function( e ) {

    var pepperWidth = $("#pepper").width();
    var xOffset = e.pageX - this.offsetLeft;

    /* If the user is RE-voting, the mousemove unbound on the previous vote, so pepper-cover's width
       wasn't changed. */
    $("#pepper-cover").width( pepperWidth - xOffset );

    /* To avoid confusion with the pct changing when the user moves their mouse off the pepper, remove
       the event handler. */
    $("#pepper").unbind("mousemove");

    /* Change 'None' to '...'.  If we don't call vote asynchronously, you never see the '...'. Don't
       know why. */
    $(".pepper-vote").text( '...' );

    var border = 10;
    xOffset = xOffset - border;

    xOffset = Math.max( 0, xOffset );
    xOffset = Math.min( xOffset, pepperWidth - border*2 );

    var pct = Math.round( xOffset / ( pepperWidth - border*2 ) * 100 );
    setTimeout( function() { vote( pct ); }, 0 );
  } );
} );

function vote( voteVal ) {

  $("input#vote").val( voteVal );

  $.ajax( {
    type: 'POST',
    url: '/api/vote/offensiveness/',
    data: $("#offensiveness").serialize(),
    dataType: 'text',
    success: function( data, textStatus ) {

      $(".pepper-vote").text( voteVal + '%' );
      $("#thanks-for-voting-vulgarness").html( data ).show('normal');

      try {
        pageTracker._trackEvent( 'Terms', 'Vote - Vulgarity', term_name, voteVal );
      }
      catch(err) {}
    },
    error: function( XMLHttpRequest, textStatus, errorThrown ) {

      $(".pepper-vote").text( 'None' );
      $("#thanks-for-voting-vulgarness").html( XMLHttpRequest.responseText );
      $("#thanks-for-voting-vulgarness").show('normal');
    }
  } );
}

function sleep(milliseconds) {
  var start = new Date().getTime();
  while( (new Date().getTime() - start) < milliseconds){};
}
