Modifing titanium slider - titanium

Question

The default titanium slider only allows you to have one pin on it.
How could you modify it, so that it accepts a range of values. Such as age range?
Cheers.
UPDATE (after installing module):
// Double Slider example
var tidoubleslider = require('com.semanticpress.tidoubleslider');
var dSlider = tidoubleslider.createSlider({
top: 40,
height: 50,
width: 280,
leftTrackImage:'left2.png',
highlightedLeftTrackImage:'highlightedLeft2.png',
disabledLeftTrackImage:'disabledLeft2.png',
centerTrackImage:'center2.png',
highlightedCenterTrackImage:'highlightedCenter2.png',
disabledCenterTrackImage:'disabledCenter2.png',
rightTrackImage:'right2.png',
highlightedRightTrackImage:'highlightedRight2.png',
disabledRightTrackImage:'disabledRight2.png',
leftThumbImage:'thumb.png',
highlightedLeftThumbImage:'highlightedThumb.png',
disabledLeftThumbImage:'disabledThumb.png',
rightThumbImage:'thumb.png',
highlightedRightThumbImage:'highlightedThumb.png',
disabledRightThumbImage:'disabledThumb.png',
min:0,
max:50,
leftValue:25,
rightValue:50,
enabled: true
});
$.ageSliderView.add(dSlider);
var leftLabel = Ti.UI.createLabel({
top:30,
left:20,
width:100,
height: 20,
color:'black',
text:dSlider.leftValue
});
$.ageSliderView.add(leftLabel);
var rightLabel = Ti.UI.createLabel({
top:30,
right:20,
width:100,
height: 20,
color:'black',
text:dSlider.rightValue,
textAlign:'right'
});
$.ageSliderView.add(rightLabel);
dSlider.addEventListener('touchstart', function(e) {
if (typeof e.value !== 'undefined') {
if (e.thumbIndex === 0) {
leftLabel.text = e.value.toFixed(1);
leftLabel.color = 'red';
}
else {
rightLabel.text = e.value.toFixed(1);
rightLabel.color = 'red';
}
}
else {
leftLabel.color = 'gray';
rightLabel.color = 'gray';
}
});
dSlider.addEventListener('change', function(e) {
if (e.thumbIndex === 0) {
leftLabel.text = e.value.toFixed(1);
}
else {
rightLabel.text = e.value.toFixed(1);
}
});
dSlider.addEventListener('touchend', function(e) {
if (typeof e.value !== 'undefined') {
if (e.thumbIndex === 0) {
leftLabel.text = e.value.toFixed(1);
leftLabel.color = 'black';
}
else {
rightLabel.text = e.value.toFixed(1);
rightLabel.color = 'black';
}
}
else {
leftLabel.color = 'black';
rightLabel.color = 'black';
}
});
The slider does not appear on the screen. I guess it is because the slider images are missing?

Answer 1

Here you go.The slider With raning option in titanium
https://github.com/tzmartin/Ti-Double-Slider/tree/master/dist
Thanks