Skip to content

Commit

Permalink
feat(dashboard): paragraphs in 3D context
Browse files Browse the repository at this point in the history
  • Loading branch information
Novout committed Mar 22, 2022
1 parent 4ae5c81 commit 805473c
Show file tree
Hide file tree
Showing 12 changed files with 302 additions and 268 deletions.
1 change: 1 addition & 0 deletions packages/better-write-app/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -118,6 +118,7 @@
"three/examples/jsm/capabilities/WebGL.js",
"three/examples/jsm/geometries/TextGeometry.js",
"three/examples/jsm/loaders/FontLoader",
"three/examples/jsm/loaders/FontLoader.js",
"v-tooltip",
"vue",
"vue-i18n",
Expand Down

Large diffs are not rendered by default.

Original file line number Diff line number Diff line change
Expand Up @@ -28,46 +28,31 @@
<PDFConfigurationSetParagraph
v-motion
:initial="{ opacity: 0, y: 30 }"
:visible-once="{
opacity: 1,
y: 0,
}"
:enter="{ opacity: 1, y: 0 }"
:delay="0"
/>
<PDFConfigurationSetHeadingOne
v-motion
:initial="{ opacity: 0, y: 30 }"
:visible-once="{
opacity: 1,
y: 0,
}"
:enter="{ opacity: 1, y: 0 }"
:delay="0"
/>
<PDFConfigurationSetHeadingTwo
v-motion
:initial="{ opacity: 0, y: 30 }"
:visible-once="{
opacity: 1,
y: 0,
}"
:enter="{ opacity: 1, y: 0 }"
:delay="0"
/>
<PDFConfigurationSetHeadingThree
v-motion
:initial="{ opacity: 0, y: 30 }"
:visible-once="{
opacity: 1,
y: 0,
}"
:enter="{ opacity: 1, y: 0 }"
:delay="0"
/>
<PDFConfigurationSetLineBreak
v-motion
:initial="{ opacity: 0, y: 30 }"
:visible-once="{
opacity: 1,
y: 0,
}"
:enter="{ opacity: 1, y: 0 }"
:delay="0"
/>
</div>
Expand Down
87 changes: 0 additions & 87 deletions packages/better-write-app/src/components/landing/LandingFirst.vue

This file was deleted.

46 changes: 0 additions & 46 deletions packages/better-write-app/src/components/landing/LandingFooter.vue

This file was deleted.

