<script type="text/javascript" charset="utf-8">
    $(document).ready(function(){    
 
        // Identify this question
        var thisQuestion = $('#question{QID}');
 
        // Assign column-specific classes
        $('table.subquestion-list tr', thisQuestion).each(function(i) {
 
            $('> *:gt(0)', this).each(function(i){
                $(this).addClass('column-'+(i+1));
                $(this).attr('data-column', i+1);
            });
        });
      
          // Insert the sliders
        $('.answer-item.column-1 input[type="text"]', thisQuestion).each(function(i) {
            $(this).closest('td').addClass('with-slider');
            var thisValue = $(this).val();
 
            $(this).bootstrapSlider({
                'min': 0,
                'max': 10,
                'step': 0.1,
                'range': false,
                'value': Number(thisValue),
                'tooltip': 'always'
            });
 
            // Initialization stuff
            if(thisValue == '') {
                $(this).val('');
                $(this).closest('td').find('.tooltip').hide();
            }
            else {
                updateCallOut($(this).closest('td'));
            }
        });
 
        // A function to update the slider callout
        function updateCallOut(el) {
            var thisTooltip = $(el).find('.tooltip');
            //$('.tooltip-inner', thisTooltip).text(callOutText);
            thisTooltip.show().css('margin-left', '-'+(thisTooltip.width()/2)+'px');
        }
 
        // Listener on sliders
        $('td.with-slider .slider').on('mousedown', function(event, ui) {
            updateCallOut($(this).closest('td'));
        });            
        $('td.with-slider input[type="text"]', thisQuestion).on('slide slideStop', function(event, ui) {
            updateCallOut($(this).closest('td'));
            checkconditions($(this).val(), $(this).attr('name'), 'text');
        });
 
        // Listener on resizing (override the bootstrap callout behaviour)
        $(window).resize(function() {
            $('td.with-slider', thisQuestion).each(function(i) {
                if($('input[type="text"]', this).val() != '') {
                    updateCallOut(this);
                }
            });
        });
        
        // Define the slider left/right labels
        var sliderLeftLabels = ['no', 'no','no','no','no'];
        var sliderRightLabels = ['great', 'great', 'great', 'great', '10'];
        
        // Insert slider left/right labels
        $('td.with-slider', thisQuestion).append('<div class="left-text"></div><div class="right-text"></div>');
        $('.left-text', thisQuestion).each(function(i) {
            $(this).text(sliderLeftLabels[i]);
        });
        $('.right-text', thisQuestion).each(function(i) {
            $(this).text(sliderRightLabels[i]);
        });
 
        // Some clean-up styles for the sliders (could be placed in template.css)
        $('thead th, .answer-item.column-1', thisQuestion).css({
            'text-align': 'center'
        });
        $('.slider.slider-horizontal', thisQuestion).css({
            'margin': '1.7em auto 1em'
        });
        $('.slider-selection', thisQuestion).css({
            'background': 'transparent none',
            'box-shadow': 'none'
        });
        $('.slider-handle', thisQuestion).css({
            'top': '-4px'
        });
        $('.left-text, .right-text', thisQuestion).css({
            'margin-top': '-0.5em',
            'font-size': '90%'
        });
        $('.left-text', thisQuestion).css({
            'float': 'left'
        });
        $('.right-text', thisQuestion).css({
            'float': 'right'
        });
    });
  </script>

