diff options
Diffstat (limited to 'bitbake/lib/toaster/toastergui/templates/editcustomimage_modal.html')
-rw-r--r-- | bitbake/lib/toaster/toastergui/templates/editcustomimage_modal.html | 68 |
1 files changed, 58 insertions, 10 deletions
diff --git a/bitbake/lib/toaster/toastergui/templates/editcustomimage_modal.html b/bitbake/lib/toaster/toastergui/templates/editcustomimage_modal.html index fd998f63eb..8046c08fb5 100644 --- a/bitbake/lib/toaster/toastergui/templates/editcustomimage_modal.html +++ b/bitbake/lib/toaster/toastergui/templates/editcustomimage_modal.html | |||
@@ -1,23 +1,71 @@ | |||
1 | <!-- | 1 | <!-- |
2 | modal dialog shown on the build dashboard, for editing an existing custom image | 2 | modal dialog shown on the build dashboard, for editing an existing custom image; |
3 | only shown if more than one custom image was built, so the user needs to | ||
4 | choose which one to edit | ||
5 | |||
6 | required context: | ||
7 | build - a Build object | ||
3 | --> | 8 | --> |
4 | <div class="modal hide fade in" aria-hidden="false" id="edit-custom-image-modal"> | 9 | <div class="modal hide fade in" aria-hidden="false" id="edit-custom-image-modal"> |
5 | <div class="modal-header"> | 10 | <div class="modal-header"> |
6 | <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> | 11 | <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> |
7 | <h3>Select custom image to edit</h3> | 12 | <h3>Which image do you want to edit?</h3> |
8 | </div> | 13 | </div> |
14 | |||
9 | <div class="modal-body"> | 15 | <div class="modal-body"> |
10 | <div class="row-fluid"> | 16 | <div class="row-fluid"> |
11 | <span class="help-block"> | 17 | {% for recipe in build.get_custom_image_recipes %} |
12 | Explanation of what this modal is for | 18 | <label class="radio"> |
13 | </span> | 19 | {{recipe.name}} |
14 | </div> | 20 | <input type="radio" class="form-control" name="select-custom-image" |
15 | <div class="control-group controls"> | 21 | data-url="{% url 'customrecipe' build.project.id recipe.id %}"> |
16 | <input type="text" class="huge" placeholder="input box" required> | 22 | </label> |
17 | <span class="help-block error" style="display:none">Error text</span> | 23 | {% endfor %} |
18 | </div> | 24 | </div> |
25 | <span class="help-block error" id="invalid-custom-image-help" style="display:none"> | ||
26 | Please select a custom image to edit. | ||
27 | </span> | ||
19 | </div> | 28 | </div> |
29 | |||
20 | <div class="modal-footer"> | 30 | <div class="modal-footer"> |
21 | <button class="btn btn-primary btn-large" disabled>Action</button> | 31 | <button class="btn btn-primary btn-large" data-url="#" |
32 | data-action="edit-custom-image" disabled> | ||
33 | Edit custom image | ||
34 | </button> | ||
22 | </div> | 35 | </div> |
23 | </div> | 36 | </div> |
37 | |||
38 | <script> | ||
39 | $(document).ready(function () { | ||
40 | var editCustomImageButton = $('[data-action="edit-custom-image"]'); | ||
41 | var error = $('#invalid-custom-image-help'); | ||
42 | var radios = $('[name="select-custom-image"]'); | ||
43 | |||
44 | // return custom image radio buttons which are selected | ||
45 | var getSelectedRadios = function () { | ||
46 | return $('[name="select-custom-image"]:checked'); | ||
47 | }; | ||
48 | |||
49 | radios.change(function () { | ||
50 | if (getSelectedRadios().length === 1) { | ||
51 | editCustomImageButton.removeAttr('disabled'); | ||
52 | error.hide(); | ||
53 | } | ||
54 | else { | ||
55 | editCustomImageButton.attr('disabled', 'disabled'); | ||
56 | error.show(); | ||
57 | } | ||
58 | }); | ||
59 | |||
60 | editCustomImageButton.click(function () { | ||
61 | var selectedRadios = getSelectedRadios(); | ||
62 | |||
63 | if (selectedRadios.length === 1) { | ||
64 | document.location.href = selectedRadios.first().attr('data-url'); | ||
65 | } | ||
66 | else { | ||
67 | error.show(); | ||
68 | } | ||
69 | }); | ||
70 | }); | ||
71 | </script> | ||