bitbake: toaster: Continue front end features to custom image recipe page.

Continuation of the work on the custom image recipe page, this brings
in:

- Basic notification of having added/removed a package.
- Connect up Build button
- Download recipe feature
- No packages states
- Project bread crumb
- Display additional recipe metadata
- Update accessors for recipe object inheritance changes

[YOCTO #8082]

(Bitbake rev: a656756a9255ec5882686ce9563d17f2eb3136e3)

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>

bitbake/lib/toaster/toastergui/static/js/customrecipe.js

@@ -3,6 +3,7 @@
 function customRecipePageInit(ctx) {
 
   var urlParams = libtoaster.parseUrlParams();
+  var customiseTable = $("#selectpackagestable");
 
   (function notificationRequest(){
     if (urlParams.hasOwnProperty('notify') && urlParams.notify === 'new'){
@@ -10,7 +11,7 @@ function customRecipePageInit(ctx) {
     }
   })();
 
-  $("#recipeselection").on('table-done', function(e, total, tableParams){
+  customiseTable.on('table-done', function(e, total, tableParams){
     /* Table is done so now setup the click handler for the package buttons */
     $(".add-rm-package-btn").click(function(e){
       e.preventDefault();
@@ -21,30 +22,45 @@ function customRecipePageInit(ctx) {
   function addRemovePackage(pkgBtn, tableParams){
     var pkgBtnData = pkgBtn.data();
     var method;
-    var buttonToShow;
+    var msg = "You have ";
 
     if (pkgBtnData.directive == 'add') {
       method = 'PUT';
-      buttonToShow = '#package-rm-btn-' + pkgBtnData.package;
+      msg += "added 1 package to "+ctx.recipe.name+":";
     } else if (pkgBtnData.directive == 'remove') {
       method = 'DELETE';
-      buttonToShow = '#package-add-btn-' + pkgBtnData.package;
+      msg += "removed 1 package from "+ctx.recipe.name+":";
     } else {
       throw("Unknown package directive: should be add or remove");
     }
 
+    msg += ' <strong>' + pkgBtnData.name + '<strong>';
+
     $.ajax({
         type: method,
         url: pkgBtnData.packageUrl,
         headers: { 'X-CSRFToken' : $.cookie('csrftoken')},
         success: function(data){
-          /* Invalidate the Add | Rm package table's current cache */
+          if (data.error !== 'ok'){
+            console.warn(data.error);
+            return;
+          }
+          /* Reload and Invalidate the Add | Rm package table's current data */
           tableParams.nocache = true;
-          $.get(ctx.tableApiUrl, tableParams);
-          /* Swap the buttons around */
-          pkgBtn.hide();
-          $(buttonToShow).show();
+          customiseTable.trigger('reload', [tableParams]);
+
+          libtoaster.showChangeNotification(msg);
         }
     });
   }
+
+  /* Trigger a build of your custom image */
+  $(".build-custom-image").click(function(){
+    libtoaster.startABuild(libtoaster.ctx.projectBuildsUrl,
+      libtoaster.ctx.projectId,
+      ctx.recipe.name,
+      function(){
+        window.location.replace(libtoaster.ctx.projectBuildsUrl);
+    });
+  });
 }