mirror of
https://github.com/FriendsOfTYPO3/tea.git
synced 2024-11-10 04:56:12 +01:00
[FEATURE] Add frontend linting (#120)
Co-authored-by: Łukasz Uznański <l.uznanski@macopedia.com> Co-authored-by: Oliver Klee <typo3-coding@oliverklee.de>
This commit is contained in:
parent
ab7e5c45f5
commit
d4ec80de29
17 changed files with 269 additions and 0 deletions
5
.gitattributes
vendored
5
.gitattributes
vendored
|
@ -8,3 +8,8 @@
|
||||||
/Tests/ export-ignore
|
/Tests/ export-ignore
|
||||||
/codeception.yml export-ignore
|
/codeception.yml export-ignore
|
||||||
/phpcs.xml export-ignore
|
/phpcs.xml export-ignore
|
||||||
|
/Resources/Private/.eslintignore export-ignore
|
||||||
|
/Resources/Private/.eslintrc.json export-ignore
|
||||||
|
/Resources/Private/.prettierrc.js export-ignore
|
||||||
|
/Resources/Private/package.json export-ignore
|
||||||
|
/Resources/Private/stylelint.config.js export-ignore
|
||||||
|
|
20
.github/workflows/ci.yml
vendored
20
.github/workflows/ci.yml
vendored
|
@ -62,6 +62,26 @@ jobs:
|
||||||
- "php:codestyle"
|
- "php:codestyle"
|
||||||
php-version:
|
php-version:
|
||||||
- 7.4
|
- 7.4
|
||||||
|
code-quality-frontend:
|
||||||
|
name: "Code quality frontend checks"
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
strategy:
|
||||||
|
matrix:
|
||||||
|
command:
|
||||||
|
- "style"
|
||||||
|
- "js"
|
||||||
|
steps:
|
||||||
|
-
|
||||||
|
name: Checkout
|
||||||
|
uses: actions/checkout@v2
|
||||||
|
-
|
||||||
|
name: "Install modules"
|
||||||
|
working-directory: ./Resources/Private
|
||||||
|
run: yarn
|
||||||
|
-
|
||||||
|
name: "Run command"
|
||||||
|
working-directory: ./Resources/Private
|
||||||
|
run: "yarn lint:${{ matrix.command }}"
|
||||||
xliff-lint:
|
xliff-lint:
|
||||||
name: "Xliff linter"
|
name: "Xliff linter"
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
|
|
4
.gitignore
vendored
4
.gitignore
vendored
|
@ -4,3 +4,7 @@
|
||||||
/composer.lock
|
/composer.lock
|
||||||
/nbproject
|
/nbproject
|
||||||
/var
|
/var
|
||||||
|
/Resources/Private/node_modules/
|
||||||
|
/Resources/Private/yarn.lock
|
||||||
|
/Resources/Private/yarn-error.log
|
||||||
|
/Resources/Private/package-lock.json
|
||||||
|
|
|
@ -3,3 +3,4 @@
|
||||||
defined('TYPO3_MODE') || die('Access denied.');
|
defined('TYPO3_MODE') || die('Access denied.');
|
||||||
|
|
||||||
\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addStaticFile('tea', 'Configuration/TypoScript', 'Tea');
|
\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addStaticFile('tea', 'Configuration/TypoScript', 'Tea');
|
||||||
|
\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addStaticFile('tea', 'Configuration/TypoScript/Frontend/', 'Tea frontend (optional)');
|
||||||
|
|
8
Configuration/TypoScript/Frontend/setup.typoscript
Normal file
8
Configuration/TypoScript/Frontend/setup.typoscript
Normal file
|
@ -0,0 +1,8 @@
|
||||||
|
page {
|
||||||
|
includeCSS {
|
||||||
|
tea = EXT:tea/Resources/Public/Css/Main.css
|
||||||
|
}
|
||||||
|
includeJSFooter {
|
||||||
|
tea = EXT:tea/Resources/Public/JavaScript/Main.js
|
||||||
|
}
|
||||||
|
}
|
1
Resources/Private/.eslintignore
Normal file
1
Resources/Private/.eslintignore
Normal file
|
@ -0,0 +1 @@
|
||||||
|
node_modules
|
10
Resources/Private/.eslintrc.json
Normal file
10
Resources/Private/.eslintrc.json
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
{
|
||||||
|
"root": true,
|
||||||
|
"extends": [
|
||||||
|
"eslint:recommended",
|
||||||
|
"plugin:prettier/recommended"
|
||||||
|
],
|
||||||
|
"env": {
|
||||||
|
"browser": true
|
||||||
|
}
|
||||||
|
}
|
7
Resources/Private/.prettierrc.js
Normal file
7
Resources/Private/.prettierrc.js
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
module.exports = {
|
||||||
|
semi: true,
|
||||||
|
trailingComma: "all",
|
||||||
|
singleQuote: true,
|
||||||
|
printWidth: 120,
|
||||||
|
tabWidth: 4
|
||||||
|
};
|
|
@ -23,6 +23,14 @@
|
||||||
<source>Our selection of assorted teas</source>
|
<source>Our selection of assorted teas</source>
|
||||||
<target>Unsere Auswahl an erlesenen Tees</target>
|
<target>Unsere Auswahl an erlesenen Tees</target>
|
||||||
</trans-unit>
|
</trans-unit>
|
||||||
|
<trans-unit id="tx_tea_domain_model_product_tea.uid">
|
||||||
|
<source>UID</source>
|
||||||
|
<target>UID</target>
|
||||||
|
</trans-unit>
|
||||||
|
<trans-unit id="tx_tea_domain_model_product_tea.title">
|
||||||
|
<source>Title</source>
|
||||||
|
<target>Titel</target>
|
||||||
|
</trans-unit>
|
||||||
</body>
|
</body>
|
||||||
</file>
|
</file>
|
||||||
</xliff>
|
</xliff>
|
||||||
|
|
|
@ -18,6 +18,12 @@
|
||||||
<trans-unit id="index.heading">
|
<trans-unit id="index.heading">
|
||||||
<source>Our selection of assorted teas</source>
|
<source>Our selection of assorted teas</source>
|
||||||
</trans-unit>
|
</trans-unit>
|
||||||
|
<trans-unit id="tx_tea_domain_model_product_tea.uid">
|
||||||
|
<source>UID</source>
|
||||||
|
</trans-unit>
|
||||||
|
<trans-unit id="tx_tea_domain_model_product_tea.title">
|
||||||
|
<source>Title</source>
|
||||||
|
</trans-unit>
|
||||||
</body>
|
</body>
|
||||||
</file>
|
</file>
|
||||||
</xliff>
|
</xliff>
|
||||||
|
|
|
@ -8,6 +8,12 @@
|
||||||
</h2>
|
</h2>
|
||||||
|
|
||||||
<table class="table">
|
<table class="table">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th><f:translate key="tx_tea_domain_model_product_tea.uid"/></th>
|
||||||
|
<th><f:translate key="tx_tea_domain_model_product_tea.title"/></th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<f:for each="{teas}" as="tea">
|
<f:for each="{teas}" as="tea">
|
||||||
<tr>
|
<tr>
|
||||||
|
|
27
Resources/Private/package.json
Normal file
27
Resources/Private/package.json
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
{
|
||||||
|
"name": "tea",
|
||||||
|
"description": "",
|
||||||
|
"repository": {
|
||||||
|
"url": "https://github.com/TYPO3-Documentation/tea.git"
|
||||||
|
},
|
||||||
|
"keywords": [],
|
||||||
|
"author": "",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"license": "ISC",
|
||||||
|
"scripts": {
|
||||||
|
"lint:js": "eslint --config .eslintrc.json '../Public/**/*.js'",
|
||||||
|
"lint:js:fix": "eslint --config .eslintrc.json '../Public/**/*.js' --quiet --fix",
|
||||||
|
"lint:style": "stylelint --config stylelint.config.js ../Public/**/*.css",
|
||||||
|
"lint:style:fix": "stylelint --config stylelint.config.js ../Public/**/*.css --fix"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"eslint": "^6.8.0",
|
||||||
|
"eslint-config-prettier": "^6.11.0",
|
||||||
|
"eslint-plugin-import": "^2.20.1",
|
||||||
|
"eslint-plugin-prettier": "^3.1.4",
|
||||||
|
"prettier": "^2.0.5",
|
||||||
|
"stylelint": "^13",
|
||||||
|
"stylelint-config-recommended": "^3.0.0",
|
||||||
|
"stylelint-no-browser-hacks": "^1.2.1"
|
||||||
|
}
|
||||||
|
}
|
110
Resources/Private/stylelint.config.js
Normal file
110
Resources/Private/stylelint.config.js
Normal file
|
@ -0,0 +1,110 @@
|
||||||
|
"use strict";
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
extends: "stylelint-config-recommended",
|
||||||
|
rules: {
|
||||||
|
"at-rule-empty-line-before": [
|
||||||
|
"always",
|
||||||
|
{
|
||||||
|
except: ["blockless-after-same-name-blockless", "first-nested"],
|
||||||
|
ignore: ["after-comment"],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"at-rule-name-case": "lower",
|
||||||
|
"at-rule-name-space-after": "always-single-line",
|
||||||
|
"at-rule-semicolon-newline-after": "always",
|
||||||
|
"block-closing-brace-empty-line-before": "never",
|
||||||
|
"block-closing-brace-newline-after": "always",
|
||||||
|
"block-closing-brace-newline-before": "always-multi-line",
|
||||||
|
"block-closing-brace-space-before": "always-single-line",
|
||||||
|
"block-opening-brace-newline-after": "always-multi-line",
|
||||||
|
"block-opening-brace-space-after": "always-single-line",
|
||||||
|
"block-opening-brace-space-before": "always",
|
||||||
|
"color-hex-case": "lower",
|
||||||
|
"color-hex-length": "short",
|
||||||
|
"comment-empty-line-before": [
|
||||||
|
"always",
|
||||||
|
{
|
||||||
|
except: ["first-nested"],
|
||||||
|
ignore: ["stylelint-commands"],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"comment-whitespace-inside": "always",
|
||||||
|
"custom-property-empty-line-before": [
|
||||||
|
"always",
|
||||||
|
{
|
||||||
|
except: ["after-custom-property", "first-nested"],
|
||||||
|
ignore: ["after-comment", "inside-single-line-block"],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"declaration-bang-space-after": "never",
|
||||||
|
"declaration-bang-space-before": "always",
|
||||||
|
"declaration-block-semicolon-newline-after": "always-multi-line",
|
||||||
|
"declaration-block-semicolon-space-after": "always-single-line",
|
||||||
|
"declaration-block-semicolon-space-before": "never",
|
||||||
|
"declaration-block-single-line-max-declarations": 1,
|
||||||
|
"declaration-block-trailing-semicolon": "always",
|
||||||
|
"declaration-colon-newline-after": "always-multi-line",
|
||||||
|
"declaration-colon-space-after": "always-single-line",
|
||||||
|
"declaration-colon-space-before": "never",
|
||||||
|
"declaration-empty-line-before": [
|
||||||
|
"always",
|
||||||
|
{
|
||||||
|
except: ["after-declaration", "first-nested"],
|
||||||
|
ignore: ["after-comment", "inside-single-line-block"],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"function-comma-newline-after": "always-multi-line",
|
||||||
|
"function-comma-space-after": "always-single-line",
|
||||||
|
"function-comma-space-before": "never",
|
||||||
|
"function-max-empty-lines": 0,
|
||||||
|
"function-name-case": "lower",
|
||||||
|
"function-parentheses-newline-inside": "always-multi-line",
|
||||||
|
"function-parentheses-space-inside": "never-single-line",
|
||||||
|
"function-whitespace-after": "always",
|
||||||
|
indentation: 2,
|
||||||
|
"length-zero-no-unit": true,
|
||||||
|
"max-empty-lines": 1,
|
||||||
|
"media-feature-colon-space-after": "always",
|
||||||
|
"media-feature-colon-space-before": "never",
|
||||||
|
"media-feature-name-case": "lower",
|
||||||
|
"media-feature-parentheses-space-inside": "never",
|
||||||
|
"media-feature-range-operator-space-after": "always",
|
||||||
|
"media-feature-range-operator-space-before": "always",
|
||||||
|
"media-query-list-comma-newline-after": "always-multi-line",
|
||||||
|
"media-query-list-comma-space-after": "always-single-line",
|
||||||
|
"media-query-list-comma-space-before": "never",
|
||||||
|
"no-eol-whitespace": true,
|
||||||
|
"no-missing-end-of-source-newline": true,
|
||||||
|
"number-leading-zero": "always",
|
||||||
|
"number-no-trailing-zeros": true,
|
||||||
|
"property-case": "lower",
|
||||||
|
"rule-empty-line-before": [
|
||||||
|
"always-multi-line",
|
||||||
|
{
|
||||||
|
except: ["first-nested"],
|
||||||
|
ignore: ["after-comment"],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"selector-attribute-brackets-space-inside": "never",
|
||||||
|
"selector-attribute-operator-space-after": "never",
|
||||||
|
"selector-attribute-operator-space-before": "never",
|
||||||
|
"selector-combinator-space-after": "always",
|
||||||
|
"selector-combinator-space-before": "always",
|
||||||
|
"selector-descendant-combinator-no-non-space": true,
|
||||||
|
"selector-list-comma-newline-after": "always",
|
||||||
|
"selector-list-comma-space-before": "never",
|
||||||
|
"selector-max-empty-lines": 0,
|
||||||
|
"selector-pseudo-class-case": "lower",
|
||||||
|
"selector-pseudo-class-parentheses-space-inside": "never",
|
||||||
|
"selector-pseudo-element-case": "lower",
|
||||||
|
"selector-pseudo-element-colon-notation": "double",
|
||||||
|
"selector-type-case": "lower",
|
||||||
|
"unit-case": "lower",
|
||||||
|
"value-keyword-case": "lower",
|
||||||
|
"value-list-comma-newline-after": "always-multi-line",
|
||||||
|
"value-list-comma-space-after": "always-single-line",
|
||||||
|
"value-list-comma-space-before": "never",
|
||||||
|
"value-list-max-empty-lines": 0,
|
||||||
|
},
|
||||||
|
};
|
15
Resources/Public/Css/Main.css
Normal file
15
Resources/Public/Css/Main.css
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
.tx-tea table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tx-tea table,
|
||||||
|
.tx-tea th,
|
||||||
|
.tx-tea td {
|
||||||
|
border: 1px solid black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tx-tea thead th {
|
||||||
|
height: 50px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
41
Resources/Public/JavaScript/Main.js
Normal file
41
Resources/Public/JavaScript/Main.js
Normal file
|
@ -0,0 +1,41 @@
|
||||||
|
var TYPO3 = TYPO3 || {};
|
||||||
|
TYPO3.tea = {};
|
||||||
|
|
||||||
|
TYPO3.tea.makeSortable = function (table) {
|
||||||
|
var th = table.tHead,
|
||||||
|
i;
|
||||||
|
th && (th = th.rows[0]) && (th = th.cells);
|
||||||
|
if (th) i = th.length;
|
||||||
|
else return;
|
||||||
|
while (--i >= 0)
|
||||||
|
(function (i) {
|
||||||
|
var dir = 1;
|
||||||
|
th[i].addEventListener("click", function () {
|
||||||
|
TYPO3.tea.sortTable(table, i, (dir = 1 - dir));
|
||||||
|
});
|
||||||
|
})(i);
|
||||||
|
};
|
||||||
|
|
||||||
|
TYPO3.tea.sortTable = function (table, col, reverse) {
|
||||||
|
var tb = table.tBodies[0],
|
||||||
|
tr = Array.prototype.slice.call(tb.rows, 0),
|
||||||
|
i;
|
||||||
|
reverse = -(+reverse || -1);
|
||||||
|
tr = tr.sort(function (a, b) {
|
||||||
|
return (
|
||||||
|
reverse *
|
||||||
|
a.cells[col].textContent
|
||||||
|
.trim()
|
||||||
|
.localeCompare(b.cells[col].textContent.trim())
|
||||||
|
);
|
||||||
|
});
|
||||||
|
for (i = 0; i < tr.length; ++i) tb.appendChild(tr[i]);
|
||||||
|
};
|
||||||
|
|
||||||
|
document.addEventListener("DOMContentLoaded", function () {
|
||||||
|
var t = document.querySelectorAll(".tx-tea table"),
|
||||||
|
i = t.length;
|
||||||
|
while (--i >= 0) {
|
||||||
|
TYPO3.tea.makeSortable(t[i]);
|
||||||
|
}
|
||||||
|
});
|
Loading…
Reference in a new issue