allow x,y coordinates in various coordinates input

This commit is contained in:
HF 2024-02-13 15:08:27 +01:00
parent cba4ba0901
commit 0ad4a997b8
4 changed files with 74 additions and 44 deletions

View File

@ -7,7 +7,7 @@ import { useSelector, shallowEqual } from 'react-redux';
import { t } from 'ttag'; import { t } from 'ttag';
import useInterval from './hooks/interval'; import useInterval from './hooks/interval';
import { getToday, dateToString, coordsFromUrl } from '../core/utils'; import { getToday, dateToString, coordsFromString } from '../core/utils';
import { shardOrigin } from '../store/actions/fetch'; import { shardOrigin } from '../store/actions/fetch';
const keptState = { const keptState = {
@ -278,8 +278,11 @@ function ModCanvastools() {
placeholder="X_Y or URL" placeholder="X_Y or URL"
onChange={(evt) => { onChange={(evt) => {
let co = evt.target.value.trim(); let co = evt.target.value.trim();
co = coordsFromUrl(co) || co; co = coordsFromString(co);
evt.target.value = co; if (co) {
co = co.join('_');
evt.target.value = co;
}
keptState.coords = co; keptState.coords = co;
}} }}
/> />
@ -343,8 +346,11 @@ function ModCanvastools() {
placeholder="X_Y or URL" placeholder="X_Y or URL"
onChange={(evt) => { onChange={(evt) => {
let co = evt.target.value.trim(); let co = evt.target.value.trim();
co = coordsFromUrl(co) || co; co = coordsFromString(co);
evt.target.value = co; if (co) {
co = co.join('_');
evt.target.value = co;
}
keptState.tlcoords = co; keptState.tlcoords = co;
}} }}
/> />
@ -362,8 +368,11 @@ function ModCanvastools() {
placeholder="X_Y or URL" placeholder="X_Y or URL"
onChange={(evt) => { onChange={(evt) => {
let co = evt.target.value.trim(); let co = evt.target.value.trim();
co = coordsFromUrl(co) || co; co = coordsFromString(co);
evt.target.value = co; if (co) {
co = co.join('_');
evt.target.value = co;
}
keptState.brcoords = co; keptState.brcoords = co;
}} }}
/> />
@ -420,8 +429,11 @@ function ModCanvastools() {
placeholder="X_Y or URL" placeholder="X_Y or URL"
onChange={(evt) => { onChange={(evt) => {
let co = evt.target.value.trim(); let co = evt.target.value.trim();
co = coordsFromUrl(co) || co; co = coordsFromString(co);
evt.target.value = co; if (co) {
co = co.join('_');
evt.target.value = co;
}
keptState.tlrcoords = co; keptState.tlrcoords = co;
}} }}
/> />
@ -439,8 +451,11 @@ function ModCanvastools() {
placeholder="X_Y or URL" placeholder="X_Y or URL"
onChange={(evt) => { onChange={(evt) => {
let co = evt.target.value.trim(); let co = evt.target.value.trim();
co = coordsFromUrl(co) || co; co = coordsFromString(co);
evt.target.value = co; if (co) {
co = co.join('_');
evt.target.value = co;
}
keptState.brrcoords = co; keptState.brrcoords = co;
}} }}
/> />
@ -507,8 +522,11 @@ function ModCanvastools() {
placeholder="X_Y or URL" placeholder="X_Y or URL"
onChange={(evt) => { onChange={(evt) => {
let co = evt.target.value.trim(); let co = evt.target.value.trim();
co = coordsFromUrl(co) || co; co = coordsFromString(co);
evt.target.value = co; if (co) {
co = co.join('_');
evt.target.value = co;
}
keptState.tlccoords = co; keptState.tlccoords = co;
}} }}
/> />
@ -526,8 +544,11 @@ function ModCanvastools() {
placeholder="X_Y or URL" placeholder="X_Y or URL"
onChange={(evt) => { onChange={(evt) => {
let co = evt.target.value.trim(); let co = evt.target.value.trim();
co = coordsFromUrl(co) || co; co = coordsFromString(co);
evt.target.value = co; if (co) {
co = co.join('_');
evt.target.value = co;
}
keptState.brccoords = co; keptState.brccoords = co;
}} }}
/> />

View File

@ -8,7 +8,7 @@ import { useSelector, shallowEqual } from 'react-redux';
import { t } from 'ttag'; import { t } from 'ttag';
import copyTextToClipboard from '../utils/clipboard'; import copyTextToClipboard from '../utils/clipboard';
import { parseInterval, coordsFromUrl } from '../core/utils'; import { parseInterval, coordsFromString } from '../core/utils';
import { shardOrigin } from '../store/actions/fetch'; import { shardOrigin } from '../store/actions/fetch';
const keepState = { const keepState = {
@ -185,8 +185,11 @@ function ModWatchtools() {
placeholder="X_Y or URL" placeholder="X_Y or URL"
onChange={(evt) => { onChange={(evt) => {
let co = evt.target.value.trim(); let co = evt.target.value.trim();
co = coordsFromUrl(co) || co; co = coordsFromString(co);
evt.target.value = co; if (co) {
co = co.join('_');
evt.target.value = co;
}
keepState.tlcoords = co; keepState.tlcoords = co;
}} }}
/> />
@ -204,8 +207,11 @@ function ModWatchtools() {
placeholder="X_Y or URL" placeholder="X_Y or URL"
onChange={(evt) => { onChange={(evt) => {
let co = evt.target.value.trim(); let co = evt.target.value.trim();
co = coordsFromUrl(co) || co; co = coordsFromString(co);
evt.target.value = co; if (co) {
co = co.join('_');
evt.target.value = co;
}
keepState.brcoords = co; keepState.brcoords = co;
}} }}
/> />

View File

@ -9,7 +9,7 @@ import { useSelector, shallowEqual } from 'react-redux';
import { t } from 'ttag'; import { t } from 'ttag';
import templateLoader from '../ui/templateLoader'; import templateLoader from '../ui/templateLoader';
import { coordsFromUrl } from '../core/utils'; import { coordsFromString } from '../core/utils';
const TemplateItemEdit = ({ const TemplateItemEdit = ({
title: initTitle, title: initTitle,
@ -18,13 +18,13 @@ const TemplateItemEdit = ({
imageId, imageId,
stopEditing, stopEditing,
}) => { }) => {
const [initCoords, initDimensions] = useMemo(() => [ const [initCoords] = useMemo(() => [
(Number.isNaN(parseInt(initX, 10)) (Number.isNaN(parseInt(initX, 10))
|| Number.isNaN(parseInt(initY, 10))) ? null : [initX, initY], || Number.isNaN(parseInt(initY, 10))) ? null : [initX, initY],
], [initX, initY]); ], [initX, initY]);
const [coords, setCoords] = useState(initCoords); const [coords, setCoords] = useState(initCoords);
const [dimensions, setDimensions] = useState(initDimensions); const [dimensions, setDimensions] = useState(null);
const [title, setTitle] = useState(initTitle || ''); const [title, setTitle] = useState(initTitle || '');
const [file, setFile] = useState(null); const [file, setFile] = useState(null);
const [titleUnique, setTitleUnique] = useState(true); const [titleUnique, setTitleUnique] = useState(true);
@ -148,14 +148,11 @@ const TemplateItemEdit = ({
}} }}
placeholder="X_Y or URL" placeholder="X_Y or URL"
onChange={(evt) => { onChange={(evt) => {
let co = evt.target.value.trim(); const co = coordsFromString(evt.target.value.trim());
co = coordsFromUrl(co) || co; if (co) {
evt.target.value = co; evt.target.value = co.join('_');
const newCoords = co.split('_').map((z) => parseInt(z, 10)); }
setCoords( setCoords(co);
(!newCoords.some(Number.isNaN) && newCoords.length === 2)
? newCoords : null,
);
}} }}
/></span> /></span>
</p> </p>

View File

@ -471,25 +471,31 @@ export function getDateTimeString(timestamp) {
} }
/* /*
* get X_Y coordinates out of URL * get X_Y coordinates out of url or x_y or x,y string
* @param url url ending with #canas,x,y,z coords * @param url url ending with #canas,x,y,z coords
* @return coordinates in X_Y form or null * @return coordinates in [x,y] array or null
*/ */
export function coordsFromUrl(url) { export function coordsFromString(url) {
let splitInd = url.lastIndexOf('#'); let splitInd = url.lastIndexOf('#');
if (splitInd === -1) { let coords = [];
return null;
}
let part = url.slice(splitInd + 1);
splitInd = part.indexOf('?');
if (splitInd !== -1) { if (splitInd !== -1) {
part = part.slice(0, splitInd); let part = url.slice(splitInd + 1);
splitInd = part.indexOf('?');
if (splitInd !== -1) {
part = part.slice(0, splitInd);
}
coords = part.split(',').map((z) => parseInt(z, 10)).slice(1);
} }
const [, x, y] = part.split(','); if (coords.length !== 2 || coords.some(Number.isNaN)) {
if (x && y) { coords = url.split('_').map((z) => parseInt(z, 10));
return `${x}_${y}`;
} }
return null; if (coords.length !== 2 || coords.some(Number.isNaN)) {
coords = url.split(',').map((z) => parseInt(z, 10));
}
if (coords.length !== 2 || coords.some(Number.isNaN)) {
coords = null;
}
return coords;
} }
/* /*