Skip to main content

Search and Top Navigation

#7908 closed enhancement (worksforme)

Opened November 23, 2011 12:50PM UTC

Closed November 23, 2011 04:02PM UTC

Last modified November 23, 2011 04:07PM UTC

3 cursors slider

Reported by: delfo Owned by: delfo
Priority: minor Milestone: 1.9.0
Component: ui.slider Version: 1.8.16
Keywords: Cc:
Blocked by: Blocking:
Description

it would be nice to extend the slider type with two ranges (cursor for min, cursor for max) with a third cursor able to slide in between min and max.

Use case: pick up a value in between a defined range

This should be achievable merging somehow two sliders (i'm working in this way)

or extending the slider widget

Attachments (0)
Change History (10)

Changed November 23, 2011 01:14PM UTC by scottgonzalez comment:1

owner: → delfo
status: newpending

I don't see how this is necessary for your specified use case. Your use case lacks so much detail that a single slider sounds like a perfect fit.

Changed November 23, 2011 01:25PM UTC by delfo comment:2

status: pendingnew

Hi Scott,

i know you can achieve the same playing with the min and max values, this way the slider bar keep the same but the extreme values dynamically change.

In my specific case i would like to implement a visual interface for the extreme setting too, such like the one you achieve having a basic slider with a two dimensional range

hope this explains more my needs

Example: i have a video player, through the main cursor the user is able to slide from T-Start to T-End, having the capability to change both of them through cursors

[------------*-------------]

------[---*------]---------

Changed November 23, 2011 01:50PM UTC by scottgonzalez comment:3

status: newpending

Do you have any references to existing UIs that work like this?

Changed November 23, 2011 01:58PM UTC by delfo comment:4

status: pendingnew

All the VJ softwares actually works like that,

you play a piece of video in loop, having the cursor automatically or manually sliding from a certain T-Start to T-End

i'm working on a user interface for processing JS which should allow to dynamically manually change the sliding range of several parameters according their ranges which may also vary during the performance

Changed November 23, 2011 02:06PM UTC by scottgonzalez comment:5

Can you link to a screenshot of an existing implementation? I just did an image search for vj software and saw lots of sliders, but nothing that looked like what you're describing.

Changed November 23, 2011 02:30PM UTC by delfo comment:6

here it goes,

this comes from Resolume software (one of the most famous on windows platform)

per each channel as you can see you got 'limit cursors' (the two rectangles extreme left and right) which allows you to set the slider range, than the main cursor which moves continuously based on the settings (play, pause, loop, reverse, random,...)

in fact i'm working on a widget which should implement the whole element which is such a basic fundamental brick in the whole solution

[[Image(http://www.resolume.com/gfx/features/effectspannel.gif)]]

Changed November 23, 2011 03:47PM UTC by scottgonzalez comment:7

Other than styling, this is what you're looking for, correct? http://jsbin.com/oyibuc

Changed November 23, 2011 03:56PM UTC by delfo comment:8

well right value is not moving but yes that's the idea

i thought handlers and values numbers were limited to two according the widget specification

this solve my needs by the way, clean and clear, thank you very much

maybe an update in the wikipage would be useful also for other people

cheers

Delfo

Changed November 23, 2011 04:02PM UTC by scottgonzalez comment:9

resolution: → worksforme
status: newclosed

Oops, updated the jsbin: http://jsbin.com/oyibuc/2/edit.

The docs seem pretty clear about this; the examples actually all use three handles: http://docs.jquery.com/UI/Slider#option-values What were you looking at that we should update?

Changed November 23, 2011 04:07PM UTC by delfo comment:10

http://docs.jquery.com/UI/Slider#option-values

here it says

''This option can be used to specify multiple handles. If range is set to true, the length of 'values' should be 2.''

that's why i thoguht you may have only 1 or 2 cursors