PolarNotion / turntable

A Responsive JQuery Slider
http://polarnotion.github.io/turntable/
515 stars 48 forks source link

Connecting to an range input slider #11

Open vilav opened 7 years ago

vilav commented 7 years ago

Hi there,

Of most plugins out there, found turntable to be quite performant on mobile. Noob Question: Any ideas on officially adding support for the range input for the plugin? Or any guidance to readily connect it at present?

Thanks!

morganjlopes commented 7 years ago

What do you mean by range input?

Godspeed,

Morgan J. Lopes

Polar Notion. 

Go boldly forward.

On Wed, Jan 18, 2017 at 10:03 PM Vilav Bhatt

< mailto:Vilav Bhatt notifications@github.com

wrote:

a, pre, code, a:link, body { word-wrap: break-word !important; }

Hi there,

Of most plugins out there, found turntable to be quite performant on mobile. Noob Question: Any ideas on officially adding support for the range input for the plugin? Or any guidance to readily connect it at present?

Thanks!

You are receiving this because you are subscribed to this thread.

Reply to this email directly, https://github.com/PolarNotion/turntable/issues/11 , or https://github.com/notifications/unsubscribe-auth/ACDF2gSrXYzs_XMK5ioA-IsmApCAsAewks5rTtJ5gaJpZM4Lnp0J .

vilav commented 7 years ago

Hi Morgan,

I meant a slider as an added controller for the 360 movement. Found the following demo as an example: http://codepen.io/pixelthing/pen/kkxpqo

There is a pull request to your repository but the slider doesnt seem to update in relation to the 360.

Thanks

morganjlopes commented 7 years ago

Since the slider works on cursor position, what if you just added a ‘move-finger-from-left-to-right’ graph. Same result since slider would still require moving cursor back and forth across screen.

Godspeed,

Morgan J. Lopes

Polar Notion. 

Go boldly forward.

On Wed, Jan 18, 2017 at 10:33 PM Vilav Bhatt

< mailto:Vilav Bhatt notifications@github.com

wrote:

a, pre, code, a:link, body { word-wrap: break-word !important; }

Hi Morgan,

I meant a slider as an added controller for the 360 movement. Found the following demo as an example: http://codepen.io/pixelthing/pen/kkxpqo

There is a pull request to your repository but the slider doesnt seem to update in relation to the 360.

Thanks

You are receiving this because you commented.

Reply to this email directly, https://github.com/PolarNotion/turntable/issues/11#issuecomment-273673256 , or https://github.com/notifications/unsubscribe-auth/ACDF2iDQTzbeNnlxdeM6YPsOwifk-CSZks5rTtmUgaJpZM4Lnp0J .

ibarsi commented 7 years ago

Hey @vilav,

It's been a while since I submitted that pull request. If you're interested in this feature, id be happy to look into it and ensure it's ready to be merged.

vilav commented 7 years ago

@ibarsi that would be awesome, if you could! It's a very nifty feature you added in the PR!

ibarsi commented 7 years ago

@vilav I've committed an update to the input slider, it now sets it's min/max/step values in relation to 360 degrees (much like the pen you commented as an example).

Here's a fiddle that shows it in action: https://jsfiddle.net/ibarsi/LLh3prgo/1/

Let me know if this is what you had in mind.

vilav commented 7 years ago

awesome, thanks @ibarsi! trying it out now, keep you posted with findings!

vilav commented 7 years ago

hi @ibarsi, the slider works great on desktop. but on mobile the slider handle doesn't seem to update. so when I drag the slider, the 360 still works but the position of the handle of the slider doesn't update position. any way to fix that / or does it need a plugin like NoUISlider? (https://refreshless.com/nouislider/)

ibarsi commented 7 years ago

@vilav Yeah, that mainly comes down to a lack of range input support in some browsers (especially mobile). I simply wanted to add generic support for the base range input element, that way implementers can decide to use any range UI library in conjunction to create whatever experience they desire.

Have you tried a lib like noUiSlider, does it play nice with turntable' range input support?