mirror of
https://github.com/vector-im/hydrogen-web.git
synced 2024-12-23 03:25:12 +01:00
Read from manifest
This commit is contained in:
parent
e8a4ab5ecc
commit
855298bdaf
@ -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);
|
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -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}"!`);
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user