jQuery Controls of Graphics Display

The input fields and controls below the graphics display enable the user to specify the type of bands to be displayed for the CO molecule, i.e. vibration-rotation transitions within the same electronic state, X-X or A-A, or electronic transitions between these states as X-A, for different pairs of vibrational quantum numbers and isotopes of carbon and oxygen.

The <plaintext> tag has previously been used to display code and avoid any problems with handling the "<" and ">" characters in the code, but this tag is now deprecated, and once opened it cannot be closed. An alternative method of using jQuery is applied applied here, and the code is in ../js/jquery-showcode.js.


/**
* This controls the input fields below the graphics.
*/
$(function() {
  $('.manin').attr('disabled','disabled');  // On page load disable scaling inputs for automatic scaling,
  $('.manin').addClass('disabled');         // and show that they are disabled,
  $('[name=scaling').val(['auto']);
  var vmax = Number($('#vmax').val());      // get max allowed values of v" and v',
  $('#vl').attr('max',vmax);                // then set this to v", and
  var voff = Number($('#voff').val());      // get max v' offset from v" when in the same electronic state.
  if ($('input[name=statei]:checked').val() !== $('input[name=statef]:checked').val()) {
    $('#vu').attr('min','0');               // On page reload when different states were previously selected,
    $('#vu').attr('max',vmax);              // this sets the allowed limits of v' between 0 and vmax.
  }
  $('#atomC').val(12);                      // Reset the isotopes for C and O back to the defaults.
  $('#atomO').val(16);

  // On reset disable manual inputs and hide extra column for isotopic band origin shift.
  $('#reset').click(function(event) {
    $('.manin').addClass('disabled').removeClass('enabled');
    $('.isotab').addClass('hidecol').removeClass('showcol');
  });

  $("#myCaption").click(function(){ 
    $("#myCaption").hide();
    $("#capButton").show();
  });
  $("#capButton").click(function(){ 
    $("#capButton").hide();
    $("#myCaption").show();
  });

  // For the radio button pair of statei, if "A" is selected then "A"
  // is also selected for the radio button pair of statef, preventing
  // "X" to be selected for statef.  This has been taken from
  // http://api.jquery.com/val/ with the required changes.
  $('input[type=radio]').click(function() {
    if (this.name === 'statei' || this.name === 'statef') {	// Only these are selected
      $('#vl').val("0");                // Initialize v" to 0
      if ($('input[name=statei]:checked').val() === "A") {
        $('input[name=statef]').val(["A"]);
      }
      if ($('input[name=statei]:checked').val() === $('input[name=statef]:checked').val()) {
        $('#vu').val("1");              // When both electronic states are the same, v' is initialized to 1,
        $('#vu').attr('min','1');       // the min allowed value is set to 1, and
        $('#vu').attr('max',voff);      // the max allowed value is set to voff.
      } else {
        $('#vu').val("0");              // When both electronic states are different, v' is initialized to 0,
        $('#vu').attr('min','0');       // the min allowed value is set to 0, and
        $('#vu').attr('max',vmax);      // the max allowed value is set to vmax.
      }
    }
  });
	
  // When v" is changed, v' will be changed if both electronic states are the same and v' <= v" or v' > v" + voff.
  $('#vl').change(function() {
    if ($('input[name=statei]:checked').val() === $('input[name=statef]:checked').val()) {
      var vl = Number($(this).val());
      var vu = Number($('#vu').val());
      $('#vu').attr('min',vl+1);      // Both electronic states are the same, so set min allowed value
      $('#vu').attr('max',vl+voff);   // of v' to v" +1 and max allowed value to v" + voff.
      if (vl >= vu) {
        $('#vu').val(vl+1);           // v' <= v" so increment v'.
      } else if (vu - vl > voff) {
        $('#vu').val(vl+voff);        // v' > v" + voff so set v' to v" + voff.
      }
    }
  });

  // When auto is selected, disable the manual input fields.
  $('#auto').click(function() {
    $('.manin').attr('disabled','disabled');
    $('.manin').addClass('disabled').removeClass('enabled');
  });
  // When manual is selected, enable the manual input fields.
  $('#man').click(function() {
    $('.manin').removeAttr('disabled');
    $('.manin').addClass('enabled').removeClass('disabled');
  });
	
  // If the (12,16) isotopic version is selected hide the extra column for
  // band origin shift, otherwise display it.
  $('.isoinput').click(function() {
    if ($('#atomC').val() === "12" && $('#atomO').val() === "16")
      $('.isotab').addClass('hidecol').removeClass('showcol');
    else
      $('.isotab').addClass('showcol').removeClass('hidecol');
  });
});
Click here to return to the diatomic page.