bitbake: toaster: newcustomimage_modal add frontend name validation

Add front end handling of validation response from create new
CustomImageRecipe api.

(Bitbake rev: eff66b502df8e001cd0abc25bcbd742687169619)

Signed-off-by: Michael Wood <michael.g.wood@intel.com>
Signed-off-by: brian avery <avery.brian@gmail.com>
Signed-off-by: Richard Purdie <richard.purdie@linuxfoundation.org>

1 files changed, 32 insertions, 5 deletions

diff --git a/bitbake/lib/toaster/toastergui/static/js/newcustomimage_modal.js b/bitbake/lib/toaster/toastergui/static/js/newcustomimage_modal.js
index 16e42b3d27..0b9d31aa6c 100644
--- a/bitbake/lib/toaster/toastergui/static/js/newcustomimage_modal.js
+++ b/bitbake/lib/toaster/toastergui/static/js/newcustomimage_modal.js
@@ -5,24 +5,51 @@ function newCustomImageModalInit(){
 
   var newCustomImgBtn = $("#create-new-custom-image-btn");
   var imgCustomModal = $("#new-custom-image-modal");
+  var invalidNameHelp = $("#invalid-name-help");
+  var nameInput = imgCustomModal.find('input');
+
+  var invalidMsg = "Image names cannot contain spaces or capital letters. The only allowed special character is dash (-).";
 
   newCustomImgBtn.click(function(e){
     e.preventDefault();
 
-    var name = imgCustomModal.find('input').val();
     var baseRecipeId = imgCustomModal.data('recipe');
 
-    if (name.length > 0) {
-      imgCustomModal.modal('hide');
-      libtoaster.createCustomRecipe(name, baseRecipeId, function(ret) {
+    if (nameInput.val().length > 0) {
+      libtoaster.createCustomRecipe(nameInput.val(), baseRecipeId,
+      function(ret) {
         if (ret.error !== "ok") {
           console.warn(ret.error);
+          if (ret.error === "invalid-name") {
+            showError(invalidMsg);
+          } else if (ret.error === "already-exists") {
+            showError("An image with this name already exists. Image names must be unique.");
+          }
         } else {
+          imgCustomModal.modal('hide');
           window.location.replace(ret.url + '?notify=new');
         }
       });
+    }
+  });
+
+  function showError(text){
+    invalidNameHelp.text(text);
+    invalidNameHelp.show();
+  }
+
+  nameInput.on('keyup', function(){
+    if (nameInput.val().length === 0){
+      newCustomImgBtn.prop("disabled", true);
+      return
+    }
+
+    if (nameInput.val().search(/[^a-z|0-9|-]/) != -1){
+      showError(invalidMsg);
+      newCustomImgBtn.prop("disabled", true);
     } else {
-      console.warn("TODO No name supplied");
+      invalidNameHelp.hide();
+      newCustomImgBtn.prop("disabled", false);
     }
   });
 }