summaryrefslogtreecommitdiff
path: root/web/gotosocial-styling/index.js
diff options
context:
space:
mode:
Diffstat (limited to 'web/gotosocial-styling/index.js')
-rw-r--r--web/gotosocial-styling/index.js71
1 files changed, 71 insertions, 0 deletions
diff --git a/web/gotosocial-styling/index.js b/web/gotosocial-styling/index.js
new file mode 100644
index 000000000..88d9398b2
--- /dev/null
+++ b/web/gotosocial-styling/index.js
@@ -0,0 +1,71 @@
+"use strict";
+
+const Promise = require("bluebird");
+const fs = require("fs").promises;
+const postcss = require('postcss');
+const {parse} = require("postcss-scss");
+
+/*
+ Bundle all postCSS files under the `templates/` directory separately, each prepended with the (variable) contents of ./colors.css
+ Outputs in plain CSS are in `build/`, split by template
+*/
+
+const postcssPlugins = ["postcss-strip-inline-comments", "postcss-nested", "postcss-simple-vars", "postcss-color-function"].map((plugin) => require(plugin)());
+
+function getTemplates() {
+ return fs.readdir(`${__dirname}/templates`).then((templates) => {
+ return templates.map((a) => {
+ return [a, `${__dirname}/templates/${a}`];
+ });
+ });
+}
+
+getTemplates();
+
+function bundle([template, path]) {
+ return Promise.try(() => {
+ return Promise.all([
+ fs.readFile(`${__dirname}/colors.css`, "utf-8"),
+ fs.readFile(path, "utf-8")
+ ]);
+ }).then(([colors, style]) => {
+ return parse(colors + "\n" + style);
+ }).then((ast) => {
+ return postcss(postcssPlugins).process(ast, {
+ from: template,
+ to: template
+ });
+ }).then((bundle) => {
+ return fs.writeFile(`${buildDir}/${template}`, bundle.css);
+ }).then(() => {
+ console.log(`Finished writing CSS to ${buildDir}/${template}`);
+ });
+}
+
+let buildDir = process.env.BUILD_DIR;
+if (buildDir == undefined) {
+ buildDir = `${__dirname}/build`;
+}
+console.log("bundling to", buildDir);
+
+function bundleAll() {
+ return getTemplates().then((templates) => {
+ return Promise.map(templates, bundle);
+ });
+}
+
+if (process.env.NODE_ENV != "development") {
+ bundleAll();
+} else {
+ const chokidar = require("chokidar");
+ console.log("Watching for changes");
+ chokidar.watch(`${__dirname}/templates`).on("all", (_, path) => {
+ if (path.endsWith(".css")) {
+ bundle([path.split("/").slice(-1)[0], path]);
+ }
+ });
+ chokidar.watch(`${__dirname}/colors.css`).on("all", () => {
+ console.log("colors.css updated, rebuilding all templates");
+ bundleAll();
+ });
+} \ No newline at end of file