mirror of https://github.com/CIRCL/AIL-framework
130 lines
4.2 KiB
HTML
130 lines
4.2 KiB
HTML
<div class="input-group" >
|
|
<input id="ltags" type="text" class="form-control" autocomplete="off" style="width: 760px" name="taxonomies_tags">
|
|
</div>
|
|
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-info dropdown-toggle mt-1 mb-3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" id="dropdown-taxonomie">
|
|
Taxonomie Selected
|
|
</button>
|
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdown-taxonomie"> <!-- TODO: make dropdown-scrollable -->
|
|
<h6 class="dropdown-header">Taxonomie Tags</h6>
|
|
<button class="dropdown-item" type="button" id="all-tags-taxonomies">All Tags <i class="fas fa-tags"></i></button>
|
|
<div class="dropdown-divider"></div>
|
|
{% for taxo in tags_selector_data['active_taxonomies'] %}
|
|
<button class="dropdown-item" type="button" id="{{ taxo }}-id{{ loop.index0 }}">{{ taxo }}</button>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="input-group">
|
|
<input id="ltagsgalaxies" type="text" class="form-control" autocomplete="off" style="width: 760px" name="galaxies_tags">
|
|
</div>
|
|
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-info dropdown-toggle mt-1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" id="dropdown-galaxy">
|
|
Galaxy Selected
|
|
</button>
|
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdown-galaxy"> <!-- TODO: make dropdown-scrollable -->
|
|
<h6 class="dropdown-header">Galaxy Tags</h6>
|
|
<button class="dropdown-item" type="button" id="all-tags-galaxies">All Tags <i class="fas fa-tags"></i></button>
|
|
<div class="dropdown-divider"></div>
|
|
{% for galaxy in tags_selector_data['active_galaxies'] %}
|
|
<button class="dropdown-item" type="button" id="{{ galaxy }}-idgalax{{ loop.index0 }}">{{ galaxy }}</button>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!--
|
|
<button class="btn btn-primary" onclick="tagsSelector()">
|
|
<i class="fas fa-plus"></i>
|
|
Add Tags
|
|
</button>
|
|
-->
|
|
|
|
|
|
<script>
|
|
var ltags;
|
|
var ltagsgalaxies;
|
|
|
|
$.getJSON("{{ url_for('tags_ui.tag_taxonomies_tags_enabled_json') }}",
|
|
function(data) {
|
|
{% if 'taxonomies_tags' in tags_selector_data %}
|
|
var valueData = [
|
|
{% for tag in tags_selector_data['taxonomies_tags'] %}
|
|
'{{tag|safe}}',
|
|
{% endfor %}
|
|
];
|
|
{% else %}
|
|
var valueData = [];
|
|
{% endif %}
|
|
|
|
|
|
ltags = $('#ltags').tagSuggest({
|
|
data: data,
|
|
value: valueData,
|
|
maxDropHeight: 200,
|
|
name: 'ltags'
|
|
});
|
|
});
|
|
|
|
$.getJSON("{{ url_for('tags_ui.tag_galaxies_tags_enabled_json') }}",
|
|
function(data) {
|
|
{% if 'galaxies_tags' in tags_selector_data %}
|
|
var valueData = [
|
|
{% for tag in tags_selector_data['galaxies_tags'] %}
|
|
'{{tag|safe}}',
|
|
{% endfor %}
|
|
];
|
|
{% else %}
|
|
var valueData = [];
|
|
{% endif %}
|
|
|
|
ltagsgalaxies = $('#ltagsgalaxies').tagSuggest({
|
|
data: data,
|
|
value: valueData,
|
|
maxDropHeight: 200,
|
|
name: 'ltagsgalaxies'
|
|
});
|
|
});
|
|
|
|
jQuery("#all-tags-taxonomies").click(function(e){
|
|
//change input tags list
|
|
$.getJSON("{{ url_for('tags_ui.tag_taxonomies_tags_enabled_json') }}",
|
|
function(data) {
|
|
ltags.setData(data)
|
|
});
|
|
});
|
|
|
|
jQuery("#all-tags-galaxies").click(function(e){
|
|
$.getJSON("{{ url_for('tags_ui.tag_galaxies_tags_enabled_json') }}",
|
|
function(data) {
|
|
ltagsgalaxies.setData(data)
|
|
});
|
|
});
|
|
|
|
{% for taxo in tags_selector_data['active_taxonomies'] %}
|
|
jQuery("#{{ taxo }}-id{{ loop.index0 }}").click(function(e){
|
|
$.getJSON("{{ url_for('tags_ui.tag_taxonomie_tags_enabled_json') }}?taxonomie={{ taxo }}",
|
|
function(data) {
|
|
ltags.setData(data)
|
|
});
|
|
});
|
|
{% endfor %}
|
|
|
|
{% for galaxy in tags_selector_data['active_galaxies'] %}
|
|
jQuery("#{{ galaxy }}-idgalax{{ loop.index0 }}").click(function(e){
|
|
$.getJSON("{{ url_for('tags_ui.tag_galaxy_tags_enabled_json') }}?galaxy={{ galaxy }}",
|
|
function(data) {
|
|
ltagsgalaxies.setData(data)
|
|
});
|
|
});
|
|
{% endfor %}
|
|
|
|
// function tagsSelector() {
|
|
// var tags = ltags.getValue()
|
|
// var tagsgalaxy = ltagsgalaxies.getValue()
|
|
// window.location.replace("myurl?tags=" + tags + "&tagsgalaxies=" + tagsgalaxy);
|
|
//}
|
|
</script>
|