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

InteractivePoly: touch hinting at mobile

Browse source
This commit is contained in:
muerwre 2019-02-25 16:23:29 +07:00
parent 15618ad3d7
commit 5b315d97c7
2 changed files with 14 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/modules/InteractivePoly.ts
View file

@ -148,13 +148,14 @@ export class Component extends Polyline {
this.is_editing = false;
this.stopDragHinting();
this.stopDrawing();
this.touchHinter.removeFrom(this._map);
this.fire('editordisable');
},
enable: () => {
this.is_editing = true;
this.showVisibleMarkers();
this.startDragHinting();
this.touchHinter.addTo(this._map);
this.fire('editorenable');
},
@ -525,9 +526,9 @@ export class Component extends Polyline {
};
touchHinter: Polyline = new Polyline([], {
weight: 25,
color: 'rgba(255, 255, 255, 0)',
weight: 24,
smoothFactor: 3,
className: 'touch-hinter-poly'
// bubblingMouseEvents: false,
});
@ -563,7 +564,7 @@ Component.addInitHook(function () {
this.on('latlngschange', this.updateTouchHinter);
if (window.innerWidth < 768) {
this.touchHinter.setStyle({ weight: 50 });
this.touchHinter.setStyle({ weight: 32 });
}
}
});

9
src/styles/map.less
View file

@ -50,6 +50,7 @@
width: 32px;
height: 32px;
transform: translate(-8px, -8px);
background: rgba(255, 50, 0, 0.3);
}
}
@ -71,6 +72,14 @@
}
}
.touch-hinter-poly {
stroke: rgba(255, 50, 0, 0);
@media (max-width: @mobile_breakpoint) {
stroke: rgba(255, 50, 0, 0.1);
}
}
.leaflet-control-container .leaflet-routing-container-hide {
display: none;
}