$(function (){

    // chart.js
    var ctx = document.getElementById("sotu-chart").getContext("2d");
    var data = [
        {
            value: 30,
            color:"#F7464A"
        },
        {
            value : 50,
            color : "#E2EAE9"
        },
        {
            value : 100,
            color : "#D4CCC5"
        },
        {
            value : 40,
            color : "#949FB1"
        },
        {
            value : 120,
            color : "#4D5360"
        }

    ]
    var options = {
        segmentShowStroke : false,
        percentageInnerCutout : 80
    }
    
    new Chart(ctx).Doughnut(data, options);



    // gradient for slider fill
    $('input[type="range"]').change(function () {
        var val = ($(this).val() - $(this).attr('min')) / ($(this).attr('max') - $(this).attr('min'));
        
        $(this).css('background-image',
                    '-webkit-gradient(linear, left top, right top, '
                    + 'color-stop(' + val + ', #5bc0de), '
                    + 'color-stop(' + val + ', #222)'
                    + ')'
                    );
    });

    // buttons do things
    var $btncta = $('.btn-cta'),
        $btnback = $('.btn-back'),
        $wrapper = $('.sidebar-wrapper');

    $btncta.on('click', function() {
        $wrapper.toggleClass('active');
        $btnback.toggleClass('hidden');
    });
    $btnback.on('click', function() {
        $wrapper.toggleClass('active');
        $btnback.toggleClass('hidden');
    });    
});
@@ -680,50 +680,38 @@
     
-$('input%5Btype=%22range%22%5D').change(function (
+    %0A    function fillSlider(e
 ) %7B%0A
@@ -714,24 +714,28 @@
 ) %7B%0A        
+ 
+   
 var val = ($
@@ -735,20 +735,17 @@
 al = ($(
-this
+e
 ).val() 
@@ -744,28 +744,25 @@
 ).val() - $(
-this
+e
 ).attr('min'
@@ -769,20 +769,17 @@
 )) / ($(
-this
+e
 ).attr('
@@ -788,20 +788,17 @@
 x') - $(
-this
+e
 ).attr('
@@ -809,25 +809,33 @@
 ));%0A        
+   
-%0A
+ %0A    
         $(th
@@ -836,12 +836,9 @@
   $(
-this
+e
 ).cs
@@ -859,16 +859,20 @@
 image',%0A
+    
         
@@ -928,24 +928,28 @@
 ight top, '%0A
+    
             
@@ -1007,32 +1007,36 @@
                 
+    
 + 'color-stop(' 
@@ -1053,16 +1053,20 @@
  #222)'%0A
+    
         
@@ -1103,16 +1103,190 @@
         
+    );%0A    %7D%0A%0A    $('input%5Btype=%22range%22%5D').each(function () %7B    %0A        fillSlider(this);%0A    %7D);%0A%0A    $('input%5Btype=%22range%22%5D').change(function () %7B%0A        fillSlider(this
 );%0A    %7D

fix gradient fill in sliders initial state