diff --git a/client/.gitignore b/client/.gitignore index fd3dbb5..f696615 100644 --- a/client/.gitignore +++ b/client/.gitignore @@ -34,3 +34,5 @@ yarn-error.log* # typescript *.tsbuildinfo next-env.d.ts + +certificates \ No newline at end of file diff --git a/client/src/app/draw/page.tsx b/client/src/app/draw/page.tsx index ea3a41d..8efebe3 100644 --- a/client/src/app/draw/page.tsx +++ b/client/src/app/draw/page.tsx @@ -1,6 +1,6 @@ 'use client'; import { TDrawCondition, TPicture } from '@/types/app'; -import { useState } from 'react'; +import { useEffect, useState } from 'react'; import { ZenMaruGothic } from '../../../font/font'; import { DrawCondition } from './components/DrawCondition'; import { DrawEditor } from './components/DrawEditor'; @@ -10,6 +10,20 @@ export default function Draw() { const [picture, setPicture] = useState([]); const [drawCondition, setDrawCondition] = useState('STOPPING'); + const [draftPosition, setDraftPosition] = useState<{ + x: number; + y: number; + }>({ x: 1, y: 1 }); + + useEffect(() => { + navigator.geolocation.watchPosition((position) => { + console.log(position.coords.latitude, position.coords.longitude); + setDraftPosition({ + x: position.coords.latitude, + y: position.coords.longitude, + }); + }); + }, [draftPosition]); const onSubmit = () => { // TODO: サーバー側に情報を渡す @@ -17,18 +31,20 @@ export default function Draw() { return (
-
- setTitle(e.target.value)} - /> - +
+
+ setTitle(e.target.value)} + /> + +
- +
経度{draftPosition.x}
+
経度{draftPosition.y}