bulma-slider - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

package.json

		{
		"name": "bulma-slider",
		"version": "0.1.1",
		"version": "0.1.2",
		"description": "Display classic slider more sexy, in different colors, sizes, and states ",
		@@ -5,0 +5,0 @@ "main": "slider.sass",

slider.js

		// Find output DOM associated to the DOM element passed as parameter
		function findOutputForSlider( element ) {
		var idVal = element.id;
		outputs = document.getElementsByTagName( 'output' );
		for( var i = 0; i < outputs.length; i++ ) {
		if ( outputs[ i ].htmlFor == idVal )
		return outputs[ i ];
		}
		}
		function findOutputForSlider(element) {
		var idVal = element.id;
		outputs = document.getElementsByTagName('output');
		for (var i = 0; i < outputs.length; i++) {
		if (outputs[i].htmlFor == idVal)
		return outputs[i];
		}
		}

		function getSliderOutputPosition( slider ) {
		function getSliderOutputPosition(slider) {
		// Update output position
		var newPlace,
		minValue;
		minValue;

		var style = window.getComputedStyle( slider, null );
		var style = window.getComputedStyle(slider, null);
		// Measure width of range input
		sliderWidth = parseInt( style.getPropertyValue( 'width' ), 10 );
		sliderWidth = parseInt(style.getPropertyValue('width'), 10);

		// Figure out placement percentage between left and right of input
		if ( !slider.getAttribute( 'min' ) ) {
		if (!slider.getAttribute('min')) {
		minValue = 0;
		} else {
		minValue = slider.getAttribute( 'min' );
		minValue = slider.getAttribute('min');
		}
		var newPoint = ( slider.value - minValue ) / ( slider.getAttribute( 'max' ) - minValue );
		var newPoint = (slider.value - minValue) / (slider.getAttribute('max') - minValue);

		// Prevent bubble from going beyond left or right (unsupported browsers)
		if ( newPoint < 0 ) {
		if (newPoint < 0) {
		newPlace = 0;
		} else if ( newPoint > 1 ) {
		} else if (newPoint > 1) {
		newPlace = sliderWidth;
		@@ -42,24 +42,24 @@ } else {

		document.addEventListener( 'DOMContentLoaded', function () {
		document.addEventListener('DOMContentLoaded', function() {
		// Get all document sliders
		var sliders = document.querySelectorAll( 'input[type="range"].slider' );
		[].forEach.call( sliders, function ( slider ) {
		var output = findOutputForSlider( slider );
		if ( output ) {
		if ( slider.classList.contains( 'has-output-tooltip' ) ) {
		var sliders = document.querySelectorAll('input[type="range"].slider');
		[].forEach.call(sliders, function(slider) {
		var output = findOutputForSlider(slider);
		if (output) {
		if (slider.classList.contains('has-output-tooltip')) {
		// Get new output position
		var newPosition = getSliderOutputPosition( slider );
		var newPosition = getSliderOutputPosition(slider);

		// Set output position
		output.style[ 'left' ] = newPosition.position;
		output.style['left'] = newPosition.position;
		}

		// Add event listener to update output when slider value change
		slider.addEventListener( 'input', function( event ) {
		if ( event.target.classList.contains( 'has-output-tooltip' ) ) {
		slider.addEventListener('input', function(event) {
		if (event.target.classList.contains('has-output-tooltip')) {
		// Get new output position
		var newPosition = getSliderOutputPosition( event.target );
		var newPosition = getSliderOutputPosition(event.target);

		// Set output position
		output.style[ 'left' ] = newPosition.position;
		output.style['left'] = newPosition.position;
		}
		@@ -69,5 +69,5 @@
		output.value = event.target.value;
		} );
		});
		}
		} );
		} );
		});
		});

bulma-slider - npm Package Compare versions

Worsened metrics