bitbake: toaster: Add recipe details page

This page provides the details of recipes, showing their packages and
additional metadata. It also allows you to build the recipe or customise
the recipe if it is an image recipe.

[YOCTO #8070]

(Bitbake rev: b6023619397f679791b7eff1faac06f4246133ce)

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>
This commit is contained in:
Michael Wood 2015-11-04 15:46:24 +00:00 committed by Richard Purdie
parent 5f52614a87
commit ce7289613b
2 changed files with 232 additions and 0 deletions

View File

@ -0,0 +1,52 @@
"use strict";
function recipeDetailsPageInit(ctx){
$(".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');
});
$("#add-layer-btn").click(function(){
var btn = $(this);
libtoaster.addRmLayer(ctx.recipe.layer_version,
true,
function (layersList){
var msg = libtoaster.makeLayerAddRmAlertMsg(ctx.recipe.layer_version,
layersList,
true);
libtoaster.showChangeNotification(msg);
var toShow = $("#customise-build-btns");
/* If we have no packages built yet also fade in the build packages
* hint message
*/
if (ctx.recipe.totalPackages === 0){
toShow = toShow.add("#build-to-get-packages-msg");
}
$("#packages-alert").add(btn).fadeOut(function(){
toShow.fadeIn();
});
});
});
/* Trigger a build of your custom image */
$(".build-recipe-btn").click(function(){
libtoaster.startABuild(libtoaster.ctx.projectBuildsUrl,
libtoaster.ctx.projectId,
ctx.recipe.name,
function(){
window.location.replace(libtoaster.ctx.projectBuildsUrl);
});
});
}

View File

@ -0,0 +1,180 @@
{% extends "base.html" %}
{% load projecttags %}
{% load humanize %}
{% load static %}
{% block pagecontent %}
<div class="section">
<ul class="breadcrumb">
<li class="muted">
{{project.name}}
</li>
<li>
<a href="{% url 'project' project.id %}">Configuration</a>
<span class="divider">&rarr;</span>
</li>
<li>
{% if recipe.is_image %}
<a href="{% url 'projectimagerecipes' project.id %}">Image recipes</a>
{% else %}
<a href="{% url 'projectsoftwarerecipes' project.id %}">Software recipes</a>
{% endif %}
<span class="divider">&rarr;</span>
</li>
<li class="active">
{{recipe.name}} ({{recipe.layer_version.layer.name}})
</li>
</ul>
</div>
<script src="{% static 'js/recipedetails.js' %}"></script>
<script>
$(document).ready(function (){
var ctx = {
recipe : {
id: {{recipe.pk}},
name: "{{recipe.name}}",
totalPackages: {{packages.count}},
layer_version : {
id: {{recipe.layer_version.pk}},
name: "{{recipe.layer_version.layer.name}}",
layerdetailurl: "{% url 'layerdetails' project.pk recipe.layer_version.pk %}"
}
}
};
try {
recipeDetailsPageInit(ctx);
} catch (e) {
document.write("Sorry, An error has occurred loading this page");
console.warn(e);
}
});
</script>
{% include 'newcustomimage_modal.html' %}
<div class="row-fluid span11">
<div class="alert alert-success lead" id="image-created-notification" style="margin-top: 15px; display: none">
<button type="button" data-dismiss="alert" class="close">x</button>
Your custom image <strong>{{recipe.name}}</strong> has been created. You can now add or remove packages as needed.
</div>
<div class="page-header air">
<h1>
{{recipe.name}}
<small>({{recipe.layer_version.layer.name}})</small>
</h1>
</div>
</div>
<div class="row-fluid span11">
<div class="span8">
<div class="button-place btn-group" id="customise-build-btns"
style="width: 100%;
{% if not in_project %}
display:none;
{% endif %}">
<button class="btn btn-large span6 build-recipe-btn" style="width: 50%">
Build {{recipe.name}}
</button>
{% if recipe.is_image %}
<button class="btn btn-large span6 customise-btn" data-recipe="{{recipe.pk}}" style="width: 50%">
Customise {{recipe.name}}
</button>
{% endif %}
</div>
<div class="button-place">
<button class="btn btn-block btn-large" id="add-layer-btn"
style="width:100%;
{% if in_project %}
display:none;
{% endif %}">
<i class="icon-plus"></i>
Add the {{recipe.layer_version.layer.name}} layer to your project to build or customise this image recipe
</button>
</div>
<div id="packages-table">
{% if packages.count %}
{% url 'recipepackages' project.id recipe.id as xhr_table_url %}
<h2>{{title}} (<span class="table-count-{{table_name}}">0</span>) </h2>
{% include "toastertable.html" %}
{% else %}
<h2>{{title}}</h2>
{% endif %}
<div class="alert alert-info air" id="build-to-get-packages-msg"
{# if there are packages and it's in the project don't show this msg #}
{% if packages.count or not packages.count and not in_project %}
style="display:none"
{% endif %} >
<p class="lead">Toaster has no package information for {{recipe.name}}. To generate package information, build {{recipe.name}}</p>
<button class="btn btn-info btn-large build-recipe-btn" style="margin:20px 0 10px 0;">Build {{recipe.name}}</button>
</div>
<div class="alert alert-info air" id="packages-alert"
{% if packages.count or in_project %}
style="display:none"
{% endif %}
>
<p class="lead">Toaster has no package information for {{recipe.name}}
</p>
</div>
</div>
</div>
<div class="span4 well">
<h2 style="margin-bottom:20px;">About {{recipe.name}}</h2>
<dl>
<dt>
Approx. packages included
<i class="icon-question-sign get-help" title="" data-original-title="The number of packages included is based on information from previous builds and from parsing layers, so we can never be sure it is 100% accurate"></i>
</dt>
<dd class="no-packages">{{packages.count}}</dd>
<dt>
Approx. package size
<i class="icon-question-sign get-help" title="" data-original-title="Package size is based on information from previous builds, so we can never be sure it is 100% accurate"></i>
</dt>
<dd>{{approx_pkg_size.size__sum|filtered_filesizeformat}}</dd>
{% if last_build %}
<dt>Last build</dt>
<dd>
<i class="icon-ok-sign success"></i>
<a href="{% url 'projectbuilds' project.id%}">{{last_build.completed_on|date:"d/m/y H:i"}}</a>
</dd>
{% endif %}
<dt>Recipe file</dt>
<dd>
<code>{{recipe.file_path|cut_path_prefix:recipe.layer_version.local_path}}</code>
<a href="{{recipe.get_vcs_recipe_file_link_url}}"><i class="icon-share" title="" data-original-title="View recipe file"></i></a>
</dd>
<dt>Layer</dt>
<dd><a href="{% url 'layerdetails' project.id recipe.layer_version.pk %}">{{recipe.layer_version.layer.name}}</a></dd>
<dt>
Summary
</dt>
<dd>
{{recipe.summary}}
</dd>
<dt>
Description
</dt>
<dd>
{{recipe.description}}
</dd>
<dt>Version</dt>
<dd>
{{recipe.version}}
</dd>
<dt>Section</dt>
<dd>
{{recipe.section}}
</dd>
<dt>License</dt>
<dd>
{{recipe.license}}
</dd>
</dl>
</div>
</div>
{% endblock %}