akanealw/misode.github.io
1
0
Fork 0
mirror of https://github.com/misode/misode.github.io.git synced 2026-04-24 15:47:08 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Projects (#192)

Browse Source 
* Add file save UI and drafts project

* Fix build

* Create SearchList component as abstraction

* Add project page and file tree view

* Create Locale context

* Create Theme context

* Create Version context

* Create Title context

* Create Project context

* Store current file in project context

* Fix issues when renaming file and implement deleting

* Style improvements

* Make all project strings translatable

* Fix z-index
This commit is contained in:
Misode
2022-01-18 01:02:19 +01:00
committed by GitHub
parent cd318dc795
commit c6c52ca41a
39 changed files with 958 additions and 373 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/app/components/previews/BiomeSourcePreview.tsx
View File

@@ -4,8 +4,8 @@ import { NoiseGeneratorSettings, TerrainShaper } from 'deepslate'
import { useEffect, useRef, useState } from 'preact/hooks'
import type { PreviewProps } from '.'
import { Btn, BtnMenu } from '..'
import { useLocale } from '../../contexts'
import { useCanvas } from '../../hooks'
import { locale } from '../../Locales'
import { biomeMap, getBiome } from '../../previews'
import { newSeed } from '../../Utils'
@@ -13,7 +13,8 @@ const LAYERS = ['biomes', 'temperature', 'humidity', 'continentalness', 'erosion
const OverworldShaper = TerrainShaper.overworld()
export const BiomeSourcePreview = ({ model, data, shown, lang, version }: PreviewProps) => {
export const BiomeSourcePreview = ({ model, data, shown, version }: PreviewProps) => {
const { locale } = useLocale()
const [scale, setScale] = useState(2)
const [focused, setFocused] = useState<string | undefined>(undefined)
const [layers, setLayers] = useState(new Set<typeof LAYERS[number]>(['biomes']))
@@ -76,12 +77,12 @@ export const BiomeSourcePreview = ({ model, data, shown, lang, version }: Previe
<div class="controls">
{focused && <Btn label={focused} class="no-pointer" />}
{type === 'multi_noise' &&
<BtnMenu icon="stack" tooltip={locale(lang, 'configure_layers')}>
<BtnMenu icon="stack" tooltip={locale('configure_layers')}>
{LAYERS.map(name => {
const enabled = layers.has(name)
return <Btn label={locale(lang, `layer.${name}`)}
return <Btn label={locale(`layer.${name}`)}
active={enabled}
tooltip={enabled ? locale(lang, 'enabled') : locale(lang, 'disabled')}
tooltip={enabled ? locale('enabled') : locale('disabled')}
onClick={(e) => {
setLayers(new Set([name]))
e.stopPropagation()
@@ -89,13 +90,13 @@ export const BiomeSourcePreview = ({ model, data, shown, lang, version }: Previe
})}
</BtnMenu>}
{(type === 'multi_noise' || type === 'checkerboard') && <>
<Btn icon="dash" tooltip={locale(lang, 'zoom_out')}
<Btn icon="dash" tooltip={locale('zoom_out')}
onClick={() => changeScale(scale * 1.5)} />
<Btn icon="plus" tooltip={locale(lang, 'zoom_in')}
<Btn icon="plus" tooltip={locale('zoom_in')}
onClick={() => changeScale(scale / 1.5)} />
</>}
{type === 'multi_noise' &&
<Btn icon="sync" tooltip={locale(lang, 'generate_new_seed')}
<Btn icon="sync" tooltip={locale('generate_new_seed')}
onClick={() => newSeed(model)} />}
</div>
<canvas ref={canvas} width="200" height="200"></canvas>

11
src/app/components/previews/DecoratorPreview.tsx
View File

@@ -1,12 +1,13 @@
import { useEffect, useState } from 'preact/hooks'
import type { PreviewProps } from '.'
import { Btn } from '..'
import { useLocale } from '../../contexts'
import { useCanvas } from '../../hooks'
import { locale } from '../../Locales'
import { decorator } from '../../previews'
import { randomSeed } from '../../Utils'
export const DecoratorPreview = ({ data, version, shown, lang }: PreviewProps) => {
export const DecoratorPreview = ({ data, version, shown }: PreviewProps) => {
const { locale } = useLocale()
const [scale, setScale] = useState(4)
const [seed, setSeed] = useState(randomSeed())
@@ -28,11 +29,11 @@ export const DecoratorPreview = ({ data, version, shown, lang }: PreviewProps) =
return <>
<div class="controls">
<Btn icon="dash" tooltip={locale(lang, 'zoom_out')}
<Btn icon="dash" tooltip={locale('zoom_out')}
onClick={() => setScale(Math.min(16, scale + 1))} />
<Btn icon="plus" tooltip={locale(lang, 'zoom_in')}
<Btn icon="plus" tooltip={locale('zoom_in')}
onClick={() => setScale(Math.max(1, scale - 1))} />
<Btn icon="sync" tooltip={locale(lang, 'generate_new_seed')}
<Btn icon="sync" tooltip={locale('generate_new_seed')}
onClick={() => setSeed(randomSeed())} />
</div>
<canvas ref={canvas} width="64" height="64"></canvas>

11
src/app/components/previews/NoisePreview.tsx
View File

@@ -1,12 +1,13 @@
import { useEffect, useRef, useState } from 'preact/hooks'
import type { PreviewProps } from '.'
import { Btn } from '..'
import { useLocale } from '../../contexts'
import { useCanvas } from '../../hooks'
import { locale } from '../../Locales'
import { normalNoise } from '../../previews'
import { randomSeed } from '../../Utils'
export const NoisePreview = ({ lang, data, shown, version }: PreviewProps) => {
export const NoisePreview = ({ data, shown, version }: PreviewProps) => {
const { locale } = useLocale()
const [seed, setSeed] = useState(randomSeed())
const [scale, setScale] = useState(2)
const offset = useRef<[number, number]>([0, 0])
@@ -41,11 +42,11 @@ export const NoisePreview = ({ lang, data, shown, version }: PreviewProps) => {
return <>
<div class="controls">
<Btn icon="dash" tooltip={locale(lang, 'zoom_out')}
<Btn icon="dash" tooltip={locale('zoom_out')}
onClick={() => changeScale(scale * 1.5)} />
<Btn icon="plus" tooltip={locale(lang, 'zoom_in')}
<Btn icon="plus" tooltip={locale('zoom_in')}
onClick={() => changeScale(scale / 1.5)} />
<Btn icon="sync" tooltip={locale(lang, 'generate_new_seed')}
<Btn icon="sync" tooltip={locale('generate_new_seed')}
onClick={() => setSeed(randomSeed())} />
</div>
<canvas ref={canvas} width="256" height="256"></canvas>

14
src/app/components/previews/NoiseSettingsPreview.tsx
View File

@@ -1,14 +1,14 @@
import { useEffect, useRef, useState } from 'preact/hooks'
import type { PreviewProps } from '.'
import { Btn, BtnInput, BtnMenu } from '..'
import { useLocale } from '../../contexts'
import { useCanvas } from '../../hooks'
import { locale } from '../../Locales'
import { noiseSettings } from '../../previews'
import { checkVersion } from '../../services'
import { randomSeed } from '../../Utils'
export const NoiseSettingsPreview = ({ lang, data, shown, version }: PreviewProps) => {
const loc = locale.bind(null, lang)
export const NoiseSettingsPreview = ({ data, shown, version }: PreviewProps) => {
const { locale } = useLocale()
const [seed, setSeed] = useState(randomSeed())
const [biomeScale, setBiomeScale] = useState(0.2)
const [biomeDepth, setBiomeDepth] = useState(0.1)
@@ -48,12 +48,12 @@ export const NoiseSettingsPreview = ({ lang, data, shown, version }: PreviewProp
<div class="controls">
{focused && <Btn label={`Y = ${focused}`} class="no-pointer" />}
{checkVersion(version, undefined, '1.17') &&
<BtnMenu icon="gear" tooltip={locale(lang, 'terrain_settings')}>
<BtnInput label={loc('preview.scale')} value={`${biomeScale}`} onChange={v => setBiomeScale(Number(v))} />
<BtnInput label={loc('preview.depth')} value={`${biomeDepth}`} onChange={v => setBiomeDepth(Number(v))} />
<BtnMenu icon="gear" tooltip={locale('terrain_settings')}>
<BtnInput label={locale('preview.scale')} value={`${biomeScale}`} onChange={v => setBiomeScale(Number(v))} />
<BtnInput label={locale('preview.depth')} value={`${biomeDepth}`} onChange={v => setBiomeDepth(Number(v))} />
</BtnMenu>
}
<Btn icon="sync" tooltip={locale(lang, 'generate_new_seed')}
<Btn icon="sync" tooltip={locale('generate_new_seed')}
onClick={() => setSeed(randomSeed())} />
</div>
<canvas ref={canvas} width={size} height={size}></canvas>

1
src/app/components/previews/index.ts
View File

@@ -7,7 +7,6 @@ export * from './NoisePreview'
export * from './NoiseSettingsPreview'
export type PreviewProps = {
lang: string,
model: DataModel,
data: any,
shown: boolean,