lbsadmin/ESPUI
1
0
Fork 0
mirror of https://github.com/s00500/ESPUI.git synced 2025-06-12 04:10:39 +00:00
Code Issues Releases Activity

reformate slider

Browse Source
This commit is contained in:
Lukas Bachschwell
2019-12-28 14:17:29 +01:00
parent 79046d7bd0
commit 681a00b3ed
3 changed files with 116 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

197
data/js/slider.js
View File

@ -4,122 +4,119 @@
By: Ravikumar Chauhan
-------------------------------------------------------- */
function rkmd_rangeSlider(selector) {
var self, slider_width, slider_offset, curnt, sliderDiscrete, range, slider;
self = $(selector);
slider_width = self.width();
slider_offset = self.offset().left;
sliderDiscrete = self;
var self, slider_width, slider_offset, curnt, sliderDiscrete, range, slider;
self = $(selector);
slider_width = self.width();
slider_offset = self.offset().left;
sliderDiscrete = self;
sliderDiscrete.each(function(i, v) {
curnt = $(this);
curnt.append(sliderDiscrete_tmplt());
range = curnt.find('input[type="range"]');
slider = curnt.find('.slider');
slider_fill = slider.find('.slider-fill');
slider_handle = slider.find('.slider-handle');
slider_label = slider.find('.slider-label');
sliderDiscrete.each(function(i, v) {
curnt = $(this);
curnt.append(sliderDiscrete_tmplt());
range = curnt.find('input[type="range"]');
slider = curnt.find(".slider");
slider_fill = slider.find(".slider-fill");
slider_handle = slider.find(".slider-handle");
slider_label = slider.find(".slider-label");
var range_val = parseInt(range.val());
slider_fill.css('width', range_val + '%');
slider_handle.css('left', range_val + '%');
slider_label.find('span').text(range_val);
});
var range_val = parseInt(range.val());
slider_fill.css("width", range_val + "%");
slider_handle.css("left", range_val + "%");
slider_label.find("span").text(range_val);
});
self.on('mousedown touchstart', '.slider-handle', function(e) {
if (e.button === 2) {
return false;
}
var parents = $(this).parents('.rkmd-slider');
var slider_width = parents.width();
var slider_offset = parents.offset().left;
var check_range = parents.find('input[type="range"]').is(':disabled');
if (check_range === true) {
return false;
}
$(this).addClass('is-active');
var moveFu =
function(e) {
var pageX = e.pageX || e.changedTouches[0].pageX;
var slider_new_width = pageX - slider_offset;
if (slider_new_width <= slider_width && !(slider_new_width < '0')) {
slider_move(parents, slider_new_width, slider_width, true);
}
};
var upFu =
function(e) {
$(this).off(handlers);
parents.find('.is-active').removeClass('is-active');
};
self.on("mousedown touchstart", ".slider-handle", function(e) {
if (e.button === 2) {
return false;
}
var parents = $(this).parents(".rkmd-slider");
var slider_width = parents.width();
var slider_offset = parents.offset().left;
var check_range = parents.find('input[type="range"]').is(":disabled");
if (check_range === true) {
return false;
}
$(this).addClass("is-active");
var moveFu = function(e) {
var pageX = e.pageX || e.changedTouches[0].pageX;
var slider_new_width = pageX - slider_offset;
if (slider_new_width <= slider_width && !(slider_new_width < "0")) {
slider_move(parents, slider_new_width, slider_width, true);
}
};
var upFu = function(e) {
$(this).off(handlers);
parents.find(".is-active").removeClass("is-active");
};
var handlers = {
mousemove: moveFu,
touchmove: moveFu,
mouseup: upFu,
touchend: upFu
};
$(document).on(handlers);
});
var handlers = {
mousemove: moveFu,
touchmove: moveFu,
mouseup: upFu,
touchend: upFu
};
$(document).on(handlers);
});
self.on('mousedown touchstart', '.slider', function(e) {
if (e.button === 2) {
return false;
}
self.on("mousedown touchstart", ".slider", function(e) {
if (e.button === 2) {
return false;
}
var parents = $(this).parents('.rkmd-slider');
var slider_width = parents.width();
var slider_offset = parents.offset().left;
var check_range = parents.find('input[type="range"]').is(':disabled');
var parents = $(this).parents(".rkmd-slider");
var slider_width = parents.width();
var slider_offset = parents.offset().left;
var check_range = parents.find('input[type="range"]').is(":disabled");
if (check_range === true) {
return false;
}
if (check_range === true) {
return false;
}
var slider_new_width = e.pageX - slider_offset;
if (slider_new_width <= slider_width && !(slider_new_width < '0')) {
slider_move(parents, slider_new_width, slider_width, true);
}
var upFu =
function(e) {
$(this).off(handlers);
};
var slider_new_width = e.pageX - slider_offset;
if (slider_new_width <= slider_width && !(slider_new_width < "0")) {
slider_move(parents, slider_new_width, slider_width, true);
}
var upFu = function(e) {
$(this).off(handlers);
};
var handlers = {
mouseup: upFu,
touchend: upFu
};
$(document).on(handlers);
});
};
var handlers = {
mouseup: upFu,
touchend: upFu
};
$(document).on(handlers);
});
}
function sliderDiscrete_tmplt() {
var tmplt = '<div class="slider">' +
'<div class="slider-fill"></div>' +
'<div class="slider-handle"><div class="slider-label"><span>0</span></div></div>' +
'</div>';
var tmplt =
'<div class="slider">' +
'<div class="slider-fill"></div>' +
'<div class="slider-handle"><div class="slider-label"><span>0</span></div></div>' +
"</div>";
return tmplt;
return tmplt;
}
function slider_move(parents, newW, sliderW, send) {
var slider_new_val = parseInt(Math.round(newW / sliderW * 100));
var slider_new_val = parseInt(Math.round((newW / sliderW) * 100));
var slider_fill = parents.find('.slider-fill');
var slider_handle = parents.find('.slider-handle');
var range = parents.find('input[type="range"]');
var slider_fill = parents.find(".slider-fill");
var slider_handle = parents.find(".slider-handle");
var range = parents.find('input[type="range"]');
slider_fill.css('width', slider_new_val + '%');
slider_handle.css({
'left': slider_new_val + '%',
'transition': 'none',
'-webkit-transition': 'none',
'-moz-transition': 'none'
});
slider_fill.css("width", slider_new_val + "%");
slider_handle.css({
left: slider_new_val + "%",
transition: "none",
"-webkit-transition": "none",
"-moz-transition": "none"
});
range.val(slider_new_val);
if (parents.find('.slider-handle span').text() != slider_new_val) {
parents.find('.slider-handle span').text(slider_new_val);
var number = parents.attr('id').substring(2);
if (send) websock.send('slvalue:' + slider_new_val + ':' + number);
}
range.val(slider_new_val);
if (parents.find(".slider-handle span").text() != slider_new_val) {
parents.find(".slider-handle span").text(slider_new_val);
var number = parents.attr("id").substring(2);
if (send) websock.send("slvalue:" + slider_new_val + ":" + number);
}
}

