Read from manifest

This commit is contained in:
RMidhunSuresh 2022-05-11 12:40:32 +05:30
parent e8a4ab5ecc
commit 855298bdaf
2 changed files with 24 additions and 17 deletions

View File

@ -31,12 +31,12 @@ function appendVariablesToCSS(variables, cssSource) {
return cssSource + getRootSectionWithVariables(variables); return cssSource + getRootSectionWithVariables(variables);
} }
function addThemesToConfig(bundle, themeSummary, defaultThemes) { function addThemesToConfig(bundle, manifestLocations, defaultThemes) {
for (const [fileName, info] of Object.entries(bundle)) { for (const [fileName, info] of Object.entries(bundle)) {
if (fileName === "assets/config.json") { if (fileName === "assets/config.json") {
const source = new TextDecoder().decode(info.source); const source = new TextDecoder().decode(info.source);
const config = JSON.parse(source); const config = JSON.parse(source);
config["themes"] = themeSummary; config["themeManifests"] = manifestLocations;
config["defaultTheme"] = defaultThemes; config["defaultTheme"] = defaultThemes;
info.source = new TextEncoder().encode(JSON.stringify(config)); info.source = new TextEncoder().encode(JSON.stringify(config));
} }
@ -247,13 +247,17 @@ module.exports = function buildThemes(options) {
generateBundle(_, bundle) { generateBundle(_, bundle) {
const { assetMap, chunkMap, runtimeThemeChunk } = parseBundle(bundle); const { assetMap, chunkMap, runtimeThemeChunk } = parseBundle(bundle);
const themeSummary = {}; const manifestLocations = [];
for (const [location, chunkArray] of chunkMap) { for (const [location, chunkArray] of chunkMap) {
const manifest = require(`${location}/manifest.json`); const manifest = require(`${location}/manifest.json`);
const compiledVariables = options.compiledVariables.get(location); const compiledVariables = options.compiledVariables.get(location);
const derivedVariables = compiledVariables["derived-variables"]; const derivedVariables = compiledVariables["derived-variables"];
const icon = compiledVariables["icon"]; const icon = compiledVariables["icon"];
const builtAsset = {}; const builtAsset = {};
/**
* Generate a mapping from theme name to asset hashed location of said theme in build output.
* This can be used to enumerate themes during runtime.
*/
for (const chunk of chunkArray) { for (const chunk of chunkArray) {
const [, name, variant] = chunk.fileName.match(/theme-(.+)-(.+)\.css/); const [, name, variant] = chunk.fileName.match(/theme-(.+)-(.+)\.css/);
builtAsset[`${name}-${variant}`] = assetMap.get(chunk.fileName).fileName; builtAsset[`${name}-${variant}`] = assetMap.get(chunk.fileName).fileName;
@ -265,24 +269,14 @@ module.exports = function buildThemes(options) {
"icon": icon "icon": icon
}; };
const name = `theme-${manifest.name}.json`; const name = `theme-${manifest.name}.json`;
manifestLocations.push(`assets/${name}`);
this.emitFile({ this.emitFile({
type: "asset", type: "asset",
name, name,
source: JSON.stringify(manifest), source: JSON.stringify(manifest),
}); });
} }
/** addThemesToConfig(bundle, manifestLocations, defaultThemes);
* Generate a mapping from theme name to asset hashed location of said theme in build output.
* This can be used to enumerate themes during runtime.
*/
for (const [, chunkArray] of chunkMap) {
chunkArray.forEach((chunk) => {
const [, name, variant] = chunk.fileName.match(/theme-(.+)-(.+)\.css/);
const assetHashedFileName = assetMap.get(chunk.fileName).fileName;
themeSummary[`${name}-${variant}`] = assetHashedFileName;
});
}
addThemesToConfig(bundle, themeSummary, defaultThemes);
}, },
} }
} }

View File

@ -164,6 +164,8 @@ export class Platform {
this._disposables = new Disposables(); this._disposables = new Disposables();
this._olmPromise = undefined; this._olmPromise = undefined;
this._workerPromise = undefined; this._workerPromise = undefined;
// Mapping from theme-name to asset hashed location of css file
this._themeMapping = {};
} }
async init() { async init() {
@ -178,9 +180,20 @@ export class Platform {
this._serviceWorkerHandler, this._serviceWorkerHandler,
this._config.push this._config.push
); );
this._themeMapping = await this._createThemeMappingFromManifests();
await this._loadThemeFromSetting(); await this._loadThemeFromSetting();
} }
async _createThemeMappingFromManifests() {
const mapping = {};
const manifests = this.config["themeManifests"];
for (const manifestLocation of manifests) {
const {body}= await this.request(manifestLocation, {method: "GET", format: "json", cache: true}).response();
Object.assign(mapping, body["source"]["built-asset"]);
}
return mapping;
}
async _loadThemeFromSetting() { async _loadThemeFromSetting() {
const themeName = await this.settingsStorage.getString("theme"); const themeName = await this.settingsStorage.getString("theme");
if (themeName) { if (themeName) {
@ -316,7 +329,7 @@ export class Platform {
} }
get themes() { get themes() {
return Object.keys(this.config["themes"]); return Object.keys(this._themeMapping);
} }
async getActiveTheme() { async getActiveTheme() {
@ -337,7 +350,7 @@ export class Platform {
} }
setTheme(themeName) { setTheme(themeName) {
const themeLocation = this.config["themes"][themeName]; const themeLocation = this._themeMapping[themeName];
if (!themeLocation) { if (!themeLocation) {
throw new Error(`Cannot find theme location for theme "${themeName}"!`); throw new Error(`Cannot find theme location for theme "${themeName}"!`);
} }