2022-01-15 03:46:39 +00:00
import type { NextPage } from "next" ;
import Head from "next/head" ;
import "mapbox-gl/dist/mapbox-gl.css" ;
import Map from "../components/Map" ;
2022-02-27 06:17:52 +00:00
import { useAppDispatch } from "../lib/hooks" ;
import { setPluginsTxt } from "../slices/pluginsTxt" ;
2022-01-14 04:24:18 +00:00
const Home : NextPage = ( ) = > {
2022-02-27 06:17:52 +00:00
const dispatch = useAppDispatch ( ) ;
2022-01-14 04:24:18 +00:00
return (
2022-01-15 03:46:39 +00:00
< >
2022-01-14 04:24:18 +00:00
< Head >
2022-01-15 04:27:29 +00:00
< meta charSet = "utf-8" / >
2022-01-15 03:46:39 +00:00
< meta name = "viewport" content = "width=device-width, initial-scale=1" / >
2022-02-14 05:38:21 +00:00
< title key = "title" > Modmapper < / title >
2022-01-14 04:24:18 +00:00
< link rel = "icon" href = "/favicon.ico" / >
2022-02-13 01:40:55 +00:00
2022-02-14 05:38:21 +00:00
< meta
key = "description"
name = "description"
content = "Map of Skyrim mods"
/ >
< meta key = "og:title" property = "og:title" content = "Modmapper" / >
2022-02-13 01:40:55 +00:00
< meta property = "og:site_name" content = "Modmapper" > < / meta >
2022-02-14 05:38:21 +00:00
< meta
key = "og:description"
property = "og:description"
content = "Map of Skyrim mods"
/ >
2022-02-13 01:40:55 +00:00
< meta property = "og:type" content = "website" / >
2022-02-14 05:38:21 +00:00
< meta key = "og:url" property = "og:url" content = "https://modmapper.com" / >
2022-02-13 01:48:22 +00:00
< meta
property = "og:image"
content = "https://modmapper.com/img/screenshot.jpg"
/ >
2022-02-13 01:40:55 +00:00
< meta
property = "og:image:alt"
content = "A screenshot of Modmapper displaying a map of Skyrim with a grid of cells overlayed colored green to red indicating how many mods edited each cell"
/ >
2022-02-14 05:38:21 +00:00
< meta key = "twitter:title" name = "twitter:title" content = "Modmapper" / >
< meta
key = "twitter:description"
name = "twitter:description"
content = "Map of Skyrim mods"
/ >
2022-02-13 01:48:22 +00:00
< meta
name = "twitter:image"
content = "https://modmapper.com/img/screenshot.jpg"
/ >
2022-02-13 01:40:55 +00:00
< meta
name = "twitter:image:alt"
content = "A screenshot of Modmapper displaying a map of Skyrim with a grid of cells overlayed colored green to red indicating how many mods edited each cell"
/ >
< meta name = "twitter:card" content = "summary_large_image" / >
< meta name = "twitter:site" content = "@tyhallada" / >
< meta name = "twitter:creator" content = "@tyhallada" / >
2022-01-14 04:24:18 +00:00
< / Head >
2022-02-27 06:17:52 +00:00
< div
style = { {
margin : 0 ,
padding : 0 ,
width : "100%" ,
height : "100%" ,
} }
onDragOver = { ( evt ) = > {
console . log ( "drag over!" ) ;
evt . preventDefault ( ) ;
} }
onDrop = { async ( evt ) = > {
console . log ( "drop!" ) ;
evt . preventDefault ( ) ;
if ( evt . dataTransfer . items && evt . dataTransfer . items . length > 0 ) {
const file = evt . dataTransfer . items [ 0 ] . getAsFile ( ) ;
if ( file ) {
dispatch ( setPluginsTxt ( await file . text ( ) ) ) ;
}
}
} }
>
< Map / >
< / div >
2022-01-15 03:46:39 +00:00
< / >
) ;
} ;
2022-01-14 04:24:18 +00:00
2022-01-15 03:46:39 +00:00
export default Home ;