<script type="text/javascript" charset="utf-8">
    $(document).ready(function(){    
 
        // Identify this question
        var qID = {QID};
        var thisQuestion = $('#question'+qID);
 
        // Add some classes
        $(thisQuestion).addClass('with-exclusive-items');
        $('td.answer-item', thisQuestion).addClass('non-exclusive-item');
 
        // Loop through the last-column cells
        $('td.answer-item:last-child', thisQuestion).each(function(i) {
            varThisID = $('input[type="text"]', this).attr('id');
 
            // Add a class
            $(this).removeClass('non-exclusive-item').addClass('exclusive-item');
 
            // Hide the text input
            $('td.answer-item:last-child input[type="text"]', thisQuestion).hide();
 
            // Insert checkboxes
            $(this).append('<div class="checkbox">\
                                <input class="checkbox" name="" id="'+varThisID+'_cbox" value="N/A" type="checkbox">\
                                <label for="'+varThisID+'_cbox" class="answertext inserted-label"></label>\
                            </div>'); 
        });
 
        // Listener on the checkboxes
        $('.exclusive-item input[type="checkbox"]', thisQuestion).on('change', function(e) {
            var thisRow = $(this).closest('tr.subquestion-list');
            var thisCell = $(this).closest('td.answer-item');
            if($(this).is(':checked')) {
                $('input[type="text"]', thisCell).val('1');
                $('.non-exclusive-item input[type="text"]', thisRow).val('');
            }
            else {
                $('input[type="text"]', thisCell).val('');
            }
 
            // Fire Expression Manager
            $('input[type="text"]', thisRow).each(function(i) {
                $(this).trigger('keyup');
            });
        });
 
        // Listener on the text inputs
        $('.non-exclusive-item input[type="text"]', thisQuestion).on('keyup change', function(e) {
            var thisRow = $(this).closest('tr.subquestion-list');
            if($.trim($(this).val()) != '') {
                $('.exclusive-item input[type="checkbox"]', thisRow).prop('checked',false);
                $('.exclusive-item input[type="text"]', thisRow).val('');
            }
 
            // Fire Expression Manager
            $('.exclusive-item input[type="text"]', thisRow).trigger('keyup');
        });
 
        // Insert some styles (these could be in template.css)
        // For the LS 2.67 default template
        var newStyles = '.with-exclusive-items thead th.answertext {\
                            text-align: center;\
                        }\
                        .with-exclusive-items .exclusive-item {\
                            text-align: center;\
                            vertical-align: middle;\
                            cursor: pointer;\
                        }\
                        .with-exclusive-items .checkbox {\
                            padding-left: 0;\
                        }\
                        .with-exclusive-items .inserted-label {\
                            width: 24px;\
                            min-height: 24px;\
                            padding: 0;\
                        }\
                        .with-exclusive-items .inserted-label::before {\
                            margin: 4px 0 0 4px;\
                        }\
                        .with-exclusive-items .inserted-label::after {\
                            margin: 4px 0 0 4px;\
                        }';    
        $('head').append('<style type="text/css">'+newStyles+'</style>');    
    });    
</script>

<script type="text/javascript" charset="utf-8">
 
$(document).ready(function(){
  var thisQuestion = $('#question{QID}');
  $('div.question-item',thisQuestion).each(function(i) {
            var subQuestionID =  $(this).attr('id');
            var sliderHandle = $('div.min-slider-handle',this);
              var sliderValue = $(sliderHandle).attr('aria-valuenow');
            console.log("MBR-sliderHandleValueNow");
              console.log(sliderValue);
  });
})
</script>

<style type="text/css">.slider.slider-horizontal .slider-handle {
    margin-top: -5px;
}
.tooltip-main{
    visibility: hidden;
}
.slider-container {
    margin-top: 2em;
    margin-bottom: 1em;
}
.control-label{
      font-weight: bold;
}
.withslider {
    margin-bottom: 0px;
}
.form-group {
    margin-bottom: 0px;
}
.not-used-label{
    color:#e74c3c;
}
.not-used-handle{
    background-image: linear-gradient(to bottom, #e74c3c 0%, #e74c3c 100%);
}
.active-handle{
    background-image: linear-gradient(to bottom, #149bdf 0%, #0480be 100%);
}
.odd-line{
    background-color: #f9f9f9;
}
.even-line{
    background-color: #ecf0f1;
}
</style>
<script type="text/javascript" charset="utf-8">
$(document).on('ready pjax:scriptcomplete',function(){
    //Get the current question
      var thisQuestion = $('#question{QID}');
      // for each question item
      $('div.question-item',thisQuestion).each(function(i) {
        // Set line background alternately
        if(i%2 == 0){
          $(this).addClass("odd-line");
        }
          else{
          $(this).addClass("even-line");
        }
          var questionItemID =  $(this).attr('id');
        // Add not used label
        var questionLabel =$(".control-label",this);
      $(questionLabel).append("  <span id=NU"+questionItemID+" class='not-used-label'>Not used</span>" );
      // Set slider handle to not used
      var sliderHandle = $('.min-slider-handle',this);
      $(sliderHandle).addClass("not-used-handle");
      // Add mouse up handler
      $(sliderHandle).mouseup(function(){
          // Get question item ID
        var questionItem = $(this).closest('div.question-item');
        var questionItemID =  $(questionItem).attr('id');
        console.log(questionItemID);
        // if slider value is -1
        if($(this).attr('aria-valuenow')==-1){
            // Set slider handle to not used
              if(!$(this).hasClass("not-used-handle")){
                $(this).addClass("not-used-handle");
                $(this).removeClass("active-handle");
            }
              // show not used label
            $("#NU"+questionItemID).show();
        }
        // if slider value is different from -1
        else{
          // Set slider handle to active
          if(!$(this).hasClass("active-handle")){
                $(this).addClass("active-handle");
                $(this).removeClass("not-used-handle");                  }
          // hide not used label
            $("#NU"+questionItemID).hide();
        }
      });
  });
})
</script>