17
data/js/slider.min.js vendored
View File

@ -1,10 +1,11 @@
function rkmd_rangeSlider(selector){var self,slider_width,slider_offset,curnt,sliderDiscrete,range,slider;self=$(selector);slider_width=self.width();slider_offset=self.offset().left;sliderDiscrete=self;sliderDiscrete.each(function(i,v){curnt=$(this);curnt.append(sliderDiscrete_tmplt());range=curnt.find('input[type="range"]');slider=curnt.find('.slider');slider_fill=slider.find('.slider-fill');slider_handle=slider.find('.slider-handle');slider_label=slider.find('.slider-label');var range_val=parseInt(range.val());slider_fill.css('width',range_val+'%');slider_handle.css('left',range_val+'%');slider_label.find('span').text(range_val);});self.on('mousedown touchstart','.slider-handle',function(e){if(e.button===2){return false;}
var parents=$(this).parents('.rkmd-slider');var slider_width=parents.width();var slider_offset=parents.offset().left;var check_range=parents.find('input[type="range"]').is(':disabled');if(check_range===true){return false;}
$(this).addClass('is-active');var moveFu=function(e){var pageX=e.pageX||e.changedTouches[0].pageX;var slider_new_width=pageX-slider_offset;if(slider_new_width<=slider_width&&!(slider_new_width<'0')){slider_move(parents,slider_new_width,slider_width,true);}};var upFu=function(e){$(this).off(handlers);parents.find('.is-active').removeClass('is-active');};var handlers={mousemove:moveFu,touchmove:moveFu,mouseup:upFu,touchend:upFu};$(document).on(handlers);});self.on('mousedown touchstart','.slider',function(e){if(e.button===2){return false;}
var parents=$(this).parents('.rkmd-slider');var slider_width=parents.width();var slider_offset=parents.offset().left;var check_range=parents.find('input[type="range"]').is(':disabled');if(check_range===true){return false;}
var slider_new_width=e.pageX-slider_offset;if(slider_new_width<=slider_width&&!(slider_new_width<'0')){slider_move(parents,slider_new_width,slider_width,true);}
var upFu=function(e){$(this).off(handlers);};var handlers={mouseup:upFu,touchend:upFu};$(document).on(handlers);});};function sliderDiscrete_tmplt(){var tmplt='<div class="slider">'+
function rkmd_rangeSlider(selector){var self,slider_width,slider_offset,curnt,sliderDiscrete,range,slider;self=$(selector);slider_width=self.width();slider_offset=self.offset().left;sliderDiscrete=self;sliderDiscrete.each(function(i,v){curnt=$(this);curnt.append(sliderDiscrete_tmplt());range=curnt.find('input[type="range"]');slider=curnt.find(".slider");slider_fill=slider.find(".slider-fill");slider_handle=slider.find(".slider-handle");slider_label=slider.find(".slider-label");var range_val=parseInt(range.val());slider_fill.css("width",range_val+"%");slider_handle.css("left",range_val+"%");slider_label.find("span").text(range_val);});self.on("mousedown touchstart",".slider-handle",function(e){if(e.button===2){return false;}
var parents=$(this).parents(".rkmd-slider");var slider_width=parents.width();var slider_offset=parents.offset().left;var check_range=parents.find('input[type="range"]').is(":disabled");if(check_range===true){return false;}
$(this).addClass("is-active");var moveFu=function(e){var pageX=e.pageX||e.changedTouches[0].pageX;var slider_new_width=pageX-slider_offset;if(slider_new_width<=slider_width&&!(slider_new_width<"0")){slider_move(parents,slider_new_width,slider_width,true);}};var upFu=function(e){$(this).off(handlers);parents.find(".is-active").removeClass("is-active");};var handlers={mousemove:moveFu,touchmove:moveFu,mouseup:upFu,touchend:upFu};$(document).on(handlers);});self.on("mousedown touchstart",".slider",function(e){if(e.button===2){return false;}
var parents=$(this).parents(".rkmd-slider");var slider_width=parents.width();var slider_offset=parents.offset().left;var check_range=parents.find('input[type="range"]').is(":disabled");if(check_range===true){return false;}
var slider_new_width=e.pageX-slider_offset;if(slider_new_width<=slider_width&&!(slider_new_width<"0")){slider_move(parents,slider_new_width,slider_width,true);}
var upFu=function(e){$(this).off(handlers);};var handlers={mouseup:upFu,touchend:upFu};$(document).on(handlers);});}
function sliderDiscrete_tmplt(){var tmplt='<div class="slider">'+
'<div class="slider-fill"></div>'+
'<div class="slider-handle"><div class="slider-label"><span>0</span></div></div>'+
'</div>';return tmplt;}
function slider_move(parents,newW,sliderW,send){var slider_new_val=parseInt(Math.round(newW/sliderW*100));var slider_fill=parents.find('.slider-fill');var slider_handle=parents.find('.slider-handle');var range=parents.find('input[type="range"]');slider_fill.css('width',slider_new_val+'%');slider_handle.css({'left':slider_new_val+'%','transition':'none','-webkit-transition':'none','-moz-transition':'none'});range.val(slider_new_val);if(parents.find('.slider-handle span').text()!=slider_new_val){parents.find('.slider-handle span').text(slider_new_val);var number=parents.attr('id').substring(2);if(send)websock.send('slvalue:'+slider_new_val+':'+number);}}
"</div>";return tmplt;}
function slider_move(parents,newW,sliderW,send){var slider_new_val=parseInt(Math.round((newW/sliderW)*100));var slider_fill=parents.find(".slider-fill");var slider_handle=parents.find(".slider-handle");var range=parents.find('input[type="range"]');slider_fill.css("width",slider_new_val+"%");slider_handle.css({left:slider_new_val+"%",transition:"none","-webkit-transition":"none","-moz-transition":"none"});range.val(slider_new_val);if(parents.find(".slider-handle span").text()!=slider_new_val){parents.find(".slider-handle span").text(slider_new_val);var number=parents.attr("id").substring(2);if(send)websock.send("slvalue:"+slider_new_val+":"+number);}}