jQuery-Knob
jQuery-Knob copied to clipboard
Destroy knob dynamically
I've made this plugin for display time-lapse with knob, but if re-launch the plugin on runtime knob tilt.
var knob_options = {knob: {width: 24, height: 24, displayInput: true, stopper: true, readOnly: true, fgColor: "#999"}},
timer = null;
$.fn.setKnobTimeout = function(options, callback, limit) {
var settings = $.extend({
start: 0,
cycle: false,
knob: {
stopper: true,
readOnly: true,
cursor: "gauge",
thickness: 0.35,
lineCap: "butt",
width: 200,
height: 200,
displayInput: false,
displayPrevious: false,
fgColor: "#87CEEB",
inputColor: "",
font: "Arial",
fontWeight: "bold",
step: 1,
draw: null,
change: null,
cancel: null,
release: null
}
}, options),
$s = $(this),
seconds = limit/10;
$s.val(settings.start).trigger("change");
if(settings.start < (seconds)) {
settings.start++;
window.clearTimeout(timer);
timer = setTimeout(function() {
$s.setKnobTimeout({
start: settings.start,
cycle: settings.cycle,
knob: settings.knob
}, callback, limit);
}, 1);
} else {
if(settings.start == seconds) {
if(typeof callback == "function") {
callback.call(this);
}
}
settings.start = 0;
if(settings.cycle) {
window.clearTimeout(timer);
timer = setTimeout(function() {
$s.setKnobTimeout({
start: settings.start,
cycle: settings.cycle,
knob: settings.knob
}, callback, limit);
}, 1);
}
}
// <-- Destroy need here
$s.knob({min: 0, max: seconds, stopper: settings.knob.stopper, readOnly: settings.knob.readOnly, cursor: settings.knob.cursor, thickness: settings.knob.thickness, lineCap: settings.knob.lineCap, width: settings.knob.width, height: settings.knob.height, displayInput: settings.knob.displayInput, displayPrevious: settings.knob.displayPrevious, fgColor: settings.knob.fgColor, inputColor: settings.knob.inputColor, font: settings.knob.font, fontWeight: settings.knob.fontWeight, step: settings.knob.step, draw: settings.knob.draw, change: settings.knob.change, cancel: settings.knob.cancel, release: settings.knob.release});
};
Usage:
$(".knob").setKnobTimeout(knob_options, function() {
alert("Hello!");
}, 2000);
How to destroy dynamically knob for reconstruct it?
well if the task needed is to remove knob with input after timeout has passed, try usage:
$(".knob").setKnobTimeout(knob_options, function() {
alert("Hello!");
this.parent()[0].remove();
//console.log(this.parent()[0]);
}, 2000);
Hi,
Did you find the proper way to dispose of jquery knob as I am having the same issue?
I'm having the same problem as well
i have the same problem too. plz solve this issue and release new version of plugin. tnx