muerwre/orchidmap-front
1
0
Fork 0
mirror of https://github.com/muerwre/orchidmap-front.git synced 2025-04-25 19:16:41 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions

fixed markers in edit mode when appears

Browse source
This commit is contained in:
muerwre 2019-03-05 16:56:15 +07:00
parent 9744b0dfd5
commit 18ccd32eea
2 changed files with 27 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

19
src/modules/Sticker.tsx
View file

@ -9,7 +9,7 @@ import classnames from 'classnames';
import { getLabelDirection } from '$utils/geom'; import { getLabelDirection } from '$utils/geom';
import { ILatLng } from "$modules/Stickers"; import { ILatLng } from "$modules/Stickers";
import { IRootState } from "$redux/user/reducer"; import { IRootState } from "$redux/user/reducer";
import { editor } from "$modules/Editor"; import { Editor, editor } from "$modules/Editor";
const getX = e => ( const getX = e => (
e.touches && e.touches.length > 0 e.touches && e.touches.length > 0
@ -33,6 +33,7 @@ interface Props {
set: IRootState['activeSticker']['set']; set: IRootState['activeSticker']['set'];
angle?: number; angle?: number;
text?: string; text?: string;
editor: Editor,
deleteSticker: (sticker: this) => void; deleteSticker: (sticker: this) => void;
@ -42,7 +43,7 @@ interface Props {
export class Sticker { export class Sticker {
constructor({ constructor({
latlng, deleteSticker, map, lockMapClicks, sticker, set, triggerOnChange, angle = 2.2, text = '', latlng, deleteSticker, map, lockMapClicks, sticker, set, triggerOnChange, angle = 2.2, text = '', editor,
}: Props) { }: Props) {
this.text = text; this.text = text;
this.latlng = latlng; this.latlng = latlng;
@ -54,6 +55,7 @@ export class Sticker {
this.direction = getLabelDirection(this.angle); this.direction = getLabelDirection(this.angle);
this.deleteSticker = deleteSticker; this.deleteSticker = deleteSticker;
this.lockMapClicks = lockMapClicks; this.lockMapClicks = lockMapClicks;
this.editor = editor;
ReactDOM.render( ReactDOM.render(
<React.Fragment> <React.Fragment>
@ -94,17 +96,27 @@ export class Sticker {
this.marker = marker(latlng, { icon: mark, draggable: true }); this.marker = marker(latlng, { icon: mark, draggable: true });
this.marker.on('add', this.updateModeOnAdd);
this.element.addEventListener('mouseup', this.onDragStop); this.element.addEventListener('mouseup', this.onDragStop);
this.element.addEventListener('mouseup', this.preventPropagations); this.element.addEventListener('mouseup', this.preventPropagations);
this.element.addEventListener('touchend', this.onDragStop); this.element.addEventListener('touchend', this.onDragStop);
this.element.addEventListener('touchend', this.preventPropagations); this.element.addEventListener('touchend', this.preventPropagations);
this.marker.addEventListener('dragend', this.triggerOnChange); this.marker.on('dragend', this.triggerOnChange);
this.setAngle(this.angle); this.setAngle(this.angle);
} }
updateModeOnAdd = () => {
if (this.editor.getEditing()) {
this.startEditing();
} else {
this.stopEditing();
}
};
setText = (text: Props['text']): void => { setText = (text: Props['text']): void => {
this.text = text; this.text = text;
}; };
@ -207,6 +219,7 @@ export class Sticker {
marker: Marker; marker: Marker;
isDragging: boolean = false; isDragging: boolean = false;
direction: string; direction: string;
editor: Editor;
text: Props['text']; text: Props['text'];
latlng: Props['latlng']; latlng: Props['latlng'];

20
src/modules/Stickers.ts
View file

@ -26,7 +26,7 @@ export class Stickers {
this.clusterLayer.addTo(map); this.clusterLayer.addTo(map);
this.clusterLayer.on('animationend', this.onSpiderify); // this.clusterLayer.on('animationend', this.onSpiderify);
this.lockMapClicks = lockMapClicks; this.lockMapClicks = lockMapClicks;
this.stickers = []; this.stickers = [];
@ -50,6 +50,7 @@ export class Stickers {
set, set,
triggerOnChange: this.triggerOnChange, triggerOnChange: this.triggerOnChange,
text, text,
editor: this.editor,
}); });
this.stickers.push(marker); this.stickers.push(marker);
@ -80,14 +81,15 @@ export class Stickers {
dumpData = (): Array<IStickerDump> => this.stickers.map(sticker => sticker.dumpData()); dumpData = (): Array<IStickerDump> => this.stickers.map(sticker => sticker.dumpData());
onSpiderify = (): void => { // onSpiderify = (): void => {
// todo: it has markers passed as argument. Update only them. // console.log('spider?');
if (this.editor.getEditing()) { // // todo: it has markers passed as argument. Update only them.
this.startEditing(); // if (this.editor.getEditing()) {
} else { // this.startEditing();
this.stopEditing(); // } else {
} // this.stopEditing();
}; // }
// };
startEditing = (): void => { startEditing = (): void => {
this.stickers.map(sticker => sticker.startEditing()); this.stickers.map(sticker => sticker.startEditing());