NovaGM
/
ModuleBuilder
mirror of https://github.com/NovaGM/ModuleBuilder.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

[Various] Theme color palette

This commit is contained in:
Ducko 2021-07-17 20:49:12 +01:00 committed by Alyxia Sother
parent 772b40ef4d
commit fc795a700b
No known key found for this signature in database
GPG Key ID: 355968D14144B739
5 changed files with 100 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
src/imageCdn.js
View File

@ -8,27 +8,49 @@ export default (manifest) => {
const baseDir = join(distDir, 'img', manifest.name);
return manifest.images ? Promise.all(manifest.images.map(async (x, i) => {
mkdirSync(baseDir, { recursive: true });
if (Array.isArray(x)) {
const finalName = `${i}.png`;
const finalFile = join(baseDir, finalName);
// console.log('colors', x, i, finalFile);
let i2 = 0;
for (const c of x) {
const file = join(baseDir, `${i2}.png`);
c[2] = file;
console.log(c, file);
await new Promise((res) => exec(`convert -size 212x112 xc:${c[1].replace('(', '\\(').replace(')', '\\)')} "${file}"`, res));
i2++;
}
console.log(x);
await new Promise((res) => exec(`montage ${x.map((c) => `"${c[2]}"`).join(' ')} -background "#101418" -tile 2x3 -geometry +6+6 - | convert - -trim "${finalFile}"`, res));
i2 = 0;
for (const c of x) {
const text = c[0].substring(2).replaceAll('-', ' ').replace('background ', '').replace(/\w\S*/g, (_) => _[0].toUpperCase() + _.substring(1).toLowerCase());
await new Promise((res) => exec(`convert -font 'Noto-Sans-Regular' -fill white -pointsize 20 -draw 'text ${(Math.floor(i2 / 3) * 230) + 100 - (text.length * 4)},${70 + (i2 % 3) * 125} "${text}"' "${finalFile}" "${finalFile}"`, res));
i2++;
}
return `/img/${manifest.name}/${finalName}`;
}
const rawFile = join(baseDir, x.split('/').pop());
const rawExt = rawFile.split('.').pop();
const finalName = `${i}.${rawExt === 'gif' ? 'gif' : 'png'}`;
const finalFile = join(baseDir, finalName);
mkdirSync(baseDir, { recursive: true });
if (!x.includes('http')) {
console.log('color', x, i, finalFile);
try {
await new Promise((res) => exec(`convert -size 330x200 xc:${x.replace('(', '\\(').replace(')', '\\)')} "${finalFile}"`, res));
} catch (e) {
console.error('Failed to use ImageMagick to resize and compress, copying file as backup');
// copyFileSync(rawFile, finalFile);
}
return `/img/${manifest.name}/${finalName}`;
}
console.log(x, i, rawFile, finalFile);
const writer = createWriteStream(rawFile);

7
src/index.js
View File

@ -179,10 +179,9 @@ for (const parentRepo of ModuleRepos) {
);
if (preprocessor) {
const preOut = (await import(`./preprocessors/${preprocessor}.js`)).default(
`${cloneDir}${moduleDir}`,
repo,
);
const preOut = await (
await import(`./preprocessors/${preprocessor}.js`)
).default(`${cloneDir}${moduleDir}`, repo);
if (preOut !== undefined) {
moduleDir = preOut;

25
src/preprocessors/bdTheme.js
View File

@ -1,6 +1,8 @@
import { readFileSync, writeFileSync, mkdirSync, rmSync } from 'fs';
export default (themePath, repo) => {
import generateThemeJS from './genericTheme.js';
export default async (themePath, repo) => {
const content = readFileSync(themePath, 'utf8');
const metaReg = /@([^ ]*) (.*)/g;
@ -45,26 +47,7 @@ export default (themePath, repo) => {
rmSync(themePath);
mkdirSync(themePath);
const jsCode = `// Generated by MS2Builder - bdTheme preprocessor / porter
let style;
export default {
goosemodHandlers: {
onImport: async () => {
style = document.createElement("style");
document.head.appendChild(style);
style.appendChild(
document.createTextNode(
\`${content}\`
)
);
},
onRemove: async () => {
style.remove();
},
}
};`;
const jsCode = await generateThemeJS(manifest, content, repo);
writeFileSync(`${themePath}/goosemodModule.json`, JSON.stringify(manifest));
writeFileSync(`${themePath}/index.js`, jsCode);

57
src/preprocessors/genericTheme.js
View File

@ -1,3 +1,5 @@
import axios from 'axios';
const discordVars = [
'--header-primary',
'--header-secondary',
@ -55,10 +57,31 @@ const discordVars = [
'--deprecated-text-input-prefix',
];
export default (manifest, _content, repo) => {
const imagePaletteVars = [
'--background-primary',
'--background-secondary',
'--background-secondary-alt',
'--background-tertiary',
'--background-accent',
'--background-floating',
];
export default async (manifest, _content, repo) => {
const content = _content.replace(/\\/g, '\\\\').replace(/`/g, '\\`').replace(/\$/g, '\\$');
let variables = content.match(/--([^*!\n}]*): ([^*!\n}]*);/g) || [];
let variables = content.match(/--([^*!\n}]*): ([^*\n}]*);/g) || [];
let imports = content.match(/@import url\(['"`]?(.*)['"`]?\);/g) || [];
for (const x of imports) {
const url = x.replace(/@import url\(['"`]?/, '').replace(/['"`]?\);/, '');
console.log(x, url);
const imported = (await axios.get(url)).data;
variables = variables.concat(imported.match(/--([^*!\n}]*): ([^*\n}]*);/g) || []);
}
if (variables.length > 0)
variables = variables.map((x) => {
const spl = x.split(':');
@ -75,6 +98,28 @@ export default (manifest, _content, repo) => {
return [name, val, type];
});
const imagePalette = [];
for (const wanted of imagePaletteVars) {
const v = variables.find((x) => x[0] === wanted);
if (!v) {
console.log('aborting color palette image, could not find var', wanted);
break;
}
while (v[1].startsWith('var(')) {
v[1] = variables.find((y) => y[0] === v[1].slice(4, -1))[1];
}
imagePalette.push([v[0], v[1]]);
}
if (imagePalette.length === imagePaletteVars.length) {
if (!repo[4].images) repo[4].images = [];
repo[4].images.push(imagePalette);
}
// Filter out Discord standard vars, and duplicate names
if (variables.length > 0)
variables = variables.filter(
@ -122,7 +167,9 @@ export default (manifest, _content, repo) => {
.replace('Dnd', 'DND')}',
oninput: (val) => {
${''/* x[2] === 'color' && x[1][0] !== '#' ? `val = 'rgb(' + parseInt(val.substring(1, 3), 16).toString() + ', ' + parseInt(val.substring(3, 5), 16).toString() + ', ' + parseInt(val.substring(5, 7), 16).toString() + ')'` : '' */}
${
'' /* x[2] === 'color' && x[1][0] !== '#' ? `val = 'rgb(' + parseInt(val.substring(1, 3), 16).toString() + ', ' + parseInt(val.substring(3, 5), 16).toString() + ', ' + parseInt(val.substring(5, 7), 16).toString() + ')'` : '' */
}
document.body.style.setProperty('${x[0]}', val);
},
@ -163,7 +210,3 @@ export default (manifest, _content, repo) => {
}
};`;
};
<<<<<<< HEAD
=======
>>>>>>> 39784f0 ([GenericTheme > Settings] Fix hex color checking when not color type causing bad values oninput)

29
src/preprocessors/pcTheme.js
View File

@ -1,7 +1,9 @@
import { readFileSync, writeFileSync, mkdirSync, rmSync } from 'fs';
import sass from 'sass';
export default (manifestPath, repo) => {
import generateThemeJS from './genericTheme.js';
export default async (manifestPath, repo) => {
const pcManifest = JSON.parse(readFileSync(manifestPath, 'utf8'));
let manifest = {
@ -12,7 +14,7 @@ export default (manifestPath, repo) => {
description: pcManifest.description,
version: pcManifest.version,
authors: [ pcManifest.author ]
authors: [pcManifest.author],
};
rmSync(manifestPath);
@ -21,7 +23,7 @@ export default (manifestPath, repo) => {
if (pcManifest.theme.split('.').pop() === 'scss') {
const cssPath = pcManifest.theme.split('.').slice(0, -1).concat('css').join('.');
const compiled = (sass.renderSync({ file: pcManifest.theme })).css;
const compiled = sass.renderSync({ file: pcManifest.theme }).css;
writeFileSync(cssPath, compiled);
pcManifest.theme = cssPath;
@ -29,26 +31,7 @@ export default (manifestPath, repo) => {
const content = readFileSync(pcManifest.theme, 'utf8');
const jsCode = `// Generated by MS2Builder - pcTheme preprocessor / porter
let style;
export default {
goosemodHandlers: {
onImport: async () => {
style = document.createElement("style");
document.head.appendChild(style);
style.appendChild(
document.createTextNode(
\`${content}\`
)
);
},
onRemove: async () => {
style.remove();
},
}
};`;
const jsCode = await generateThemeJS(manifest, content, repo);
writeFileSync(`${manifestPath}/goosemodModule.json`, JSON.stringify(manifest));
writeFileSync(`${manifestPath}/index.js`, jsCode);