Empty file.
29 changes: 29 additions & 0 deletions packages/better-write-app/src/lang/br/landing.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,5 +11,34 @@ export default {
website: 'Editor',
desktop: 'Desktop',
},
paragraphs: [
'— Entre o relento e o desespero, sobrevivi.',
` É possível observar uma casa modesta ao
final da estrada, interrompendo a passagem para
todos os tipos de locomoção.`,
'— Não! Não! NÃO!',
` — Desculpe-me pela arrogância, podê-lo-ei
retribuir satisfatoriamente em outras circunstâncias.`,
` O que nos resta acabará por romper o futuro promissor.`,
` O imbróglio não pode ser resolvido. A
complacência dos envolvidos na discussão foi dissolvida
pelo puro ódio individualista.`,
`Comecei a palrar,
Sufocando o desprovido,
Aprendi a falhar,
Compreendendo o improviso,
Sustentei a salvar,
Desfalecendo no auspício.`,
'Escrever melhor ou melhor escrever?',
'A criatividade é a salvação para o ostracismo cotidiano.',
'— Música para meus ouvidos! Uníssono da vitória!',
'— A passagem está logo ali! Vamos!',
`Kino apareceu na fresta, de relance, mais que o suficiente
para Linea aceitar a perda.`,
`No último esforço,
Percebi a insolência,
Recebendo o amor doloroso,
Aceitei a clarência.`,
],
},
}
86 changes: 84 additions & 2 deletions packages/better-write-app/src/pages/Landing.vue
Original file line number Diff line number Diff line change
@@ -1,17 +1,87 @@
<template>
<main class="min-h-screen w-full overflow-x-hidden">
<LandingFirst />
<section
id="landing-base"
class="flex flex-col bg-theme-background-2 z-max text-white items-center justify-between min-h-screen w-full overflow-x-hidden"
>
<div
v-if="webgl.isLoaded.value"
class="flex-1 bg-theme-background-2 container mx-auto flex px-5 py-24 flex-col justify-center items-center z-50"
>
<div class="lg:flex-grow w-full flex flex-col items-center text-center">
<div class="flex justify-start items-end">
<img
class="shadow-lg rounded-xs w-12 md:w-18"
src="@/assets/logo.png"
/>
<span
class="ml-5 relative top-3 sm:top-4 lg:top-6 md:ml-10 text-3xl sm:text-4xl lg:text-5xl font-bold"
>Better Write.</span
>
</div>
<v-typical
v-motion
:initial="{ opacity: 0, y: 50 }"
:enter="{ opacity: 1, y: 0, transition: { delay: 300 } }"
class="mt-8 border-b leading-relaxed text-lg blink"
:steps="[
t('landing.first.typical.1'),
1500,
t('landing.first.typical.2'),
150,
t('landing.first.typical.3'),
1500,
t('landing.first.typical.3'),
1500,
]"
:loop="Infinity"
:wrapper="'p'"
></v-typical>
<div
v-motion
class="flex items-center justify-between w-1/2 lg:w-5/12 xl:w-1/3 mt-32"
:initial="{ opacity: 0 }"
:enter="{ opacity: 1, transition: { delay: 300 } }"
>
<button
class="flex items-center justify-center font-bold transition-colors shadow-xl w-full text-base md:text-lg px-6 py-3 md:px-5 md:py-5 border border-gray-800 bg-black-opacity hover:bg-gray-900 text-gray-200 flex flex-col"
@click.prevent.stop="onClick"
>
<div>
{{ t('landing.first.editor.website') }}
</div>
<div class="text-xs">
{{ version }}
</div>
</button>
</div>
</div>
</div>
<div
v-else
class="flex justify-center items-center h-screen w-full bg-theme-background-2 z-umax"
>
<Spinner :width="150" :height="150" />
</div>
</section>
</main>
</template>

<script setup lang="ts">
import { useHead } from '@vueuse/head'
import { useI18n } from 'vue-i18n'
import { computed, onMounted } from 'vue'
import { computed, onMounted, nextTick } from 'vue'
import { useWebGL } from '@/use/webgl'
import { useEnv } from '@/use/env'
import { useNProgress } from '@vueuse/integrations'
import { useRouter } from 'vue-router'
import VTypical from 'vue-typical'
const { t } = useI18n()
const webgl = useWebGL()
const env = useEnv()
const { isLoading } = useNProgress()
const router = useRouter()
onMounted(() => {
document.body.removeAttribute('class')
Expand All @@ -28,4 +98,16 @@
})
webgl.init()
const version = computed(() => `v${env.packageVersion()}`)
const onClick = async () => {
isLoading.value = true
await nextTick
router.push('/').finally(() => {
isLoading.value = false
})
}
</script>
25 changes: 25 additions & 0 deletions packages/better-write-app/src/use/defines.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,30 @@ import i18n from '@/lang'
export const useDefines = () => {
const { t } = i18n.global

const landing = () => {
const name = () => {
// vue-i18n limitation zzzzzzzzzzzzzzz
const arr = [
t('landing.first.paragraphs[0]'),
t('landing.first.paragraphs[1]'),
t('landing.first.paragraphs[3]'),
t('landing.first.paragraphs[4]'),
t('landing.first.paragraphs[5]'),
t('landing.first.paragraphs[6]'),
t('landing.first.paragraphs[7]'),
t('landing.first.paragraphs[8]'),
t('landing.first.paragraphs[9]'),
t('landing.first.paragraphs[10]'),
t('landing.first.paragraphs[11]'),
t('landing.first.paragraphs[12]'),
]

return arr[Math.floor(Math.random() * arr.length)]
}

return { name }
}

const pdf = () => {
const fixFonts = () => {
return ['EB Garamond', 'Cormorant Garamond']
Expand Down Expand Up @@ -215,5 +239,6 @@ export const useDefines = () => {
return {
pdf,
themes,
landing,
}
}
Loading

0 comments on commit 805473c

Please sign in to comment.