diff --git a/src/Utils/MarkerIconFactory.ts b/src/Utils/MarkerIconFactory.ts deleted file mode 100644 index e6229fcd..00000000 --- a/src/Utils/MarkerIconFactory.ts +++ /dev/null @@ -1,90 +0,0 @@ -/* eslint-disable @typescript-eslint/restrict-template-expressions */ -/* eslint-disable @typescript-eslint/no-unsafe-return */ -import { divIcon, Point } from 'leaflet' - -const createSvg = (shape: string, markerColor: string, borderColor: string) => { - const svgMap = { - circle: - '', - square: - '', - star: - '', - penta: - '', - } - // eslint-disable-next-line security/detect-object-injection - return svgMap[shape] -} - -const addIcon = (icon: string) => { - switch (icon) { - case 'point': - return '' - case 'calendar': - return '' - case 'user': - return '' - case 'fire': - return '' - case 'tree': - return '' - case 'music': - return '' - case 'drum': - return '' - case 'quest': - return '' - case 'compass': - return '' - case 'liebevoll.jetzt': - return ' ' - case 'group': - return '' - case 'puzzle': - return '' - case 'staff-snake': - return '' - case 'flower': - return '' - case 'network': - return '' - case 'crosshair': - return '' - case 'shop': - return '' - case 'plant': - return '' - case 'circle-dot': - return '' - case 'cannabis': - return '' - default: - return '' - } -} - -const MarkerIconFactory = (shape: string, color1: string, color2: string, icon: string) => { - return divIcon({ - html: `${createSvg(shape, color1, color2)}${addIcon(icon)}`, - iconAnchor: [17, 40], - popupAnchor: [0, -40], - iconSize: new Point(40, 46), - className: 'leaflet-data-marker', - shadowAnchor: [0, 0], - }) -} - -export default MarkerIconFactory diff --git a/src/Utils/MarkerIconFactory.tsx b/src/Utils/MarkerIconFactory.tsx new file mode 100644 index 00000000..1734c0a7 --- /dev/null +++ b/src/Utils/MarkerIconFactory.tsx @@ -0,0 +1,112 @@ +/* eslint-disable @typescript-eslint/restrict-template-expressions */ +/* eslint-disable @typescript-eslint/no-unsafe-return */ +import { divIcon, Point } from 'leaflet' +import { renderToString } from 'react-dom/server' + +import CalendarSVG from '#assets/icons/calendar.svg' +import CannabisSVG from '#assets/icons/cannabis.svg' +import CircleDotSVG from '#assets/icons/circle-dot.svg' +import CompassSVG from '#assets/icons/compass.svg' +import CrosshairSVG from '#assets/icons/crosshair.svg' +import DrumSVG from '#assets/icons/drum.svg' +import FireSVG from '#assets/icons/fire.svg' +import FlowerSVG from '#assets/icons/flower.svg' +import GroupSVG from '#assets/icons/group.svg' +import LiebevollJetztSVG from '#assets/icons/liebevoll.jetzt.svg' +import MusicSVG from '#assets/icons/music.svg' +import NetworkSVG from '#assets/icons/network.svg' +import PlantSVG from '#assets/icons/plant.svg' +import PointSVG from '#assets/icons/point.svg' +import PuzzleSVG from '#assets/icons/puzzle.svg' +import QuestSVG from '#assets/icons/quest.svg' +import ShopSVG from '#assets/icons/shop.svg' +import StaffSnakeSVG from '#assets/icons/staff-snake.svg' +import TreeSVG from '#assets/icons/tree.svg' +import UserSVG from '#assets/icons/user.svg' + +const createSvg = (shape: string, markerColor: string, borderColor: string) => { + const svgMap = { + circle: + '', + square: + '', + star: + '', + penta: + '', + } + // eslint-disable-next-line security/detect-object-injection + return svgMap[shape] +} + +const addIcon = (icon: string) => { + switch (icon) { + case 'point': + return x + case 'calendar': + return x + case 'user': + return x + case 'fire': + return x + case 'tree': + return x + case 'music': + return x + case 'drum': + return x + case 'quest': + return x + case 'compass': + return x + case 'liebevoll.jetzt': + return x + case 'group': + return x + case 'puzzle': + return x + case 'staff-snake': + return x + case 'flower': + return x + case 'network': + return x + case 'crosshair': + return x + case 'shop': + return x + case 'plant': + return x + case 'circle-dot': + return x + case 'cannabis': + return x + default: + return <> + } +} + +const MarkerIconFactory = (shape: string, color1: string, color2: string, icon: string) => { + return divIcon({ + html: `${createSvg(shape, color1, color2)}${renderToString(addIcon(icon))}`, + iconAnchor: [17, 40], + popupAnchor: [0, -40], + iconSize: new Point(40, 46), + className: 'leaflet-data-marker', + shadowAnchor: [0, 0], + }) +} + +export default MarkerIconFactory diff --git a/src/assets/icons/calendar.svg b/src/assets/icons/calendar.svg new file mode 100644 index 00000000..45c0e75a --- /dev/null +++ b/src/assets/icons/calendar.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/cannabis.svg b/src/assets/icons/cannabis.svg new file mode 100644 index 00000000..a09da7a1 --- /dev/null +++ b/src/assets/icons/cannabis.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/circle-dot.svg b/src/assets/icons/circle-dot.svg new file mode 100644 index 00000000..476563e2 --- /dev/null +++ b/src/assets/icons/circle-dot.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/compass.svg b/src/assets/icons/compass.svg new file mode 100644 index 00000000..9ab15366 --- /dev/null +++ b/src/assets/icons/compass.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/crosshair.svg b/src/assets/icons/crosshair.svg new file mode 100644 index 00000000..559f48e5 --- /dev/null +++ b/src/assets/icons/crosshair.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/drum.svg b/src/assets/icons/drum.svg new file mode 100644 index 00000000..a654b605 --- /dev/null +++ b/src/assets/icons/drum.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/fire.svg b/src/assets/icons/fire.svg new file mode 100644 index 00000000..345c869e --- /dev/null +++ b/src/assets/icons/fire.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/flower.svg b/src/assets/icons/flower.svg new file mode 100644 index 00000000..1882a384 --- /dev/null +++ b/src/assets/icons/flower.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/group.svg b/src/assets/icons/group.svg new file mode 100644 index 00000000..f76b392c --- /dev/null +++ b/src/assets/icons/group.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/liebevoll.jetzt.svg b/src/assets/icons/liebevoll.jetzt.svg new file mode 100644 index 00000000..ab4e3890 --- /dev/null +++ b/src/assets/icons/liebevoll.jetzt.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/music.svg b/src/assets/icons/music.svg new file mode 100644 index 00000000..2cb008a7 --- /dev/null +++ b/src/assets/icons/music.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/network.svg b/src/assets/icons/network.svg new file mode 100644 index 00000000..1a194465 --- /dev/null +++ b/src/assets/icons/network.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/plant.svg b/src/assets/icons/plant.svg new file mode 100644 index 00000000..3a16df90 --- /dev/null +++ b/src/assets/icons/plant.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/point.svg b/src/assets/icons/point.svg new file mode 100644 index 00000000..fbda97bc --- /dev/null +++ b/src/assets/icons/point.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/puzzle.svg b/src/assets/icons/puzzle.svg new file mode 100644 index 00000000..7498beb4 --- /dev/null +++ b/src/assets/icons/puzzle.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/quest.svg b/src/assets/icons/quest.svg new file mode 100644 index 00000000..67cfc84a --- /dev/null +++ b/src/assets/icons/quest.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/shop.svg b/src/assets/icons/shop.svg new file mode 100644 index 00000000..bd828da3 --- /dev/null +++ b/src/assets/icons/shop.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/staff-snake.svg b/src/assets/icons/staff-snake.svg new file mode 100644 index 00000000..196bcdfa --- /dev/null +++ b/src/assets/icons/staff-snake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/tree.svg b/src/assets/icons/tree.svg new file mode 100644 index 00000000..3941bb23 --- /dev/null +++ b/src/assets/icons/tree.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/user.svg b/src/assets/icons/user.svg new file mode 100644 index 00000000..5bf6e806 --- /dev/null +++ b/src/assets/icons/user.svg @@ -0,0 +1 @@ + \ No newline at end of file