* [[PATCH v2]] toaster: projectconf Add feature for free form IMAGE_FSTYPES
@ 2015-11-23 11:41 Michael Wood
2015-11-24 13:26 ` Barros Pena, Belen
0 siblings, 1 reply; 7+ messages in thread
From: Michael Wood @ 2015-11-23 11:41 UTC (permalink / raw)
To: toaster
Add feature to the projectconf page to allow free form input of
IMAGE_FSTYPES. Sometimes a recipe can provide an IMAGE_FSTYPE that
isn't in the normal image_types class. So would need to be specified
manually.
[YOCTO #7828]
Signed-off-by: Michael Wood <michael.g.wood@intel.com>
---
.../toaster/toastergui/templates/projectconf.html | 128 +++++++++++++++------
1 file changed, 95 insertions(+), 33 deletions(-)
diff --git a/bitbake/lib/toaster/toastergui/templates/projectconf.html b/bitbake/lib/toaster/toastergui/templates/projectconf.html
index 30fd03e..13f9c66 100644
--- a/bitbake/lib/toaster/toastergui/templates/projectconf.html
+++ b/bitbake/lib/toaster/toastergui/templates/projectconf.html
@@ -36,18 +36,36 @@
<span class="js-config-var-name js-config-var-managed-name">IMAGE_FSTYPES</span>
<i class="icon-question-sign get-help" title="Formats of root file system images that you want to have created <br /><a href='http://www.yoctoproject.org/docs/1.6.1/ref-manual/ref-manual.html#var-IMAGE_FSTYPES' target='_blank'>Read more in the manual</a>"></i>
</dt>
- <dd class="lead">
- <span id="image_fstypes">{{fstypes}}</span>
- <i class="icon-pencil" id="change-image_fstypes-icon"></i>
- <form id="change-image_fstypes-form" style="display:none;">
- <input id="filter-image_fstypes" type="text" placeholder="Search image types" class="span4">
- <div id="all-image_fstypes" class="scrolling">
+ <dd style="margin-bottom: 20px">
+ <span id="image_fstypes" class="lead">{{fstypes}}</span>
+ <i class="icon-pencil" id="change-image_fstypes-icon"></i>
+ <form id="change-image_fstypes-form" style="display:none;">
+ <label>Choose from known image types</label>
+ <input id="filter-image_fstypes" type="text" placeholder="Search known image types" class="span4">
+ <div id="all-image_fstypes" class="scrolling">
+ </div>
+ <div class="input-append">
+ <span class="control-group" id="fstypes-control-validation">
+ <label>Enter your own image types
+ <i data-original-title="You can enter more than one image type, separated by a space" class="icon-question-sign get-help" title=""></i>
+ </label>
+ <input type="text" id="new-image-fstype-input">
+
+ </span>
</div>
- <span class="help-block" id="fstypes-error-message">You must select at least one image type</span>
- <button id="apply-change-image_fstypes" type="button" class="btn">Save</button>
- <button id="cancel-change-image_fstypes" type="button" class="btn btn-link">Cancel</button>
- </form>
- </dd>
+ <p style="display:none" class="error" id="fstypes-error-message">
+ You must select at least one image type. <br />
+ Choose from the list of known ones or type your own.
+ </p>
+ <p style="display:none" class="error" id="invalid-chars-in-fstype-msg">
+ A valid image type cannot include underscores.
+ </p>
+ <div>
+ <button id="apply-change-image_fstypes" type="button" class="btn">Save</button>
+ <button id="cancel-change-image_fstypes" type="button" class="btn btn-link">Cancel</button>
+ </div>
+ </form>
+ </dd>
{% endif %}
{% if image_install_append_defined %}
@@ -305,20 +323,41 @@
return true;
}
- // Test to insure at least one FS Type is checked
+ var fsTypesInput = $("#new-image-fstype-input");
+ var invalidCharsMsg = $("#invalid-chars-in-fstype-msg");
+ var fsTypesControl = $("#fstypes-control-validation");
+ var noFsType = $('#fstypes-error-message');
+ var fsTypesApplyBtn = $("#apply-change-image_fstypes");
+
+ /* Validation of fstypes */
function enableFsTypesSave() {
- var any_checked = 0;
- $(".fs-checkbox-fstypes:checked").each(function(){
- any_checked = 1;
- });
- if ( 0 == any_checked ) {
- $("#apply-change-image_fstypes").attr("disabled","disabled");
- $('#fstypes-error-message').show();
- }
- else {
- $("#apply-change-image_fstypes").removeAttr("disabled");
- $('#fstypes-error-message').hide();
- }
+ var valid_input = false;
+ var valid_checkboxes = false;
+ var anyChecked = $(".fs-checkbox-fstypes:checked").length;
+
+ /* No underscores allowed */
+ if (fsTypesInput.val().match(/\_/)) {
+ invalidCharsMsg.show();
+ fsTypesControl.addClass("error");
+ valid_input = false;
+ } else {
+ fsTypesControl.removeClass("error");
+ invalidCharsMsg.hide();
+ valid_input = true;
+ }
+
+ if (!anyChecked && !fsTypesInput.val()){
+ noFsType.show();
+ valid_checkboxes = false;
+ } else {
+ noFsType.hide();
+ valid_checkboxes = true;
+ }
+
+ if (valid_checkboxes == false || valid_input == false)
+ fsTypesApplyBtn.attr("disabled","disabled");
+ else
+ fsTypesApplyBtn.removeAttr("disabled");
}
// Preset or reset the Package Class checkbox labels
@@ -597,17 +636,37 @@
}
});
- $('#apply-change-image_fstypes').click(function(){
- // extract the selected fstypes and sort them
- var fstypes_array = [];
- var checkboxes = document.getElementsByClassName('fs-checkbox-fstypes');
- $(".fs-checkbox-fstypes:checked").each(function(){
- fstypes_array.push($(this).val());
- });
- fstypes_array.sort();
+ fsTypesInput.on('input', function(){
+ enableFsTypesSave();
+ });
+
+ fsTypesApplyBtn.click(function(e){
+ e.preventDefault();
+
+ var fstypes = '';
+ // extract the selected fstypes and sort them
+ var fstypes_array = [];
+ var checkboxes = document.getElementsByClassName('fs-checkbox-fstypes');
+ $(".fs-checkbox-fstypes:checked").each(function(){
+ fstypes_array.push($(this).val());
+ });
+ fstypes_array.sort();
+
+ /* If we have a value in our enter own image type input and it
+ * isn't already selected add it to the fstypes value
+ */
+ if (fsTypesInput.val()){
+ var inputFsTypes = fsTypesInput.val().split(" ");
+
+ for (var type in inputFsTypes){
+ if (fstypes_array.indexOf(inputFsTypes[type].trim()) === -1)
+ {
+ fstypes += inputFsTypes[type]+' ';
+ }
+ }
+ }
// now make a string of them
- var fstypes = '';
for (var i = 0, length = fstypes_array.length; i < length; i++) {
fstypes += fstypes_array[i] + ' ';
}
@@ -620,6 +679,9 @@
$("#change-image_fstypes-form").slideUp(function() {
$('#image_fstypes, #change-image_fstypes-icon').show();
});
+
+
+ fsTypesInput.val("");
});
{% endif %}
--
2.5.0
^ permalink raw reply related [flat|nested] 7+ messages in thread
* Re: [[PATCH v2]] toaster: projectconf Add feature for free form IMAGE_FSTYPES
2015-11-23 11:41 [[PATCH v2]] toaster: projectconf Add feature for free form IMAGE_FSTYPES Michael Wood
@ 2015-11-24 13:26 ` Barros Pena, Belen
2015-11-26 14:28 ` Smith, Elliot
0 siblings, 1 reply; 7+ messages in thread
From: Barros Pena, Belen @ 2015-11-24 13:26 UTC (permalink / raw)
To: Wood, Michael G, toaster@yoctoproject.org
On 23/11/2015 11:41, "toaster-bounces@yoctoproject.org on behalf of
Michael Wood" <toaster-bounces@yoctoproject.org on behalf of
michael.g.wood@intel.com> wrote:
>Add feature to the projectconf page to allow free form input of
>IMAGE_FSTYPES. Sometimes a recipe can provide an IMAGE_FSTYPE that
>isn't in the normal image_types class. So would need to be specified
>manually.
>
>[YOCTO #7828]
This seems to address all the issues from v1. Getting rid the 'already
selected' error message by not duplicating any values works well.
From my perspective, this is good to go.
Thanks!
Belén
>
>Signed-off-by: Michael Wood <michael.g.wood@intel.com>
>---
> .../toaster/toastergui/templates/projectconf.html | 128
>+++++++++++++++------
> 1 file changed, 95 insertions(+), 33 deletions(-)
>
>diff --git a/bitbake/lib/toaster/toastergui/templates/projectconf.html
>b/bitbake/lib/toaster/toastergui/templates/projectconf.html
>index 30fd03e..13f9c66 100644
>--- a/bitbake/lib/toaster/toastergui/templates/projectconf.html
>+++ b/bitbake/lib/toaster/toastergui/templates/projectconf.html
>@@ -36,18 +36,36 @@
> <span class="js-config-var-name
>js-config-var-managed-name">IMAGE_FSTYPES</span>
> <i class="icon-question-sign get-help" title="Formats of
>root file system images that you want to have created <br /><a
>href='http://www.yoctoproject.org/docs/1.6.1/ref-manual/ref-manual.html#va
>r-IMAGE_FSTYPES' target='_blank'>Read more in the manual</a>"></i>
> </dt>
>- <dd class="lead">
>- <span id="image_fstypes">{{fstypes}}</span>
>- <i class="icon-pencil"
>id="change-image_fstypes-icon"></i>
>- <form id="change-image_fstypes-form"
>style="display:none;">
>- <input id="filter-image_fstypes" type="text"
>placeholder="Search image types" class="span4">
>- <div id="all-image_fstypes" class="scrolling">
>+ <dd style="margin-bottom: 20px">
>+ <span id="image_fstypes" class="lead">{{fstypes}}</span>
>+ <i class="icon-pencil" id="change-image_fstypes-icon"></i>
>+ <form id="change-image_fstypes-form" style="display:none;">
>+ <label>Choose from known image types</label>
>+ <input id="filter-image_fstypes" type="text"
>placeholder="Search known image types" class="span4">
>+ <div id="all-image_fstypes" class="scrolling">
>+ </div>
>+ <div class="input-append">
>+ <span class="control-group"
>id="fstypes-control-validation">
>+ <label>Enter your own image types
>+ <i data-original-title="You can enter more than
>one image type, separated by a space" class="icon-question-sign get-help"
>title=""></i>
>+ </label>
>+ <input type="text" id="new-image-fstype-input">
>+
>+ </span>
> </div>
>- <span class="help-block"
>id="fstypes-error-message">You must select at least one image type</span>
>- <button id="apply-change-image_fstypes"
>type="button" class="btn">Save</button>
>- <button id="cancel-change-image_fstypes"
>type="button" class="btn btn-link">Cancel</button>
>- </form>
>- </dd>
>+ <p style="display:none" class="error"
>id="fstypes-error-message">
>+ You must select at least one image type. <br />
>+ Choose from the list of known ones or type your
>own.
>+ </p>
>+ <p style="display:none" class="error"
>id="invalid-chars-in-fstype-msg">
>+ A valid image type cannot include underscores.
>+ </p>
>+ <div>
>+ <button id="apply-change-image_fstypes"
>type="button" class="btn">Save</button>
>+ <button id="cancel-change-image_fstypes"
>type="button" class="btn btn-link">Cancel</button>
>+ </div>
>+ </form>
>+ </dd>
> {% endif %}
>
> {% if image_install_append_defined %}
>@@ -305,20 +323,41 @@
> return true;
> }
>
>- // Test to insure at least one FS Type is checked
>+ var fsTypesInput = $("#new-image-fstype-input");
>+ var invalidCharsMsg = $("#invalid-chars-in-fstype-msg");
>+ var fsTypesControl = $("#fstypes-control-validation");
>+ var noFsType = $('#fstypes-error-message');
>+ var fsTypesApplyBtn = $("#apply-change-image_fstypes");
>+
>+ /* Validation of fstypes */
> function enableFsTypesSave() {
>- var any_checked = 0;
>- $(".fs-checkbox-fstypes:checked").each(function(){
>- any_checked = 1;
>- });
>- if ( 0 == any_checked ) {
>-
>$("#apply-change-image_fstypes").attr("disabled","disabled");
>- $('#fstypes-error-message').show();
>- }
>- else {
>- $("#apply-change-image_fstypes").removeAttr("disabled");
>- $('#fstypes-error-message').hide();
>- }
>+ var valid_input = false;
>+ var valid_checkboxes = false;
>+ var anyChecked = $(".fs-checkbox-fstypes:checked").length;
>+
>+ /* No underscores allowed */
>+ if (fsTypesInput.val().match(/\_/)) {
>+ invalidCharsMsg.show();
>+ fsTypesControl.addClass("error");
>+ valid_input = false;
>+ } else {
>+ fsTypesControl.removeClass("error");
>+ invalidCharsMsg.hide();
>+ valid_input = true;
>+ }
>+
>+ if (!anyChecked && !fsTypesInput.val()){
>+ noFsType.show();
>+ valid_checkboxes = false;
>+ } else {
>+ noFsType.hide();
>+ valid_checkboxes = true;
>+ }
>+
>+ if (valid_checkboxes == false || valid_input == false)
>+ fsTypesApplyBtn.attr("disabled","disabled");
>+ else
>+ fsTypesApplyBtn.removeAttr("disabled");
> }
>
> // Preset or reset the Package Class checkbox labels
>@@ -597,17 +636,37 @@
> }
> });
>
>- $('#apply-change-image_fstypes').click(function(){
>- // extract the selected fstypes and sort them
>- var fstypes_array = [];
>- var checkboxes =
>document.getElementsByClassName('fs-checkbox-fstypes');
>- $(".fs-checkbox-fstypes:checked").each(function(){
>- fstypes_array.push($(this).val());
>- });
>- fstypes_array.sort();
>+ fsTypesInput.on('input', function(){
>+ enableFsTypesSave();
>+ });
>+
>+ fsTypesApplyBtn.click(function(e){
>+ e.preventDefault();
>+
>+ var fstypes = '';
>+ // extract the selected fstypes and sort them
>+ var fstypes_array = [];
>+ var checkboxes =
>document.getElementsByClassName('fs-checkbox-fstypes');
>+ $(".fs-checkbox-fstypes:checked").each(function(){
>+ fstypes_array.push($(this).val());
>+ });
>+ fstypes_array.sort();
>+
>+ /* If we have a value in our enter own image type input
>and it
>+ * isn't already selected add it to the fstypes value
>+ */
>+ if (fsTypesInput.val()){
>+ var inputFsTypes = fsTypesInput.val().split(" ");
>+
>+ for (var type in inputFsTypes){
>+ if (fstypes_array.indexOf(inputFsTypes[type].trim())
>=== -1)
>+ {
>+ fstypes += inputFsTypes[type]+' ';
>+ }
>+ }
>+ }
>
> // now make a string of them
>- var fstypes = '';
> for (var i = 0, length = fstypes_array.length; i <
>length; i++) {
> fstypes += fstypes_array[i] + ' ';
> }
>@@ -620,6 +679,9 @@
> $("#change-image_fstypes-form").slideUp(function() {
> $('#image_fstypes,
>#change-image_fstypes-icon').show();
> });
>+
>+
>+ fsTypesInput.val("");
> });
> {% endif %}
>
>--
>2.5.0
>
>--
>_______________________________________________
>toaster mailing list
>toaster@yoctoproject.org
>https://lists.yoctoproject.org/listinfo/toaster
^ permalink raw reply [flat|nested] 7+ messages in thread
* Re: [[PATCH v2]] toaster: projectconf Add feature for free form IMAGE_FSTYPES
2015-11-24 13:26 ` Barros Pena, Belen
@ 2015-11-26 14:28 ` Smith, Elliot
2015-11-26 15:00 ` Barros Pena, Belen
2015-11-26 16:05 ` Michael Wood
0 siblings, 2 replies; 7+ messages in thread
From: Smith, Elliot @ 2015-11-26 14:28 UTC (permalink / raw)
To: Barros Pena, Belen; +Cc: toaster@yoctoproject.org
[-- Attachment #1: Type: text/plain, Size: 10125 bytes --]
On 24 November 2015 at 13:26, Barros Pena, Belen <
belen.barros.pena@intel.com> wrote:
> On 23/11/2015 11:41, "toaster-bounces@yoctoproject.org on behalf of
> Michael Wood" <toaster-bounces@yoctoproject.org on behalf of
> michael.g.wood@intel.com> wrote:
>
> >Add feature to the projectconf page to allow free form input of
> >IMAGE_FSTYPES. Sometimes a recipe can provide an IMAGE_FSTYPE that
> >isn't in the normal image_types class. So would need to be specified
> >manually.
> >
> >[YOCTO #7828]
>
> This seems to address all the issues from v1. Getting rid the 'already
> selected' error message by not duplicating any values works well.
>
It works correctly, but there is one issue: if you enter an invalid string
as the image type (e.g. btrfss) and want to correct it, there's no way to
delete it from the list.
Perhaps a button to set the list back to the defaults, or to remove any
invalid types ("cleanup")?
Alternatively, add the user's custom image type to the checkbox list; if
they uncheck it, is disappears from the list.
Elliot
>
> From my perspective, this is good to go.
>
> Thanks!
>
> Belén
>
> >
> >Signed-off-by: Michael Wood <michael.g.wood@intel.com>
> >---
> > .../toaster/toastergui/templates/projectconf.html | 128
> >+++++++++++++++------
> > 1 file changed, 95 insertions(+), 33 deletions(-)
> >
> >diff --git a/bitbake/lib/toaster/toastergui/templates/projectconf.html
> >b/bitbake/lib/toaster/toastergui/templates/projectconf.html
> >index 30fd03e..13f9c66 100644
> >--- a/bitbake/lib/toaster/toastergui/templates/projectconf.html
> >+++ b/bitbake/lib/toaster/toastergui/templates/projectconf.html
> >@@ -36,18 +36,36 @@
> > <span class="js-config-var-name
> >js-config-var-managed-name">IMAGE_FSTYPES</span>
> > <i class="icon-question-sign get-help" title="Formats of
> >root file system images that you want to have created <br /><a
> >href='
> http://www.yoctoproject.org/docs/1.6.1/ref-manual/ref-manual.html#va
> >r-IMAGE_FSTYPES' target='_blank'>Read more in the manual</a>"></i>
> > </dt>
> >- <dd class="lead">
> >- <span id="image_fstypes">{{fstypes}}</span>
> >- <i class="icon-pencil"
> >id="change-image_fstypes-icon"></i>
> >- <form id="change-image_fstypes-form"
> >style="display:none;">
> >- <input id="filter-image_fstypes" type="text"
> >placeholder="Search image types" class="span4">
> >- <div id="all-image_fstypes" class="scrolling">
> >+ <dd style="margin-bottom: 20px">
> >+ <span id="image_fstypes" class="lead">{{fstypes}}</span>
> >+ <i class="icon-pencil" id="change-image_fstypes-icon"></i>
> >+ <form id="change-image_fstypes-form" style="display:none;">
> >+ <label>Choose from known image types</label>
> >+ <input id="filter-image_fstypes" type="text"
> >placeholder="Search known image types" class="span4">
> >+ <div id="all-image_fstypes" class="scrolling">
> >+ </div>
> >+ <div class="input-append">
> >+ <span class="control-group"
> >id="fstypes-control-validation">
> >+ <label>Enter your own image types
> >+ <i data-original-title="You can enter more than
> >one image type, separated by a space" class="icon-question-sign get-help"
> >title=""></i>
> >+ </label>
> >+ <input type="text" id="new-image-fstype-input">
> >+
> >+ </span>
> > </div>
> >- <span class="help-block"
> >id="fstypes-error-message">You must select at least one image type</span>
> >- <button id="apply-change-image_fstypes"
> >type="button" class="btn">Save</button>
> >- <button id="cancel-change-image_fstypes"
> >type="button" class="btn btn-link">Cancel</button>
> >- </form>
> >- </dd>
> >+ <p style="display:none" class="error"
> >id="fstypes-error-message">
> >+ You must select at least one image type. <br />
> >+ Choose from the list of known ones or type your
> >own.
> >+ </p>
> >+ <p style="display:none" class="error"
> >id="invalid-chars-in-fstype-msg">
> >+ A valid image type cannot include underscores.
> >+ </p>
> >+ <div>
> >+ <button id="apply-change-image_fstypes"
> >type="button" class="btn">Save</button>
> >+ <button id="cancel-change-image_fstypes"
> >type="button" class="btn btn-link">Cancel</button>
> >+ </div>
> >+ </form>
> >+ </dd>
> > {% endif %}
> >
> > {% if image_install_append_defined %}
> >@@ -305,20 +323,41 @@
> > return true;
> > }
> >
> >- // Test to insure at least one FS Type is checked
> >+ var fsTypesInput = $("#new-image-fstype-input");
> >+ var invalidCharsMsg = $("#invalid-chars-in-fstype-msg");
> >+ var fsTypesControl = $("#fstypes-control-validation");
> >+ var noFsType = $('#fstypes-error-message');
> >+ var fsTypesApplyBtn = $("#apply-change-image_fstypes");
> >+
> >+ /* Validation of fstypes */
> > function enableFsTypesSave() {
> >- var any_checked = 0;
> >- $(".fs-checkbox-fstypes:checked").each(function(){
> >- any_checked = 1;
> >- });
> >- if ( 0 == any_checked ) {
> >-
> >$("#apply-change-image_fstypes").attr("disabled","disabled");
> >- $('#fstypes-error-message').show();
> >- }
> >- else {
> >- $("#apply-change-image_fstypes").removeAttr("disabled");
> >- $('#fstypes-error-message').hide();
> >- }
> >+ var valid_input = false;
> >+ var valid_checkboxes = false;
> >+ var anyChecked = $(".fs-checkbox-fstypes:checked").length;
> >+
> >+ /* No underscores allowed */
> >+ if (fsTypesInput.val().match(/\_/)) {
> >+ invalidCharsMsg.show();
> >+ fsTypesControl.addClass("error");
> >+ valid_input = false;
> >+ } else {
> >+ fsTypesControl.removeClass("error");
> >+ invalidCharsMsg.hide();
> >+ valid_input = true;
> >+ }
> >+
> >+ if (!anyChecked && !fsTypesInput.val()){
> >+ noFsType.show();
> >+ valid_checkboxes = false;
> >+ } else {
> >+ noFsType.hide();
> >+ valid_checkboxes = true;
> >+ }
> >+
> >+ if (valid_checkboxes == false || valid_input == false)
> >+ fsTypesApplyBtn.attr("disabled","disabled");
> >+ else
> >+ fsTypesApplyBtn.removeAttr("disabled");
> > }
> >
> > // Preset or reset the Package Class checkbox labels
> >@@ -597,17 +636,37 @@
> > }
> > });
> >
> >- $('#apply-change-image_fstypes').click(function(){
> >- // extract the selected fstypes and sort them
> >- var fstypes_array = [];
> >- var checkboxes =
> >document.getElementsByClassName('fs-checkbox-fstypes');
> >- $(".fs-checkbox-fstypes:checked").each(function(){
> >- fstypes_array.push($(this).val());
> >- });
> >- fstypes_array.sort();
> >+ fsTypesInput.on('input', function(){
> >+ enableFsTypesSave();
> >+ });
> >+
> >+ fsTypesApplyBtn.click(function(e){
> >+ e.preventDefault();
> >+
> >+ var fstypes = '';
> >+ // extract the selected fstypes and sort them
> >+ var fstypes_array = [];
> >+ var checkboxes =
> >document.getElementsByClassName('fs-checkbox-fstypes');
> >+ $(".fs-checkbox-fstypes:checked").each(function(){
> >+ fstypes_array.push($(this).val());
> >+ });
> >+ fstypes_array.sort();
> >+
> >+ /* If we have a value in our enter own image type input
> >and it
> >+ * isn't already selected add it to the fstypes value
> >+ */
> >+ if (fsTypesInput.val()){
> >+ var inputFsTypes = fsTypesInput.val().split(" ");
> >+
> >+ for (var type in inputFsTypes){
> >+ if (fstypes_array.indexOf(inputFsTypes[type].trim())
> >=== -1)
> >+ {
> >+ fstypes += inputFsTypes[type]+' ';
> >+ }
> >+ }
> >+ }
> >
> > // now make a string of them
> >- var fstypes = '';
> > for (var i = 0, length = fstypes_array.length; i <
> >length; i++) {
> > fstypes += fstypes_array[i] + ' ';
> > }
> >@@ -620,6 +679,9 @@
> > $("#change-image_fstypes-form").slideUp(function() {
> > $('#image_fstypes,
> >#change-image_fstypes-icon').show();
> > });
> >+
> >+
> >+ fsTypesInput.val("");
> > });
> > {% endif %}
> >
> >--
> >2.5.0
> >
> >--
> >_______________________________________________
> >toaster mailing list
> >toaster@yoctoproject.org
> >https://lists.yoctoproject.org/listinfo/toaster
>
> --
> _______________________________________________
> toaster mailing list
> toaster@yoctoproject.org
> https://lists.yoctoproject.org/listinfo/toaster
>
--
Elliot Smith
Software Engineer
Intel Open Source Technology Centre
[-- Attachment #2: Type: text/html, Size: 14831 bytes --]
^ permalink raw reply [flat|nested] 7+ messages in thread
* Re: [[PATCH v2]] toaster: projectconf Add feature for free form IMAGE_FSTYPES
2015-11-26 14:28 ` Smith, Elliot
@ 2015-11-26 15:00 ` Barros Pena, Belen
2015-11-26 16:05 ` Michael Wood
1 sibling, 0 replies; 7+ messages in thread
From: Barros Pena, Belen @ 2015-11-26 15:00 UTC (permalink / raw)
To: Smith, Elliot; +Cc: toaster@yoctoproject.org
On 26/11/2015 14:28, "Smith, Elliot" <elliot.smith@intel.com> wrote:
>On 24 November 2015 at 13:26, Barros Pena, Belen
><belen.barros.pena@intel.com> wrote:
>
>On 23/11/2015 11:41, "toaster-bounces@yoctoproject.org on behalf of
>Michael Wood" <toaster-bounces@yoctoproject.org on behalf of
>michael.g.wood@intel.com> wrote:
>
>>Add feature to the projectconf page to allow free form input of
>>IMAGE_FSTYPES. Sometimes a recipe can provide an IMAGE_FSTYPE that
>>isn't in the normal image_types class. So would need to be specified
>>manually.
>>
>>[YOCTO #7828]
>
>This seems to address all the issues from v1. Getting rid the 'already
>selected' error message by not duplicating any values works well.
>
>
>
>
>It works correctly, but there is one issue: if you enter an invalid
>string as the image type (e.g. btrfss) and want to correct it, there's no
>way to delete it from the list.
Heh, well spotted. Didn't think of this one :/
>
>
>Perhaps a button to set the list back to the defaults, or to remove any
>invalid types ("cleanup")?
This would be a possible solution, but it seems a bit clunky when you just
want to remove an extra 's' from an image type that you typed by mistake.
>
>
>Alternatively, add the user's custom image type to the checkbox list; if
>they uncheck it, is disappears from the list.
This was the initial solution, but having it disappearing from the list
when you unchecked it is not the behaviour you expect from checkboxes, and
it does feel quite weird. A solution would be to store the value you type
in the free text field somewhere, so that it appears back there when you
click the 'change' button and you can edit it.
I know we cannot store the value in the database (the list of image types
is currently hardcoded in views.py), but maybe it's enough to store it for
the session. You are bound to realise quite soon if you typed something
wrong.
Michael: is this possible?
Thanks!
Belén
>
>
>Elliot
>
>
>
From my perspective, this is good to go.
>
>Thanks!
>
>Belén
>
>>
>>Signed-off-by: Michael Wood <michael.g.wood@intel.com>
>>---
>> .../toaster/toastergui/templates/projectconf.html | 128
>>+++++++++++++++------
>> 1 file changed, 95 insertions(+), 33 deletions(-)
>>
>>diff --git a/bitbake/lib/toaster/toastergui/templates/projectconf.html
>>b/bitbake/lib/toaster/toastergui/templates/projectconf.html
>>index 30fd03e..13f9c66 100644
>>--- a/bitbake/lib/toaster/toastergui/templates/projectconf.html
>>+++ b/bitbake/lib/toaster/toastergui/templates/projectconf.html
>>@@ -36,18 +36,36 @@
>> <span class="js-config-var-name
>>js-config-var-managed-name">IMAGE_FSTYPES</span>
>> <i class="icon-question-sign get-help" title="Formats of
>>root file system images that you want to have created <br /><a
>>href='http://www.yoctoproject.org/docs/1.6.1/ref-manual/ref-manual.html#v
>>a
>>r-IMAGE_FSTYPES' target='_blank'>Read more in the manual</a>"></i>
>> </dt>
>>- <dd class="lead">
>>- <span id="image_fstypes">{{fstypes}}</span>
>>- <i class="icon-pencil"
>>id="change-image_fstypes-icon"></i>
>>- <form id="change-image_fstypes-form"
>>style="display:none;">
>>- <input id="filter-image_fstypes" type="text"
>>placeholder="Search image types" class="span4">
>>- <div id="all-image_fstypes" class="scrolling">
>>+ <dd style="margin-bottom: 20px">
>>+ <span id="image_fstypes" class="lead">{{fstypes}}</span>
>>+ <i class="icon-pencil" id="change-image_fstypes-icon"></i>
>>+ <form id="change-image_fstypes-form"
>>style="display:none;">
>>+ <label>Choose from known image types</label>
>>+ <input id="filter-image_fstypes" type="text"
>>placeholder="Search known image types" class="span4">
>>+ <div id="all-image_fstypes" class="scrolling">
>>+ </div>
>>+ <div class="input-append">
>>+ <span class="control-group"
>>id="fstypes-control-validation">
>>+ <label>Enter your own image types
>>+ <i data-original-title="You can enter more than
>>one image type, separated by a space" class="icon-question-sign get-help"
>>title=""></i>
>>+ </label>
>>+ <input type="text" id="new-image-fstype-input">
>>+
>>+ </span>
>> </div>
>>- <span class="help-block"
>>id="fstypes-error-message">You must select at least one image type</span>
>>- <button id="apply-change-image_fstypes"
>>type="button" class="btn">Save</button>
>>- <button id="cancel-change-image_fstypes"
>>type="button" class="btn btn-link">Cancel</button>
>>- </form>
>>- </dd>
>>+ <p style="display:none" class="error"
>>id="fstypes-error-message">
>>+ You must select at least one image type. <br />
>>+ Choose from the list of known ones or type your
>>own.
>>+ </p>
>>+ <p style="display:none" class="error"
>>id="invalid-chars-in-fstype-msg">
>>+ A valid image type cannot include underscores.
>>+ </p>
>>+ <div>
>>+ <button id="apply-change-image_fstypes"
>>type="button" class="btn">Save</button>
>>+ <button id="cancel-change-image_fstypes"
>>type="button" class="btn btn-link">Cancel</button>
>>+ </div>
>>+ </form>
>>+ </dd>
>> {% endif %}
>>
>> {% if image_install_append_defined %}
>>@@ -305,20 +323,41 @@
>> return true;
>> }
>>
>>- // Test to insure at least one FS Type is checked
>>+ var fsTypesInput = $("#new-image-fstype-input");
>>+ var invalidCharsMsg = $("#invalid-chars-in-fstype-msg");
>>+ var fsTypesControl = $("#fstypes-control-validation");
>>+ var noFsType = $('#fstypes-error-message');
>>+ var fsTypesApplyBtn = $("#apply-change-image_fstypes");
>>+
>>+ /* Validation of fstypes */
>> function enableFsTypesSave() {
>>- var any_checked = 0;
>>- $(".fs-checkbox-fstypes:checked").each(function(){
>>- any_checked = 1;
>>- });
>>- if ( 0 == any_checked ) {
>>-
>>$("#apply-change-image_fstypes").attr("disabled","disabled");
>>- $('#fstypes-error-message').show();
>>- }
>>- else {
>>- $("#apply-change-image_fstypes").removeAttr("disabled");
>>- $('#fstypes-error-message').hide();
>>- }
>>+ var valid_input = false;
>>+ var valid_checkboxes = false;
>>+ var anyChecked = $(".fs-checkbox-fstypes:checked").length;
>>+
>>+ /* No underscores allowed */
>>+ if (fsTypesInput.val().match(/\_/)) {
>>+ invalidCharsMsg.show();
>>+ fsTypesControl.addClass("error");
>>+ valid_input = false;
>>+ } else {
>>+ fsTypesControl.removeClass("error");
>>+ invalidCharsMsg.hide();
>>+ valid_input = true;
>>+ }
>>+
>>+ if (!anyChecked && !fsTypesInput.val()){
>>+ noFsType.show();
>>+ valid_checkboxes = false;
>>+ } else {
>>+ noFsType.hide();
>>+ valid_checkboxes = true;
>>+ }
>>+
>>+ if (valid_checkboxes == false || valid_input == false)
>>+ fsTypesApplyBtn.attr("disabled","disabled");
>>+ else
>>+ fsTypesApplyBtn.removeAttr("disabled");
>> }
>>
>> // Preset or reset the Package Class checkbox labels
>>@@ -597,17 +636,37 @@
>> }
>> });
>>
>>- $('#apply-change-image_fstypes').click(function(){
>>- // extract the selected fstypes and sort them
>>- var fstypes_array = [];
>>- var checkboxes =
>>document.getElementsByClassName('fs-checkbox-fstypes');
>>- $(".fs-checkbox-fstypes:checked").each(function(){
>>- fstypes_array.push($(this).val());
>>- });
>>- fstypes_array.sort();
>>+ fsTypesInput.on('input', function(){
>>+ enableFsTypesSave();
>>+ });
>>+
>>+ fsTypesApplyBtn.click(function(e){
>>+ e.preventDefault();
>>+
>>+ var fstypes = '';
>>+ // extract the selected fstypes and sort them
>>+ var fstypes_array = [];
>>+ var checkboxes =
>>document.getElementsByClassName('fs-checkbox-fstypes');
>>+ $(".fs-checkbox-fstypes:checked").each(function(){
>>+ fstypes_array.push($(this).val());
>>+ });
>>+ fstypes_array.sort();
>>+
>>+ /* If we have a value in our enter own image type input
>>and it
>>+ * isn't already selected add it to the fstypes value
>>+ */
>>+ if (fsTypesInput.val()){
>>+ var inputFsTypes = fsTypesInput.val().split(" ");
>>+
>>+ for (var type in inputFsTypes){
>>+ if (fstypes_array.indexOf(inputFsTypes[type].trim())
>>=== -1)
>>+ {
>>+ fstypes += inputFsTypes[type]+' ';
>>+ }
>>+ }
>>+ }
>>
>> // now make a string of them
>>- var fstypes = '';
>> for (var i = 0, length = fstypes_array.length; i <
>>length; i++) {
>> fstypes += fstypes_array[i] + ' ';
>> }
>>@@ -620,6 +679,9 @@
>> $("#change-image_fstypes-form").slideUp(function() {
>> $('#image_fstypes,
>>#change-image_fstypes-icon').show();
>> });
>>+
>>+
>>+ fsTypesInput.val("");
>> });
>> {% endif %}
>>
>>--
>>2.5.0
>>
>>--
>>_______________________________________________
>>toaster mailing list
>>toaster@yoctoproject.org
>>https://lists.yoctoproject.org/listinfo/toaster
>
>--
>_______________________________________________
>toaster mailing list
>toaster@yoctoproject.org
>https://lists.yoctoproject.org/listinfo/toaster
>
>
>
>
>
>
>
>
>
>--
>Elliot Smith
>Software Engineer
>Intel Open Source Technology Centre
>
>
>
>
^ permalink raw reply [flat|nested] 7+ messages in thread
* Re: [[PATCH v2]] toaster: projectconf Add feature for free form IMAGE_FSTYPES
2015-11-26 14:28 ` Smith, Elliot
2015-11-26 15:00 ` Barros Pena, Belen
@ 2015-11-26 16:05 ` Michael Wood
2015-11-26 16:18 ` Barros Pena, Belen
1 sibling, 1 reply; 7+ messages in thread
From: Michael Wood @ 2015-11-26 16:05 UTC (permalink / raw)
To: Smith, Elliot, Barros Pena, Belen; +Cc: toaster@yoctoproject.org
On 26/11/15 14:28, Smith, Elliot wrote:
> On 24 November 2015 at 13:26, Barros Pena, Belen
> <belen.barros.pena@intel.com <mailto:belen.barros.pena@intel.com>> wrote:
>
> On 23/11/2015 11:41, "toaster-bounces@yoctoproject.org
> <mailto:toaster-bounces@yoctoproject.org> on behalf of
> Michael Wood" <toaster-bounces@yoctoproject.org
> <mailto:toaster-bounces@yoctoproject.org> on behalf of
> michael.g.wood@intel.com <mailto:michael.g.wood@intel.com>> wrote:
>
> >Add feature to the projectconf page to allow free form input of
> >IMAGE_FSTYPES. Sometimes a recipe can provide an IMAGE_FSTYPE that
> >isn't in the normal image_types class. So would need to be specified
> >manually.
> >
> >[YOCTO #7828]
>
> This seems to address all the issues from v1. Getting rid the 'already
> selected' error message by not duplicating any values works well.
>
>
> It works correctly, but there is one issue: if you enter an invalid
> string as the image type (e.g. btrfss) and want to correct it, there's
> no way to delete it from the list.
To remove custom added values, you just have to click edit and then
press 'Save'.
>
> Perhaps a button to set the list back to the defaults, or to remove
> any invalid types ("cleanup")?
>
> Alternatively, add the user's custom image type to the checkbox list;
> if they uncheck it, is disappears from the list.
>
> Elliot
>
>
> From my perspective, this is good to go.
>
> Thanks!
>
> Belén
>
> >
> >Signed-off-by: Michael Wood <michael.g.wood@intel.com
> <mailto:michael.g.wood@intel.com>>
> >---
> > .../toaster/toastergui/templates/projectconf.html | 128
> >+++++++++++++++------
> > 1 file changed, 95 insertions(+), 33 deletions(-)
> >
> >diff --git
> a/bitbake/lib/toaster/toastergui/templates/projectconf.html
> >b/bitbake/lib/toaster/toastergui/templates/projectconf.html
> >index 30fd03e..13f9c66 100644
> >--- a/bitbake/lib/toaster/toastergui/templates/projectconf.html
> >+++ b/bitbake/lib/toaster/toastergui/templates/projectconf.html
> >@@ -36,18 +36,36 @@
> > <span class="js-config-var-name
> >js-config-var-managed-name">IMAGE_FSTYPES</span>
> > <i class="icon-question-sign get-help"
> title="Formats of
> >root file system images that you want to have created <br /><a
> >href='http://www.yoctoproject.org/docs/1.6.1/ref-manual/ref-manual.html#va
> >r-IMAGE_FSTYPES' target='_blank'>Read more in the manual</a>"></i>
> > </dt>
> >- <dd class="lead">
> >- <span id="image_fstypes">{{fstypes}}</span>
> >- <i class="icon-pencil"
> >id="change-image_fstypes-icon"></i>
> >- <form id="change-image_fstypes-form"
> >style="display:none;">
> >- <input id="filter-image_fstypes" type="text"
> >placeholder="Search image types" class="span4">
> >- <div id="all-image_fstypes" class="scrolling">
> >+ <dd style="margin-bottom: 20px">
> >+ <span id="image_fstypes"
> class="lead">{{fstypes}}</span>
> >+ <i class="icon-pencil"
> id="change-image_fstypes-icon"></i>
> >+ <form id="change-image_fstypes-form"
> style="display:none;">
> >+ <label>Choose from known image types</label>
> >+ <input id="filter-image_fstypes" type="text"
> >placeholder="Search known image types" class="span4">
> >+ <div id="all-image_fstypes" class="scrolling">
> >+ </div>
> >+ <div class="input-append">
> >+ <span class="control-group"
> >id="fstypes-control-validation">
> >+ <label>Enter your own image types
> >+ <i data-original-title="You can enter
> more than
> >one image type, separated by a space" class="icon-question-sign
> get-help"
> >title=""></i>
> >+ </label>
> >+ <input type="text"
> id="new-image-fstype-input">
> >+
> >+ </span>
> > </div>
> >- <span class="help-block"
> >id="fstypes-error-message">You must select at least one image
> type</span>
> >- <button id="apply-change-image_fstypes"
> >type="button" class="btn">Save</button>
> >- <button id="cancel-change-image_fstypes"
> >type="button" class="btn btn-link">Cancel</button>
> >- </form>
> >- </dd>
> >+ <p style="display:none" class="error"
> >id="fstypes-error-message">
> >+ You must select at least one image type.
> <br />
> >+ Choose from the list of known ones or type
> your
> >own.
> >+ </p>
> >+ <p style="display:none" class="error"
> >id="invalid-chars-in-fstype-msg">
> >+ A valid image type cannot include underscores.
> >+ </p>
> >+ <div>
> >+ <button id="apply-change-image_fstypes"
> >type="button" class="btn">Save</button>
> >+ <button id="cancel-change-image_fstypes"
> >type="button" class="btn btn-link">Cancel</button>
> >+ </div>
> >+ </form>
> >+ </dd>
> > {% endif %}
> >
> > {% if image_install_append_defined %}
> >@@ -305,20 +323,41 @@
> > return true;
> > }
> >
> >- // Test to insure at least one FS Type is checked
> >+ var fsTypesInput = $("#new-image-fstype-input");
> >+ var invalidCharsMsg = $("#invalid-chars-in-fstype-msg");
> >+ var fsTypesControl = $("#fstypes-control-validation");
> >+ var noFsType = $('#fstypes-error-message');
> >+ var fsTypesApplyBtn = $("#apply-change-image_fstypes");
> >+
> >+ /* Validation of fstypes */
> > function enableFsTypesSave() {
> >- var any_checked = 0;
> >- $(".fs-checkbox-fstypes:checked").each(function(){
> >- any_checked = 1;
> >- });
> >- if ( 0 == any_checked ) {
> >-
> >$("#apply-change-image_fstypes").attr("disabled","disabled");
> >- $('#fstypes-error-message').show();
> >- }
> >- else {
> >- $("#apply-change-image_fstypes").removeAttr("disabled");
> >- $('#fstypes-error-message').hide();
> >- }
> >+ var valid_input = false;
> >+ var valid_checkboxes = false;
> >+ var anyChecked = $(".fs-checkbox-fstypes:checked").length;
> >+
> >+ /* No underscores allowed */
> >+ if (fsTypesInput.val().match(/\_/)) {
> >+ invalidCharsMsg.show();
> >+ fsTypesControl.addClass("error");
> >+ valid_input = false;
> >+ } else {
> >+ fsTypesControl.removeClass("error");
> >+ invalidCharsMsg.hide();
> >+ valid_input = true;
> >+ }
> >+
> >+ if (!anyChecked && !fsTypesInput.val()){
> >+ noFsType.show();
> >+ valid_checkboxes = false;
> >+ } else {
> >+ noFsType.hide();
> >+ valid_checkboxes = true;
> >+ }
> >+
> >+ if (valid_checkboxes == false || valid_input == false)
> >+ fsTypesApplyBtn.attr("disabled","disabled");
> >+ else
> >+ fsTypesApplyBtn.removeAttr("disabled");
> > }
> >
> > // Preset or reset the Package Class checkbox labels
> >@@ -597,17 +636,37 @@
> > }
> > });
> >
> >- $('#apply-change-image_fstypes').click(function(){
> >- // extract the selected fstypes and sort them
> >- var fstypes_array = [];
> >- var checkboxes =
> >document.getElementsByClassName('fs-checkbox-fstypes');
> >- $(".fs-checkbox-fstypes:checked").each(function(){
> >- fstypes_array.push($(this).val());
> >- });
> >- fstypes_array.sort();
> >+ fsTypesInput.on('input', function(){
> >+ enableFsTypesSave();
> >+ });
> >+
> >+ fsTypesApplyBtn.click(function(e){
> >+ e.preventDefault();
> >+
> >+ var fstypes = '';
> >+ // extract the selected fstypes and sort them
> >+ var fstypes_array = [];
> >+ var checkboxes =
> >document.getElementsByClassName('fs-checkbox-fstypes');
> >+ $(".fs-checkbox-fstypes:checked").each(function(){
> >+ fstypes_array.push($(this).val());
> >+ });
> >+ fstypes_array.sort();
> >+
> >+ /* If we have a value in our enter own image type
> input
> >and it
> >+ * isn't already selected add it to the fstypes value
> >+ */
> >+ if (fsTypesInput.val()){
> >+ var inputFsTypes = fsTypesInput.val().split(" ");
> >+
> >+ for (var type in inputFsTypes){
> >+ if
> (fstypes_array.indexOf(inputFsTypes[type].trim())
> >=== -1)
> >+ {
> >+ fstypes += inputFsTypes[type]+' ';
> >+ }
> >+ }
> >+ }
> >
> > // now make a string of them
> >- var fstypes = '';
> > for (var i = 0, length = fstypes_array.length; i <
> >length; i++) {
> > fstypes += fstypes_array[i] + ' ';
> > }
> >@@ -620,6 +679,9 @@
> > $("#change-image_fstypes-form").slideUp(function() {
> > $('#image_fstypes,
> >#change-image_fstypes-icon').show();
> > });
> >+
> >+
> >+ fsTypesInput.val("");
> > });
> > {% endif %}
> >
> >--
> >2.5.0
> >
> >--
> >_______________________________________________
> >toaster mailing list
> >toaster@yoctoproject.org <mailto:toaster@yoctoproject.org>
> >https://lists.yoctoproject.org/listinfo/toaster
>
> --
> _______________________________________________
> toaster mailing list
> toaster@yoctoproject.org <mailto:toaster@yoctoproject.org>
> https://lists.yoctoproject.org/listinfo/toaster
>
>
>
>
> --
> Elliot Smith
> Software Engineer
> Intel Open Source Technology Centre
>
> ---------------------------------------------------------------------
> Intel Corporation (UK) Limited
> Registered No. 1134945 (England)
> Registered Office: Pipers Way, Swindon SN3 1RJ
> VAT No: 860 2173 47
>
> This e-mail and any attachments may contain confidential material for
> the sole use of the intended recipient(s). Any review or distribution
> by others is strictly prohibited. If you are not the intended
> recipient, please contact the sender and delete all copies.
>
^ permalink raw reply [flat|nested] 7+ messages in thread
* Re: [[PATCH v2]] toaster: projectconf Add feature for free form IMAGE_FSTYPES
2015-11-26 16:05 ` Michael Wood
@ 2015-11-26 16:18 ` Barros Pena, Belen
2015-12-15 13:08 ` Barros Pena, Belen
0 siblings, 1 reply; 7+ messages in thread
From: Barros Pena, Belen @ 2015-11-26 16:18 UTC (permalink / raw)
To: Wood, Michael G, Smith, Elliot; +Cc: toaster@yoctoproject.org
On 26/11/2015 16:05, "Michael Wood" <michael.g.wood@intel.com> wrote:
>On 26/11/15 14:28, Smith, Elliot wrote:
>> On 24 November 2015 at 13:26, Barros Pena, Belen
>> <belen.barros.pena@intel.com <mailto:belen.barros.pena@intel.com>>
>>wrote:
>>
>> On 23/11/2015 11:41, "toaster-bounces@yoctoproject.org
>> <mailto:toaster-bounces@yoctoproject.org> on behalf of
>> Michael Wood" <toaster-bounces@yoctoproject.org
>> <mailto:toaster-bounces@yoctoproject.org> on behalf of
>> michael.g.wood@intel.com <mailto:michael.g.wood@intel.com>> wrote:
>>
>> >Add feature to the projectconf page to allow free form input of
>> >IMAGE_FSTYPES. Sometimes a recipe can provide an IMAGE_FSTYPE that
>> >isn't in the normal image_types class. So would need to be
>>specified
>> >manually.
>> >
>> >[YOCTO #7828]
>>
>> This seems to address all the issues from v1. Getting rid the
>>'already
>> selected' error message by not duplicating any values works well.
>>
>>
>> It works correctly, but there is one issue: if you enter an invalid
>> string as the image type (e.g. btrfss) and want to correct it, there's
>> no way to delete it from the list.
>
>To remove custom added values, you just have to click edit and then
>press 'Save'.
The fact that Elliot couldn't work it out I think tells us something. We
shouldn't leave it that way :/
>
>>
>> Perhaps a button to set the list back to the defaults, or to remove
>> any invalid types ("cleanup")?
>>
>> Alternatively, add the user's custom image type to the checkbox list;
>> if they uncheck it, is disappears from the list.
>>
>> Elliot
>>
>>
>> From my perspective, this is good to go.
>>
>> Thanks!
>>
>> Belén
>>
>> >
>> >Signed-off-by: Michael Wood <michael.g.wood@intel.com
>> <mailto:michael.g.wood@intel.com>>
>> >---
>> > .../toaster/toastergui/templates/projectconf.html | 128
>> >+++++++++++++++------
>> > 1 file changed, 95 insertions(+), 33 deletions(-)
>> >
>> >diff --git
>> a/bitbake/lib/toaster/toastergui/templates/projectconf.html
>> >b/bitbake/lib/toaster/toastergui/templates/projectconf.html
>> >index 30fd03e..13f9c66 100644
>> >--- a/bitbake/lib/toaster/toastergui/templates/projectconf.html
>> >+++ b/bitbake/lib/toaster/toastergui/templates/projectconf.html
>> >@@ -36,18 +36,36 @@
>> > <span class="js-config-var-name
>> >js-config-var-managed-name">IMAGE_FSTYPES</span>
>> > <i class="icon-question-sign get-help"
>> title="Formats of
>> >root file system images that you want to have created <br /><a
>>
>>>href='http://www.yoctoproject.org/docs/1.6.1/ref-manual/ref-manual.html#
>>>va
>> >r-IMAGE_FSTYPES' target='_blank'>Read more in the manual</a>"></i>
>> > </dt>
>> >- <dd class="lead">
>> >- <span id="image_fstypes">{{fstypes}}</span>
>> >- <i class="icon-pencil"
>> >id="change-image_fstypes-icon"></i>
>> >- <form id="change-image_fstypes-form"
>> >style="display:none;">
>> >- <input id="filter-image_fstypes" type="text"
>> >placeholder="Search image types" class="span4">
>> >- <div id="all-image_fstypes" class="scrolling">
>> >+ <dd style="margin-bottom: 20px">
>> >+ <span id="image_fstypes"
>> class="lead">{{fstypes}}</span>
>> >+ <i class="icon-pencil"
>> id="change-image_fstypes-icon"></i>
>> >+ <form id="change-image_fstypes-form"
>> style="display:none;">
>> >+ <label>Choose from known image types</label>
>> >+ <input id="filter-image_fstypes" type="text"
>> >placeholder="Search known image types" class="span4">
>> >+ <div id="all-image_fstypes" class="scrolling">
>> >+ </div>
>> >+ <div class="input-append">
>> >+ <span class="control-group"
>> >id="fstypes-control-validation">
>> >+ <label>Enter your own image types
>> >+ <i data-original-title="You can enter
>> more than
>> >one image type, separated by a space" class="icon-question-sign
>> get-help"
>> >title=""></i>
>> >+ </label>
>> >+ <input type="text"
>> id="new-image-fstype-input">
>> >+
>> >+ </span>
>> > </div>
>> >- <span class="help-block"
>> >id="fstypes-error-message">You must select at least one image
>> type</span>
>> >- <button id="apply-change-image_fstypes"
>> >type="button" class="btn">Save</button>
>> >- <button id="cancel-change-image_fstypes"
>> >type="button" class="btn btn-link">Cancel</button>
>> >- </form>
>> >- </dd>
>> >+ <p style="display:none" class="error"
>> >id="fstypes-error-message">
>> >+ You must select at least one image type.
>> <br />
>> >+ Choose from the list of known ones or type
>> your
>> >own.
>> >+ </p>
>> >+ <p style="display:none" class="error"
>> >id="invalid-chars-in-fstype-msg">
>> >+ A valid image type cannot include
>>underscores.
>> >+ </p>
>> >+ <div>
>> >+ <button id="apply-change-image_fstypes"
>> >type="button" class="btn">Save</button>
>> >+ <button id="cancel-change-image_fstypes"
>> >type="button" class="btn btn-link">Cancel</button>
>> >+ </div>
>> >+ </form>
>> >+ </dd>
>> > {% endif %}
>> >
>> > {% if image_install_append_defined %}
>> >@@ -305,20 +323,41 @@
>> > return true;
>> > }
>> >
>> >- // Test to insure at least one FS Type is checked
>> >+ var fsTypesInput = $("#new-image-fstype-input");
>> >+ var invalidCharsMsg = $("#invalid-chars-in-fstype-msg");
>> >+ var fsTypesControl = $("#fstypes-control-validation");
>> >+ var noFsType = $('#fstypes-error-message');
>> >+ var fsTypesApplyBtn = $("#apply-change-image_fstypes");
>> >+
>> >+ /* Validation of fstypes */
>> > function enableFsTypesSave() {
>> >- var any_checked = 0;
>> >- $(".fs-checkbox-fstypes:checked").each(function(){
>> >- any_checked = 1;
>> >- });
>> >- if ( 0 == any_checked ) {
>> >-
>> >$("#apply-change-image_fstypes").attr("disabled","disabled");
>> >- $('#fstypes-error-message').show();
>> >- }
>> >- else {
>> >- $("#apply-change-image_fstypes").removeAttr("disabled");
>> >- $('#fstypes-error-message').hide();
>> >- }
>> >+ var valid_input = false;
>> >+ var valid_checkboxes = false;
>> >+ var anyChecked =
>>$(".fs-checkbox-fstypes:checked").length;
>> >+
>> >+ /* No underscores allowed */
>> >+ if (fsTypesInput.val().match(/\_/)) {
>> >+ invalidCharsMsg.show();
>> >+ fsTypesControl.addClass("error");
>> >+ valid_input = false;
>> >+ } else {
>> >+ fsTypesControl.removeClass("error");
>> >+ invalidCharsMsg.hide();
>> >+ valid_input = true;
>> >+ }
>> >+
>> >+ if (!anyChecked && !fsTypesInput.val()){
>> >+ noFsType.show();
>> >+ valid_checkboxes = false;
>> >+ } else {
>> >+ noFsType.hide();
>> >+ valid_checkboxes = true;
>> >+ }
>> >+
>> >+ if (valid_checkboxes == false || valid_input == false)
>> >+ fsTypesApplyBtn.attr("disabled","disabled");
>> >+ else
>> >+ fsTypesApplyBtn.removeAttr("disabled");
>> > }
>> >
>> > // Preset or reset the Package Class checkbox labels
>> >@@ -597,17 +636,37 @@
>> > }
>> > });
>> >
>> >- $('#apply-change-image_fstypes').click(function(){
>> >- // extract the selected fstypes and sort them
>> >- var fstypes_array = [];
>> >- var checkboxes =
>> >document.getElementsByClassName('fs-checkbox-fstypes');
>> >- $(".fs-checkbox-fstypes:checked").each(function(){
>> >- fstypes_array.push($(this).val());
>> >- });
>> >- fstypes_array.sort();
>> >+ fsTypesInput.on('input', function(){
>> >+ enableFsTypesSave();
>> >+ });
>> >+
>> >+ fsTypesApplyBtn.click(function(e){
>> >+ e.preventDefault();
>> >+
>> >+ var fstypes = '';
>> >+ // extract the selected fstypes and sort them
>> >+ var fstypes_array = [];
>> >+ var checkboxes =
>> >document.getElementsByClassName('fs-checkbox-fstypes');
>> >+ $(".fs-checkbox-fstypes:checked").each(function(){
>> >+ fstypes_array.push($(this).val());
>> >+ });
>> >+ fstypes_array.sort();
>> >+
>> >+ /* If we have a value in our enter own image type
>> input
>> >and it
>> >+ * isn't already selected add it to the fstypes
>>value
>> >+ */
>> >+ if (fsTypesInput.val()){
>> >+ var inputFsTypes = fsTypesInput.val().split(" ");
>> >+
>> >+ for (var type in inputFsTypes){
>> >+ if
>> (fstypes_array.indexOf(inputFsTypes[type].trim())
>> >=== -1)
>> >+ {
>> >+ fstypes += inputFsTypes[type]+' ';
>> >+ }
>> >+ }
>> >+ }
>> >
>> > // now make a string of them
>> >- var fstypes = '';
>> > for (var i = 0, length = fstypes_array.length; i <
>> >length; i++) {
>> > fstypes += fstypes_array[i] + ' ';
>> > }
>> >@@ -620,6 +679,9 @@
>> > $("#change-image_fstypes-form").slideUp(function() {
>> > $('#image_fstypes,
>> >#change-image_fstypes-icon').show();
>> > });
>> >+
>> >+
>> >+ fsTypesInput.val("");
>> > });
>> > {% endif %}
>> >
>> >--
>> >2.5.0
>> >
>> >--
>> >_______________________________________________
>> >toaster mailing list
>> >toaster@yoctoproject.org <mailto:toaster@yoctoproject.org>
>> >https://lists.yoctoproject.org/listinfo/toaster
>>
>> --
>> _______________________________________________
>> toaster mailing list
>> toaster@yoctoproject.org <mailto:toaster@yoctoproject.org>
>> https://lists.yoctoproject.org/listinfo/toaster
>>
>>
>>
>>
>> --
>> Elliot Smith
>> Software Engineer
>> Intel Open Source Technology Centre
>>
>> ---------------------------------------------------------------------
>> Intel Corporation (UK) Limited
>> Registered No. 1134945 (England)
>> Registered Office: Pipers Way, Swindon SN3 1RJ
>> VAT No: 860 2173 47
>>
>> This e-mail and any attachments may contain confidential material for
>> the sole use of the intended recipient(s). Any review or distribution
>> by others is strictly prohibited. If you are not the intended
>> recipient, please contact the sender and delete all copies.
>>
>
^ permalink raw reply [flat|nested] 7+ messages in thread
* Re: [[PATCH v2]] toaster: projectconf Add feature for free form IMAGE_FSTYPES
2015-11-26 16:18 ` Barros Pena, Belen
@ 2015-12-15 13:08 ` Barros Pena, Belen
0 siblings, 0 replies; 7+ messages in thread
From: Barros Pena, Belen @ 2015-12-15 13:08 UTC (permalink / raw)
To: Wood, Michael G, Smith, Elliot; +Cc: toaster@yoctoproject.org
Sorry for the huge delay on this. A new design now attached to the
Bugzilla entry
https://bugzilla.yoctoproject.org/show_bug.cgi?id=7828
Let me know what you think.
Belén
On 26/11/2015 16:18, "toaster-bounces@yoctoproject.org on behalf of Barros
Pena, Belen" <toaster-bounces@yoctoproject.org on behalf of
belen.barros.pena@intel.com> wrote:
>
>
>On 26/11/2015 16:05, "Michael Wood" <michael.g.wood@intel.com> wrote:
>
>>On 26/11/15 14:28, Smith, Elliot wrote:
>>> On 24 November 2015 at 13:26, Barros Pena, Belen
>>> <belen.barros.pena@intel.com <mailto:belen.barros.pena@intel.com>>
>>>wrote:
>>>
>>> On 23/11/2015 11:41, "toaster-bounces@yoctoproject.org
>>> <mailto:toaster-bounces@yoctoproject.org> on behalf of
>>> Michael Wood" <toaster-bounces@yoctoproject.org
>>> <mailto:toaster-bounces@yoctoproject.org> on behalf of
>>> michael.g.wood@intel.com <mailto:michael.g.wood@intel.com>> wrote:
>>>
>>> >Add feature to the projectconf page to allow free form input of
>>> >IMAGE_FSTYPES. Sometimes a recipe can provide an IMAGE_FSTYPE that
>>> >isn't in the normal image_types class. So would need to be
>>>specified
>>> >manually.
>>> >
>>> >[YOCTO #7828]
>>>
>>> This seems to address all the issues from v1. Getting rid the
>>>'already
>>> selected' error message by not duplicating any values works well.
>>>
>>>
>>> It works correctly, but there is one issue: if you enter an invalid
>>> string as the image type (e.g. btrfss) and want to correct it, there's
>>> no way to delete it from the list.
>>
>>To remove custom added values, you just have to click edit and then
>>press 'Save'.
>
>The fact that Elliot couldn't work it out I think tells us something. We
>shouldn't leave it that way :/
>
>>
>>>
>>> Perhaps a button to set the list back to the defaults, or to remove
>>> any invalid types ("cleanup")?
>>>
>>> Alternatively, add the user's custom image type to the checkbox list;
>>> if they uncheck it, is disappears from the list.
>>>
>>> Elliot
>>>
>>>
>>> From my perspective, this is good to go.
>>>
>>> Thanks!
>>>
>>> Belén
>>>
>>> >
>>> >Signed-off-by: Michael Wood <michael.g.wood@intel.com
>>> <mailto:michael.g.wood@intel.com>>
>>> >---
>>> > .../toaster/toastergui/templates/projectconf.html | 128
>>> >+++++++++++++++------
>>> > 1 file changed, 95 insertions(+), 33 deletions(-)
>>> >
>>> >diff --git
>>> a/bitbake/lib/toaster/toastergui/templates/projectconf.html
>>> >b/bitbake/lib/toaster/toastergui/templates/projectconf.html
>>> >index 30fd03e..13f9c66 100644
>>> >--- a/bitbake/lib/toaster/toastergui/templates/projectconf.html
>>> >+++ b/bitbake/lib/toaster/toastergui/templates/projectconf.html
>>> >@@ -36,18 +36,36 @@
>>> > <span class="js-config-var-name
>>> >js-config-var-managed-name">IMAGE_FSTYPES</span>
>>> > <i class="icon-question-sign get-help"
>>> title="Formats of
>>> >root file system images that you want to have created <br /><a
>>>
>>>>href='http://www.yoctoproject.org/docs/1.6.1/ref-manual/ref-manual.html
>>>>#
>>>>va
>>> >r-IMAGE_FSTYPES' target='_blank'>Read more in the manual</a>"></i>
>>> > </dt>
>>> >- <dd class="lead">
>>> >- <span id="image_fstypes">{{fstypes}}</span>
>>> >- <i class="icon-pencil"
>>> >id="change-image_fstypes-icon"></i>
>>> >- <form id="change-image_fstypes-form"
>>> >style="display:none;">
>>> >- <input id="filter-image_fstypes" type="text"
>>> >placeholder="Search image types" class="span4">
>>> >- <div id="all-image_fstypes"
>>>class="scrolling">
>>> >+ <dd style="margin-bottom: 20px">
>>> >+ <span id="image_fstypes"
>>> class="lead">{{fstypes}}</span>
>>> >+ <i class="icon-pencil"
>>> id="change-image_fstypes-icon"></i>
>>> >+ <form id="change-image_fstypes-form"
>>> style="display:none;">
>>> >+ <label>Choose from known image types</label>
>>> >+ <input id="filter-image_fstypes" type="text"
>>> >placeholder="Search known image types" class="span4">
>>> >+ <div id="all-image_fstypes" class="scrolling">
>>> >+ </div>
>>> >+ <div class="input-append">
>>> >+ <span class="control-group"
>>> >id="fstypes-control-validation">
>>> >+ <label>Enter your own image types
>>> >+ <i data-original-title="You can enter
>>> more than
>>> >one image type, separated by a space" class="icon-question-sign
>>> get-help"
>>> >title=""></i>
>>> >+ </label>
>>> >+ <input type="text"
>>> id="new-image-fstype-input">
>>> >+
>>> >+ </span>
>>> > </div>
>>> >- <span class="help-block"
>>> >id="fstypes-error-message">You must select at least one image
>>> type</span>
>>> >- <button id="apply-change-image_fstypes"
>>> >type="button" class="btn">Save</button>
>>> >- <button id="cancel-change-image_fstypes"
>>> >type="button" class="btn btn-link">Cancel</button>
>>> >- </form>
>>> >- </dd>
>>> >+ <p style="display:none" class="error"
>>> >id="fstypes-error-message">
>>> >+ You must select at least one image type.
>>> <br />
>>> >+ Choose from the list of known ones or type
>>> your
>>> >own.
>>> >+ </p>
>>> >+ <p style="display:none" class="error"
>>> >id="invalid-chars-in-fstype-msg">
>>> >+ A valid image type cannot include
>>>underscores.
>>> >+ </p>
>>> >+ <div>
>>> >+ <button id="apply-change-image_fstypes"
>>> >type="button" class="btn">Save</button>
>>> >+ <button id="cancel-change-image_fstypes"
>>> >type="button" class="btn btn-link">Cancel</button>
>>> >+ </div>
>>> >+ </form>
>>> >+ </dd>
>>> > {% endif %}
>>> >
>>> > {% if image_install_append_defined %}
>>> >@@ -305,20 +323,41 @@
>>> > return true;
>>> > }
>>> >
>>> >- // Test to insure at least one FS Type is checked
>>> >+ var fsTypesInput = $("#new-image-fstype-input");
>>> >+ var invalidCharsMsg = $("#invalid-chars-in-fstype-msg");
>>> >+ var fsTypesControl = $("#fstypes-control-validation");
>>> >+ var noFsType = $('#fstypes-error-message');
>>> >+ var fsTypesApplyBtn = $("#apply-change-image_fstypes");
>>> >+
>>> >+ /* Validation of fstypes */
>>> > function enableFsTypesSave() {
>>> >- var any_checked = 0;
>>> >- $(".fs-checkbox-fstypes:checked").each(function(){
>>> >- any_checked = 1;
>>> >- });
>>> >- if ( 0 == any_checked ) {
>>> >-
>>> >$("#apply-change-image_fstypes").attr("disabled","disabled");
>>> >- $('#fstypes-error-message').show();
>>> >- }
>>> >- else {
>>> >- $("#apply-change-image_fstypes").removeAttr("disabled");
>>> >- $('#fstypes-error-message').hide();
>>> >- }
>>> >+ var valid_input = false;
>>> >+ var valid_checkboxes = false;
>>> >+ var anyChecked =
>>>$(".fs-checkbox-fstypes:checked").length;
>>> >+
>>> >+ /* No underscores allowed */
>>> >+ if (fsTypesInput.val().match(/\_/)) {
>>> >+ invalidCharsMsg.show();
>>> >+ fsTypesControl.addClass("error");
>>> >+ valid_input = false;
>>> >+ } else {
>>> >+ fsTypesControl.removeClass("error");
>>> >+ invalidCharsMsg.hide();
>>> >+ valid_input = true;
>>> >+ }
>>> >+
>>> >+ if (!anyChecked && !fsTypesInput.val()){
>>> >+ noFsType.show();
>>> >+ valid_checkboxes = false;
>>> >+ } else {
>>> >+ noFsType.hide();
>>> >+ valid_checkboxes = true;
>>> >+ }
>>> >+
>>> >+ if (valid_checkboxes == false || valid_input == false)
>>> >+ fsTypesApplyBtn.attr("disabled","disabled");
>>> >+ else
>>> >+ fsTypesApplyBtn.removeAttr("disabled");
>>> > }
>>> >
>>> > // Preset or reset the Package Class checkbox labels
>>> >@@ -597,17 +636,37 @@
>>> > }
>>> > });
>>> >
>>> >- $('#apply-change-image_fstypes').click(function(){
>>> >- // extract the selected fstypes and sort them
>>> >- var fstypes_array = [];
>>> >- var checkboxes =
>>> >document.getElementsByClassName('fs-checkbox-fstypes');
>>> >- $(".fs-checkbox-fstypes:checked").each(function(){
>>> >- fstypes_array.push($(this).val());
>>> >- });
>>> >- fstypes_array.sort();
>>> >+ fsTypesInput.on('input', function(){
>>> >+ enableFsTypesSave();
>>> >+ });
>>> >+
>>> >+ fsTypesApplyBtn.click(function(e){
>>> >+ e.preventDefault();
>>> >+
>>> >+ var fstypes = '';
>>> >+ // extract the selected fstypes and sort them
>>> >+ var fstypes_array = [];
>>> >+ var checkboxes =
>>> >document.getElementsByClassName('fs-checkbox-fstypes');
>>> >+ $(".fs-checkbox-fstypes:checked").each(function(){
>>> >+ fstypes_array.push($(this).val());
>>> >+ });
>>> >+ fstypes_array.sort();
>>> >+
>>> >+ /* If we have a value in our enter own image type
>>> input
>>> >and it
>>> >+ * isn't already selected add it to the fstypes
>>>value
>>> >+ */
>>> >+ if (fsTypesInput.val()){
>>> >+ var inputFsTypes = fsTypesInput.val().split("
>>>");
>>> >+
>>> >+ for (var type in inputFsTypes){
>>> >+ if
>>> (fstypes_array.indexOf(inputFsTypes[type].trim())
>>> >=== -1)
>>> >+ {
>>> >+ fstypes += inputFsTypes[type]+' ';
>>> >+ }
>>> >+ }
>>> >+ }
>>> >
>>> > // now make a string of them
>>> >- var fstypes = '';
>>> > for (var i = 0, length = fstypes_array.length; i
>>><
>>> >length; i++) {
>>> > fstypes += fstypes_array[i] + ' ';
>>> > }
>>> >@@ -620,6 +679,9 @@
>>> > $("#change-image_fstypes-form").slideUp(function() {
>>> > $('#image_fstypes,
>>> >#change-image_fstypes-icon').show();
>>> > });
>>> >+
>>> >+
>>> >+ fsTypesInput.val("");
>>> > });
>>> > {% endif %}
>>> >
>>> >--
>>> >2.5.0
>>> >
>>> >--
>>> >_______________________________________________
>>> >toaster mailing list
>>> >toaster@yoctoproject.org <mailto:toaster@yoctoproject.org>
>>> >https://lists.yoctoproject.org/listinfo/toaster
>>>
>>> --
>>> _______________________________________________
>>> toaster mailing list
>>> toaster@yoctoproject.org <mailto:toaster@yoctoproject.org>
>>> https://lists.yoctoproject.org/listinfo/toaster
>>>
>>>
>>>
>>>
>>> --
>>> Elliot Smith
>>> Software Engineer
>>> Intel Open Source Technology Centre
>>>
>>> ---------------------------------------------------------------------
>>> Intel Corporation (UK) Limited
>>> Registered No. 1134945 (England)
>>> Registered Office: Pipers Way, Swindon SN3 1RJ
>>> VAT No: 860 2173 47
>>>
>>> This e-mail and any attachments may contain confidential material for
>>> the sole use of the intended recipient(s). Any review or distribution
>>> by others is strictly prohibited. If you are not the intended
>>> recipient, please contact the sender and delete all copies.
>>>
>>
>
>--
>_______________________________________________
>toaster mailing list
>toaster@yoctoproject.org
>https://lists.yoctoproject.org/listinfo/toaster
^ permalink raw reply [flat|nested] 7+ messages in thread
end of thread, other threads:[~2015-12-15 13:11 UTC | newest]
Thread overview: 7+ messages (download: mbox.gz follow: Atom feed
-- links below jump to the message on this page --
2015-11-23 11:41 [[PATCH v2]] toaster: projectconf Add feature for free form IMAGE_FSTYPES Michael Wood
2015-11-24 13:26 ` Barros Pena, Belen
2015-11-26 14:28 ` Smith, Elliot
2015-11-26 15:00 ` Barros Pena, Belen
2015-11-26 16:05 ` Michael Wood
2015-11-26 16:18 ` Barros Pena, Belen
2015-12-15 13:08 ` Barros Pena, Belen
This is an external index of several public inboxes,
see mirroring instructions on how to clone and mirror
all data and code used by this external index.