Propagate API changes + improve semantics before actually working on app categories implementation

This commit is contained in:
Alexandre Aubin 2019-11-25 23:28:00 +01:00
parent 95f8503e6d
commit 749aba93fe
5 changed files with 86 additions and 89 deletions

View file

@ -10,7 +10,7 @@
// List installed apps // List installed apps
app.get('#/apps', function (c) { app.get('#/apps', function (c) {
c.api('GET', '/apps?installed', {}, function(data) { c.api('GET', '/apps?full', {}, function(data) {
var apps = data['apps']; var apps = data['apps'];
c.arraySortById(apps); c.arraySortById(apps);
c.view('app/app_list', {apps: apps}); c.view('app/app_list', {apps: apps});
@ -107,101 +107,98 @@
} }
} }
// List available apps // Display app catalog
app.get('#/apps/install', function (c) { app.get('#/apps/catalog', function (c) {
c.api('GET', '/apps', {}, function (data) { c.api('GET', '/appscatalog?full&with_categories', {}, function (data) {
c.api('GET', '/apps?raw', {}, function (dataraw) { var apps = []
var apps = [] $.each(data['apps'], function(name, app) {
$.each(data['apps'], function(k, v) {
app = dataraw[v['id']];
app.level = parseInt(app.level);
if (app.high_quality && app.level > 7) // Ignore not working apps
{ if (app.state === 'notworking') { return; }
app.state = "high-quality";
}
if ( app.maintained === false )
{
app.maintained = "orphaned";
}
else if ( app.maintained === true )
{
app.maintained = "maintained";
}
app.manifest.maintainer = extractMaintainer(app.manifest); app.id = app.manifest.id;
var isWorking = (app.state === 'working' || app.state === "high-quality") && app.level > 0; app.level = parseInt(app.level);
// Keep only the first instance of each app and remove not working apps if (app.high_quality && app.level > 7)
if (!v['id'].match(/__[0-9]{1,5}$/) && (app.state !== 'notworking')) { {
app.state = "high-quality";
}
if ( app.maintained === false )
{
app.maintained = "orphaned";
}
else if ( app.maintained === true )
{
app.maintained = "maintained";
}
app.installable = (!v.installed || app.manifest.multi_instance) app.manifest.maintainer = extractMaintainer(app.manifest);
app.levelFormatted = isNaN(app.level) ? '?' : app.level; var isWorking = (app.state === 'working' || app.state === "high-quality") && app.level > 0;
app.levelColor = levelToColor(app.level); app.installable = (!app.installed || app.manifest.supports_multi_instance)
app.stateColor = stateToColor(app.state); app.levelFormatted = isNaN(app.level) ? '?' : app.level;
app.maintainedColor = maintainedStateToColor(app.maintained);
app.installColor = combineColors(app.stateColor, app.levelColor);
app.updateDate = app.lastUpdate * 1000 || 0; app.levelColor = levelToColor(app.level);
app.isSafe = (app.installColor !== 'danger'); app.stateColor = stateToColor(app.state);
app.isWorking = isWorking ? "isworking" : "notFullyWorking"; app.maintainedColor = maintainedStateToColor(app.maintained);
app.isHighQuality = (app.state === "high-quality") ? "isHighQuality" : ""; app.installColor = combineColors(app.stateColor, app.levelColor);
app.decentQuality = (app.level > 4)?"decentQuality":"badQuality";
jQuery.extend(app, v); app.updateDate = app.lastUpdate * 1000 || 0;
apps.push(app); app.isSafe = (app.installColor !== 'danger');
} app.isWorking = isWorking ? "isworking" : "notFullyWorking";
app.isHighQuality = (app.state === "high-quality") ? "isHighQuality" : "";
app.decentQuality = (app.level > 4)?"decentQuality":"badQuality";
apps.push(app);
});
// Sort app list
c.arraySortById(apps);
// setup filtering of apps once the view is loaded
function setupFilterEvents () {
// Uses plugin isotope to filter apps (we could had ordering to)
var cardGrid = jQuery('.grid').isotope({
itemSelector: '.app-card',
layoutMode: 'fitRows',
transitionDuration: 200
}); });
// Sort app list filterByClassAndName = function () {
c.arraySortById(apps); var input = jQuery("#filter-app-cards").val().toLowerCase();
var inputMatch = (jQuery(this).find('.app-title').text().toLowerCase().indexOf(input) > -1);
// setup filtering of apps once the view is loaded var filterClass = jQuery("#dropdownFilter").attr("data-filter");
function setupFilterEvents () { var classMatch = (filterClass === '*') ? true : jQuery(this).hasClass(filterClass);
// Uses plugin isotope to filter apps (we could had ordering to) return inputMatch && classMatch;
var cardGrid = jQuery('.grid').isotope({ },
itemSelector: '.app-card',
layoutMode: 'fitRows',
transitionDuration: 200
});
filterByClassAndName = function () { // Default filter is 'decent quality apps'
var input = jQuery("#filter-app-cards").val().toLowerCase(); cardGrid.isotope({ filter: '.decentQuality' });
var inputMatch = (jQuery(this).find('.app-title').text().toLowerCase().indexOf(input) > -1);
var filterClass = jQuery("#dropdownFilter").attr("data-filter"); jQuery('.dropdownFilter').on('click', function() {
var classMatch = (filterClass === '*') ? true : jQuery(this).hasClass(filterClass); // change dropdown label
return inputMatch && classMatch; jQuery('#app-cards-list-filter-text').text(jQuery(this).find('.menu-item').text());
}, // change filter attribute
jQuery('#dropdownFilter').attr("data-filter", jQuery(this).attr("data-filter"));
// filter !
cardGrid.isotope({ filter: filterByClassAndName });
});
// Default filter is 'decent quality apps' jQuery("#filter-app-cards").on("keyup", function() {
cardGrid.isotope({ filter: '.decentQuality' }); cardGrid.isotope({ filter: filterByClassAndName });
});
};
jQuery('.dropdownFilter').on('click', function() { // render
// change dropdown label c.view('app/app_catalog', {apps: apps}, setupFilterEvents);
jQuery('#app-cards-list-filter-text').text(jQuery(this).find('.menu-item').text());
// change filter attribute
jQuery('#dropdownFilter').attr("data-filter", jQuery(this).attr("data-filter"));
// filter !
cardGrid.isotope({ filter: filterByClassAndName });
});
jQuery("#filter-app-cards").on("keyup", function() {
cardGrid.isotope({ filter: filterByClassAndName });
});
};
// render
c.view('app/app_list_install', {apps: apps}, setupFilterEvents);
});
}); });
}); });
// Get app information // Get app information
app.get('#/apps/:app', function (c) { app.get('#/apps/:app', function (c) {
c.api('GET', '/apps/'+c.params['app']+'?raw', {}, function(data) { c.api('GET', '/apps/'+c.params['app']+'?full', {}, function(data) {
c.api('GET', '/users/permissions', {}, function(data_permissions) { c.api('GET', '/users/permissions', {}, function(data_permissions) {
// Permissions // Permissions
@ -506,9 +503,9 @@
// App installation form // App installation form
app.get('#/apps/install/:app', function (c) { app.get('#/apps/install/:app', function (c) {
c.api('GET', '/apps?raw', {}, function(data) { c.api('GET', '/appscatalog?full', {}, function(data) {
var app_name = c.params["app"]; var app_name = c.params["app"];
var app_infos = data[app_name]; var app_infos = data["apps"][app_name];
if (app_infos['state'] === "validated") if (app_infos['state'] === "validated")
{ {
app_infos['state'] = "official"; app_infos['state'] = "official";
@ -535,7 +532,7 @@
{ {
c.appInstallForm( c.appInstallForm(
c.params['app'], c.params['app'],
data[c.params['app']].manifest, app_infos.manifest,
c.params c.params
); );
} }
@ -622,7 +619,7 @@
// Get app change label page // Get app change label page
app.get('#/apps/:app/changelabel', function (c) { app.get('#/apps/:app/changelabel', function (c) {
c.api('GET', '/apps/'+c.params['app']+'?raw', {}, function(app_data) { c.api('GET', '/apps/'+c.params['app']+'?full', {}, function(app_data) {
data = { data = {
id: c.params['app'], id: c.params['app'],
label: app_data.settings.label, label: app_data.settings.label,
@ -641,7 +638,7 @@
// Get app change URL page // Get app change URL page
app.get('#/apps/:app/changeurl', function (c) { app.get('#/apps/:app/changeurl', function (c) {
c.api('GET', '/apps/'+c.params['app']+'?raw', {}, function(app_data) { c.api('GET', '/apps/'+c.params['app']+'?full', {}, function(app_data) {
c.api('GET', '/domains', {}, function(domain_data) { c.api('GET', '/domains', {}, function(domain_data) {
// Display a list of available domains // Display a list of available domains

View file

@ -28,13 +28,13 @@
{{#apps}} {{#apps}}
<div class="app-card panel panel-default {{status}} {{state}} {{isWorking}} {{isHighQuality}} {{decentQuality}} {{level}}-level"> <div class="app-card panel panel-default {{status}} {{state}} {{isWorking}} {{isHighQuality}} {{decentQuality}} {{level}}-level">
<div class="panel-body"> <div class="panel-body">
<h2 class="app-title">{{name}}</h2> <h2 class="app-title">{{manifest.name}}</h2>
<div class="category"> <div class="category">
<span class="label label-{{stateColor}} label-as-badge app-state" title="{{t (concat 'app_state_' state '_explanation') }}">{{t (concat 'app_state_' state) }}</span> <span class="label label-{{stateColor}} label-as-badge app-state" title="{{t (concat 'app_state_' state '_explanation') }}">{{t (concat 'app_state_' state) }}</span>
<a target="_BLANK" href="https://yunohost.org/#/packaging_apps_levels"><span class="label label-{{levelColor}} label-as-badge app-level" title="{{t 'app_level'}}">{{t 'level'}} {{levelFormatted}}</span></a> <a target="_BLANK" href="https://yunohost.org/#/packaging_apps_levels"><span class="label label-{{levelColor}} label-as-badge app-level" title="{{t 'app_level'}}">{{t 'level'}} {{levelFormatted}}</span></a>
<span class="label label-{{maintainedColor}} label-as-badge maintained-status" title="{{t (concat maintained '_details') }}"> {{t maintained}}</span> <span class="label label-{{maintainedColor}} label-as-badge maintained-status" title="{{t (concat maintained '_details') }}"> {{t maintained}}</span>
</div> </div>
<div class="app-card-desc">{{description}}</div> <div class="app-card-desc">{{manifest.description}}</div>
</div> </div>
<div class="app-card-date-maintainer"> <div class="app-card-date-maintainer">
<i class="fa-refresh"></i> {{formatDate updateDate day="numeric" month="long" year="numeric"}} - <i class="fa-refresh"></i> {{formatDate updateDate day="numeric" month="long" year="numeric"}} -
@ -48,7 +48,7 @@
<i class="fa-book"></i> Readme <i class="fa-book"></i> Readme
</a> </a>
{{#installable}} {{#installable}}
<a href="#/apps/install/{{id}}" type="button" role="button" class="btn btn-{{installColor}} col-xs-4 active"> <a href="#/apps/install/{{manifest.id}}" type="button" role="button" class="btn btn-{{installColor}} col-xs-4 active">
<i class="fa-plus"></i> {{t 'install'}}{{^isSafe}} <i class="fa-warning"></i>{{/isSafe}} <i class="fa-plus"></i> {{t 'install'}}{{^isSafe}} <i class="fa-warning"></i>{{/isSafe}}
</a> </a>
{{/installable}} {{/installable}}

View file

@ -22,7 +22,7 @@
<dt>{{t 'version'}}</dt> <dt>{{t 'version'}}</dt>
<dd>{{version}}</dd> <dd>{{version}}</dd>
<dt>{{t 'multi_instance'}}</dt> <dt>{{t 'multi_instance'}}</dt>
<dd>{{manifest.multi_instance}}</dd> <dd>{{supports_multi_instance}}</dd>
<dt>{{t 'install_time'}}</dt> <dt>{{t 'install_time'}}</dt>
<dd>{{formatTime install_time day="numeric" month="long" year="numeric" hour="numeric" minute="numeric"}}</dd> <dd>{{formatTime install_time day="numeric" month="long" year="numeric" hour="numeric" minute="numeric"}}</dd>
{{#if settings.domain}} {{#if settings.domain}}
@ -64,7 +64,7 @@
<hr> <hr>
<div class="container"> <div class="container">
<p>{{t 'app_info_changeurl_desc' settings.domain}}</p> <p>{{t 'app_info_changeurl_desc' settings.domain}}</p>
{{#if change_url}} {{#if supports_change_url}}
<a href="#/apps/{{settings.id}}/changeurl" role="button" class="btn btn-info slide"> <a href="#/apps/{{settings.id}}/changeurl" role="button" class="btn btn-info slide">
<span class="fa-exchange"></span> {{t 'app_change_url'}} <span class="fa-exchange"></span> {{t 'app_change_url'}}
</a> </a>

View file

@ -18,7 +18,7 @@
<dt>{{t 'id'}}</dt> <dt>{{t 'id'}}</dt>
<dd>{{id}}</dd> <dd>{{id}}</dd>
<dt>{{t 'description'}}</dt> <dt>{{t 'description'}}</dt>
<dd>{{description}}</dd> <dd>{{manifest.description}}</dd>
{{#displayLicense}} {{#displayLicense}}
<dt>{{t 'license'}}</dt> <dt>{{t 'license'}}</dt>
<dd>{{manifest.license}}</dd> <dd>{{manifest.license}}</dd>

View file

@ -4,7 +4,7 @@
</div> </div>
<div class="actions-group"> <div class="actions-group">
<a role="button" href="#/apps/install" class="btn btn-success slide"> <a role="button" href="#/apps/catalog" class="btn btn-success slide">
<span class="fa-plus"></span> {{t 'install'}} <span class="fa-plus"></span> {{t 'install'}}
</a> </a>
</div> </div>
@ -16,7 +16,7 @@
<a href="#/apps/{{id}}" class="list-group-item slide" title="{{t 'infos'}}"> <a href="#/apps/{{id}}" class="list-group-item slide" title="{{t 'infos'}}">
<span class="fa-chevron-right pull-right"></span> <span class="fa-chevron-right pull-right"></span>
<h2 class="list-group-item-heading"> <h2 class="list-group-item-heading">
{{label}} <small>{{name}}</small> {{settings.label}} <small>{{name}}</small>
</h2> </h2>
<p class="list-group-item-text">{{description}}</p> <p class="list-group-item-text">{{description}}</p>
</a> </a>