Strasznie utrudniłeś sobie życie przekazując do slidera min: 0 max: 20
. Dużo prościej będzie, jak zrobisz sobie tylko dwa obiekty, które będą reprezentowały relację prędkość => cena
i jako min slidera ustawisz minimalną prędkość, a max maksymalną. Nikt nie powiedział, że musi to być 0 i 20.
function min(elements) {
return Math.min.apply(null, elements);
}
function max(elements) {
return Math.max.apply(null, elements);
}
function updateLabel($label, val) {
$label.text(val + ' Mb/s');
}
function calculatePrice(downloadSpeed, uploadSpeed) {
var downloadPrice = downloadSpeedPrices[downloadSpeed];
var uploadPrice = uploadSpeedPrices[uploadSpeed];
var monthlyPrice = downloadPrice + uploadPrice;
var initialPrice = monthlyPrice + installationFee;
$('#total').val(monthlyPrice.toFixed(2) + ' PLN');
$('#total_end').val(initialPrice.toFixed(2) + ' PLN');
}
var installationFee = 49.90;
var downloadSpeedPrices = {
10: 44.9,
11: 46.9,
12: 48.9,
13: 50.9,
14: 52.9,
15: 54.9,
16: 56.9,
17: 58.9,
18: 60.9,
19: 62.9,
20: 64.9,
21: 66.9,
22: 68.9,
23: 70.9,
24: 72.9,
25: 74.9,
26: 76.9,
27: 78.9,
28: 80.9,
29: 82.9,
30: 84.9,
};
var uploadSpeedPrices = {
1: 4.0,
2: 8.0,
3: 12.0,
4: 16.0,
5: 20.0,
6: 24.0,
7: 28.0,
8: 32.0,
9: 36.0,
10: 40.0,
};
$(document).ready(function () {
var availableDownloadSpeeds = Object.keys(downloadSpeedPrices);
var minDownloadSpeed = min(availableDownloadSpeeds);
var downloadSpeed = minDownloadSpeed;
var $downloadSpeedSelect = $('#slider_amirol');
$downloadSpeedSelect.slider({
range: 'min',
animate: true,
min: minDownloadSpeed,
max: max(availableDownloadSpeeds),
step: 1,
slide: function (event, ui) {
downloadSpeed = ui.value;
updateLabel($(ui.handle), downloadSpeed);
calculatePrice(downloadSpeed, uploadSpeed);
},
});
updateLabel($downloadSpeedSelect.find('a'), downloadSpeed);
var availableUploadSpeeds = Object.keys(uploadSpeedPrices);
var minUploadSpeed = min(availableUploadSpeeds);
var uploadSpeed = minUploadSpeed;
var $uploadSpeedSelect = $('#slider_amirol_down');
$uploadSpeedSelect.slider({
range: 'min',
animate: true,
min: minUploadSpeed,
max: max(availableUploadSpeeds),
step: 1,
slide: function (event, ui) {
uploadSpeed = ui.value;
updateLabel($(ui.handle), uploadSpeed);
calculatePrice(downloadSpeed, uploadSpeed);
},
});
updateLabel($uploadSpeedSelect.find('a'), uploadSpeed);
calculatePrice(downloadSpeed, uploadSpeed);
});