fuckin awesome!!
JQuery knobs
71–80 of 101 posts
Re: JQuery knobs
#72I wanted to work on some of the usability issues raised in this thread, but I'm not the biggest fan of the style of the original JavaScript, so I ported (most of) the code to CoffeeScript:
https://github.com/wyattanderson/jQuery-Knob
I left out some of the configurability by choice, and there's no Cakefile yet, but I added the ability to color the knob through CSS via the addition of a hidden style target element. Maybe not a great practice, but I like it better than embedding style information in the code and HTML. Additionally, it'll draw resolution-doubled on Retina displays.
Feel free to hack on it.
Re: JQuery knobs
#73It's hard to make it 100 without it going back to 0. Maybe a gap between them and if you're already moused down going to up to 100, it stays at 100 as you continue to move the mouse right, but will go back down as you mouse left?
Completely agree, but I think the solution is simpler: just like a physical knob, don't let it cross over from 100 to 0 and back. If it's 100, you need to drag it back around the centre to get to 0.
if (curLevel == maxLevel &&
angleFromCenter > 0 &&
angleFromCenter < 45){
// Ignore
} else {
// Process normally
}
Re: JQuery knobs
#74Being familiar with knobs in digital audio workstation UIs, it's somewhat frustrating that I have to trace the thing around in a circle. Convention is that clicking in the knob and then dragging continuously up or down or using the scroll wheel should change its value.
Re: JQuery knobs
#75Extremely awesome. My only (nitpicky) objection: I wasn't able to do a simple $('#myProgressKnob').attr('value', _new_value_); and have the graph around the edges update. The number in the center changes, but the circular part doesn't get updated (at least, for me). I really wanted to use this in my latest project (shameless plug: http://wwikt-peterldowns.dotcloud.com ) but couldn't make it happen so I'm switching ba…
Use this instead: $('#myProgressKnob').val(_new_value_);
Thank you!
Re: JQuery knobs
#76Beautiful, but, when is this ever the best UX for a control (outside of sound mixers and sequencers)? (I'm expecting/hoping to get schooled on this.)
It’s a much nicer input mechanism to just click and drag left/right or up/down, or to use a scroll wheel (or trackpad scrolling). What distinguishes a physical knob from a physical slider is that the knob affords relative movements, rather than absolute ones: you turn the knob with the same motion from every starting setting and your hand stays in the same place, whereas a slider has a distinct physical position corr…
My jQuery knob plugin called knobRot has relative controls. It uses sprites rather than canvas, and there are a few other issues in the tracker, but you can see a demo here: http://www.domitable.com/static/side-projects/jquery-plugins... and this is the source on GitHub https://github.com/AlexanderParker/knobRot
I also would like to have a way of locking the mouse position, but sadly that would give black hat developers a nice exploit (for harvesting likes etc).
Re: JQuery knobs
#77Earlier quoted context omitted.
Kind of ... the focus has to be on the number before the mousewheel works though: http://jsfiddle.net/dmethvin/gDfcY/
hmm, i was thinking along these lines: http://jsfiddle.net/gDfcY/6/ this gives NaN, tho, because I suck at javascript, but I'm sure there's something workable in there.
http://jsfiddle.net/gDfcY/8/ Seems to work, but it's probably not the most elegant way it can be done
Re: JQuery knobs
#78Beautiful, but, when is this ever the best UX for a control (outside of sound mixers and sequencers)? (I'm expecting/hoping to get schooled on this.)
It’s a much nicer input mechanism to just click and drag left/right or up/down, or to use a scroll wheel (or trackpad scrolling). What distinguishes a physical knob from a physical slider is that the knob affords relative movements, rather than absolute ones: you turn the knob with the same motion from every starting setting and your hand stays in the same place, whereas a slider has a distinct physical position corr…
The pointer lock API should be in Chrome and FF.
http://updates.html5rocks.com/2012/02/Pointer-Lock-API-Bring...
Re: JQuery knobs
#79Earlier quoted context omitted.
It’s a much nicer input mechanism to just click and drag left/right or up/down, or to use a scroll wheel (or trackpad scrolling). What distinguishes a physical knob from a physical slider is that the knob affords relative movements, rather than absolute ones: you turn the knob with the same motion from every starting setting and your hand stays in the same place, whereas a slider has a distinct physical position corr…
The pointer lock API should be in Chrome and FF. http://updates.html5rocks.com/2012/02/Pointer-Lock-API-Bring... https://bugzilla.mozilla.org/show_bug.cgi?id=633602 https://developer.mozilla.org/en/API/Pointer_Lock_API
This is good news, though I don't see it becoming a standard any time soon without a way of blocking nefarious sites from taking hold of people's pointers. Perhaps a browser warning bar when a site tries to lock the cursor (or does this already happen)?
Re: JQuery knobs
#80"jQuery Knobs" sounds like a term for dickish jQuery enthusiasts.