mirror of
https://github.com/He4eT/elseifplayer.git
synced 2026-05-04 17:07:22 +00:00
index.js: extract App.jsx
This commit is contained in:
parent
0d0e42a26a
commit
ceafed4a5c
2 changed files with 76 additions and 73 deletions
73
src/App.jsx
Normal file
73
src/App.jsx
Normal file
|
|
@ -0,0 +1,73 @@
|
|||
import { Route, Router, Switch } from 'wouter-preact'
|
||||
|
||||
import {
|
||||
useHashLocation,
|
||||
extractView,
|
||||
} from './routing'
|
||||
import {
|
||||
useThemeEngine,
|
||||
} from '~/src/themes/themes'
|
||||
|
||||
import HomeView from '~/src/views/HomeView/HomeView'
|
||||
import GamesView from '~/src/views/GamesView/GamesView'
|
||||
import ThemesView from '~/src/views/ThemesView/ThemesView'
|
||||
import PlayerView from '~/src/views/PlayerView/PlayerView'
|
||||
import NotFoundView from '~/src/views/NotFoundView'
|
||||
|
||||
export default function App () {
|
||||
const themeEngine = useThemeEngine()
|
||||
const [currentLocation] = useHashLocation()
|
||||
|
||||
const playerView = (themeEngine, singleWindow) =>
|
||||
function view (params) {
|
||||
return (<PlayerView {...{
|
||||
themeEngine,
|
||||
singleWindow,
|
||||
...params,
|
||||
}} />)
|
||||
}
|
||||
|
||||
return (
|
||||
<Router hook={useHashLocation}>
|
||||
<div className={[
|
||||
'app',
|
||||
extractView(currentLocation),
|
||||
themeEngine.currentTheme].join(' ')}>
|
||||
|
||||
<Switch>
|
||||
<Route path='/'>
|
||||
<HomeView {...{
|
||||
themeEngine,
|
||||
}} />
|
||||
</Route>
|
||||
<Route path='/games/'>
|
||||
<GamesView />
|
||||
</Route>
|
||||
<Route path='/themes/'>
|
||||
<ThemesView {...{
|
||||
themeEngine,
|
||||
}} />
|
||||
</Route>
|
||||
|
||||
<Route path='/play/:encodedUrl'>
|
||||
{ playerView(themeEngine, false) }
|
||||
</Route>
|
||||
<Route path='/play/:encodedUrl/:theme'>
|
||||
{ playerView(themeEngine, false) }
|
||||
</Route>
|
||||
<Route path='/focus/:encodedUrl'>
|
||||
{ playerView(themeEngine, true) }
|
||||
</Route>
|
||||
<Route path='/focus/:encodedUrl/:theme'>
|
||||
{ playerView(themeEngine, true) }
|
||||
</Route>
|
||||
|
||||
<Route>
|
||||
<NotFoundView />
|
||||
</Route>
|
||||
</Switch>
|
||||
|
||||
</div>
|
||||
</Router>
|
||||
)
|
||||
}
|
||||
76
src/index.js
76
src/index.js
|
|
@ -1,79 +1,9 @@
|
|||
import { h, render } from 'preact'
|
||||
import { Route, Router, Switch } from 'wouter-preact'
|
||||
|
||||
import {
|
||||
useHashLocation,
|
||||
extractView,
|
||||
} from './routing'
|
||||
import {
|
||||
useThemeEngine,
|
||||
} from '~/src/themes/themes'
|
||||
|
||||
import HomeView from '~/src/views/HomeView/HomeView'
|
||||
import GamesView from '~/src/views/GamesView/GamesView'
|
||||
import ThemesView from '~/src/views/ThemesView/ThemesView'
|
||||
import PlayerView from '~/src/views/PlayerView/PlayerView'
|
||||
import NotFoundView from '~/src/views/NotFoundView'
|
||||
import { render } from 'preact'
|
||||
|
||||
import '@fontsource/open-sans'
|
||||
|
||||
import '~/src/style/base.css'
|
||||
|
||||
function App () {
|
||||
const themeEngine = useThemeEngine()
|
||||
const [currentLocation] = useHashLocation()
|
||||
|
||||
const playerView = (themeEngine, singleWindow) =>
|
||||
function view (params) {
|
||||
return (<PlayerView {...{
|
||||
themeEngine,
|
||||
singleWindow,
|
||||
...params,
|
||||
}} />)
|
||||
}
|
||||
|
||||
return (
|
||||
<Router hook={useHashLocation}>
|
||||
<div className={[
|
||||
'app',
|
||||
extractView(currentLocation),
|
||||
themeEngine.currentTheme].join(' ')}>
|
||||
|
||||
<Switch>
|
||||
<Route path='/'>
|
||||
<HomeView {...{
|
||||
themeEngine,
|
||||
}} />
|
||||
</Route>
|
||||
<Route path='/games/'>
|
||||
<GamesView />
|
||||
</Route>
|
||||
<Route path='/themes/'>
|
||||
<ThemesView {...{
|
||||
themeEngine,
|
||||
}} />
|
||||
</Route>
|
||||
|
||||
<Route path='/play/:encodedUrl'>
|
||||
{ playerView(themeEngine, false) }
|
||||
</Route>
|
||||
<Route path='/play/:encodedUrl/:theme'>
|
||||
{ playerView(themeEngine, false) }
|
||||
</Route>
|
||||
<Route path='/focus/:encodedUrl'>
|
||||
{ playerView(themeEngine, true) }
|
||||
</Route>
|
||||
<Route path='/focus/:encodedUrl/:theme'>
|
||||
{ playerView(themeEngine, true) }
|
||||
</Route>
|
||||
|
||||
<Route>
|
||||
<NotFoundView />
|
||||
</Route>
|
||||
</Switch>
|
||||
|
||||
</div>
|
||||
</Router>
|
||||
)
|
||||
}
|
||||
import App from './App'
|
||||
|
||||
render(<App />, document.getElementById('root'))
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue