From 543586462b66434741f47f2884b4ccdeda5397b5 Mon Sep 17 00:00:00 2001 From: Michael Wood Date: Mon, 28 Sep 2015 21:45:24 -0700 Subject: [PATCH] toaster: Add Image customisation frontend feature Add the Image customisation front end feature to Toaster. Caveat - This feature is currently in development and should not be enabled by default. Signed-off-by: Michael Wood Signed-off-by: brian avery Signed-off-by: Richard Purdie --- .../toastergui/static/js/customrecipe.js | 50 ++++++ lib/toaster/toastergui/static/js/layerBtn.js | 13 ++ .../toastergui/static/js/newcustomimage.js | 49 ++++++ .../toastergui/templates/baseprojectpage.html | 7 +- .../toastergui/templates/customise_btn.html | 9 ++ .../toastergui/templates/customrecipe.html | 142 ++++++++++++++++++ .../toastergui/templates/newcustomimage.html | 54 +++++++ .../toastergui/templates/pkg_add_rm_btn.html | 16 ++ lib/toaster/toastergui/templates/project.html | 2 +- .../toastergui/templates/projecttopbar.html | 9 +- lib/toaster/toastergui/urls.py | 17 ++- lib/toaster/toastergui/views.py | 9 ++ 12 files changed, 368 insertions(+), 9 deletions(-) create mode 100644 lib/toaster/toastergui/static/js/customrecipe.js create mode 100644 lib/toaster/toastergui/static/js/newcustomimage.js create mode 100644 lib/toaster/toastergui/templates/customise_btn.html create mode 100644 lib/toaster/toastergui/templates/customrecipe.html create mode 100644 lib/toaster/toastergui/templates/newcustomimage.html create mode 100644 lib/toaster/toastergui/templates/pkg_add_rm_btn.html diff --git a/lib/toaster/toastergui/static/js/customrecipe.js b/lib/toaster/toastergui/static/js/customrecipe.js new file mode 100644 index 00000000000..4f6b304dd62 --- /dev/null +++ b/lib/toaster/toastergui/static/js/customrecipe.js @@ -0,0 +1,50 @@ +"use strict"; + +function customRecipePageInit(ctx) { + + var urlParams = libtoaster.parseUrlParams(); + + (function notificationRequest(){ + if (urlParams.hasOwnProperty('notify') && urlParams.notify === 'new'){ + $("#image-created-notification").show(); + } + })(); + + $("#recipeselection").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(); + addRemovePackage($(this), tableParams); + }); + }); + + function addRemovePackage(pkgBtn, tableParams){ + var pkgBtnData = pkgBtn.data(); + var method; + var buttonToShow; + + if (pkgBtnData.directive == 'add') { + method = 'PUT'; + buttonToShow = '#package-rm-btn-' + pkgBtnData.package; + } else if (pkgBtnData.directive == 'remove') { + method = 'DELETE'; + buttonToShow = '#package-add-btn-' + pkgBtnData.package; + } else { + throw("Unknown package directive: should be add or remove"); + } + + $.ajax({ + type: method, + url: pkgBtnData.packageUrl, + headers: { 'X-CSRFToken' : $.cookie('csrftoken')}, + success: function(data){ + /* Invalidate the Add | Rm package table's current cache */ + tableParams.nocache = true; + $.get(ctx.tableApiUrl, tableParams); + /* Swap the buttons around */ + pkgBtn.hide(); + $(buttonToShow).show(); + } + }); + } +} diff --git a/lib/toaster/toastergui/static/js/layerBtn.js b/lib/toaster/toastergui/static/js/layerBtn.js index a0509f9aa36..da0241c62b1 100644 --- a/lib/toaster/toastergui/static/js/layerBtn.js +++ b/lib/toaster/toastergui/static/js/layerBtn.js @@ -68,6 +68,19 @@ function layerBtnsInit(ctx) { }); }); + + $(".customise-btn").unbind('click'); + $(".customise-btn").click(function(e){ + e.preventDefault(); + var imgCustomModal = $("#new-custom-image-modal"); + + if (imgCustomModal.length == 0) + throw("Modal new-custom-image not found"); + + imgCustomModal.data('recipe', $(this).data('recipe')); + imgCustomModal.modal('show'); + }); + /* Setup the initial state of the buttons */ for (var i in ctx.projectLayers){ diff --git a/lib/toaster/toastergui/static/js/newcustomimage.js b/lib/toaster/toastergui/static/js/newcustomimage.js new file mode 100644 index 00000000000..935b21ede84 --- /dev/null +++ b/lib/toaster/toastergui/static/js/newcustomimage.js @@ -0,0 +1,49 @@ +"use strict"; + +function newCustomImagePageInit(ctx){ + + var newCustomImgBtn = $("#create-new-custom-image-btn"); + var imgCustomModal = $("#new-custom-image-modal"); + + newCustomImgBtn.click(function(e){ + e.preventDefault(); + + var name = imgCustomModal.find('input').val(); + var baseRecipeId = imgCustomModal.data('recipe'); + + if (name.length > 0) { + createCustomRecipe(name, baseRecipeId); + imgCustomModal.modal('hide'); + } else { + console.warn("TODO No name supplied"); + } + }); + + function createCustomRecipe(name, baseRecipeId){ + var data = { + 'name' : name, + 'project' : libtoaster.ctx.projectId, + 'base' : baseRecipeId, + }; + + $.ajax({ + type: "POST", + url: ctx.xhrCustomRecipeUrl, + data: data, + headers: { 'X-CSRFToken' : $.cookie('csrftoken')}, + success: function (ret) { + if (ret.error !== "ok") { + console.warn(ret.error); + } else { + window.location.replace(ret.url + '?notify=new'); + } + }, + error: function (ret) { + console.warn("Call failed"); + console.warn(ret); + } + }); + } + + +} diff --git a/lib/toaster/toastergui/templates/baseprojectpage.html b/lib/toaster/toastergui/templates/baseprojectpage.html index 668e0bf5ef5..88bf8599e4b 100644 --- a/lib/toaster/toastergui/templates/baseprojectpage.html +++ b/lib/toaster/toastergui/templates/baseprojectpage.html @@ -23,8 +23,11 @@
  • Configuration
  • Compatible metadata
    • - -
  • Recipes
    • + {% if CUSTOM_IMAGE %} +
  • Custom images
    • + {% endif %} +
  • Image recipes
    • +
  • Software recipes
  • Machines
  • Layers
  • Extra configuration
    • diff --git a/lib/toaster/toastergui/templates/customise_btn.html b/lib/toaster/toastergui/templates/customise_btn.html new file mode 100644 index 00000000000..54d05f9ea6d --- /dev/null +++ b/lib/toaster/toastergui/templates/customise_btn.html @@ -0,0 +1,9 @@ + + + + diff --git a/lib/toaster/toastergui/templates/customrecipe.html b/lib/toaster/toastergui/templates/customrecipe.html new file mode 100644 index 00000000000..823bbd8a1e6 --- /dev/null +++ b/lib/toaster/toastergui/templates/customrecipe.html @@ -0,0 +1,142 @@ +{% extends "base.html" %} +{% load projecttags %} +{% load humanize %} +{% load static %} +{% block pagecontent %} + +{% include "projecttopbar.html" %} + + + + +
    + +
    +

    + {{recipe.name}} + ({{recipe.base_recipe.name}}) +

    +
    +
    + +
    +
    +
    + + Build {{recipe.name}} + + +
    + +
    + {% url 'recipeselectpackages' project.id recipe.id as xhr_table_url %} + {% with 'recipeselection' as table_name %} + {% with 'Add | Remove packages' as title %} + +

    {{title}} ()

    + + {% include "toastertable.html" %} + {% endwith %} + {% endwith %} +
    +
    +
    +

    About {{recipe.name}}

    + +
    +
    + Approx. packages included + +
    +
    {{recipe.packages.count}}
    + +
    Layer
    + +
    {{recipe.base_recipe.layer_version.layer.name}}
    + +
    + + Delete custom image +
    +
    + + {% endblock %} diff --git a/lib/toaster/toastergui/templates/newcustomimage.html b/lib/toaster/toastergui/templates/newcustomimage.html new file mode 100644 index 00000000000..4487b3ea081 --- /dev/null +++ b/lib/toaster/toastergui/templates/newcustomimage.html @@ -0,0 +1,54 @@ +{% extends "base.html" %} +{% load projecttags %} +{% load humanize %} +{% load static %} +{% block pagecontent %} + + + + + + + +{% include "projecttopbar.html" %} + + +{% url table_name project.id as xhr_table_url %} +{% include "toastertable.html" %} + + + +{% endblock %} + + diff --git a/lib/toaster/toastergui/templates/pkg_add_rm_btn.html b/lib/toaster/toastergui/templates/pkg_add_rm_btn.html new file mode 100644 index 00000000000..b766aeac93c --- /dev/null +++ b/lib/toaster/toastergui/templates/pkg_add_rm_btn.html @@ -0,0 +1,16 @@ + diff --git a/lib/toaster/toastergui/templates/project.html b/lib/toaster/toastergui/templates/project.html index e8354fd6783..2f978bc7153 100644 --- a/lib/toaster/toastergui/templates/project.html +++ b/lib/toaster/toastergui/templates/project.html @@ -67,7 +67,7 @@
      diff --git a/lib/toaster/toastergui/templates/projecttopbar.html b/lib/toaster/toastergui/templates/projecttopbar.html index ca2741daf96..a3d1b88edf4 100644 --- a/lib/toaster/toastergui/templates/projecttopbar.html +++ b/lib/toaster/toastergui/templates/projecttopbar.html @@ -1,6 +1,6 @@ @@ -34,6 +34,13 @@ Import layer + {% if CUSTOM_IMAGE %} +
    • + + New custom image + +
      • + {% endif %}
    • diff --git a/lib/toaster/toastergui/urls.py b/lib/toaster/toastergui/urls.py index b47a161687b..a1adbb7be02 100644 --- a/lib/toaster/toastergui/urls.py +++ b/lib/toaster/toastergui/urls.py @@ -103,16 +103,13 @@ urlpatterns = patterns('toastergui.views', tables.NewCustomImagesTable.as_view(template_name="newcustomimage.html"), name="newcustomimage"), - url(r'^project/(?P\d+)/availablerecipes/$', - tables.ProjectLayersRecipesTable.as_view(template_name="generic-toastertable-page.html"), - { 'table_name': tables.ProjectLayersRecipesTable.__name__.lower(), - 'title' : 'Recipes available for layers in the current project' }, - name="projectavailabletargets"), url(r'^project/(?P\d+)/layers/$', tables.LayersTable.as_view(template_name="generic-toastertable-page.html"), name="projectlayers"), + + url(r'^project/(?P\d+)/layer/(?P\d+)$', 'layerdetails', name='layerdetails'), @@ -129,6 +126,16 @@ urlpatterns = patterns('toastergui.views', name=tables.LayerMachinesTable.__name__.lower()), + url(r'^project/(?P\d+)/customrecipe/(?P\d+)/selectpackages/$', + tables.SelectPackagesTable.as_view(template_name="generic-toastertable-page.html"), name="recipeselectpackages"), + + + url(r'^project/(?P\d+)/customrecipe/(?P\d+)$', + 'customrecipe', + name="customrecipe"), + + + # typeahead api end points url(r'^xhr_typeahead/(?P\d+)/layers$', typeaheads.LayersTypeAhead.as_view(), name='xhr_layerstypeahead'), diff --git a/lib/toaster/toastergui/views.py b/lib/toaster/toastergui/views.py index 392e56da2a2..b7eddf411d1 100755 --- a/lib/toaster/toastergui/views.py +++ b/lib/toaster/toastergui/views.py @@ -2790,6 +2790,15 @@ if True: return(vars_managed,sorted(vars_fstypes),vars_blacklist) + def customrecipe(request, pid, recipe_id): + project = Project.objects.get(pk=pid) + context = {'project' : project, + 'projectlayers': [], + 'recipe' : CustomImageRecipe.objects.get(pk=recipe_id) + } + + return render(request, "customrecipe.html", context) + @_template_renderer("projectconf.html") def projectconf(request, pid): -- 2.47.3