Your IP : 18.219.40.177
/**
* Slider module
* @param {object} window global object
* @param {object|function} $ jQuery
* @param {object} EventMgr Event manager
* @param {object} App Application
*/
/*global App:true*/
App.Slider = function(window, $, EventMgr, App) {
'use strict';
var init = function() {
EventMgr.on($content(), sliderSelector, 'mousedown', drag);
EventMgr.on($content(), sliderWrapperSelector, 'mousedown', sliderToPoint);
EventMgr.bind('appendForm', start);
EventMgr.bind('appendEditInList', startEditInList);
EventMgr.bind('reloadSlider', start);
EventMgr.on($content(), sliderInputSelector, 'change', sliderMove);
EventMgr.on($content(), sliderInputSelector,
'keydown', sliderKeyDownHandler);
EventMgr.on($content(), sliderInputSelector, 'keyup', deleteSliderHandler);
EventMgr.on($content(), sliderSelector, 'ontouchstart', drag);
},
$content = function() {
return $('#main-wrapper');
},
sliderSelector = '.l-slider__wr:not(".readonly") .b-slider__el',
sliderInputSelector = '.b-input_for_slider:not(".readonly")',
sliderWrapperSelector = '.l-slider__wr:not(".readonly")',
max = 0, min = 0, self = null, maxleft = 0, shiftX = 0, width = 0,
intId = null, tabId = '', inputId = null, step = 0,
//flag for change input value
fromInput = false,
calcValue = function(np) {
var bound = max - min,
delta = (bound / maxleft),
initDelta = (min % step),
value = (Math.round(np * delta) + parseInt(min, 10)),
el = App.Dom.byId(inputId),
elSlider = App.Dom.byId(inputId + '-slider'),
ldf = (value % step),
rdf = step - ldf;
if (ldf > rdf) {
value += rdf;
} else {
value -= ldf;
}
value += initDelta;
//check bounds
if (value > max) {
value = max;
} else if (value < min) {
value = min;
}
if (el !== null) {
el.value = value;
}
if (elSlider) {
elSlider.setAttribute('data-value', value);
}
EventMgr.trigger('changeSliderValue', { tabId: tabId });
},
getDataSlider = function() {
tabId = self.getAttribute('data-tabid');
inputId = self.getAttribute('data-id');
min = self.getAttribute('data-min');
step = parseInt(self.getAttribute('data-step'), 10);
if (!step) { step = 1;}
max = (self.getAttribute('data-max'));
width = $(self).parent().width();
maxleft = width - 9;
},
setPosition = function(newPosition) {
var np = 0;
if ((newPosition <= maxleft) && (newPosition >= 0)) {
np = newPosition;
}
else if (newPosition > maxleft) {
fromInput = false;
np = maxleft;
}
else {
fromInput = false;
np = 0;
}
self.style.left = np + 'px';
if (!fromInput) {
calcValue(np);
}
fromInput = false;
return false;
},
start = function(e, data) {
tabId = data.tabId;
$('#incont-' + tabId + ' .b-slider__el').each(function() {
self = this;
fromInput = true;
getDataSlider();
if (width !== 0) {
var value = this.getAttribute('data-value'),
bound = max - min,
delta = bound / maxleft,
np = value / delta - min / delta;
setPosition(np);
}
});
},
startEditInList = function(e, data) {
tabId = data.tabId;
$('#editinlist-wrapper-' + tabId + ' .b-slider__el')
.each(function() {
self = this;
fromInput = true;
getDataSlider();
var value = this.getAttribute('data-value'),
bound = max - min,
delta = bound / maxleft,
np = value / delta - min / delta;
setPosition(np);
});
},
sliderMove = function(e, sv) {
e = e || window.event;
var f = (this.value.substr(0, 1) === '-') ? '-' : '';
this.value = f + this.value.replace(/\D/g, '');
fromInput = true;
var id = this.getAttribute('id');
self = App.Dom.byId(id + '-slider');
getDataSlider();
var value = App.Dom.byId(inputId).value,
ldf = value % step,
rdf = step - ldf,
bound = max - min,
delta = bound / maxleft,
initDelta = (min % step),
np,
elSlider = App.Dom.byId(inputId + '-slider');
value -= 0;
if (ldf > rdf) {
value += rdf;
} else {
value -= ldf;
}
value += initDelta;
this.value = value;
np = value / delta - min / delta;
if (np > maxleft) {
fromInput = false;
}
setPosition(np);
blockEvent(e);
if (elSlider) {
elSlider.setAttribute('data-value', value);
}
EventMgr.trigger('changeSliderValue', { tabId: tabId });
return false;
},
sliderKeyDownHandler = function(e) {
e = e || window.event;
var codeKey = e.which || e.keyCode,
id;
if (codeKey === 38 || codeKey === 40) {
id = this.getAttribute('id');
self = $('a#' + id + '-slider')[0];
getDataSlider();
blockEvent(e);
}
if (codeKey === 38 && !e.ctrlKey) {
clearInterval(intId);
sliderMoveForKeyDown(true);
intId = setInterval(function() { sliderMoveForKeyDown(true); }, 100);
blockEvent(e);
} else if (codeKey === 40 && !e.ctrlKey) {
clearInterval(intId);
sliderMoveForKeyDown(false);
intId = setInterval(function() { sliderMoveForKeyDown(false); }, 100);
blockEvent(e);
}
},
deleteSliderHandler = function() {
var f = (this.value.substr(0, 1) === '-') ? '-' : '';
this.value = f + this.value.replace(/\D/g, '');
clearInterval(intId);
},
sliderMoveForKeyDown = function(up) {
var input = App.Dom.byId(inputId),
value = input.value;
if (up) {
value = parseInt(value, 10) + step;
} else {
if (value === max) {
value -= 3;
} else {
value -= step;
}
}
input.value = value;
EventMgr.trigger('changeSliderValue', { tabId: tabId });
$('#' + inputId).trigger('change');
},
sliderToPoint = function(e) {
e = e || window.event;
self = $(this).children('.b-slider__el')[0];
getDataSlider();
shiftX = e.clientX - $(this).offset().left - 7;
setPosition(shiftX);
$('#' + inputId).trigger('change');
},
drag = function(e) {
$(this).trigger('focus');
e = e || window.event;
if (e.touches) {
shiftX = e.touches[0].pageX - parseInt(this.style.left, 10);
document.ontouchmove = move;
document.ontouchend = drop;
document.ontouchcancel = drop;
} else {
shiftX = e.clientX - parseInt(this.style.left, 10);
document.onmousemove = move;
document.onmouseup = drop;
}
self = this;
getDataSlider();
blockEvent(e);
return false;
},
//Handler for move
move = function(e) {
e = e || window.event;
if (e.touches) {
setPosition(e.touches[0].pageX - shiftX);
} else {
setPosition(e.clientX - shiftX);
}
blockEvent(e);
return false;
},
//Handler for mouseup, unbind mousemove and mouseup
drop = function(e) {
$(this).trigger('blur');
e = e || window.event;
document.onmousemove = null;
document.onmouseup = null;
document.ontouchmove = null;
document.ontouchend = null;
document.ontouchcancel = null;
$('#' + inputId).trigger('change');
blockEvent(e);
};
return {
init: init
};
}(window, $, EventMgr, App);