<script type="text/javascript" charset="utf-8">  
  $(document).ready(function() {
 
    // Identify this question
    var thisQuestion = $('#question{QID}');
 
    // Add some classes
    $('input.text', thisQuestion).addClass('active-item');
    $('input.text:last', thisQuestion).removeClass('active-item').addClass('total-item');
 
    // Disable the last input
    $('.total-item', thisQuestion).prop('readonly', true);
 
    // Listener on the inputs
    $('.active-item', thisQuestion).on('keyup change paste', function() {
      setTimeout(function() { // Pause required for paste
        // Calculate and insert the total
        var total = 0;
        $('.active-item', thisQuestion).each(function(i) {
          total = total + Number($(this).val());
        });
        $('.total-item', thisQuestion).val(total);
      }, 100);
    });
  });
</script>

$(document).ready(function() {
 
  // Custom question index
 
  if($('#index').length > 0) {
    $('body').addClass('with-dropdown-index');
 
    $('#progress-wrapper').after($('#index'));
    $('#index .container').wrapInner('<div class="inner-container" />');
    $('#index h2').insertBefore($('#index .inner-container')).append('<span class="ui-icon ui-icon-arrowthick-1-s"></span><span style="display:none" class="ui-icon ui-icon-arrowthick-1-n"></span>');
 
    $('#index h2').click(function() { 
      $('#index .inner-container').slideToggle(300, function() {
        if($('#index .inner-container').is(':visible')) {
          $('#index h2 .ui-icon-arrowthick-1-s').hide();
          $('#index h2 .ui-icon-arrowthick-1-n').show();
        }
        else {
          $('#index h2 .ui-icon-arrowthick-1-n').hide();
          $('#index h2 .ui-icon-arrowthick-1-s').show();
        }
      });
    });
  }
 
});

/* Custom Dropdown Question Index */
.with-dropdown-index .outerframe {
  margin: 0;
}
 
.with-dropdown-index #index {
  position: relative;
  right: auto;
  top: auto;
  width: 25em;
  height: auto;
  margin: 0 auto 0.5em auto;
  overflow: auto;
  background: #fff;
  border: 1px solid #AAAAAA;
}
 
.with-dropdown-index #index .container {
  width: auto;
}
 
.with-dropdown-index #index h2 {
  position: relative;
  padding: 0.5em;
  background: #EEEEEE;
  text-align: center;
  cursor: pointer;
  color: #444444;
}
 
.with-dropdown-index #index h2 .ui-icon {
  position: absolute;
  top: 0.5em;
  right: 1em;
    display: inline-block;
  margin: 0 0 0 1em;
  background-image: url(images/ui-icons_888888_256x240.png);
}
 
.with-dropdown-index #index .inner-container {
  display: none;
}