Fix #1522 Issue with jquery ui tabs & multiselect

This commit is contained in:
Nicolas Le Goff
2013-10-10 16:20:20 +02:00
parent 044a7d5862
commit d4b7280c81
5 changed files with 1095 additions and 1157 deletions

View File

@@ -23,7 +23,7 @@
"sinon": "~1.7",
"sinon-chai": "~2.4",
"js-fixtures": "https://github.com/badunk/js-fixtures/archive/master.zip",
"bootstrap-multiselect": "https://github.com/davidstutz/bootstrap-multiselect.git",
"bootstrap-multiselect": "https://github.com/davidstutz/bootstrap-multiselect.git#bootstrap-2-3",
"zxcvbn" : "https://github.com/lowe/zxcvbn.git",
"geonames-server-jquery-plugin" : "~0.2"
}

View File

@@ -57,7 +57,6 @@ $groups = array(
, '//include/jquery.tooltip.js'
, '//include/jslibs/jquery.contextmenu_scroll.js'
, '//include/jslibs/jquery.print.js'
, '//include/jslibs/jquery.multiselect.js'
, '//include/jslibs/jquery.cluetip.js'
, '//include/jquery.nicoslider.js'
, '//skins/report/report.js'

View File

@@ -15,25 +15,36 @@
</div>
</div>
</div>
{% set all_coll = dashboard.getAllColl() %}
<div class="form2">
<div class="form_titre">{% trans "report:: 2 - Bases" %}</div>
<div id="select_one">
{% block base_selector %}
{% set all_coll = dashboard.getAllColl() %}
<select name="popbases[]" class="multiselect" multiple="multiple" id="popbases">
<ul class="multiselect" style="max-height: 150px; overflow-y: auto; overflow-x: hidden;">
<li>
<a href="javascript:void(0);" class="select-all">
{% trans %}Select all{% endtrans %}
</a>
<a href="javascript:void(0);" class="deselect-all">
{% trans %}Deselect all{% endtrans %}
</a>
</li>
{% for the_base_coll in all_coll %}
<optgroup label="{{ the_base_coll.name_sbas }}">
<li><label data-group-id="{{ loop.index }}" class="multiselect-group"><b>{{ the_base_coll.name_sbas }}</b></label></li>
{% for a_coll in the_base_coll.sbas_collections %}
<option value="{{ a_coll.sbas_id}}_{{ a_coll.coll_id }}">{{ a_coll.name }}</option>
<li>
<a href="javascript:void(0);">
<label class="checkbox">
<input name="popbases[]" checked="checked" type="checkbox" class="coll-checkbox checkbox-{{ loop.parent.loop.index }}" value="{{ a_coll.sbas_id}}_{{ a_coll.coll_id }}">
{{ a_coll.name }}
</label>
</a>
</li>
{% endfor %}
</optgroup>
{% endfor %}
</select>
{% endblock base_selector %}
</ul>
</div>
</div>
{% endblock form_date_and_base %}

View File

@@ -56,6 +56,7 @@
$wrapper = $slider.find(".wrapper");
$ulHeight = ul.height();
$wrapper.width($wrapperWidth);
$wrapper.height($ulHeight);
$wrapperCss= {
'overflow':'hidden',
@@ -64,6 +65,7 @@
};
$wrapper.css($wrapperCss);
ul.css('position', 'absolute');
ul.width(ulWidth);
$slider.prepend("<div class='scrollleft'></div>");
$slider.append("<div class='scrollright'></div>");
@@ -78,16 +80,20 @@
rightCss = {
'width' : $scrollWidth - ($wrapper.outerWidth(true) - $wrapper.innerWidth()),
'height' : liHeight,
'height' : liHeight + 5,
'float' : 'right',
'background-color' : o.color
'background-color' : o.color,
'cursor': 'pointer',
' user-select': 'none'
};
leftCss = {
'width' : $scrollWidth - ($wrapper.outerWidth(true) - $wrapper.innerWidth()),
'height' : liHeight,
'height' : liHeight + 5,
'float' : 'left',
'background-color' : o.color
'background-color' : o.color,
'cursor': 'pointer',
' user-select': 'none'
};
leftScroll.css(leftCss);
@@ -95,44 +101,32 @@
var rightScrollWidth = rightScroll.width();
var leftScrollWidth = leftScroll.width();
var scrollInterval = 100;
var scrollXpos = 0;
var scrollStepSpeed = 20;
var scrollStepSpeed = 40;
var speed = 8;
var repeat = null;
var shift = o.start;
//calcul position zone droite
rightScroll.bind("mousemove", function(e){
var x = e.pageX - ($(this).offset().left);
scrollXpos = Math.round((x / rightScrollWidth) * scrollStepSpeed);
});
//calcul position zone gauche
leftScroll.bind("mousemove", function(e){
var x = $(this).innerWidth() - (e.pageX - $(this).offset().left);
scrollXpos = Math.round((x / leftScrollWidth) * scrollStepSpeed);
});
//scroll a droite
rightScroll.bind("mouseenter", function(){
repeat = setInterval(function(){
rightScroll.bind("click", function(e){
var x = e.pageX - ($(this).offset().left);
scrollXpos = Math.round((x / rightScrollWidth) * scrollStepSpeed);
shift += (scrollXpos * speed);
if(shift > (ulWidth - $wrapperWidth) + 50)
{
shift = (ulWidth - $wrapperWidth) + 50;
}
ul.animate({
left: -shift
}, 1);
}, scrollInterval);
});
//scroll a gauche
leftScroll.bind("mouseenter", function(){
repeat = setInterval(function(){
leftScroll.bind("click", function(e){
var x = $(this).innerWidth() - (e.pageX - $(this).offset().left);
scrollXpos = Math.round((x / leftScrollWidth) * scrollStepSpeed);
shift -= (scrollXpos * speed);
if(shift < 0)
@@ -144,19 +138,6 @@
left: -shift
}, 1);
}, scrollInterval);
});
//on stop a droite
rightScroll.bind("mouseout", function(){
clearInterval(repeat);
scrollXpos = 0;
});
//on stop a gauche
leftScroll.bind("mouseout", function(){
clearInterval(repeat);
scrollXpos = 0;
});
}
};

File diff suppressed because it is too large Load Diff