feat: main Updated text animation 1

Browse Source
This commit is contained in:
Nikolaj Frey 2023-06-27 18:09:21 +10:00
parent 6068a00eb6
commit 14c508786a
1 changed files with 16 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
remix/app/components/textAnimation1.tsx
View File

@ -4,32 +4,31 @@ import React from 'react'
export const TextAnimation1 = props => {
const texts = React.useMemo(() => {
return [
// 't',
'thingtime',
'creative',
'tt',
'thingtime'
// 'tt / thingtime'
// 'tht',
// 'thit',
// 'thint',
// 'thingt',
// 'thingti',
// 'thingtim',
// 'thingtime',
// 'Thingtime',
// 'ThingTime',
// 'Thing Time'
'vibrant',
'powerful',
'love',
'infinite',
'magical',
'inspiring'
]
}, [])
const [titleText, setTitleText] = React.useState(texts[0])
React.useEffect(() => {
const interval = setInterval(() => {
const newTextIdx = texts?.indexOf(titleText) + 1
const newTimeout = Math.random() * 3500 + 1500
setTimeout(() => {
let newTextIdx = Math.round(Math.random() * (texts.length - 1))
if (newTextIdx === texts.indexOf(titleText)) {
newTextIdx = newTextIdx + 1
}
const newText = texts[newTextIdx] || texts[0]
setTitleText(newText)
}, 4000)
return () => clearInterval(interval)
}, newTimeout)
}, [titleText, texts])
return <RainbowText>{titleText}</RainbowText>