Archos/masto-fe-archos
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[build] upgrade eslint to 9.37.0 (#88)

Browse Source 
Co-authored-by: tobi <tobi.smethurst@protonmail.com>
Reviewed-on: https://codeberg.org/superseriousbusiness/masto-fe-standalone/pulls/88
Co-authored-by: Zoë Bijl <moiety@noreply.codeberg.org>
Co-committed-by: Zoë Bijl <moiety@noreply.codeberg.org>
This commit is contained in:
Zoë Bijl
2025-10-12 13:42:02 +02:00
committed by tobi
parent 75d7a62693
commit 1ff70886a1
975 changed files with 22196 additions and 21964 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/javascript/flavours/glitch/features/ui/components/doodle_modal.jsx
+150 -138
View File
@@ -1,96 +1,96 @@
import PropTypes from 'prop-types';
import PropTypes from "prop-types";
import classNames from 'classnames';
import classNames from "classnames";
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { connect } from 'react-redux';
import ImmutablePropTypes from "react-immutable-proptypes";
import ImmutablePureComponent from "react-immutable-pure-component";
import { connect } from "react-redux";
import Atrament from 'atrament'; // the doodling library
import { debounce, mapValues } from 'lodash';
import Atrament from "atrament"; // the doodling library
import { debounce, mapValues } from "lodash";
import { doodleSet, uploadCompose } from 'flavours/glitch/actions/compose';
import Button from 'flavours/glitch/components/button';
import { IconButton } from 'flavours/glitch/components/icon_button';
import { doodleSet, uploadCompose } from "flavours/glitch/actions/compose";
import Button from "flavours/glitch/components/button";
import { IconButton } from "flavours/glitch/components/icon_button";
// palette nicked from MyPaint, CC0
const palette = [
['rgb( 0, 0, 0)', 'Black'],
['rgb( 38, 38, 38)', 'Gray 15'],
['rgb( 77, 77, 77)', 'Grey 30'],
['rgb(128, 128, 128)', 'Grey 50'],
['rgb(171, 171, 171)', 'Grey 67'],
['rgb(217, 217, 217)', 'Grey 85'],
['rgb(255, 255, 255)', 'White'],
['rgb(128, 0, 0)', 'Maroon'],
['rgb(209, 0, 0)', 'English-red'],
['rgb(255, 54, 34)', 'Tomato'],
['rgb(252, 60, 3)', 'Orange-red'],
['rgb(255, 140, 105)', 'Salmon'],
['rgb(252, 232, 32)', 'Cadium-yellow'],
['rgb(243, 253, 37)', 'Lemon yellow'],
['rgb(121, 5, 35)', 'Dark crimson'],
['rgb(169, 32, 62)', 'Deep carmine'],
['rgb(255, 140, 0)', 'Orange'],
['rgb(255, 168, 18)', 'Dark tangerine'],
['rgb(217, 144, 88)', 'Persian orange'],
['rgb(194, 178, 128)', 'Sand'],
['rgb(255, 229, 180)', 'Peach'],
['rgb(100, 54, 46)', 'Bole'],
['rgb(108, 41, 52)', 'Dark cordovan'],
['rgb(163, 65, 44)', 'Chestnut'],
['rgb(228, 136, 100)', 'Dark salmon'],
['rgb(255, 195, 143)', 'Apricot'],
['rgb(255, 219, 188)', 'Unbleached silk'],
['rgb(242, 227, 198)', 'Straw'],
['rgb( 53, 19, 13)', 'Bistre'],
['rgb( 84, 42, 14)', 'Dark chocolate'],
['rgb(102, 51, 43)', 'Burnt sienna'],
['rgb(184, 66, 0)', 'Sienna'],
['rgb(216, 153, 12)', 'Yellow ochre'],
['rgb(210, 180, 140)', 'Tan'],
['rgb(232, 204, 144)', 'Dark wheat'],
['rgb( 0, 49, 83)', 'Prussian blue'],
['rgb( 48, 69, 119)', 'Dark grey blue'],
['rgb( 0, 71, 171)', 'Cobalt blue'],
['rgb( 31, 117, 254)', 'Blue'],
['rgb(120, 180, 255)', 'Bright french blue'],
['rgb(171, 200, 255)', 'Bright steel blue'],
['rgb(208, 231, 255)', 'Ice blue'],
['rgb( 30, 51, 58)', 'Medium jungle green'],
['rgb( 47, 79, 79)', 'Dark slate grey'],
['rgb( 74, 104, 93)', 'Dark grullo green'],
['rgb( 0, 128, 128)', 'Teal'],
['rgb( 67, 170, 176)', 'Turquoise'],
['rgb(109, 174, 199)', 'Cerulean frost'],
['rgb(173, 217, 186)', 'Tiffany green'],
['rgb( 22, 34, 29)', 'Gray-asparagus'],
['rgb( 36, 48, 45)', 'Medium dark teal'],
['rgb( 74, 104, 93)', 'Xanadu'],
['rgb(119, 198, 121)', 'Mint'],
['rgb(175, 205, 182)', 'Timberwolf'],
['rgb(185, 245, 246)', 'Celeste'],
['rgb(193, 255, 234)', 'Aquamarine'],
['rgb( 29, 52, 35)', 'Cal Poly Pomona'],
['rgb( 1, 68, 33)', 'Forest green'],
['rgb( 42, 128, 0)', 'Napier green'],
['rgb(128, 128, 0)', 'Olive'],
['rgb( 65, 156, 105)', 'Sea green'],
['rgb(189, 246, 29)', 'Green-yellow'],
['rgb(231, 244, 134)', 'Bright chartreuse'],
['rgb(138, 23, 137)', 'Purple'],
['rgb( 78, 39, 138)', 'Violet'],
['rgb(193, 75, 110)', 'Dark thulian pink'],
['rgb(222, 49, 99)', 'Cerise'],
['rgb(255, 20, 147)', 'Deep pink'],
['rgb(255, 102, 204)', 'Rose pink'],
['rgb(255, 203, 219)', 'Pink'],
['rgb(255, 255, 255)', 'White'],
['rgb(229, 17, 1)', 'RGB Red'],
['rgb( 0, 255, 0)', 'RGB Green'],
['rgb( 0, 0, 255)', 'RGB Blue'],
['rgb( 0, 255, 255)', 'CMYK Cyan'],
['rgb(255, 0, 255)', 'CMYK Magenta'],
['rgb(255, 255, 0)', 'CMYK Yellow'],
["rgb( 0, 0, 0)", "Black"],
["rgb( 38, 38, 38)", "Gray 15"],
["rgb( 77, 77, 77)", "Grey 30"],
["rgb(128, 128, 128)", "Grey 50"],
["rgb(171, 171, 171)", "Grey 67"],
["rgb(217, 217, 217)", "Grey 85"],
["rgb(255, 255, 255)", "White"],
["rgb(128, 0, 0)", "Maroon"],
["rgb(209, 0, 0)", "English-red"],
["rgb(255, 54, 34)", "Tomato"],
["rgb(252, 60, 3)", "Orange-red"],
["rgb(255, 140, 105)", "Salmon"],
["rgb(252, 232, 32)", "Cadium-yellow"],
["rgb(243, 253, 37)", "Lemon yellow"],
["rgb(121, 5, 35)", "Dark crimson"],
["rgb(169, 32, 62)", "Deep carmine"],
["rgb(255, 140, 0)", "Orange"],
["rgb(255, 168, 18)", "Dark tangerine"],
["rgb(217, 144, 88)", "Persian orange"],
["rgb(194, 178, 128)", "Sand"],
["rgb(255, 229, 180)", "Peach"],
["rgb(100, 54, 46)", "Bole"],
["rgb(108, 41, 52)", "Dark cordovan"],
["rgb(163, 65, 44)", "Chestnut"],
["rgb(228, 136, 100)", "Dark salmon"],
["rgb(255, 195, 143)", "Apricot"],
["rgb(255, 219, 188)", "Unbleached silk"],
["rgb(242, 227, 198)", "Straw"],
["rgb( 53, 19, 13)", "Bistre"],
["rgb( 84, 42, 14)", "Dark chocolate"],
["rgb(102, 51, 43)", "Burnt sienna"],
["rgb(184, 66, 0)", "Sienna"],
["rgb(216, 153, 12)", "Yellow ochre"],
["rgb(210, 180, 140)", "Tan"],
["rgb(232, 204, 144)", "Dark wheat"],
["rgb( 0, 49, 83)", "Prussian blue"],
["rgb( 48, 69, 119)", "Dark grey blue"],
["rgb( 0, 71, 171)", "Cobalt blue"],
["rgb( 31, 117, 254)", "Blue"],
["rgb(120, 180, 255)", "Bright french blue"],
["rgb(171, 200, 255)", "Bright steel blue"],
["rgb(208, 231, 255)", "Ice blue"],
["rgb( 30, 51, 58)", "Medium jungle green"],
["rgb( 47, 79, 79)", "Dark slate grey"],
["rgb( 74, 104, 93)", "Dark grullo green"],
["rgb( 0, 128, 128)", "Teal"],
["rgb( 67, 170, 176)", "Turquoise"],
["rgb(109, 174, 199)", "Cerulean frost"],
["rgb(173, 217, 186)", "Tiffany green"],
["rgb( 22, 34, 29)", "Gray-asparagus"],
["rgb( 36, 48, 45)", "Medium dark teal"],
["rgb( 74, 104, 93)", "Xanadu"],
["rgb(119, 198, 121)", "Mint"],
["rgb(175, 205, 182)", "Timberwolf"],
["rgb(185, 245, 246)", "Celeste"],
["rgb(193, 255, 234)", "Aquamarine"],
["rgb( 29, 52, 35)", "Cal Poly Pomona"],
["rgb( 1, 68, 33)", "Forest green"],
["rgb( 42, 128, 0)", "Napier green"],
["rgb(128, 128, 0)", "Olive"],
["rgb( 65, 156, 105)", "Sea green"],
["rgb(189, 246, 29)", "Green-yellow"],
["rgb(231, 244, 134)", "Bright chartreuse"],
["rgb(138, 23, 137)", "Purple"],
["rgb( 78, 39, 138)", "Violet"],
["rgb(193, 75, 110)", "Dark thulian pink"],
["rgb(222, 49, 99)", "Cerise"],
["rgb(255, 20, 147)", "Deep pink"],
["rgb(255, 102, 204)", "Rose pink"],
["rgb(255, 203, 219)", "Pink"],
["rgb(255, 255, 255)", "White"],
["rgb(229, 17, 1)", "RGB Red"],
["rgb( 0, 255, 0)", "RGB Green"],
["rgb( 0, 0, 255)", "RGB Blue"],
["rgb( 0, 255, 255)", "CMYK Cyan"],
["rgb(255, 0, 255)", "CMYK Magenta"],
["rgb(255, 255, 0)", "CMYK Yellow"],
];
// re-arrange to the right order for display
@@ -105,7 +105,7 @@ for (let row = 0; row < 7; row++) {
// Utility for converting base64 image to binary for upload
// https://stackoverflow.com/questions/35940290/how-to-convert-base64-string-to-javascript-file-object-like-as-from-file-input-f
function dataURLtoFile(dataurl, filename) {
let arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
let arr = dataurl.split(","), mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
while(n--){
u8arr[n] = bstr.charCodeAt(n);
@@ -114,16 +114,16 @@ function dataURLtoFile(dataurl, filename) {
}
/** Doodle canvas size options */
const DOODLE_SIZES = {
normal: [500, 500, 'Square 500'],
tootbanner: [702, 330, 'Tootbanner'],
s640x480: [640, 480, '640×480 - 480p'],
s800x600: [800, 600, '800×600 - SVGA'],
s720x480: [720, 405, '720x405 - 16:9'],
normal: [500, 500, "Square 500"],
tootbanner: [702, 330, "Tootbanner"],
s640x480: [640, 480, "640×480 - 480p"],
s800x600: [800, 600, "800×600 - SVGA"],
s720x480: [720, 405, "720x405 - 16:9"],
};
const mapStateToProps = state => ({
options: state.getIn(['compose', 'doodle']),
options: state.getIn(["compose", "doodle"]),
});
const mapDispatchToProps = dispatch => ({
@@ -166,7 +166,7 @@ class DoodleModal extends ImmutablePureComponent {
/** Foreground color */
get fg () {
return this.props.options.get('fg');
return this.props.options.get("fg");
}
set fg (value) {
this.props.setOpt({ fg: value });
@@ -174,7 +174,7 @@ class DoodleModal extends ImmutablePureComponent {
/** Background color */
get bg () {
return this.props.options.get('bg');
return this.props.options.get("bg");
}
set bg (value) {
this.props.setOpt({ bg: value });
@@ -182,7 +182,7 @@ class DoodleModal extends ImmutablePureComponent {
/** Swap Fg and Bg for drawing */
get swapped () {
return this.props.options.get('swapped');
return this.props.options.get("swapped");
}
set swapped (value) {
this.props.setOpt({ swapped: value });
@@ -190,7 +190,7 @@ class DoodleModal extends ImmutablePureComponent {
/** Mode - 'draw' or 'fill' */
get mode () {
return this.props.options.get('mode');
return this.props.options.get("mode");
}
set mode (value) {
this.props.setOpt({ mode: value });
@@ -198,7 +198,7 @@ class DoodleModal extends ImmutablePureComponent {
/** Base line weight */
get weight () {
return this.props.options.get('weight');
return this.props.options.get("weight");
}
set weight (value) {
this.props.setOpt({ weight: value });
@@ -206,7 +206,7 @@ class DoodleModal extends ImmutablePureComponent {
/** Drawing opacity */
get opacity () {
return this.props.options.get('opacity');
return this.props.options.get("opacity");
}
set opacity (value) {
this.props.setOpt({ opacity: value });
@@ -214,7 +214,7 @@ class DoodleModal extends ImmutablePureComponent {
/** Adaptive stroke - change width with speed */
get adaptiveStroke () {
return this.props.options.get('adaptiveStroke');
return this.props.options.get("adaptiveStroke");
}
set adaptiveStroke (value) {
this.props.setOpt({ adaptiveStroke: value });
@@ -222,7 +222,7 @@ class DoodleModal extends ImmutablePureComponent {
/** Smoothing (for mouse drawing) */
get smoothing () {
return this.props.options.get('smoothing');
return this.props.options.get("smoothing");
}
set smoothing (value) {
this.props.setOpt({ smoothing: value });
@@ -230,7 +230,7 @@ class DoodleModal extends ImmutablePureComponent {
/** Size preset */
get size () {
return this.props.options.get('size');
return this.props.options.get("size");
}
set size (value) {
this.props.setOpt({ size: value });
@@ -243,27 +243,29 @@ class DoodleModal extends ImmutablePureComponent {
* @param {KeyboardEvent} e
*/
handleKeyUp = (e) => {
if (e.target.nodeName === 'INPUT') return;
if (e.target.nodeName === "INPUT") {
return;
}
if (e.key === 'Delete') {
if (e.key === "Delete") {
e.preventDefault();
this.handleClearBtn();
return;
}
if (e.key === 'Backspace' || (e.key === 'z' && (e.ctrlKey || e.metaKey))) {
if (e.key === "Backspace" || (e.key === "z" && (e.ctrlKey || e.metaKey))) {
e.preventDefault();
this.undo();
}
if (e.key === 'Control' || e.key === 'Meta') {
if (e.key === "Control" || e.key === "Meta") {
this.controlHeld = false;
this.swapped = false;
}
if (e.key === 'Shift') {
if (e.key === "Shift") {
this.shiftHeld = false;
this.mode = 'draw';
this.mode = "draw";
}
};
@@ -272,14 +274,14 @@ class DoodleModal extends ImmutablePureComponent {
* @param {KeyboardEvent} e
*/
handleKeyDown = (e) => {
if (e.key === 'Control' || e.key === 'Meta') {
if (e.key === "Control" || e.key === "Meta") {
this.controlHeld = true;
this.swapped = true;
}
if (e.key === 'Shift') {
if (e.key === "Shift") {
this.shiftHeld = true;
this.mode = 'fill';
this.mode = "fill";
}
};
@@ -290,17 +292,19 @@ class DoodleModal extends ImmutablePureComponent {
this.controlHeld = false;
this.shiftHeld = false;
this.swapped = false;
window.addEventListener('keyup', this.handleKeyUp, false);
window.addEventListener('keydown', this.handleKeyDown, false);
window.addEventListener("keyup", this.handleKeyUp, false);
window.addEventListener("keydown", this.handleKeyDown, false);
}
/**
* Tear component down
*/
componentWillUnmount () {
window.removeEventListener('keyup', this.handleKeyUp, false);
window.removeEventListener('keydown', this.handleKeyDown, false);
if (this.sketcher) this.sketcher.destroy();
window.removeEventListener("keyup", this.handleKeyUp, false);
window.removeEventListener("keydown", this.handleKeyDown, false);
if (this.sketcher) {
this.sketcher.destroy();
}
}
/**
@@ -311,37 +315,37 @@ class DoodleModal extends ImmutablePureComponent {
setCanvasRef = (elem) => {
this.canvas = elem;
if (elem) {
elem.addEventListener('dirty', () => {
elem.addEventListener("dirty", () => {
this.saveUndo();
this.sketcher._dirty = false;
});
elem.addEventListener('click', () => {
elem.addEventListener("click", () => {
// sketcher bug - does not fire dirty on fill
if (this.mode === 'fill') {
if (this.mode === "fill") {
this.saveUndo();
}
});
// prevent context menu
elem.addEventListener('contextmenu', (e) => {
elem.addEventListener("contextmenu", (e) => {
e.preventDefault();
});
elem.addEventListener('mousedown', (e) => {
elem.addEventListener("mousedown", (e) => {
if (e.button === 2) {
this.swapped = true;
}
});
elem.addEventListener('mouseup', (e) => {
elem.addEventListener("mouseup", (e) => {
if (e.button === 2) {
this.swapped = this.controlHeld;
}
});
this.initSketcher(elem);
this.mode = 'draw'; // Reset mode - it's confusing if left at 'fill'
this.mode = "draw"; // Reset mode - it's confusing if left at 'fill'
}
};
@@ -352,7 +356,9 @@ class DoodleModal extends ImmutablePureComponent {
initSketcher (canvas = null) {
const sizepreset = DOODLE_SIZES[this.size];
if (this.sketcher) this.sketcher.destroy();
if (this.sketcher) {
this.sketcher.destroy();
}
this.sketcher = new Atrament(canvas || this.canvas, sizepreset[0], sizepreset[1]);
if (canvas) {
@@ -368,7 +374,7 @@ class DoodleModal extends ImmutablePureComponent {
*/
onDoneButton = () => {
const dataUrl = this.sketcher.toImage();
const file = dataURLtoFile(dataUrl, 'doodle.png');
const file = dataURLtoFile(dataUrl, "doodle.png");
this.props.submit(file);
this.props.onClose(); // close dialog
};
@@ -377,7 +383,7 @@ class DoodleModal extends ImmutablePureComponent {
* Cancel button handler
*/
onCancelButton = () => {
if (this.undos.length > 1 && !confirm('Discard doodle? All changes will be lost!')) {
if (this.undos.length > 1 && !confirm("Discard doodle? All changes will be lost!")) {
return;
}
@@ -388,9 +394,13 @@ class DoodleModal extends ImmutablePureComponent {
* Update sketcher options based on state
*/
updateSketcherSettings () {
if (!this.sketcher) return;
if (!this.sketcher) {
return;
}
if (this.oldSize !== this.size) this.initSketcher();
if (this.oldSize !== this.size) {
this.initSketcher();
}
this.sketcher.color = (this.swapped ? this.bg : this.fg);
this.sketcher.opacity = this.opacity;
@@ -476,7 +486,7 @@ class DoodleModal extends ImmutablePureComponent {
* @param {MouseEvent<HTMLButtonElement>} e - event
*/
setModeDraw = (e) => {
this.mode = 'draw';
this.mode = "draw";
e.target.blur();
};
@@ -485,7 +495,7 @@ class DoodleModal extends ImmutablePureComponent {
* @param {MouseEvent<HTMLButtonElement>} e - event
*/
setModeFill = (e) => {
this.mode = 'fill';
this.mode = "fill";
e.target.blur();
};
@@ -521,9 +531,11 @@ class DoodleModal extends ImmutablePureComponent {
*/
changeSize = (e) => {
let newSize = e.target.value;
if (newSize === this.oldSize) return;
if (newSize === this.oldSize) {
return;
}
if (this.undos.length > 1 && !confirm('Change canvas size? This will erase your current drawing!')) {
if (this.undos.length > 1 && !confirm("Change canvas size? This will erase your current drawing!")) {
return;
}
@@ -531,7 +543,7 @@ class DoodleModal extends ImmutablePureComponent {
};
handleClearBtn = () => {
if (this.undos.length > 1 && !confirm('Clear canvas? This will erase your current drawing!')) {
if (this.undos.length > 1 && !confirm("Clear canvas? This will erase your current drawing!")) {
return;
}
@@ -584,8 +596,8 @@ class DoodleModal extends ImmutablePureComponent {
</div>
</div>
<div className='doodle-toolbar'>
<IconButton icon='pencil' title='Draw' label='Draw' onClick={this.setModeDraw} size={18} active={this.mode === 'draw'} inverted />
<IconButton icon='bath' title='Fill' label='Fill' onClick={this.setModeFill} size={18} active={this.mode === 'fill'} inverted />
<IconButton icon='pencil' title='Draw' label='Draw' onClick={this.setModeDraw} size={18} active={this.mode === "draw"} inverted />
<IconButton icon='bath' title='Fill' label='Fill' onClick={this.setModeFill} size={18} active={this.mode === "fill"} inverted />
<IconButton icon='undo' title='Undo' label='Undo' onClick={this.undo} size={18} inverted />
<IconButton icon='trash' title='Clear' label='Clear' onClick={this.handleClearBtn} size={18} inverted />
</div>
@@ -602,8 +614,8 @@ class DoodleModal extends ImmutablePureComponent {
data-color={c[0]}
title={c[1]}
className={classNames({
'foreground': this.fg === c[0],
'background': this.bg === c[0],
"foreground": this.fg === c[0],
"background": this.bg === c[0],
})}
/>,
)