bitbake: toaster: layerdetails clean ups after integrating local layer changes

A few clean ups for the work done to integrate editing imported local layers
into the layer detail page.

(Bitbake rev: 092ef32e695b43c3337b7116722c4c6eba981396)

Signed-off-by: Michael Wood <michael.g.wood@intel.com>
Signed-off-by: Elliot Smith <elliot.smith@intel.com>
Signed-off-by: Richard Purdie <richard.purdie@linuxfoundation.org>

2 files changed, 41 insertions, 47 deletions

diff --git a/bitbake/lib/toaster/toastergui/static/css/default.css b/bitbake/lib/toaster/toastergui/static/css/default.css
index f71b37e7fc..a56bb8cbff 100644
--- a/bitbake/lib/toaster/toastergui/static/css/default.css
+++ b/bitbake/lib/toaster/toastergui/static/css/default.css
@@ -316,6 +316,8 @@ h2.panel-title { font-size: 30px; }
 /* Make the help in tables insivisble until you hover over the right cell */
 .hover-help { visibility: hidden; }
 
+#add-remove-layer-btn { margin-bottom: 20px; }
+
 /* Blue hightlight animation for tasks and directory structure tables */
 .highlight { -webkit-animation: target-fade 15s 1; -moz-animation: target-fade 15s 1; animation: target-fade 15s 1; }
 @-webkit-keyframes target-fade { 0% { background-color: #D9EDF7; } 25% { background-color: #D9EDF7; } 100% { background-color: white; } }
diff --git a/bitbake/lib/toaster/toastergui/static/js/layerdetails.js b/bitbake/lib/toaster/toastergui/static/js/layerdetails.js
index 2ff8e598a9..5fd7274894 100644
--- a/bitbake/lib/toaster/toastergui/static/js/layerdetails.js
+++ b/bitbake/lib/toaster/toastergui/static/js/layerdetails.js
@@ -11,11 +11,19 @@ function layerDetailsPageInit (ctx) {
   var machineTab = $("#machines-tab");
   var detailsTab = $("#details-tab");
   var editLayerSource = $("#edit-layer-source");
+  var saveSourceChangesBtn = $("#save-changes-for-switch");
+  var layerGitRefInput = $("#layer-git-ref");
+  var layerSubDirInput = $('#layer-subdir');
+
+  targetTab.on('show.bs.tab', targetsTabShow);
+  detailsTab.on('show.bs.tab', detailsTabShow);
+  machineTab.on('show.bs.tab', machinesTabShow);
 
   /* setup the dependencies typeahead */
-  libtoaster.makeTypeahead(layerDepInput, libtoaster.ctx.layersTypeAheadUrl, { include_added: "true" }, function(item){
+  libtoaster.makeTypeahead(layerDepInput,
+                           libtoaster.ctx.layersTypeAheadUrl,
+                           { include_added: "true" }, function(item){
     currentLayerDepSelection = item;
-
     layerDepBtn.removeAttr("disabled");
   });
 
@@ -26,20 +34,6 @@ function layerDetailsPageInit (ctx) {
     }
   });
 
-  $(window).on('hashchange', function(e){
-    switch(window.location.hash){
-      case '#machines':
-        machineTab.tab('show');
-        break;
-      case '#recipes':
-        targetTab.tab('show');
-        break;
-      default:
-        detailsTab.tab('show');
-        break;
-    }
-  });
-
   function addRemoveDep(depLayerId, add, doneCb) {
     var data = { layer_version_id : ctx.layerVersion.id };
     if (add)
@@ -151,6 +145,7 @@ function layerDetailsPageInit (ctx) {
     });
   });
 
+
   function defaultAddBtnText(){
       var text = " Add the "+ctx.layerVersion.name+" layer to your project";
       addRmLayerBtn.text(text);
@@ -158,12 +153,12 @@ function layerDetailsPageInit (ctx) {
       addRmLayerBtn.removeClass("btn-danger");
   }
 
-  detailsTab.on('show', function(){
+  function detailsTabShow(){
     if (!ctx.layerVersion.inCurrentPrj)
       defaultAddBtnText();
 
-    window.location.hash = "details";
-  });
+    window.location.hash = "information";
+  }
 
   function targetsTabShow(){
     if (!ctx.layerVersion.inCurrentPrj){
@@ -217,7 +212,6 @@ function layerDetailsPageInit (ctx) {
 
   });
 
-  targetTab.on('show.bs.tab', targetsTabShow);
 
   function machinesTabShow(){
     if (!ctx.layerVersion.inCurrentPrj) {
@@ -234,8 +228,6 @@ function layerDetailsPageInit (ctx) {
     window.location.hash = "machines";
   }
 
-  machineTab.on('show.bs.tab', machinesTabShow);
-
   $(".pagesize").change(function(){
     var search = libtoaster.parseUrlParams();
     search.limit = this.value;
@@ -425,9 +417,11 @@ function layerDetailsPageInit (ctx) {
   $(".commit").tooltip();
 
   editLayerSource.click(function() {
-    // Kindly bring the git layers imported from layerindex to normal page and not this new page :(
+    /* Kindly bring the git layers imported from layerindex to normal page
+     * and not this new page :(
+     */
     $(this).hide();
-    $("#save-changes-for-switch").attr("disabled", "disabled");
+    saveSourceChangesBtn.attr("disabled", "disabled");
 
     $("#git-repo-info", "#directory-info").hide();
     $("#edit-layer-source-form").fadeIn();
@@ -446,9 +440,9 @@ function layerDetailsPageInit (ctx) {
     if ($('input[name=source-location]:checked').val() == "repo") {
       $("#layer-git").fadeIn();
       $("#layer-dir").hide();
-        if ($("#layer-git-repo-url").val().length === 0 && $("#layer-git-ref").val().length === 0) {
-            $("#save-changes-for-switch").attr("disabled", "disabled");
-        }
+      if ($("#layer-git-repo-url").val().length === 0 && layerGitRefInput.val().length === 0) {
+        saveSourceChangesBtn.attr("disabled", "disabled");
+      }
     } else {
       $("#layer-dir").fadeIn();
       $("#layer-git").hide();
@@ -456,42 +450,40 @@ function layerDetailsPageInit (ctx) {
   });
 
   $("#layer-dir-path-in-details").keyup(function() {
-    $("#save-changes-for-switch").removeAttr("disabled");
+    saveSourceChangesBtn.removeAttr("disabled");
   });
 
   $("#layer-git-repo-url").keyup(function() {
-    if ($("#layer-git-repo-url").val().length > 0 && $("#layer-git-ref").val().length > 0) {
-      $("#save-changes-for-switch").removeAttr("disabled");
+    if ($("#layer-git-repo-url").val().length > 0 && layerGitRefInput.val().length > 0) {
+      saveSourceChangesBtn.removeAttr("disabled");
     }
   });
 
-  $("#layer-git-ref").keyup(function() {
-    if ($("#layer-git-repo-url").val().length > 0 && $("#layer-git-ref").val().length > 0) {
-      $("#save-changes-for-switch").removeAttr("disabled");
+  layerGitRefInput.keyup(function() {
+    if ($("#layer-git-repo-url").val().length > 0 && layerGitRefInput.val().length > 0) {
+      saveSourceChangesBtn.removeAttr("disabled");
     }
   });
 
-  $('#cancel-changes-for-switch').click(function() {
-    editLayerSource.show();
-    $("#git-repo-info", "#directory-info").fadeIn();
-    $("#edit-layer-source-form").fadeOut();
 
-    if ($("#layer-dir-path-in-details").val().length) {
-      $("#dir").prop("checked", true);
-      $("#layer-git").fadeOut();
-      $("#layer-dir").fadeIn();
-    } else {
-      $("#layer-git").fadeIn();
-      $("#layer-dir").fadeOut();
+  layerSubDirInput.keyup(function(){
+    if ($(this).val().length > 0){
+      saveSourceChangesBtn.removeAttr("disabled");
     }
   });
 
-  $('#save-changes-for-switch').click(function() {
+  $('#cancel-changes-for-switch').click(function() {
+    $("#edit-layer-source-form").add("#layer-git").add("#layer-dir").fadeOut().promise().done(function(){
+      editLayerSource.show();
+    });
+  });
+
+  saveSourceChangesBtn.click(function() {
 
     var layerData = {
       vcs_url: $('#layer-git-repo-url').val(),
-      commit: $('#layer-git-ref').val(),
-      dirpath: $('#layer-subdir').val(),
+      commit: layerGitRefInput.val(),
+      dirpath: layerSubDirInput.val(),
       local_source_dir: $('#layer-dir-path-in-details').val(),
     };