Skip to content

Commit c29dc79

Browse files
knabarknabar
authored
Merge pull request #639 from Rdornier/split-view-user-label
Split view user label
2 parents 4dfc106 + a994a60 commit c29dc79

File tree

3 files changed

+138
-47
lines changed

3 files changed

+138
-47
lines changed

‎omeroweb/webclient/static/webclient/javascript/ome.split_view_figure.js‎

Lines changed: 64 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -232,23 +232,72 @@ $(document).ready(function() {
232232

233233
// Image Labels
234234
var $Image_Labels = $("select[name=Image_Labels]"),
235+
$Custom_Label = $("input[name=Custom_Label]"),
236+
$Image_Custom_Label_List = $("select[name=Image_Custom_Label_List]"),
235237
$rowLabels = $(".rowLabel>div"),
236238
$imgName = $("div.imgName"),
237239
$imgTags = $("div.imgTags"),
238-
$imgDatasets = $("div.imgDatasets");
240+
$imgDatasets = $("div.imgDatasets"),
241+
$customLabelInput = $("div.customLabelInput"),
242+
currentSelectedImage = "All";
243+
239244
$Image_Labels.on('change', function(){
240245
var labels = $(this).val();
241246
$rowLabels.hide(); // hide all then show one...
242247
if (labels == "Image Name") {
243248
$imgName.show();
249+
$customLabelInput.hide();
250+
$Image_Custom_Label_List.hide();
244251
} else if (labels == "Datasets") {
245252
$imgDatasets.show();
253+
$customLabelInput.hide();
254+
$Image_Custom_Label_List.hide();
246255
} else if (labels == "Tags") {
247256
$imgTags.show();
257+
$customLabelInput.hide();
258+
$Image_Custom_Label_List.hide();
259+
} else if(labels == "Custom"){
260+
$customLabelInput.show();
261+
$Image_Custom_Label_List.show();
262+
var len = $Image_Custom_Label_List[0].options.length
263+
for(var i = 0; i < len; i++){
264+
var opt = $Image_Custom_Label_List[0].options[i]
265+
var customLabelDiv = 'div.customLabel' + opt.value
266+
var $customLabel = $(customLabelDiv);
267+
$customLabel.show()
268+
}
248269
}
249270
updateColWidths();
271+
updateCustomLabels($Image_Custom_Label_List);
250272
});
251273

274+
$Custom_Label.on('input', (e) => {
275+
if (currentSelectedImage == "All"){
276+
var len = $Image_Custom_Label_List[0].options.length
277+
for(var i = 0; i < len; i++){
278+
var opt = $Image_Custom_Label_List[0].options[i]
279+
var currentDiv = '.customLabel' + opt.value
280+
$(currentDiv + ' #customLabelText').text(e.target.value);
281+
$(currentDiv).show();
282+
}
283+
} else {
284+
var currentDiv = '.customLabel'+currentSelectedImage
285+
$(currentDiv + ' #customLabelText').text(e.target.value);
286+
$(currentDiv).show();
287+
}
288+
289+
updateColWidths();
290+
updateCustomLabels($Image_Custom_Label_List);
291+
});
292+
293+
$Image_Custom_Label_List.on('change', function(){
294+
currentSelectedImage = $(this).val();
295+
if (currentSelectedImage != "All"){
296+
var currentDiv = '.customLabel'+currentSelectedImage+' #customLabelText'
297+
var currentLabel = $(currentDiv).text();
298+
$Custom_Label.val(currentLabel)
299+
}
300+
})
252301

253302
// Drag and Drop to re-order rows
254303
$('table tbody').sortable({
@@ -276,6 +325,20 @@ $(document).ready(function() {
276325
});
277326
}
278327

328+
var updateCustomLabels = function(labelList) {
329+
var len = labelList[0].options.length
330+
var allLabels = [];
331+
for(var i = 0; i < len; i++){
332+
var opt = labelList[0].options[i]
333+
var currentDiv = '.customLabel' + opt.value
334+
var text = $(currentDiv + ' #customLabelText').text();
335+
allLabels.push(""+opt.value+"//s"+text)
336+
}
337+
var $allLabels = $("input[name=All_labels]")
338+
$allLabels.val(allLabels.join("//n"))
339+
}
340+
341+
279342
// Lets sync everything to start with:
280343
updateChannelNames();
281344
updateMergedChannels();

‎omeroweb/webclient/templates/webclient/scripts/split_view_figure.html‎

Lines changed: 69 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -178,53 +178,73 @@ <h2 style="color: red">{{ warning }}</h2>
178178

179179
{% block custom_controls %}
180180
<!------------------- Custom Controls - in addition to script parameters ------------>
181-
<table cellspacing='3' style="margin-left:auto; margin-right:auto">
182-
<tr>
183-
<td></td>
184-
<td colspan="{{ channels|length }}" align="center">
185-
<div title="If true, all split panels are greyscale">
186-
Split Panels Grey:
187-
<input type="checkbox" name="Split_Panels_Grey" />
188-
</div>
189-
</td>
190-
<td align="center">
191-
<div style="height:20px" title="If true, label the merged panel with channel names. Otherwise label with &#39;Merged&#39;">
192-
Merged Names: <input type="checkbox" name="Merged_Names" checked="True"/>
193-
</div>
194-
</td>
195-
</tr>
196-
<tr>
197-
<td title="Label images with Image name (default) or datasets or tags" valign="bottom">
198-
<select name="Image_Labels" style="margin-right:20px">
199-
<option value="Image Name" selected="True" >Image Name</option>
200-
<option value="Datasets" >Datasets</option>
201-
<option value="Tags" >Tags</option>
181+
<table cellspacing='3' style="margin-left:auto; margin-right:auto">
182+
<tr>
183+
<td></td>
184+
<td colspan="{{ channels|length }}" align="center">
185+
<div title="If true, all split panels are greyscale">
186+
Split Panels Grey:
187+
<input type="checkbox" name="Split_Panels_Grey" />
188+
</div>
189+
</td>
190+
<td align="center">
191+
<div style="height:20px" title="If true, label the merged panel with channel names. Otherwise label with &#39;Merged&#39;">
192+
Merged Names: <input type="checkbox" name="Merged_Names" checked="True"/>
193+
</div>
194+
</td>
195+
</tr>
196+
<tr>
197+
<td title="Label images with Image name (default) or datasets or tags" valign="bottom">
198+
<select name="Image_Labels" style="margin-right:20px">
199+
<option value="Image Name" selected="True" >Image Name</option>
200+
<option value="Datasets" >Datasets</option>
201+
<option value="Tags" >Tags</option>
202+
{% if custom_labels_supported %}
203+
<option value="Custom" >Custom</option>
204+
{% endif %}
205+
</select>
206+
</td>
207+
{% for c in channels %}
208+
<td id="split_channels" valign="bottom">
209+
<div class="toggle_channel" style="background:#{{c.getColor.getHtml}}">
210+
<input type="text" size='10' name="{{ forloop.counter0 }}cName" value="{{ c.getLabel }}" />
211+
<input type="checkbox" name="{{ forloop.counter0 }}cActive" checked="true" />
212+
</div>
213+
</td>
214+
{% endfor %}
215+
<td align="center" valign="bottom">
216+
<table style="padding-left:10px">
217+
<tr><td width="15"> </td>
218+
{% for c in channels %}
219+
<td>
220+
<div id="merged_channels" class="toggle_channel" style="background:#{{c.getColor.getHtml}}">
221+
<input type="checkbox" name="{{ forloop.counter0 }}cMerged"
222+
{% if c.isActive %}checked="true"{% endif %} value="{{c.getColor.getInt}}"/>
223+
</div>
224+
</td>
225+
{% endfor %}
226+
</tr>
227+
</table>
228+
</td>
229+
</tr>
230+
</table>
231+
{% if custom_labels_supported %}
232+
<hr />
233+
234+
<div title="Custom label" class="customLabelInput" align="center" style="display:none;position:relative;left:float;">
235+
Custom label:
236+
<input type="text" name="Custom_Label" value="" />
237+
<select name="Image_Custom_Label_List" style="margin-right:20px;display:none;">
238+
<option value="All" selected="True">All Images</option>
239+
{% for imgData in imgDict %}
240+
<option value="{{ imgData.id }}">{{imgData.name}}</option>
241+
{% endfor %}
202242
</select>
203-
</td>
204-
{% for c in channels %}
205-
<td id="split_channels" valign="bottom">
206-
<div class="toggle_channel" style="background:#{{c.getColor.getHtml}}">
207-
<input type="text" size='10' name="{{ forloop.counter0 }}cName" value="{{ c.getLabel }}" />
208-
<input type="checkbox" name="{{ forloop.counter0 }}cActive" checked="true" />
209-
</div>
210-
</td>
211-
{% endfor %}
212-
<td align="center" valign="bottom">
213-
<table style="padding-left:10px">
214-
<tr><td width="15"> </td>
215-
{% for c in channels %}
216-
<td>
217-
<div id="merged_channels" class="toggle_channel" style="background:#{{c.getColor.getHtml}}">
218-
<input type="checkbox" name="{{ forloop.counter0 }}cMerged"
219-
{% if c.isActive %}checked="true"{% endif %} value="{{c.getColor.getInt}}"/>
220-
</div>
221-
</td>
222-
{% endfor %}
223-
</tr>
224-
</table>
225-
</td>
226-
</tr>
227-
</table>
243+
</div>
244+
<div title="All custom labels" class="allLabels" style="display:none">
245+
<input type="text" name="All_labels" value="" />
246+
</div>
247+
{% endif %}
228248
{% endblock %}
229249

230250
<!---------------------------- FIGURE PREVIEW ---------------------->
@@ -270,6 +290,9 @@ <h2 style="color: red">{{ warning }}</h2>
270290
<div>{{ d }}</div>
271291
{% endfor %}
272292
</div>
293+
<div class="customLabel{{ imgData.id }}" style="display:none">
294+
<span id="customLabelText"></span>
295+
</div>
273296
</td>
274297
{% for ch in channels %}
275298
<td class="split_column">

‎omeroweb/webclient/views.py‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4410,6 +4410,11 @@ def loadImageTags(imageIds):
44104410
if scriptId < 0:
44114411
raise AttributeError("No script found for path '%s'" % scriptPath)
44124412

4413+
if scriptName == "SplitView":
4414+
# Check we have script that supports custom labels
4415+
params = scriptService.getParams(scriptId)
4416+
context["custom_labels_supported"] = "All_labels" in params.inputs
4417+
44134418
context["template"] = template
44144419
context["scriptId"] = scriptId
44154420
return context

0 commit comments

Comments
 (0)