diff --git a/lib/tasks/generateThemeDesignerResources.js b/lib/tasks/generateThemeDesignerResources.js index 720d73829..f8f75c4fa 100644 --- a/lib/tasks/generateThemeDesignerResources.js +++ b/lib/tasks/generateThemeDesignerResources.js @@ -24,6 +24,16 @@ function getPathToRoot(themeFolder) { return "../".repeat(themeFolder.split("/").length - 2); } +/** + * Generates an less import statement for the given filePath + * + * @param {string} filePath The path to the desired file + * @returns {string} The less import statement + */ +function lessImport(filePath) { + return `@import "${filePath}";\n`; +} + function generateLibraryDotTheming({namespace, version, hasThemes}) { const dotTheming = { sEntity: "Library", @@ -51,58 +61,6 @@ function generateLibraryDotTheming({namespace, version, hasThemes}) { }); } -function lessImport(filePath) { - return `@import "${filePath}";\n`; -} - -async function createCssVariablesLessResource({workspace, combo, themeFolder}) { - const pathToRoot = getPathToRoot(themeFolder); - const cssVariablesSourceLessFile = "css_variables.source.less"; - const cssVariablesLessFile = "css_variables.less"; - - // posix as it is a virtual path (separated with /) - const themeName = posixPath.basename(themeFolder); - // The "base" theme of the baseLib is called "baseTheme" - const baseLibThemeName = themeName === "base" ? "baseTheme" : themeName; - - // Some themes do not have a base.less file (e.g. sap_hcb) - const hasBaseLess = !!(await combo.byPath(`/resources/sap/ui/core/themes/${themeName}/base.less`)); - - let cssVariablesLess = -`/* NOTE: This file was generated as an optimized version of "${cssVariablesSourceLessFile}" \ -for the Theme Designer. */\n\n`; - - if (themeName !== "base") { - const cssVariablesSourceLessResource = await workspace.byPath( - posixPath.join(themeFolder, cssVariablesSourceLessFile) - ); - - if (!cssVariablesSourceLessResource) { - throw new Error(`Could not find file "${cssVariablesSourceLessFile}" in theme "${themeFolder}"`); - } - - const cssVariablesSourceLess = await cssVariablesSourceLessResource.getString(); - - cssVariablesLess += lessImport(`../base/${cssVariablesLessFile}`); - cssVariablesLess += ` -/* START "${cssVariablesSourceLessFile}" */ -${cssVariablesSourceLess} -/* END "${cssVariablesSourceLessFile}" */ - -`; - } - - if (hasBaseLess) { - cssVariablesLess += lessImport(`${pathToRoot}../Base/baseLib/${baseLibThemeName}/base.less`); - } - cssVariablesLess += lessImport(`${pathToRoot}sap/ui/core/themes/${themeName}/global.less`); - - return new Resource({ - path: posixPath.join(themeFolder, cssVariablesLessFile), - string: cssVariablesLess - }); -} - async function generateThemeDotTheming({workspace, combo, themeFolder}) { const themeName = posixPath.basename(themeFolder); const libraryMatchPattern = /^\/resources\/(.*)\/themes\/[^/]*$/i; @@ -153,6 +111,54 @@ async function generateThemeDotTheming({workspace, combo, themeFolder}) { return newDotThemingResource; } +async function createCssVariablesLessResource({workspace, combo, themeFolder}) { + const pathToRoot = getPathToRoot(themeFolder); + const cssVariablesSourceLessFile = "css_variables.source.less"; + const cssVariablesLessFile = "css_variables.less"; + + // posix as it is a virtual path (separated with /) + const themeName = posixPath.basename(themeFolder); + // The "base" theme of the baseLib is called "baseTheme" + const baseLibThemeName = themeName === "base" ? "baseTheme" : themeName; + + // Some themes do not have a base.less file (e.g. sap_hcb) + const hasBaseLess = !!(await combo.byPath(`/resources/sap/ui/core/themes/${themeName}/base.less`)); + + let cssVariablesLess = +`/* NOTE: This file was generated as an optimized version of "${cssVariablesSourceLessFile}" \ +for the Theme Designer. */\n\n`; + + if (themeName !== "base") { + const cssVariablesSourceLessResource = await workspace.byPath( + posixPath.join(themeFolder, cssVariablesSourceLessFile) + ); + + if (!cssVariablesSourceLessResource) { + throw new Error(`Could not find file "${cssVariablesSourceLessFile}" in theme "${themeFolder}"`); + } + + const cssVariablesSourceLess = await cssVariablesSourceLessResource.getString(); + + cssVariablesLess += lessImport(`../base/${cssVariablesLessFile}`); + cssVariablesLess += ` +/* START "${cssVariablesSourceLessFile}" */ +${cssVariablesSourceLess} +/* END "${cssVariablesSourceLessFile}" */ + +`; + } + + if (hasBaseLess) { + cssVariablesLess += lessImport(`${pathToRoot}../Base/baseLib/${baseLibThemeName}/base.less`); + } + cssVariablesLess += lessImport(`${pathToRoot}sap/ui/core/themes/${themeName}/global.less`); + + return new Resource({ + path: posixPath.join(themeFolder, cssVariablesLessFile), + string: cssVariablesLess + }); +} + async function generateCssVariablesLess({workspace, combo, namespace}) { let cssVariablesSourceLessResourcePattern; if (namespace) { @@ -168,21 +174,16 @@ async function generateCssVariablesLess({workspace, combo, namespace}) { const hasCssVariables = cssVariablesSourceLessResource.length > 0; if (hasCssVariables) { - const cssVariablesLessResources = await Promise.all( - cssVariablesSourceLessResource.map((cssVariableSourceLess) => { + await Promise.all( + cssVariablesSourceLessResource.map(async (cssVariableSourceLess) => { const themeFolder = posixPath.dirname(cssVariableSourceLess.getPath()); log.verbose(`Generating css_variables.less for theme ${themeFolder}`); - return createCssVariablesLessResource({ + const r = await createCssVariablesLessResource({ workspace, combo, themeFolder }); + return await workspace.write(r); }) ); - - return cssVariablesLessResources.map(async (resource) => { - if (resource) { - await workspace.write(resource); - } - }); } }