Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

fix(slider): updates discrete slider thumb text #628

Closed
wants to merge 2 commits into from
Closed

fix(slider): updates discrete slider thumb text #628

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
914de21
fix(slider): updates discrete slider thumb text
robertmesserle Nov 12, 2014
f7c2851
fix(slider): fixed issue in the spec file from the previous commit
robertmesserle Nov 12, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion src/components/slider/slider.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ function SliderDirective($mdTheming) {
'<div class="md-focus-thumb"></div>' +
'<div class="md-focus-ring"></div>' +
'<div class="md-sign">' +
'<span class="md-thumb-text" ng-bind="modelValue"></span>' +
'<span class="md-thumb-text"></span>' +
'</div>' +
'<div class="md-disabled-thumb"></div>' +
'</div>',
Expand Down Expand Up @@ -108,6 +108,7 @@ function SliderController(scope, element, attr, $$rAF, $window, $mdEffects, $mdA

this.init = function init(ngModelCtrl) {
var thumb = angular.element(element[0].querySelector('.md-thumb'));
var thumbText = angular.element(element[0].querySelector('.md-thumb-text'));
var thumbContainer = thumb.parent();
var trackContainer = angular.element(element[0].querySelector('.md-track-container'));
var activeTrack = angular.element(element[0].querySelector('.md-track-fill'));
Expand Down Expand Up @@ -381,7 +382,10 @@ function SliderController(scope, element, attr, $$rAF, $window, $mdEffects, $mdA
* @param x
*/
function adjustThumbPosition( x ) {
var exactVal = percentToValue( positionToPercent( x ));
var closestVal = minMaxValidator( stepValidator(exactVal) );
setSliderPercent( positionToPercent(x) );
thumbText.text( closestVal );
}

/**
Expand Down
18 changes: 18 additions & 0 deletions src/components/slider/slider.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,24 @@ describe('md-slider', function() {
expect($rootScope.value).toBe(50);
}));

it('should set model on drag', inject(function($compile, $rootScope, $timeout) {
var slider = $compile('<md-slider ng-model="value" min="0" max="100" discrete>')($rootScope);
$rootScope.$apply('value = 50');
var sliderCtrl = slider.controller('mdSlider');

spyOn(slider[0].querySelector('.md-track-container'), 'getBoundingClientRect').andReturn({
width: 100,
left: 0,
right: 0
});

sliderCtrl._onInput( simulateEventAt( 30, Hammer.INPUT_START ));
$timeout.flush();

sliderCtrl._onPan( simulateEventAt( 80 ));
expect(slider[0].querySelector('.md-thumb-text').textContent).toBe('80');
}));

it('should increment model on right arrow', inject(function($compile, $rootScope, $timeout, $mdConstant) {
var slider = $compile(
'<md-slider min="100" max="104" step="2" ng-model="model">'
Expand Down