124 lines
4.4 KiB
HTML
124 lines
4.4 KiB
HTML
{% load i18n %}
|
|
<div id="image_tags_list" class="well"></div>
|
|
<div style="clear: both;"></div>
|
|
<div id="plugin_populate_section">
|
|
<h5>{% trans "Register tags required for the Plugin with specified Data Processing Version" %}</h5>
|
|
<span class="row">
|
|
<span class="col-sm-4 small-padding"><b>{% trans "Plugin" %}</b></span>
|
|
<span class="col-sm-4 small-padding"><b>{% trans "Version" %}</b></span>
|
|
</span>
|
|
<span class="row">
|
|
<span class="col-sm-4 small-padding">
|
|
<select id="plugin_select" class="plugin-choice form-control">
|
|
{% for plugin, version_dict in plugins.items %}
|
|
<option value="{{ plugin }}">{{ plugin }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</span>
|
|
<span class="col-sm-4 small-padding">
|
|
{% for plugin, version_dict in plugins.items %}
|
|
<div id="version_group_{{ plugin }}" class="data_processing-version-choice" >
|
|
<select id="data_processing_version_{{ plugin }}" class="form-control">
|
|
{% for version, tags in version_dict.items %}
|
|
<option value="{{ version }}">{{ version }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
{% endfor %}
|
|
</span>
|
|
<span class="col-sm-4 small-padding">
|
|
<input type="button" id="add_all_btn" class="btn btn-default" value="{% trans "Add plugin tags" %}" />
|
|
</span>
|
|
</span>
|
|
<span class="row">
|
|
<span class="col-sm-8 small-padding">
|
|
<input type="text" class="tag-input form-control" id="_sahara_image_tag"/>
|
|
</span>
|
|
<span class="col-sm-3 small-padding">
|
|
<button type="button" id="add_tag_btn" class="btn btn-default btn-small btn-create btn-inline" onclick="add_tag_to_image()">{% trans "Add custom tag" %}</button>
|
|
</span>
|
|
</span>
|
|
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
$(function() {
|
|
$(".plugin-choice").change(function(e) {
|
|
$(".data_processing-version-choice").hide();
|
|
var val = $(this).val();
|
|
$("#version_group_" + val).show();
|
|
}).change();
|
|
|
|
$("#add_all_btn").click(function(e) {
|
|
var plugin = $("#plugin_select").val();
|
|
var version = $("#data_processing_version_" + plugin).val();
|
|
var tags = plugin_tags_map[plugin][version];
|
|
$(tags).each(function(idx, tag) {
|
|
add_tag_to_image(tag);
|
|
});
|
|
})
|
|
});
|
|
|
|
$("#_sahara_image_tag").keypress(function (event) {
|
|
if (event.keyCode == 13) {
|
|
add_tag_to_image();
|
|
return false;
|
|
}
|
|
return true;
|
|
});
|
|
function add_tag_to_image(tag) {
|
|
if (!tag) {
|
|
tag = $.trim($("#_sahara_image_tag").val());
|
|
}
|
|
if (tag.length == 0) {
|
|
return;
|
|
}
|
|
|
|
$("#image_tags_list span").each(function (el) {
|
|
if ($.trim($(this).text()) == tag) {
|
|
return;
|
|
}
|
|
});
|
|
|
|
var tags = get_current_tags();
|
|
if ($.inArray(tag, tags) == -1) {
|
|
var span = ' <span class="label label-warning" style="float: left;display: block; margin: 2px;">$tag <i class="fa fa-close" onclick="remove_tag(this);"></i></span>'.replace("$tag", tag)
|
|
$("#image_tags_list").append(span);
|
|
update_image_tags();
|
|
}
|
|
$("#_sahara_image_tag").val("");
|
|
}
|
|
|
|
function get_current_tags() {
|
|
var tags = [];
|
|
$("#image_tags_list span").each(function (el) {
|
|
tags.push($.trim($(this).text()));
|
|
});
|
|
return tags;
|
|
}
|
|
|
|
function update_image_tags() {
|
|
var tags = get_current_tags();
|
|
$("#id_tags_list").val(JSON.stringify(tags));
|
|
}
|
|
|
|
function remove_tag(icon) {
|
|
span = icon.parentNode;
|
|
span.parentNode.removeChild(span);
|
|
update_image_tags()
|
|
}
|
|
|
|
// {"plugin": {"v1": [...tags...], "v2": [...tags...]},
|
|
// "other_plugin": ... }
|
|
var plugin_tags_map = {};
|
|
{% for plugin, version_dict in plugins.items %}
|
|
plugin_tags_map["{{ plugin }}"] = {};
|
|
{% for version, tags in version_dict.items %}
|
|
plugin_tags_map["{{ plugin }}"]["{{ version }}"] = [];
|
|
{% for tag in tags %}
|
|
plugin_tags_map["{{ plugin }}"]["{{ version }}"].push("{{ tag }}");
|
|
{% endfor %}
|
|
{% endfor %}
|
|
{% endfor %}
|
|
</script>
|