parse time in modtools with seconds and milliseconds,

allow URL to be inputed in watch
This commit is contained in:
HF 2023-12-30 12:22:05 +01:00
parent 2bfd556c3c
commit 6479923482
3 changed files with 74 additions and 31 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 } from '../core/utils';
import { getToday, dateToString, coordsFromUrl } from '../core/utils';
import { shardOrigin } from '../store/actions/fetch';
const keptState = {
@ -275,9 +275,12 @@ function ModCanvastools() {
maxWidth: '15em',
}}
type="text"
placeholder="X_Y"
placeholder="X_Y or URL"
onChange={(evt) => {
keptState.coords = evt.target.value.trim();
let co = evt.target.value.trim();
co = coordsFromUrl(co) || co;
evt.target.value = co;
keptState.coords = co;
}}
/>
</p>
@ -328,7 +331,7 @@ function ModCanvastools() {
))}
</select>
<p>
{t`Top-left corner`} (X_Y):&nbsp;
{t`Top-left corner`}:&nbsp;
<input
defaultValue={keptState.tlcoords}
style={{
@ -337,15 +340,17 @@ function ModCanvastools() {
maxWidth: '15em',
}}
type="text"
placeholder="X_Y"
placeholder="X_Y or URL"
onChange={(evt) => {
const co = evt.target.value.trim();
let co = evt.target.value.trim();
co = coordsFromUrl(co) || co;
evt.target.value = co;
keptState.tlcoords = co;
}}
/>
</p>
<p>
{t`Bottom-right corner`} (X_Y):&nbsp;
{t`Bottom-right corner`}:&nbsp;
<input
defaultValue={keptState.brcoords}
style={{
@ -354,9 +359,11 @@ function ModCanvastools() {
maxWidth: '15em',
}}
type="text"
placeholder="X_Y"
placeholder="X_Y or URL"
onChange={(evt) => {
const co = evt.target.value.trim();
let co = evt.target.value.trim();
co = coordsFromUrl(co) || co;
evt.target.value = co;
keptState.brcoords = co;
}}
/>
@ -401,7 +408,7 @@ function ModCanvastools() {
}}
/>
<p>
{t`Top-left corner`} (X_Y):&nbsp;
{t`Top-left corner`}:&nbsp;
<input
defaultValue={keptState.tlrcoords}
style={{
@ -410,15 +417,17 @@ function ModCanvastools() {
maxWidth: '15em',
}}
type="text"
placeholder="X_Y"
placeholder="X_Y or URL"
onChange={(evt) => {
const co = evt.target.value.trim();
let co = evt.target.value.trim();
co = coordsFromUrl(co) || co;
evt.target.value = co;
keptState.tlrcoords = co;
}}
/>
</p>
<p>
{t`Bottom-right corner`} (X_Y):&nbsp;
{t`Bottom-right corner`}:&nbsp;
<input
defaultValue={keptState.brrcoords}
style={{
@ -427,9 +436,11 @@ function ModCanvastools() {
maxWidth: '15em',
}}
type="text"
placeholder="X_Y"
placeholder="X_Y or URL"
onChange={(evt) => {
const co = evt.target.value.trim();
let co = evt.target.value.trim();
co = coordsFromUrl(co) || co;
evt.target.value = co;
keptState.brrcoords = co;
}}
/>
@ -484,7 +495,7 @@ function ModCanvastools() {
{cleanerStatusString}
</p>
<p>
{t`Top-left corner`} (X_Y):&nbsp;
{t`Top-left corner`}:&nbsp;
<input
defaultValue={keptState.tlccoords}
style={{
@ -493,15 +504,17 @@ function ModCanvastools() {
maxWidth: '15em',
}}
type="text"
placeholder="X_Y"
placeholder="X_Y or URL"
onChange={(evt) => {
const co = evt.target.value.trim();
let co = evt.target.value.trim();
co = coordsFromUrl(co) || co;
evt.target.value = co;
keptState.tlccoords = co;
}}
/>
</p>
<p>
{t`Bottom-right corner`} (X_Y):&nbsp;
{t`Bottom-right corner`}:&nbsp;
<input
defaultValue={keptState.brccoords}
style={{
@ -510,9 +523,11 @@ function ModCanvastools() {
maxWidth: '15em',
}}
type="text"
placeholder="X_Y"
placeholder="X_Y or URL"
onChange={(evt) => {
const co = evt.target.value.trim();
let co = evt.target.value.trim();
co = coordsFromUrl(co) || co;
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 } from '../core/utils';
import { parseInterval, coordsFromUrl } from '../core/utils';
import { shardOrigin } from '../store/actions/fetch';
const keepState = {
@ -173,7 +173,7 @@ function ModWatchtools() {
/>
</p>
<p>
{t`Top-left corner`} (X_Y):&nbsp;
{t`Top-left corner`}:&nbsp;
<input
defaultValue={keepState.tlcoords}
style={{
@ -182,15 +182,17 @@ function ModWatchtools() {
maxWidth: '15em',
}}
type="text"
placeholder="X_Y"
placeholder="X_Y or URL"
onChange={(evt) => {
const co = evt.target.value.trim();
let co = evt.target.value.trim();
co = coordsFromUrl(co) || co;
evt.target.value = co;
keepState.tlcoords = co;
}}
/>
</p>
<p>
{t`Bottom-right corner`} (X_Y):&nbsp;
{t`Bottom-right corner`}:&nbsp;
<input
defaultValue={keepState.brcoords}
style={{
@ -199,9 +201,11 @@ function ModWatchtools() {
maxWidth: '15em',
}}
type="text"
placeholder="X_Y"
placeholder="X_Y or URL"
onChange={(evt) => {
const co = evt.target.value.trim();
let co = evt.target.value.trim();
co = coordsFromUrl(co) || co;
evt.target.value = co;
keepState.brcoords = co;
}}
/>
@ -312,11 +316,13 @@ function ModWatchtools() {
switch (type) {
case 'ts': {
const date = new Date(val);
let minutes = date.getMinutes();
if (minutes < 10) minutes = `0${minutes}`;
const hours = date.getHours();
const minutes = `0${date.getMinutes()}`.slice(-2);
const seconds = `0${date.getSeconds()}`.slice(-2);
const ms = `00${date.getMilliseconds()}`.slice(-3);
return (
<td key={type} title={date.toLocaleDateString()}>
{`${date.getHours()}:${minutes}`}
{`${hours}:${minutes}:${seconds}.${ms}`}
</td>
);
}

View File

@ -470,6 +470,28 @@ export function getDateTimeString(timestamp) {
return date.toLocaleTimeString();
}
/*
* get X_Y coordinates out of URL
* @param url url ending with #canas,x,y,z coords
* @return coordinates in X_Y form or null
*/
export function coordsFromUrl(url) {
let splitInd = url.lastIndexOf('#');
if (splitInd === -1) {
return null;
}
let part = url.slice(splitInd + 1);
splitInd = part.indexOf('?');
if (splitInd !== -1) {
part = part.slice(0, splitInd);
}
const [, x, y] = part.split(',');
if (x && y) {
return `${x}_${y}`;
}
return null;
}
/*
* parse interval in s/m/h form to timestamp
* @param interval string like "2d"