89 lines
2.5 KiB
HTML
89 lines
2.5 KiB
HTML
|
<!--
|
|||
|
modal dialog shown on the build dashboard, for editing an existing custom image;
|
|||
|
only shown if more than one custom image was built, so the user needs to
|
|||
|
choose which one to edit
|
|||
|
|
|||
|
required context:
|
|||
|
build - a Build object
|
|||
|
-->
|
|||
|
<div class="modal fade" aria-hidden="false" id="edit-custom-image-modal">
|
|||
|
<div class="modal-dialog">
|
|||
|
<div class="modal-content">
|
|||
|
<div class="modal-header">
|
|||
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
|||
|
<h3>Which image do you want to edit?</h3>
|
|||
|
</div>
|
|||
|
|
|||
|
<div class="modal-body">
|
|||
|
{% for recipe in build.get_custom_image_recipes %}
|
|||
|
<div class="radio">
|
|||
|
<label>
|
|||
|
<input type="radio" name="select-custom-image"
|
|||
|
data-url="{% url 'customrecipe' build.project.id recipe.id %}">
|
|||
|
{{recipe.name}}
|
|||
|
</label>
|
|||
|
</div>
|
|||
|
{% endfor %}
|
|||
|
<span class="help-block text-danger" id="invalid-custom-image-help" style="display:none">
|
|||
|
Please select a custom image to edit.
|
|||
|
</span>
|
|||
|
</div>
|
|||
|
|
|||
|
<div class="modal-footer">
|
|||
|
<button class="btn btn-primary btn-lg" data-url="#"
|
|||
|
data-action="edit-custom-image" disabled>
|
|||
|
Edit custom image
|
|||
|
</button>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
|
|||
|
<script>
|
|||
|
$(document).ready(function () {
|
|||
|
var editCustomImageButton = $('[data-action="edit-custom-image"]');
|
|||
|
var error = $('#invalid-custom-image-help');
|
|||
|
var radios = $('[name="select-custom-image"]');
|
|||
|
|
|||
|
// return custom image radio buttons which are selected
|
|||
|
var getSelectedRadios = function () {
|
|||
|
return $('[name="select-custom-image"]:checked');
|
|||
|
};
|
|||
|
|
|||
|
function enableSubmit() {
|
|||
|
if (getSelectedRadios().length === 1) {
|
|||
|
editCustomImageButton.removeAttr('disabled');
|
|||
|
error.hide();
|
|||
|
}
|
|||
|
else {
|
|||
|
editCustomImageButton.attr('disabled', 'disabled');
|
|||
|
error.show();
|
|||
|
}
|
|||
|
};
|
|||
|
|
|||
|
$("#edit-custom-image-modal").on("shown.bs.modal", function() {
|
|||
|
enableSubmit();
|
|||
|
});
|
|||
|
|
|||
|
radios.change(function () {
|
|||
|
enableSubmit();
|
|||
|
});
|
|||
|
|
|||
|
editCustomImageButton.click(function () {
|
|||
|
var selectedRadios = getSelectedRadios();
|
|||
|
|
|||
|
if (selectedRadios.length === 1) {
|
|||
|
document.location.href = selectedRadios.first().attr('data-url');
|
|||
|
}
|
|||
|
else {
|
|||
|
error.show();
|
|||
|
}
|
|||
|
});
|
|||
|
|
|||
|
// Select the first custom image listed. Radio button groups
|
|||
|
// should always have an option selected by default
|
|||
|
$("input:radio:first").attr("checked", "checked");
|
|||
|
|
|||
|
});
|
|||
|
</script>
|