From 74381302c7a658dc3fd5e6c3a76842dd430341bb Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 17 Jul 2021 16:03:26 -0400 Subject: [PATCH] Add generalized css-to-json-util dev module (#1836) --- dev/css-to-json-util.js | 169 +++++++++++++++++++++++ dev/generate-structured-content-style.js | 146 +------------------- 2 files changed, 173 insertions(+), 142 deletions(-) create mode 100644 dev/css-to-json-util.js diff --git a/dev/css-to-json-util.js b/dev/css-to-json-util.js new file mode 100644 index 00000000..bdcac65b --- /dev/null +++ b/dev/css-to-json-util.js @@ -0,0 +1,169 @@ +/* + * Copyright (C) 2021 Yomichan Authors + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ + +const fs = require('fs'); +const css = require('css'); + +function indexOfRule(rules, selectors) { + const jj = selectors.length; + for (let i = 0, ii = rules.length; i < ii; ++i) { + const ruleSelectors = rules[i].selectors; + if (ruleSelectors.length !== jj) { continue; } + let okay = true; + for (let j = 0; j < jj; ++j) { + if (selectors[j] !== ruleSelectors[j]) { + okay = false; + break; + } + } + if (okay) { return i; } + } + return -1; +} + +function removeProperty(styles, property, removedProperties) { + let removeCount = removedProperties.get(property); + if (typeof removeCount !== 'undefined') { return removeCount; } + removeCount = 0; + for (let i = 0, ii = styles.length; i < ii; ++i) { + const key = styles[i][0]; + if (key !== property) { continue; } + styles.splice(i, 1); + --i; + --ii; + ++removeCount; + } + removedProperties.set(property, removeCount); + return removeCount; +} + +function formatRulesJson(rules) { + // Manually format JSON, for improved compactness + // return JSON.stringify(rules, null, 4); + const indent1 = ' '; + const indent2 = indent1.repeat(2); + const indent3 = indent1.repeat(3); + let result = ''; + result += '['; + let index1 = 0; + for (const {selectors, styles} of rules) { + if (index1 > 0) { result += ','; } + result += `\n${indent1}{\n${indent2}"selectors": `; + if (selectors.length === 1) { + result += `[${JSON.stringify(selectors[0], null, 4)}]`; + } else { + result += JSON.stringify(selectors, null, 4).replace(/\n/g, '\n' + indent2); + } + result += `,\n${indent2}"styles": [`; + let index2 = 0; + for (const [key, value] of styles) { + if (index2 > 0) { result += ','; } + result += `\n${indent3}[${JSON.stringify(key)}, ${JSON.stringify(value)}]`; + ++index2; + } + if (index2 > 0) { result += `\n${indent2}`; } + result += `]\n${indent1}}`; + ++index1; + } + if (index1 > 0) { result += '\n'; } + result += ']'; + return result; +} + +function generateRules(cssFile, cssFileOverrides) { + const content1 = fs.readFileSync(cssFile, {encoding: 'utf8'}); + const content2 = fs.readFileSync(cssFileOverrides, {encoding: 'utf8'}); + const stylesheet1 = css.parse(content1, {}).stylesheet; + const stylesheet2 = css.parse(content2, {}).stylesheet; + + const removePropertyPattern = /^remove-property\s+([a-zA-Z0-9-]+)$/; + const removeRulePattern = /^remove-rule$/; + + const rules = []; + + // Default stylesheet + for (const rule of stylesheet1.rules) { + if (rule.type !== 'rule') { continue; } + const {selectors, declarations} = rule; + const styles = []; + for (const declaration of declarations) { + if (declaration.type !== 'declaration') { console.log(declaration); continue; } + const {property, value} = declaration; + styles.push([property, value]); + } + if (styles.length > 0) { + rules.push({selectors, styles}); + } + } + + // Overrides + for (const rule of stylesheet2.rules) { + if (rule.type !== 'rule') { continue; } + const {selectors, declarations} = rule; + const removedProperties = new Map(); + for (const declaration of declarations) { + switch (declaration.type) { + case 'declaration': + { + const index = indexOfRule(rules, selectors); + let entry; + if (index >= 0) { + entry = rules[index]; + } else { + entry = {selectors, styles: []}; + rules.push(entry); + } + const {property, value} = declaration; + removeProperty(entry.styles, property, removedProperties); + entry.styles.push([property, value]); + } + break; + case 'comment': + { + const index = indexOfRule(rules, selectors); + if (index < 0) { throw new Error('Could not find rule with matching selectors'); } + const comment = declaration.comment.trim(); + let m; + if ((m = removePropertyPattern.exec(comment)) !== null) { + const property = m[1]; + const removeCount = removeProperty(rules[index].styles, property, removedProperties); + if (removeCount === 0) { throw new Error(`Property removal is unnecessary; ${property} does not exist`); } + } else if ((m = removeRulePattern.exec(comment)) !== null) { + rules.splice(index, 1); + } + } + break; + } + } + } + + // Remove empty + for (let i = 0, ii = rules.length; i < ii; ++i) { + if (rules[i].styles.length > 0) { continue; } + rules.splice(i, 1); + --i; + --ii; + } + + return rules; +} + + +module.exports = { + formatRulesJson, + generateRules +}; diff --git a/dev/generate-structured-content-style.js b/dev/generate-structured-content-style.js index 8335efc2..baa1a513 100644 --- a/dev/generate-structured-content-style.js +++ b/dev/generate-structured-content-style.js @@ -17,151 +17,13 @@ const fs = require('fs'); const path = require('path'); -const css = require('css'); const {testMain} = require('./util'); - -function indexOfRule(rules, selectors) { - const jj = selectors.length; - for (let i = 0, ii = rules.length; i < ii; ++i) { - const ruleSelectors = rules[i].selectors; - if (ruleSelectors.length !== jj) { continue; } - let okay = true; - for (let j = 0; j < jj; ++j) { - if (selectors[j] !== ruleSelectors[j]) { - okay = false; - break; - } - } - if (okay) { return i; } - } - return -1; -} - -function removeProperty(styles, property, removedProperties) { - let removeCount = removedProperties.get(property); - if (typeof removeCount !== 'undefined') { return removeCount; } - removeCount = 0; - for (let i = 0, ii = styles.length; i < ii; ++i) { - const key = styles[i][0]; - if (key !== property) { continue; } - styles.splice(i, 1); - --i; - --ii; - ++removeCount; - } - removedProperties.set(property, removeCount); - return removeCount; -} - -function formatRulesJson(rules) { - // Manually format JSON, for improved compactness - // return JSON.stringify(rules, null, 4); - const indent1 = ' '; - const indent2 = indent1.repeat(2); - const indent3 = indent1.repeat(3); - let result = ''; - result += '['; - let index1 = 0; - for (const {selectors, styles} of rules) { - if (index1 > 0) { result += ','; } - result += `\n${indent1}{\n${indent2}"selectors": `; - if (selectors.length === 1) { - result += `[${JSON.stringify(selectors[0], null, 4)}]`; - } else { - result += JSON.stringify(selectors, null, 4).replace(/\n/g, '\n' + indent2); - } - result += `,\n${indent2}"styles": [`; - let index2 = 0; - for (const [key, value] of styles) { - if (index2 > 0) { result += ','; } - result += `\n${indent3}[${JSON.stringify(key)}, ${JSON.stringify(value)}]`; - ++index2; - } - if (index2 > 0) { result += `\n${indent2}`; } - result += `]\n${indent1}}`; - ++index1; - } - if (index1 > 0) { result += '\n'; } - result += ']'; - return result; -} +const {formatRulesJson, generateRules: generateRulesGeneric} = require('./css-to-json-util'); function generateRules() { - const content1 = fs.readFileSync(path.join(__dirname, '..', 'ext/css/structured-content.css'), {encoding: 'utf8'}); - const content2 = fs.readFileSync(path.join(__dirname, 'data/structured-content-overrides.css'), {encoding: 'utf8'}); - const stylesheet1 = css.parse(content1, {}).stylesheet; - const stylesheet2 = css.parse(content2, {}).stylesheet; - - const removePropertyPattern = /^remove-property\s+([a-zA-Z0-9-]+)$/; - const removeRulePattern = /^remove-rule$/; - - const rules = []; - - // Default stylesheet - for (const rule of stylesheet1.rules) { - if (rule.type !== 'rule') { continue; } - const {selectors, declarations} = rule; - const styles = []; - for (const declaration of declarations) { - if (declaration.type !== 'declaration') { console.log(declaration); continue; } - const {property, value} = declaration; - styles.push([property, value]); - } - if (styles.length > 0) { - rules.push({selectors, styles}); - } - } - - // Overrides - for (const rule of stylesheet2.rules) { - if (rule.type !== 'rule') { continue; } - const {selectors, declarations} = rule; - const removedProperties = new Map(); - for (const declaration of declarations) { - switch (declaration.type) { - case 'declaration': - { - const index = indexOfRule(rules, selectors); - let entry; - if (index >= 0) { - entry = rules[index]; - } else { - entry = {selectors, styles: []}; - rules.push(entry); - } - const {property, value} = declaration; - removeProperty(entry.styles, property, removedProperties); - entry.styles.push([property, value]); - } - break; - case 'comment': - { - const index = indexOfRule(rules, selectors); - if (index < 0) { throw new Error('Could not find rule with matching selectors'); } - const comment = declaration.comment.trim(); - let m; - if ((m = removePropertyPattern.exec(comment)) !== null) { - const property = m[1]; - const removeCount = removeProperty(rules[index].styles, property, removedProperties); - if (removeCount === 0) { throw new Error(`Property removal is unnecessary; ${property} does not exist`); } - } else if ((m = removeRulePattern.exec(comment)) !== null) { - rules.splice(index, 1); - } - } - break; - } - } - } - - // Remove empty - for (let i = 0, ii = rules.length; i < ii; ++i) { - if (rules[i].styles.length > 0) { continue; } - rules.splice(i, 1); - --i; - --ii; - } - - return rules; + const cssFile = path.join(__dirname, '..', 'ext/css/structured-content.css'); + const cssFileOverrides = path.join(__dirname, 'data/structured-content-overrides.css'); + return generateRulesGeneric(cssFile, cssFileOverrides); } function generateRulesJson() {