$(document).ready(function() {
	$(".slider-bar").click(function(e) {
		$slider = $(this).find(".brain-slider");
		sliderPos = $slider.position();
		offset = $(this).offset();
		mouseOffset = e.clientX - offset.left;
		sliderPos.left = mouseOffset - $slider.width() / 2;
		barWidth = $(this).width();
		if (sliderPos.left < 0) {
			sliderPos.left = 0;
		}
		if (sliderPos.left >= barWidth - $slider.width()) {
			sliderPos.left = barWidth - $slider.width();
		}
		$slider.css(sliderPos);
		max = $(this).data("range-max");
		min = $(this).data("range-min");
		notches = max - min;
		notchSize = barWidth / notches;
		sliderValue = Math.round(sliderPos.left / notchSize) + 1;
		$(this).find('input[type="hidden"]').attr('value', sliderValue);
	});
	$(".brain-slider").draggable({
		axis : "x",
		containment : "parent",
		stop : function() {
			max = $(this).parent().data("range-max");
			min = $(this).parent().data("range-min");
			notches = max - min;
			notchSize = $(this).parent().width() / notches;
			sliderValue = Math.round($(".brain-slider").position().left / notchSize) + 1;
			$(this).parent().find('input[type="hidden"]').attr('value', sliderValue);
		}
	});
	$(".brain-slider").mousedown(function() {
		$(this).addClass("ui-clickable-clicked");
	});
	$(".brain-slider").mouseup(function() {
		$(this).removeClass("ui-clickable-clicked");
	});
	$(".brain-slider").mouseout(function() {
		$(this).removeClass("ui-clickable-clicked");
	});
	$(".checkbox-container").click(function() {
		$checkbox = $(this).find('input[type="checkbox"]');
		if ($checkbox.prop("checked")) {
			$(this).removeClass("active");
			$checkbox.prop("checked", false);
		} else {
			$(this).addClass("active");
			$checkbox.prop("checked", true);
		}
	});
	$('.checkbox-container').on('dragstart', function(event) {
		$(this).toggleClass("active");
		$(this).find('input[type="checkbox"]').attr('checked', 'checked');
		event.preventDefault();
	});

	$(".radio-container").click(function() {
		$(this).siblings().removeClass("active");
		var $radio = $(this).children('input[type="radio"]');
		$radio.prop('checked', !$radio.prop('checked'));
		$(this).toggleClass("active");
	});
	$('.radio-container').on('dragstart', function(event) {
		$(this).siblings().removeClass("active");
		var $radio = $(this).children('input[type="radio"]');
		$radio.prop('checked', !$radio.prop('checked'));
		$(this).toggleClass("active");
		event.preventDefault();
	});
});