Commit 97a1e6c3 authored by Mathieu Giraud's avatar Mathieu Giraud

Merge branch 'feature-c/1292-tag_multiple_clones' into 'dev'

1292; tag multiple clones at once

Closes #1292

See merge request !392
parents bb9c812d ca9a06f2
Pipeline #62075 passed with stages
in 4 minutes and 44 seconds
...@@ -1361,6 +1361,9 @@ span.warningReads { ...@@ -1361,6 +1361,9 @@ span.warningReads {
#bot-separator:hover { #bot-separator:hover {
background: #073642; background: #073642;
} }
#norm_button {
width: 7ex;
}
.edit_button { .edit_button {
float: right; float: right;
margin-right: 2px; margin-right: 2px;
...@@ -2270,3 +2273,7 @@ form .form_label { ...@@ -2270,3 +2273,7 @@ form .form_label {
[hidden] { [hidden] {
display: none !important; display: none !important;
} }
.disabledbutton {
pointer-events: none;
opacity: 0.4;
}
...@@ -1361,6 +1361,9 @@ span.warningReads { ...@@ -1361,6 +1361,9 @@ span.warningReads {
#bot-separator:hover { #bot-separator:hover {
background: #fdf6e3; background: #fdf6e3;
} }
#norm_button {
width: 7ex;
}
.edit_button { .edit_button {
float: right; float: right;
margin-right: 2px; margin-right: 2px;
...@@ -2270,6 +2273,10 @@ form .form_label { ...@@ -2270,6 +2273,10 @@ form .form_label {
[hidden] { [hidden] {
display: none !important; display: none !important;
} }
.disabledbutton {
pointer-events: none;
opacity: 0.4;
}
body { body {
line-height: 20px; line-height: 20px;
} }
......
...@@ -2618,3 +2618,8 @@ form { ...@@ -2618,3 +2618,8 @@ form {
[hidden] { [hidden] {
display: none !important; display: none !important;
} }
.disabledbutton {
pointer-events: none;
opacity: 0.4;
}
\ No newline at end of file
...@@ -1381,7 +1381,7 @@ Clone.prototype = { ...@@ -1381,7 +1381,7 @@ Clone.prototype = {
var span_star = document.createElement('span') var span_star = document.createElement('span')
span_star.setAttribute('class', 'starBox'); span_star.setAttribute('class', 'starBox');
span_star.onclick = function (e) { span_star.onclick = function (e) {
self.m.openTagSelector(self.index, e); self.m.openTagSelector([self.index], e);
} }
span_star.id = self.index span_star.id = self.index
var tag_icon = document.createElement('i') var tag_icon = document.createElement('i')
......
...@@ -401,6 +401,7 @@ List.prototype = { ...@@ -401,6 +401,7 @@ List.prototype = {
self.m.focusIn(cloneID); self.m.focusIn(cloneID);
} }
div_elem.className = "listElem"; div_elem.className = "listElem";
div_elem.id = "listElem_"+cloneID
div_elem.style.display = "block"; div_elem.style.display = "block";
var span_name = document.createElement('span'); var span_name = document.createElement('span');
......
...@@ -1948,32 +1948,31 @@ changeAlleleNotation: function(alleleNotation) { ...@@ -1948,32 +1948,31 @@ changeAlleleNotation: function(alleleNotation) {
* open/build the tag/normalize menu for a clone * open/build the tag/normalize menu for a clone
* @param {integer} cloneID - clone index * @param {integer} cloneID - clone index
* */ * */
openTagSelector: function (cloneID, e) { openTagSelector: function (clonesIDs, e) {
var self = this; var self = this;
cloneID = typeof cloneID !== 'undefined' ? cloneID : this.cloneID;
this.tagSelectorList.removeAllChildren(); this.tagSelectorList.removeAllChildren();
this.cloneID=cloneID clonesIDs = clonesIDs !== undefined ? clonesIDs : this.clonesIDs;
this.clonesIDs=clonesIDs
var buildTagSelector = function (i) { var buildTagSelector = function (i) {
var span1 = document.createElement('span'); var span1 = document.createElement('span');
span1.className = "tagColorBox tagColor" + i span1.className = "tagColorBox tagColor" + i
span1.onclick = function () {
self.clone(cloneID).changeTag(i)
$(self.tagSelector).hide('fast')
}
var span2 = document.createElement('span'); var span2 = document.createElement('span');
span2.className = "tagName" + i + " tn" span2.className = "tagName" + i + " tn"
span2.appendChild(document.createTextNode(self.tag[i].name)) span2.appendChild(document.createTextNode(self.tag[i].name))
span2.onclick = function () {
self.clone(cloneID).changeTag(i)
$(self.tagSelector).hide('fast')
}
var div = document.createElement('div'); var div = document.createElement('div');
div.className = "tagElem" div.className = "tagElem"
div.id = "tagElem_" + i
div.appendChild(span1) div.appendChild(span1)
div.appendChild(span2) div.appendChild(span2)
div.onclick = function () {
for (var j = 0; j < clonesIDs.length; j++) {
self.clone(clonesIDs[j]).changeTag(i)
}
$(self.tagSelector).hide('fast')
}
var li = document.createElement('li'); var li = document.createElement('li');
li.appendChild(div) li.appendChild(div)
...@@ -1985,6 +1984,9 @@ changeAlleleNotation: function(alleleNotation) { ...@@ -1985,6 +1984,9 @@ changeAlleleNotation: function(alleleNotation) {
buildTagSelector(i); buildTagSelector(i);
} }
var separator = document.createElement('div');
separator.innerHTML = "<hr>"
var span1 = document.createElement('span'); var span1 = document.createElement('span');
span1.appendChild(document.createTextNode("normalize to: ")) span1.appendChild(document.createTextNode("normalize to: "))
...@@ -1999,8 +2001,9 @@ changeAlleleNotation: function(alleleNotation) { ...@@ -1999,8 +2001,9 @@ changeAlleleNotation: function(alleleNotation) {
this.norm_button = document.createElement('button'); this.norm_button = document.createElement('button');
this.norm_input.id = "norm_button"; this.norm_input.id = "norm_button";
this.norm_button.appendChild(document.createTextNode("ok")) this.norm_button.appendChild(document.createTextNode("ok"))
this.norm_button.onclick = function () { this.norm_button.onclick = function () {
var cloneID = self.cloneID; var cloneID = self.clonesIDs[0];
var size = parseFloat(self.norm_input.value); var size = parseFloat(self.norm_input.value);
if (size>0 && size<1){ if (size>0 && size<1){
...@@ -2021,19 +2024,26 @@ changeAlleleNotation: function(alleleNotation) { ...@@ -2021,19 +2024,26 @@ changeAlleleNotation: function(alleleNotation) {
} }
var div = document.createElement('div'); var div = document.createElement('div');
div.id = "normalization_expected_input_div"
div.appendChild(separator)
div.appendChild(span1) div.appendChild(span1)
div.appendChild(span2) div.appendChild(span2)
div.appendChild(this.norm_button) div.appendChild(this.norm_button)
var li = document.createElement('li'); var li = document.createElement('li');
li.appendChild(div) li.appendChild(div)
this.tagSelectorList.appendChild(li); this.tagSelectorList.appendChild(li);
var string;
if (cloneID[0] == "s") cloneID = cloneID.substr(3); if (clonesIDs.length > 1){
string = "Tag for " + clonesIDs.length + " clones"
} else {
if (clonesIDs[0][0] == "s") cloneID = clonesIDs[0].substr(3);
string = "Tag for "+this.clone(clonesIDs[0]).getName()
}
this.tagSelectorInfo.innerHTML = string
$(this.tagSelector).show(); $(this.tagSelector).show();
this.tagSelectorInfo.innerHTML = "tag for "+this.clone(cloneID).getName()+"("+cloneID+")";
//replace tagSeelector //replace tagSeelector
...@@ -2044,6 +2054,11 @@ changeAlleleNotation: function(alleleNotation) { ...@@ -2044,6 +2054,11 @@ changeAlleleNotation: function(alleleNotation) {
if (top<minTop) top=minTop; if (top<minTop) top=minTop;
if (top>maxTop) top=maxTop; if (top>maxTop) top=maxTop;
this.tagSelector.style.top=top+"px"; this.tagSelector.style.top=top+"px";
// If multiple clones Ids; disabled normalization div
if (clonesIDs.length > 1) {
$("#"+div.id).addClass("disabledbutton");
}
}, },
......
...@@ -371,7 +371,20 @@ Segment.prototype = { ...@@ -371,7 +371,20 @@ Segment.prototype = {
hide_selected.onclick = function () { self.m.hideSelected() } hide_selected.onclick = function () { self.m.hideSelected() }
div_stats.appendChild(hide_selected) div_stats.appendChild(hide_selected)
//
// Tag/Star
var span_star = document.createElement('span')
span_star.setAttribute('class', 'button');
span_star.setAttribute("title", 'Tag selected clones');
span_star.onclick = function (e) {
if (m.getSelected().length > 0) { self.m.openTagSelector(m.getSelected(), e); }
}
var tag_icon = document.createElement('i')
tag_icon.id = "tag_icon__multiple"
tag_icon.classList.add('icon-star-2')
span_star.appendChild(tag_icon)
div_stats.appendChild(span_star);
div.appendChild(div_stats) div.appendChild(div_stats)
div_stats.appendChild(span_fixsegmenter); div_stats.appendChild(span_fixsegmenter);
...@@ -1043,6 +1056,12 @@ Segment.prototype = { ...@@ -1043,6 +1056,12 @@ Segment.prototype = {
} }
$(".stats_content").prop('title', s) $(".stats_content").prop('title', s)
} }
if (this.m.getSelected().length > 0){
$("#tag_icon__multiple").css("display", "")
} else {
$("#tag_icon__multiple").css("display", "none")
}
}, },
/** /**
......
...@@ -352,6 +352,31 @@ class TestMultilocus < BrowserTest ...@@ -352,6 +352,31 @@ class TestMultilocus < BrowserTest
end end
end end
def test_19_edit_tag
begin
$b.clone_in_scatterplot('77').click
$b.clone_in_scatterplot('25').click(:control)
$b.clone_in_scatterplot('88').click(:control)
$b.clone_in_scatterplot('90').click(:control)
## Test tag selection for one clone
$b.clone_info('25')[:star].click
$b.element(:id => 'tagElem_0').click
assert ($b.clone_info('25')[:name].style('color') == 'rgba(220, 50, 47, 1)' ) , "clone 25 have changed color"
assert ( not $b.clone_info('88')[:name].style('color') == 'rgba(220, 50, 47, 1)' ) , "clone 88 (second of the selection) haven't chaged color "
## Test tag selection for multiple clone
$b.element(:id => "tag_icon__multiple").click
$b.element(:id => 'tagElem_6').click
assert ($b.clone_info('25')[:name].style('color') == 'rgba(211, 54, 130, 1)' ) , "clone 25 have also changed color"
assert ($b.clone_info('77')[:name].style('color') == 'rgba(211, 54, 130, 1)' ) , "clone 77 have also changed color"
assert ($b.clone_info('88')[:name].style('color') == 'rgba(211, 54, 130, 1)' ) , "clone 88 have also changed color"
end
end
# Not really a test # Not really a test
def test_zz_close def test_zz_close
close_everything close_everything
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment