jQuery.fn.vibrate = function(){

  // Loop over each of the elements in the jQuery
  // stack so that we can set up the properties
  // for the individual elements.
  this.each(
    function( intI ){
      // Get a jQuery object for this element.
      var jNode = $( this );

      // Default plugin to not be vibrating.
      var blnVibrate = false;

      // Get current position of the element.
      var intLeft = parseInt( jNode.css( "left" ) );
      var intTop = parseInt( jNode.css( "top" ) );


      // Create a function pointer that will
      // handle the updating of elements position
      // such that it will make it appear to be
      // vibrating.
      var fnUpdatePosition = function(){
        var intCurrentLeft = parseInt(
          jNode.css( "left" )
          );

        var intCurrentTop = parseInt(
          jNode.css( "top" )
          );


        // Check to see if we should keep going.
        if (blnVibrate){

          // Check to see which direction to
          // adjust in - either vert. or horz.
          if (Math.random() > .5){

            // Adjust vertically.
            if (intCurrentTop > intTop){
              intCurrentTop = (intTop - 2);
            } else {
              intCurrentTop = (intTop + 2);
            }

          } else {

            // Adjust horizontally.
            if (intCurrentLeft > intLeft){
              intCurrentLeft = (intLeft - 2);
            } else {
              intCurrentLeft = (intLeft + 2);
            }

          }

          // Set a timeout to call this method
          // again and update position.
          setTimeout(
            fnUpdatePosition,
            60
            );

        } else {

          // Reset position.
          intCurrentLeft = intLeft;
          intCurrentTop = intTop;

        }


        // Update the position.
        jNode.css(
          "top",
          (intCurrentTop + "px")
          );

        jNode.css("left",
          (intCurrentLeft + "px")
          );
      }


      // Hoook up the mouse over event to flag
      // that the vibrating should begin.
      jNode.mouseover( function(){
          // Flag vibration.
          blnVibrate = true;

          // Start vibrating.
          fnUpdatePosition();
        });

      // Hook up the mouse out event to flag
      // that the vibrating should end.
      jNode.mouseout( function(){
          // Clear vibration.
          blnVibrate = false;
        });

    }
    );
  // END: each()

  // Return the jQuery stack to keep chaining.
  return( this );
}


var ERROR_MSG   =  '<img src="images/i_error.png" width="35" height="35" alt="" />';
var SUCCESS_MSG = '<img src="images/i_ok.png" width="35" height="35" alt="" />';

$(function() {
  
  centerDiv();
  $("#white_phone,#black_phone").vibrate();
  $(window).bind("resize", centerDiv);
  
  $("#codeform").validate({
    rules: {
      name: {
        required: true,
        minlength: 3
      },
      email: {
        required: true,
        email: true
      },
      age: {
        required: true
      },
      rules: {
        required: true
      },
      code0: {
        remote: "check_code.php",
        required: true
      },
      code1: { remote: "check_code.php" },
      code2: { remote: "check_code.php" },
      code3: { remote: "check_code.php" },
      code4: { remote: "check_code.php" },
      code5: { remote: "check_code.php" }
    },
    messages: {
      name: {
        required: ERROR_MSG,
        minlength: ERROR_MSG
      },
      email: {
        required: ERROR_MSG,
        email: ERROR_MSG
      },
      age: {
        required: ERROR_MSG
      },
      rules: {
        required: ERROR_MSG
      },
      code0: {
        remote: ERROR_MSG,
        required: ERROR_MSG
      },
      code1: { remote: ERROR_MSG },
      code2: { remote: ERROR_MSG },
      code3: { remote: ERROR_MSG },
      code4: { remote: ERROR_MSG },
      code5: { remote: ERROR_MSG }
    },
    success: function(label) {
      label.html(SUCCESS_MSG);
    }
  });
  
  // add validation only for code page
  if( $("body").hasClass("codes")) {
    addParentValidation();
  }
  $("#age").bind("change", addParentValidation);
  
  //show first bubble as default and begin from 2
  $("#b1").show();
  setInterval("flickrBubbles()", 3000);

  $(".fancy").fancybox({
    frameWidth:550,
    frameHeight: 450,
    overlayColor: "#000",
    enableEscapeButton: true,
    overlayOpacity: 0.8
  });
  
  
  // Fields to upper case codes
  $("input.small").bind("keyup", function() {
    var val = $(this).val().toUpperCase();
    $(this).val(val);
  });
  
}); // end of main


var bubbleVisible = 2;
function flickrBubbles() {
  $(".bubble").hide("fast");
  $("#b" + bubbleVisible).show("fast");
  bubbleVisible++;
  if( bubbleVisible > 4) {
    bubbleVisible = 1;
  }
}

function addParentValidation() {
  var age = parseInt($("#age").val());
  if( isNaN(age)) {
    age = 0;
  }
  if( age < 18) {
    $("#parentname").rules("add", {
      required: true,
      messages: {
        required: ERROR_MSG
      }
    });
    $("#parentemail").rules("add", {
      required: true,
      email: true,
      messages: {
        required: ERROR_MSG,
        email: ERROR_MSG
      }
    });
  } else {
    $("#parentname").rules("remove");
    $("#parentemail").rules("remove");
  }
}

function centerDiv() {
  var dh = $(document).height();
  var wh = $("#wrapper").height();
  wh = 635;
  var ch = (dh - wh) / 2;
  $("#wrapper").css("top", ch + "px");
}
