popsugar / angular-slider Goto Github PK

Hi.

Currently you can only change the slider only by clicking the handle and sliding it.
It should be able also to change the slider by clicking the bar itself and the handle will move automatically to that position.
I'll be happy to help implementing it.

Idanb11

If in the CSS the box-sizing: border-box^* is defined the handler looks funky.

Bootstrap is using * { box-sizing: border-box }, so hypothetically this directive is not compatible with it.

* on why you should use border-box.

When using a range slider, there is no value displayed when the lower handle value is set to 0. This does not affect the upper handle.

I want make feature logarithmic changes ngModel[Low|High] when approaching the ceiling. Are there any developments on this problem? May have planned it commit?

Hi there. Thanks for your work with maintaining the slider.

I'm using the it for filtering some data, which is fetched via an HTTP request. Is there a way to listen on when the handle has been released so that the request isn't sent continuously?

Ng-mouseup listen on the entire slider, and doesn't account for releasing outside.

I cannot seem to get it to work for decimals.

The sliders are not initialized at the right position and require a click or a value modification to update to the correct position.

Hey,

thanks for keeping this project up and running!
I get an error on desktop browser, when dragging the slider further left than allowed - over the end.

The errors is caused by event.touches[0] as this does not exist:
eventX = event.clientX || event.touches[0].clientX;

Should be solved by checking if touches exists:
eventX = event.touches && event.touches.length > 0 ? event.touches[0].clientX : event.clientX;

Thanks a lot!
Marcel

error throw from
var c,d=b.clientX||b.touches[0].clientX

if b.touches is undefined

This isn't really an issue, as it doesn't happen all the time. I've had the same problem before and was able to fix it, but I forget how. Has anyone else ever encountered this, where parts of the slider are out of place when the page first loads, but snap to the correct positions when you click on one of the handles?

Edit: This may actually be an issue (or maybe I'm loading scripts wrong, who knows), but I discovered something else. The slider loads fine when I go from one view in the app to the page that it's on, but I get this weird effect when refreshing the browser when on this page. Here's how I'm using it:

# signup.jade
slider(floor="10", ceiling="250", step="5", ng-model-low="newJob.salary_min", ng-model-high="newJob.salary_max")

And here's how I'm setting the initial values in the controller:

# signup.coffee
$scope.newJob =
    ...
    salary_min: 50
    salary_max: 150

in the Readme, you mention translate option, but when i go through your src, i can't find any formating code, it's awful and misleading!

The bubble will not drag on mobile device. I see the bubble is getting the touch event because it lights up, but it cannot be dragged. Can you test to see if this happens across the board and not just for me?

The error I see in the console is:
Uncaught TypeError: Cannot read property '0' of undefined

All files seem to get minified when using Chrome's ADB plugin inspector so I can't debug it :(

This is how I'm using it:
<slider floor="0" ceiling="18" step="1" precision="0" ng-model="colorSlider.position"></slider>

$scope.colorSlider = {
position: 0
};

I'm using Angular 1.3 and I also couldn't get it to work with angular 1.2.

Hi,

The ng-change="" no work on slider.
You have an idea of the problem?

I had to add the following style to get this to work.

   handle {
      pointer-events:all;
   }

Am I doing something wrong?

DataBinding works.

Hi @popsugarlegal ,
Thanks for your work... 👍

I am trying to implement the slider with the following values:

<slider floor="80" ceiling="260" step="20" ng-model="footerSlider" style="margin:0 !important;"></slider>

But when I set the value of footerSlider in the controller to be 120 the Slider handle is still positioned on the left of the bar and not positioned according to the value I set in the controller.
Please help.

Idanb11.

Hi,

I'm trying to add this project to my code using bower, and when running an update I get this message :
"bower angular-slider#0.3.* invalid-meta angular-slider is missing "ignore" entry in bower.json"
I'm not an expert in bower but I think it means that there is a "ignore" block missing in the bower.json file of angular-slider.
If I'm wrong please enlighten me !

PS : I just updated my Bower (1.7.1), maybe it's related.

angular-slider directive unbinds all mousemove and mouseup event
listeners from the document when user finish sliding, thus effectively
unsubscribe rest of the code from aforementioned events. In order to
preserve external listeners only own event handlers are unbinded.

bug can be reproduced here - https://jsfiddle.net/8c31mpyd/
pull request - #32