[gnome-continuous-yocto/gnomeostree-3.28-rocko: 3650/8267] bitbake: toaster: importlayer Add git revision typeahead to that input field

[Emmanuele Bassi <ebassi src gnome org>]

commit 23ad2a8ca08da30bd5ef1e01860021ced1967c07
Author: Michael Wood <michael g wood intel com>
Date:   Fri Dec 9 16:52:50 2016 +0000

    bitbake: toaster: importlayer Add git revision typeahead to that input field
    
    Add the front end mechanism to load the typeahead for the git revision
    field on importing a layer.
    Also fix one indentation issue and update the js test.
    
    (Bitbake rev: 28114be42174095b812a93d4b5a0e01e953d74f8)
    
    Signed-off-by: Michael Wood <michael g wood intel com>
    Signed-off-by: Richard Purdie <richard purdie linuxfoundation org>

 .../lib/toaster/toastergui/static/css/default.css  |    1 -
 .../toaster/toastergui/static/js/importlayer.js    |   29 +++++++++++++++----
 .../lib/toaster/toastergui/static/js/tests/test.js |    2 +-
 .../toaster/toastergui/templates/importlayer.html  |    5 +++-
 4 files changed, 28 insertions(+), 9 deletions(-)
---
diff --git a/bitbake/lib/toaster/toastergui/static/css/default.css 
b/bitbake/lib/toaster/toastergui/static/css/default.css
index ff24e8c..5cd7e21 100644
--- a/bitbake/lib/toaster/toastergui/static/css/default.css
+++ b/bitbake/lib/toaster/toastergui/static/css/default.css
@@ -210,7 +210,6 @@ fieldset.fields-apart-from-layer-name { margin-top: 20px; }
 #import-layer-name,
 #layer-subdir { width: 20%; }
 #layer-git-repo-url { width: 40%; }
-#layer-git-ref { width: 32%; }
 #local-dir-path { width: 45%; }
 #layer-dependency { width: 16em; }
 #layer-deps-list { margin-top: 0; }
diff --git a/bitbake/lib/toaster/toastergui/static/js/importlayer.js 
b/bitbake/lib/toaster/toastergui/static/js/importlayer.js
index 4784c65..b3f094e 100644
--- a/bitbake/lib/toaster/toastergui/static/js/importlayer.js
+++ b/bitbake/lib/toaster/toastergui/static/js/importlayer.js
@@ -45,7 +45,7 @@ function importLayerPageInit (ctx) {
     function(layer) {
     if (layer.results.length > 0) {
       currentLayerDepSelection = layer.results[0];
-      layerDepBtn.click();
+        layerDepBtn.click();
     }
   });
 
@@ -333,19 +333,36 @@ function importLayerPageInit (ctx) {
     check_form();
   });
 
-  /* Have a guess at the layer name */
+  /* Setup 'blank' typeahead */
+  libtoaster.makeTypeahead(gitRefInput,
+                           ctx.xhrGitRevTypeAheadUrl,
+                           { git_url: null }, function(){});
+
+
   vcsURLInput.focusout(function (){
+    if (!$(this).val())
+      return;
+
     /* If we a layer name specified don't overwrite it or if there isn't a
      * url typed in yet return
      */
-    if (layerNameInput.val() || !$(this).val())
-      return;
-
-    if ($(this).val().search("/")){
+    if (!layerNameInput.val() && $(this).val().search("/")){
       var urlPts = $(this).val().split("/");
+      /* Add a suggestion of the layer name */
       var suggestion = urlPts[urlPts.length-1].replace(".git","");
       layerNameInput.val(suggestion);
     }
+
+    /* Now actually setup the typeahead properly with the git url entered */
+    gitRefInput._typeahead('destroy');
+
+    libtoaster.makeTypeahead(gitRefInput,
+                             ctx.xhrGitRevTypeAheadUrl,
+                             { git_url: $(this).val() },
+                             function(selected){
+                               gitRefInput._typeahead("close");
+                             });
+
   });
 
   function radioDisplay() {
diff --git a/bitbake/lib/toaster/toastergui/static/js/tests/test.js 
b/bitbake/lib/toaster/toastergui/static/js/tests/test.js
index d7953de..f3bf8d7 100644
--- a/bitbake/lib/toaster/toastergui/static/js/tests/test.js
+++ b/bitbake/lib/toaster/toastergui/static/js/tests/test.js
@@ -144,7 +144,7 @@ QUnit.test("Make typeaheads", function(assert){
 /* Page init functions */
 
 QUnit.test("Import layer page init", function(assert){
-  assert.throws(importLayerPageInit());
+  assert.throws(importLayerPageInit({ xhrGitRevTypeAheadUrl: "url" }));
 });
 
 QUnit.test("Project page init", function(assert){
diff --git a/bitbake/lib/toaster/toastergui/templates/importlayer.html 
b/bitbake/lib/toaster/toastergui/templates/importlayer.html
index bd507b5..afbeb94 100644
--- a/bitbake/lib/toaster/toastergui/templates/importlayer.html
+++ b/bitbake/lib/toaster/toastergui/templates/importlayer.html
@@ -14,6 +14,7 @@
   $(document).ready(function (){
     var ctx = {
       xhrLayerUrl : "{% url 'xhr_layer' project.id %}",
+      xhrGitRevTypeAheadUrl : "{% url 'xhr_gitrevtypeahead' %}",
     };
 
     try {
@@ -112,8 +113,10 @@
           Git revision
           <span class="glyphicon glyphicon-question-sign get-help" title="You can provide a Git branch, a 
tag or a commit SHA as the revision"></span>
         </label>
-        <input type="text" class="form-control" id="layer-git-ref" required>
+        <span style="display: block">
+        <input type="text" class="form-control" id="layer-git-ref" autocomplete="off" data-minLength="1" 
data-autocomplete="off" data-provide="typeahead" required>
         <span class="help-inline" style="display:none;" id="invalid-layer-revision-hint"></span>
+        </span>
       </div>
     </fieldset>