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

View File

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

View File

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