Split package rendering into its own module
This commit is contained in:
parent
8465b620d1
commit
e0920f10c1
|
@ -11,6 +11,7 @@ set(JAVA_SCRIPT_FILES
|
||||||
static/js/buildactionspage.js
|
static/js/buildactionspage.js
|
||||||
static/js/customrendering.js
|
static/js/customrendering.js
|
||||||
static/js/genericrendering.js
|
static/js/genericrendering.js
|
||||||
|
static/js/packagerendering.js
|
||||||
static/js/globalstatuspage.js
|
static/js/globalstatuspage.js
|
||||||
static/js/log.js
|
static/js/log.js
|
||||||
static/js/packagedetailspage.js
|
static/js/packagedetailspage.js
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import * as AjaxHelper from './ajaxhelper.js';
|
import * as AjaxHelper from './ajaxhelper.js';
|
||||||
import * as CustomRendering from './customrendering.js';
|
import * as CustomRendering from './customrendering.js';
|
||||||
import * as GenericRendering from './genericrendering.js';
|
import * as GenericRendering from './genericrendering.js';
|
||||||
|
import * as PackageRendering from './packagerendering.js';
|
||||||
import * as SinglePageHelper from './singlepage.js';
|
import * as SinglePageHelper from './singlepage.js';
|
||||||
import * as Terminal from './terminal.js';
|
import * as Terminal from './terminal.js';
|
||||||
import * as Utils from './utils.js';
|
import * as Utils from './utils.js';
|
||||||
|
@ -622,7 +623,7 @@ function renderBuildActionDetailsTable(buildActionDetails)
|
||||||
displayLabels: ['Missing dependencies', 'Missing libraries'],
|
displayLabels: ['Missing dependencies', 'Missing libraries'],
|
||||||
fieldAccessors: ['deps', 'libs'],
|
fieldAccessors: ['deps', 'libs'],
|
||||||
customRenderer: {
|
customRenderer: {
|
||||||
deps: CustomRendering.renderDependency,
|
deps: PackageRendering.renderDependency,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
default:
|
default:
|
||||||
|
@ -781,7 +782,7 @@ function renderUpdateInfoWithCheckbox(id, packageName, newPackageName, versionIn
|
||||||
|
|
||||||
function renderPackageList(packageList)
|
function renderPackageList(packageList)
|
||||||
{
|
{
|
||||||
return GenericRendering.renderCustomList(packageList, CustomRendering.renderPackage);
|
return GenericRendering.renderCustomList(packageList, PackageRendering.renderPackage);
|
||||||
}
|
}
|
||||||
|
|
||||||
function renderBuildPreparationBuildData(buildDataForPackage)
|
function renderBuildPreparationBuildData(buildDataForPackage)
|
||||||
|
|
|
@ -1,36 +1,6 @@
|
||||||
import * as GenericRendering from './genericrendering.js';
|
import * as GenericRendering from './genericrendering.js';
|
||||||
import * as Utils from './utils.js';
|
import * as Utils from './utils.js';
|
||||||
|
|
||||||
/// \brief Renders a dependency object.
|
|
||||||
export function renderDependency(value)
|
|
||||||
{
|
|
||||||
if (value.length < 1) {
|
|
||||||
return GenericRendering.renderArrayAsCommaSeparatedString(value);
|
|
||||||
}
|
|
||||||
const list = document.createElement('ul');
|
|
||||||
list.className = 'dependency-list';
|
|
||||||
value.forEach(function (dependency) {
|
|
||||||
const item = document.createElement('li');
|
|
||||||
let res = dependency.name;
|
|
||||||
if (dependency.version) {
|
|
||||||
const modes = [undefined, undefined, '=', '>=', '<=', '>', '<'];
|
|
||||||
const mode = modes[dependency.mode];
|
|
||||||
if (mode !== undefined) {
|
|
||||||
res += mode + dependency.version;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
item.appendChild(document.createTextNode(res));
|
|
||||||
if (dependency.description) {
|
|
||||||
const descriptionSpan = document.createElement('span');
|
|
||||||
descriptionSpan.appendChild(document.createTextNode(' - ' + dependency.description));
|
|
||||||
descriptionSpan.style.fontStyle = 'italics';
|
|
||||||
item.appendChild(descriptionSpan);
|
|
||||||
}
|
|
||||||
list.appendChild(item);
|
|
||||||
});
|
|
||||||
return list;
|
|
||||||
}
|
|
||||||
|
|
||||||
/// \brief Renders a "Reload" button invoking the specified \a handler when clicked.
|
/// \brief Renders a "Reload" button invoking the specified \a handler when clicked.
|
||||||
export function renderReloadButton(handler)
|
export function renderReloadButton(handler)
|
||||||
{
|
{
|
||||||
|
@ -63,56 +33,3 @@ export function renderIconLink(value, row, handler, tooltip, href, middleClickHr
|
||||||
link.className = 'icon-link';
|
link.className = 'icon-link';
|
||||||
return link;
|
return link;
|
||||||
}
|
}
|
||||||
|
|
||||||
const labelsWithoutBasics = ['Architecture', 'Repository', 'Description', 'Upstream URL', 'License(s)', 'Groups', 'Package size', 'Installed size', 'Packager', 'Build date', 'Dependencies', 'Optional dependencies', 'Make dependencies', 'Check dependencies', 'Provides', 'Replaces', 'Conflicts', 'Contained libraries', 'Needed libraries', 'Files'];
|
|
||||||
const fieldsWithoutBasics = ['packageInfo.arch', 'db', 'description', 'upstreamUrl', 'licenses', 'groups', 'packageInfo.size', 'installInfo.installedSize', 'packageInfo.packager', 'packageInfo.buildDate', 'dependencies', 'optionalDependencies', 'sourceInfo.makeDependencies', 'sourceInfo.checkDependencies', 'provides', 'replaces', 'conflicts', 'libprovides', 'libdepends', 'packageInfo.files'];
|
|
||||||
const labelsWithBasics = ['Name', 'Version', ...labelsWithoutBasics];
|
|
||||||
const fieldsWithBasics = ['name', 'version', ...fieldsWithoutBasics];
|
|
||||||
|
|
||||||
export function renderPackage(packageObj, withoutBasics)
|
|
||||||
{
|
|
||||||
const pkgInfo = packageObj.pkg;
|
|
||||||
if (pkgInfo) {
|
|
||||||
pkgInfo.id = packageObj.id;
|
|
||||||
packageObj = pkgInfo;
|
|
||||||
}
|
|
||||||
const table = GenericRendering.renderTableFromJsonObject({
|
|
||||||
data: packageObj,
|
|
||||||
displayLabels: withoutBasics ? labelsWithoutBasics : labelsWithBasics,
|
|
||||||
fieldAccessors: withoutBasics ? fieldsWithoutBasics : fieldsWithBasics,
|
|
||||||
customRenderer: {
|
|
||||||
db: function(value, row) {
|
|
||||||
return document.createTextNode(Utils.makeRepoName(value, row.dbArch));
|
|
||||||
},
|
|
||||||
upstreamUrl: function(value, row) {
|
|
||||||
return GenericRendering.renderLink(value, row, function(value) {
|
|
||||||
window.open(value);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
licenses: GenericRendering.renderArrayAsCommaSeparatedString,
|
|
||||||
groups: GenericRendering.renderArrayAsCommaSeparatedString,
|
|
||||||
dependencies: renderDependency,
|
|
||||||
optionalDependencies: renderDependency,
|
|
||||||
provides: renderDependency,
|
|
||||||
replaces: renderDependency,
|
|
||||||
conflicts: renderDependency,
|
|
||||||
libprovides: GenericRendering.renderArrayAsCommaSeparatedString,
|
|
||||||
libdepends: GenericRendering.renderArrayAsCommaSeparatedString,
|
|
||||||
'sourceInfo.makeDependencies': renderDependency,
|
|
||||||
'sourceInfo.checkDependencies': renderDependency,
|
|
||||||
'packageInfo.arch': function(value, row) {
|
|
||||||
const sourceInfo = row.sourceInfo;
|
|
||||||
const sourceArchs = sourceInfo !== undefined ? sourceInfo.archs : undefined;
|
|
||||||
if (Array.isArray(sourceArchs) && sourceArchs.length) {
|
|
||||||
return GenericRendering.renderArrayAsCommaSeparatedString(sourceArchs);
|
|
||||||
} else {
|
|
||||||
return GenericRendering.renderNoneInGrey(value);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
'packageInfo.size': GenericRendering.renderDataSize,
|
|
||||||
'installInfo.installedSize': GenericRendering.renderDataSize,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
table.className = 'package-details-table';
|
|
||||||
return table;
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import * as AjaxHelper from './ajaxhelper.js';
|
import * as AjaxHelper from './ajaxhelper.js';
|
||||||
import * as CustomRendering from './customrendering.js';
|
import * as CustomRendering from './customrendering.js';
|
||||||
import * as GenericRendering from './genericrendering.js';
|
import * as GenericRendering from './genericrendering.js';
|
||||||
|
import * as PackageRendering from './packagerendering.js';
|
||||||
import * as SinglePageHelper from './singlepage.js';
|
import * as SinglePageHelper from './singlepage.js';
|
||||||
import * as Utils from './utils.js';
|
import * as Utils from './utils.js';
|
||||||
|
|
||||||
|
@ -24,51 +25,7 @@ export function initPackageDetails(sectionElement, sectionData, newPackages)
|
||||||
name: packageParts[1]
|
name: packageParts[1]
|
||||||
};
|
};
|
||||||
AjaxHelper.queryRoute('GET', '/packages?details=1&name=' + encodeURIComponent(packageStr), function(ajaxRequest) {
|
AjaxHelper.queryRoute('GET', '/packages?details=1&name=' + encodeURIComponent(packageStr), function(ajaxRequest) {
|
||||||
showPackageDetails(ajaxRequest, packageObj);
|
PackageRendering.showPackageDetails(ajaxRequest, packageObj);
|
||||||
}, 'package-details');
|
}, 'package-details');
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
function makePackageID(row)
|
|
||||||
{
|
|
||||||
return row.db + (row.dbArch ? '@' + row.dbArch : '') + '/' + row.name;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function queryPackageDetails(value, row)
|
|
||||||
{
|
|
||||||
AjaxHelper.queryRoute('GET', '/packages?details=1&name=' + encodeURIComponent(makePackageID(row)), function(ajaxRequest) {
|
|
||||||
showPackageDetails(ajaxRequest, row);
|
|
||||||
}, 'package-details');
|
|
||||||
}
|
|
||||||
|
|
||||||
function switchToPackageDetails(packageID)
|
|
||||||
{
|
|
||||||
SinglePageHelper.sections['package-details'].state.package = packageID;
|
|
||||||
SinglePageHelper.updateHashPreventingSectionInitializer('#package-details-section?' + encodeURIComponent(packageID));
|
|
||||||
}
|
|
||||||
|
|
||||||
function showPackageDetails(ajaxRequest, row)
|
|
||||||
{
|
|
||||||
const packageID = makePackageID(row);
|
|
||||||
const packageDetailsContainer = Utils.getAndEmptyElement('package-details-container');
|
|
||||||
if (ajaxRequest.status !== 200) {
|
|
||||||
packageDetailsContainer.appendChild(document.createTextNode('unable query package details: ' + ajaxRequest.responseText));
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const responseJson = JSON.parse(ajaxRequest.responseText);
|
|
||||||
if (!Array.isArray(responseJson) || responseJson.length !== 1) {
|
|
||||||
switchToPackageDetails(packageID);
|
|
||||||
packageDetailsContainer.appendChild(document.createTextNode('unable query package details: package not present'));
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const packageObj = responseJson[0];
|
|
||||||
const heading = document.createElement('h3');
|
|
||||||
heading.appendChild(document.createTextNode(packageObj.name));
|
|
||||||
heading.appendChild(document.createTextNode(' ' + packageObj.version));
|
|
||||||
packageDetailsContainer.appendChild(heading);
|
|
||||||
packageObj.db = row.db;
|
|
||||||
packageObj.dbArch = row.dbArch;
|
|
||||||
packageDetailsContainer.appendChild(CustomRendering.renderPackage(packageObj, true));
|
|
||||||
|
|
||||||
switchToPackageDetails(packageID);
|
|
||||||
}
|
|
||||||
|
|
|
@ -0,0 +1,139 @@
|
||||||
|
import * as AjaxHelper from './ajaxhelper.js';
|
||||||
|
import * as GenericRendering from './genericrendering.js';
|
||||||
|
import * as CustomRendering from './customrendering.js';
|
||||||
|
import * as SinglePageHelper from './singlepage.js';
|
||||||
|
import * as Utils from './utils.js';
|
||||||
|
|
||||||
|
/// \brief Renders a dependency object.
|
||||||
|
export function renderDependency(value)
|
||||||
|
{
|
||||||
|
if (value.length < 1) {
|
||||||
|
return GenericRendering.renderArrayAsCommaSeparatedString(value);
|
||||||
|
}
|
||||||
|
const list = document.createElement('ul');
|
||||||
|
list.className = 'dependency-list';
|
||||||
|
value.forEach(function (dependency) {
|
||||||
|
const item = document.createElement('li');
|
||||||
|
let res = dependency.name;
|
||||||
|
if (dependency.version) {
|
||||||
|
const modes = [undefined, undefined, '=', '>=', '<=', '>', '<'];
|
||||||
|
const mode = modes[dependency.mode];
|
||||||
|
if (mode !== undefined) {
|
||||||
|
res += mode + dependency.version;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
item.appendChild(document.createTextNode(res));
|
||||||
|
if (dependency.description) {
|
||||||
|
const descriptionSpan = document.createElement('span');
|
||||||
|
descriptionSpan.appendChild(document.createTextNode(' - ' + dependency.description));
|
||||||
|
descriptionSpan.style.fontStyle = 'italics';
|
||||||
|
item.appendChild(descriptionSpan);
|
||||||
|
}
|
||||||
|
list.appendChild(item);
|
||||||
|
});
|
||||||
|
return list;
|
||||||
|
}
|
||||||
|
|
||||||
|
const labelsWithoutBasics = ['Architecture', 'Repository', 'Description', 'Upstream URL', 'License(s)', 'Groups', 'Package size', 'Installed size', 'Packager', 'Build date', 'Dependencies', 'Optional dependencies', 'Make dependencies', 'Check dependencies', 'Provides', 'Replaces', 'Conflicts', 'Contained libraries', 'Needed libraries', 'Files'];
|
||||||
|
const fieldsWithoutBasics = ['packageInfo.arch', 'db', 'description', 'upstreamUrl', 'licenses', 'groups', 'packageInfo.size', 'installInfo.installedSize', 'packageInfo.packager', 'packageInfo.buildDate', 'dependencies', 'optionalDependencies', 'sourceInfo.makeDependencies', 'sourceInfo.checkDependencies', 'provides', 'replaces', 'conflicts', 'libprovides', 'libdepends', 'packageInfo.files'];
|
||||||
|
const labelsWithBasics = ['Name', 'Version', ...labelsWithoutBasics];
|
||||||
|
const fieldsWithBasics = ['name', 'version', ...fieldsWithoutBasics];
|
||||||
|
|
||||||
|
export function renderPackage(packageObj, withoutBasics)
|
||||||
|
{
|
||||||
|
const pkgInfo = packageObj.pkg;
|
||||||
|
if (pkgInfo) {
|
||||||
|
pkgInfo.id = packageObj.id;
|
||||||
|
packageObj = pkgInfo;
|
||||||
|
}
|
||||||
|
const table = GenericRendering.renderTableFromJsonObject({
|
||||||
|
data: packageObj,
|
||||||
|
displayLabels: withoutBasics ? labelsWithoutBasics : labelsWithBasics,
|
||||||
|
fieldAccessors: withoutBasics ? fieldsWithoutBasics : fieldsWithBasics,
|
||||||
|
customRenderer: {
|
||||||
|
db: function(value, row) {
|
||||||
|
return document.createTextNode(Utils.makeRepoName(value, row.dbArch));
|
||||||
|
},
|
||||||
|
upstreamUrl: function(value, row) {
|
||||||
|
return GenericRendering.renderLink(value, row, function(value) {
|
||||||
|
window.open(value);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
licenses: GenericRendering.renderArrayAsCommaSeparatedString,
|
||||||
|
groups: GenericRendering.renderArrayAsCommaSeparatedString,
|
||||||
|
dependencies: renderDependency,
|
||||||
|
optionalDependencies: renderDependency,
|
||||||
|
provides: renderDependency,
|
||||||
|
replaces: renderDependency,
|
||||||
|
conflicts: renderDependency,
|
||||||
|
libprovides: GenericRendering.renderArrayAsCommaSeparatedString,
|
||||||
|
libdepends: GenericRendering.renderArrayAsCommaSeparatedString,
|
||||||
|
'sourceInfo.makeDependencies': renderDependency,
|
||||||
|
'sourceInfo.checkDependencies': renderDependency,
|
||||||
|
'packageInfo.arch': function(value, row) {
|
||||||
|
const sourceInfo = row.sourceInfo;
|
||||||
|
const sourceArchs = sourceInfo !== undefined ? sourceInfo.archs : undefined;
|
||||||
|
if (Array.isArray(sourceArchs) && sourceArchs.length) {
|
||||||
|
return GenericRendering.renderArrayAsCommaSeparatedString(sourceArchs);
|
||||||
|
} else {
|
||||||
|
return GenericRendering.renderNoneInGrey(value);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'packageInfo.size': GenericRendering.renderDataSize,
|
||||||
|
'installInfo.installedSize': GenericRendering.renderDataSize,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
table.className = 'package-details-table';
|
||||||
|
return table;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function renderPackageDetailsLink(row)
|
||||||
|
{
|
||||||
|
return GenericRendering.renderLink(row.name, row, queryPackageDetails, 'Show package details', undefined,
|
||||||
|
'#package-details-section?' + encodeURIComponent(row.db + (row.dbArch ? '@' + row.dbArch : '') + '/' + row.name));
|
||||||
|
}
|
||||||
|
|
||||||
|
function makePackageID(row)
|
||||||
|
{
|
||||||
|
return row.db + (row.dbArch ? '@' + row.dbArch : '') + '/' + row.name;
|
||||||
|
}
|
||||||
|
|
||||||
|
function queryPackageDetails(value, row)
|
||||||
|
{
|
||||||
|
AjaxHelper.queryRoute('GET', '/packages?details=1&name=' + encodeURIComponent(makePackageID(row)), function(ajaxRequest) {
|
||||||
|
showPackageDetails(ajaxRequest, row);
|
||||||
|
}, 'package-details');
|
||||||
|
}
|
||||||
|
|
||||||
|
function switchToPackageDetails(packageID)
|
||||||
|
{
|
||||||
|
SinglePageHelper.sections['package-details'].state.package = packageID;
|
||||||
|
SinglePageHelper.updateHashPreventingSectionInitializer('#package-details-section?' + encodeURIComponent(packageID));
|
||||||
|
}
|
||||||
|
|
||||||
|
export function showPackageDetails(ajaxRequest, row)
|
||||||
|
{
|
||||||
|
const packageID = makePackageID(row);
|
||||||
|
const packageDetailsContainer = Utils.getAndEmptyElement('package-details-container');
|
||||||
|
if (ajaxRequest.status !== 200) {
|
||||||
|
packageDetailsContainer.appendChild(document.createTextNode('unable query package details: ' + ajaxRequest.responseText));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const responseJson = JSON.parse(ajaxRequest.responseText);
|
||||||
|
if (!Array.isArray(responseJson) || responseJson.length !== 1) {
|
||||||
|
switchToPackageDetails(packageID);
|
||||||
|
packageDetailsContainer.appendChild(document.createTextNode('unable query package details: package not present'));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const packageObj = responseJson[0];
|
||||||
|
const heading = document.createElement('h3');
|
||||||
|
heading.appendChild(document.createTextNode(packageObj.name));
|
||||||
|
heading.appendChild(document.createTextNode(' ' + packageObj.version));
|
||||||
|
packageDetailsContainer.appendChild(heading);
|
||||||
|
packageObj.db = row.db;
|
||||||
|
packageObj.dbArch = row.dbArch;
|
||||||
|
packageDetailsContainer.appendChild(renderPackage(packageObj, true));
|
||||||
|
|
||||||
|
switchToPackageDetails(packageID);
|
||||||
|
}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import * as AjaxHelper from './ajaxhelper.js';
|
import * as AjaxHelper from './ajaxhelper.js';
|
||||||
import * as GenericRendering from './genericrendering.js';
|
import * as GenericRendering from './genericrendering.js';
|
||||||
|
import * as PackageRendering from './packagerendering.js';
|
||||||
import * as SinglePageHelper from './singlepage.js';
|
import * as SinglePageHelper from './singlepage.js';
|
||||||
import * as PackageDetailsPage from './packagedetailspage.js';
|
|
||||||
import * as Utils from './utils.js';
|
import * as Utils from './utils.js';
|
||||||
|
|
||||||
export function initPackageSearch(sectionElement, sectionData, newParams)
|
export function initPackageSearch(sectionElement, sectionData, newParams)
|
||||||
|
@ -107,8 +107,7 @@ function showPackageSearchResults(ajaxRequest)
|
||||||
rowsPerPage: 40,
|
rowsPerPage: 40,
|
||||||
customRenderer: {
|
customRenderer: {
|
||||||
name: function (value, row) {
|
name: function (value, row) {
|
||||||
return GenericRendering.renderLink(value, row, PackageDetailsPage.queryPackageDetails, 'Show package details', undefined,
|
return PackageRendering.renderPackageDetailsLink(row);
|
||||||
'#package-details-section?' + encodeURIComponent(row.db + (row.dbArch ? '@' + row.dbArch : '') + '/' + value));
|
|
||||||
},
|
},
|
||||||
checkbox: function(value, row) {
|
checkbox: function(value, row) {
|
||||||
return GenericRendering.renderCheckBoxForTableRow(value, row, function(row) {
|
return GenericRendering.renderCheckBoxForTableRow(value, row, function(row) {
|
||||||
|
|
Loading…
Reference in New Issue