Basically exactly as the title mentions.
Here is the issue step by step: (I have 2 events 1 nested in the other. keydown and mousedown)
Solutions found further down the post.
-
SOLVED - [s]Left clicking on the slider moved the nearest ui-slider-handle to the position of the mouse when clicked.
(I know this is default, I want to shut this off but keep the click and move functionality)[/s]
-
SOLVED - [s]After I run the set of events, I can no longer click the ui-slider-handle and move it.
(Happens after the sliders html is rebuilt with the new values added in)[/s]
-
SOLVED - [s]I can keep left clicking and performing the functionality. I don’t want this once the key combo isn’t met
anymore.[/s]
Here is the code snippet of my events.
var repeatControl = true;
$('#slider').bind('keydown', function(keyboard) {
$(this).bind('mousedown', function(mouse) {
if (repeatControl && keyboard.which == 17 && mouse.which == 1) { // Ctrl + L-Click
// Rebuild the slider handles
var newValue = 55;
var values = new Array(0,19,22,33,44, newValue);
var tabs = '';
count = 0;
var leftPercent = 0;
$.each(values, function (index, value) {
leftPercent = (value / maxValue) * 100;
tabs += '<a class="ui-slider-handle ui-state-default ui-corner-all" href="#" id="'+(count++)+'" style="left: '+leftPercent+'%;"></a>';
});
$('#slider').html(tabs); // Issue 2 happens after this...
repeatControl = false;
}
}).bind('mouseup', function() {
console.log('Release Click');
repeatControl = true;
});
}).bind('keyup', function() {
console.log('Release Keydown');
repeatControl = true;
});
Solved Issue 1 with this solution
// Disable the mouse tracking for ui-slider-handle(s)
$.widget('myapp.slider', $.ui.slider, {
_mouseCapture: function( e ) {
if ( !$( e.target ).is( this.element ) ) {
return this._super( e );
}
return false;
}
});
Solved Issue 2 with this solition
Another thread
Solved Issue 3 with this solution
var ctrlIsNotDown = true;
var mouseIsNotDown = true;
$(document).keydown(function(event) { // Any keydown
if (event.ctrlKey && ctrlIsNotDown) { // Check for Ctrl presses and ctrl is not already down
console.log('Ctrl is pressed')
$('#slider').on('click', function(mouse) {
if (mouse.which == 1 && mouseIsNotDown && !ctrlIsNotDown) {
console.log('ctrl + mouse click combo pressed');
mouseIsNotDown = false;
}
}).on('mouseup', function(mouse) {
if (mouse.which === 1 && !mouseIsNotDown) {
console.log('Mouse click released');
mouseIsNotDown = true;
}
});
ctrlIsNotDown = false; // Ctrl is down
}
}).keyup(function() { // Any keyup
console.log('Keys released');
ctrlIsNotDown = true; // Ctrl is not down
});