Skip to content

Commit a45731f

Browse files
aprogramqaprogramq
committed
style: formating code and add types
1 parent 3ef11ea commit a45731f

File tree

8 files changed

+157
-116
lines changed

8 files changed

+157
-116
lines changed

‎src/components/Hints.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { useContext } from 'react'
22
import { SizeContext } from '..'
33

4-
export function Hint({ text}:{text:string}) {
4+
export function Hint({ text }: { text: string }) {
55
const size = useContext(SizeContext)
66
return (
77
<box padding={1}>

‎src/components/Modal.tsx‎

Lines changed: 18 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,19 @@
1-
export function Modal({ activate }: { activate: boolean }) {
2-
return (
3-
<box backgroundColor={'#05df72'} position="absolute" visible={activate} top={1} right={5} width={20} height={2}>
4-
<text fg={'#0d542b'}>Successfully</text>
5-
</box>
6-
)
1+
import type { modalState } from '../types'
2+
3+
export function Modal({ activate, state, text }: { activate: boolean; state: modalState; text: string }) {
4+
return (
5+
<box
6+
backgroundColor={state === 'success' ? '#05DF72' : '#DF0505'}
7+
position="absolute"
8+
visible={activate}
9+
top={1}
10+
right={5}
11+
width={20}
12+
height={4}
13+
>
14+
<text fg={state === 'success' ? '#0D542B' : '#540D0D'} margin={1}>
15+
{text}
16+
</text>
17+
</box>
18+
)
719
}

‎src/components/screens/Start.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ export function StartScreen({
2525
<box alignItems="center" justifyContent="center" flexGrow={1} marginTop={1}>
2626
<Header activate={displayLogo} />
2727
<StartButton height={size.height} />
28-
<SelectMode height={size.height} setIndex={setSelectedIndex} selctedIndex={-1} />
28+
<SelectMode height={size.height} setIndex={setSelectedIndex} />
2929
<Hint text="[O]ptions" />
3030
</box>
3131
)

‎src/fuctions.ts‎

Lines changed: 45 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -4,60 +4,56 @@ import type { OptionValue, paletteT } from './types'
44
import fs from 'fs'
55
import type { UseState } from './types'
66

7-
export function randomColor(
8-
palette:any,
9-
setPalette: UseState<paletteT>,
10-
option: OptionValue
11-
): NodeJS.Timeout {
12-
const colorInterval = setInterval(() => {
13-
const newColors: BaseHexColor[] = []
14-
for (let i = 0; i < palette.size; i++) {
15-
let color = new HexColor()
7+
export function randomColor(palette: any, setPalette: UseState<paletteT>, option: OptionValue): NodeJS.Timeout {
8+
const colorInterval = setInterval(() => {
9+
const newColors: BaseHexColor[] = []
10+
for (let i = 0; i < palette.size; i++) {
11+
let color = new HexColor()
1612

17-
if (option == 'cold') color = new HexColorCold()
18-
else if (option == 'pastel') color = new HexColorPastele()
19-
else if (option == 'warm') color = new HexColorWarm()
13+
if (option == 'cold') color = new HexColorCold()
14+
else if (option == 'pastel') color = new HexColorPastele()
15+
else if (option == 'warm') color = new HexColorWarm()
2016

21-
newColors.push(color)
22-
if (newColors.length > 1) {
23-
color.correctChanels(newColors[i - 1]!)
24-
}
25-
}
26-
setPalette((p) => ({ ...p, colors: [...p.colors, newColors] }))
27-
setPalette((p) => ({...p, position: p.position + 1 }))
28-
}, 300)
29-
return colorInterval
17+
newColors.push(color)
18+
if (newColors.length > 1) {
19+
color.correctChanels(newColors[i - 1]!)
20+
}
21+
}
22+
setPalette((p) => ({ ...p, colors: [...p.colors, newColors] }))
23+
setPalette((p) => ({ ...p, position: p.position + 1 }))
24+
}, 300)
25+
return colorInterval
3026
}
3127

3228
export function savePaletteWrapedC(palette: BaseHexColor[], countColorsPalette: number): number {
33-
const { canvasSo } = require('./c/canvas.ts')
34-
const libData = Buffer.from(canvasSo, 'base64')
35-
if (!fs.existsSync('/tmp/canvas_lib.so'))
36-
fs.writeFileSync('/tmp/canvas_lib.so', libData, { encoding: 'binary', mode: 0o775 })
37-
const cLib = dlopen('/tmp/canvas_lib.so', {
38-
save_palette: {
39-
returns: 'int',
40-
args: ['int', 'pointer', 'pointer'],
41-
},
42-
})
43-
const paletteHex: ArrayLike<string>[] = []
44-
palette.forEach((hex) => paletteHex.push(hex.get().replace('#', '')))
45-
const buffersPalette = paletteHex.map((str) => {
46-
const buf = new Uint8Array(Buffer.from(str + '\0'))
47-
return buf
48-
})
49-
const pointerPalette = buffersPalette.map((buf) => ptr(buf))
50-
const palettePtr = ptr(new BigUint64Array(pointerPalette.map((p) => BigInt(p))))
29+
const { canvasSo } = require('./c/canvas.ts')
30+
const libData = Buffer.from(canvasSo, 'base64')
31+
if (!fs.existsSync('/tmp/canvas_lib.so'))
32+
fs.writeFileSync('/tmp/canvas_lib.so', libData, { encoding: 'binary', mode: 0o775 })
33+
const cLib = dlopen('/tmp/canvas_lib.so', {
34+
save_palette: {
35+
returns: 'int',
36+
args: ['int', 'pointer', 'pointer'],
37+
},
38+
})
39+
const paletteHex: ArrayLike<string>[] = []
40+
palette.forEach((hex) => paletteHex.push(hex.get().replace('#', '')))
41+
const buffersPalette = paletteHex.map((str) => {
42+
const buf = new Uint8Array(Buffer.from(str + '\0'))
43+
return buf
44+
})
45+
const pointerPalette = buffersPalette.map((buf) => ptr(buf))
46+
const palettePtr = ptr(new BigUint64Array(pointerPalette.map((p) => BigInt(p))))
5147

52-
const textColors: ArrayLike<string>[] = []
53-
palette.forEach((color) => textColors.push(color.textColor.replace('#', '')))
54-
const buffersTextColors = textColors.map((str) => {
55-
const buf = new Uint8Array(Buffer.from(str + '\0'))
56-
return buf
57-
})
58-
const pointerTextColors = buffersTextColors.map((buf) => ptr(buf))
59-
const textColorPtr = ptr(new BigUint64Array(pointerTextColors.map((p) => BigInt(p))))
48+
const textColors: ArrayLike<string>[] = []
49+
palette.forEach((color) => textColors.push(color.textColor.replace('#', '')))
50+
const buffersTextColors = textColors.map((str) => {
51+
const buf = new Uint8Array(Buffer.from(str + '\0'))
52+
return buf
53+
})
54+
const pointerTextColors = buffersTextColors.map((buf) => ptr(buf))
55+
const textColorPtr = ptr(new BigUint64Array(pointerTextColors.map((p) => BigInt(p))))
6056

61-
cLib.symbols.save_palette(countColorsPalette, palettePtr, textColorPtr)
62-
return 1
57+
cLib.symbols.save_palette(countColorsPalette, palettePtr, textColorPtr)
58+
return 1
6359
}

‎src/index.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,9 @@ function App() {
3737
<>
3838
<SizeContext value={size}>
3939
{display === 'start' && <StartScreen setSelectedIndex={setSelectedIndex} actionOptions={actionOptions} />}
40-
{display === 'main' && <Main actionOptions={actionOptions} selectedIndex={selectedIndex} setSelectedIndex={setSelectedIndex}/>}
40+
{display === 'main' && (
41+
<Main actionOptions={actionOptions} selectedIndex={selectedIndex} setSelectedIndex={setSelectedIndex} />
42+
)}
4143
{display === 'options' && <Options actionOptions={actionOptions} />}
4244
</SizeContext>
4345
</>

‎src/init.ts‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,13 @@ import fs from 'fs'
22
import os from 'os'
33

44
export function initialize() {
5-
const userName: string = os.userInfo().username
6-
if (!fs.existsSync(`/home/${userName}/Pictures/colors`))
7-
fs.mkdirSync(`/home/${userName}/Pictures/colors`, { recursive: true })
5+
const userName: string = os.userInfo().username
6+
if (!fs.existsSync(`/home/${userName}/Pictures/colors`))
7+
fs.mkdirSync(`/home/${userName}/Pictures/colors`, { recursive: true })
88

9-
if (!fs.existsSync(`/home/${userName}/.config/color-hunter/settings.json`)) {
10-
const initConf: string = `{\n"savePath":"/home/${userName}/Pictures/colors/"\n}`
11-
fs.mkdirSync(`/home/${userName}/.config/color-hunter/`, { recursive: true })
12-
fs.writeFileSync(`/home/${userName}/.config/color-hunter/settings.json`, initConf, 'utf8')
13-
}
9+
if (!fs.existsSync(`/home/${userName}/.config/color-hunter/settings.json`)) {
10+
const initConf: string = `{\n"savePath":"/home/${userName}/Pictures/colors/"\n}`
11+
fs.mkdirSync(`/home/${userName}/.config/color-hunter/`, { recursive: true })
12+
fs.writeFileSync(`/home/${userName}/.config/color-hunter/settings.json`, initConf, 'utf8')
13+
}
1414
}

‎src/keyboard.ts‎

Lines changed: 42 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,79 +1,86 @@
11
import { useKeyboard } from '@opentui/react'
22
import { randomColor, savePaletteWrapedC } from './fuctions.ts'
3-
import { options, type displayT, type optionsT, type paletteT, type UseState } from './types'
3+
import {
4+
options,
5+
type displayT,
6+
type optionsT,
7+
type paletteT,
8+
type keyboardMainT,
9+
type UseState,
10+
type keyboardOptionsT,
11+
} from './types'
412
import { useEffect, useState } from 'react'
513
import type { DiagnosticMessageChain } from 'typescript'
614
import { ConsolePosition } from '@opentui/core'
715

8-
export function useKeyboardMain(state: { palette: paletteT, setPalette: UseState<paletteT>, selectedIndex: number, setSelectedIndex: UseState<number>, pause: boolean, setPause: UseState<boolean>, actionOptions: (option: displayT) => void, setDisplayModal: UseState<boolean>, timeout: NodeJS.Timeout, setMyTimeout: UseState<NodeJS.Timeout> }) {
9-
16+
export function useKeyboardMain(state: keyboardMainT) {
1017
useKeyboard((key) => {
1118
switch (key.name) {
12-
case "space":
19+
case 'space':
1320
state.setPause(true)
1421
clearTimeout(state.timeout)
15-
break;
16-
case "s":
22+
break
23+
case 's':
1724
if (savePaletteWrapedC(state.palette.colors[state.palette.position]!, state.palette.size)) {
1825
state.setDisplayModal(true)
1926
setTimeout(() => state.setDisplayModal(false), 2000)
2027
}
2128
state.setPalette((p) => ({ ...p, display: true }))
2229

23-
break;
24-
case "c":
30+
break
31+
case 'c':
2532
if (state.palette.display && state.pause) {
2633
state.setMyTimeout(
27-
randomColor(
28-
state.palette,
29-
state.setPalette,
30-
options[state.selectedIndex]!.value
31-
)
34+
randomColor(state.palette, state.setPalette, options[state.selectedIndex]!.value)
3235
)
3336

34-
state.setPalette((p) => ({ ...p, position: p.colors.length - 1, display: true }))
37+
state.setPalette((p) => ({ ...p, position: p.colors.length - 1, display: true }))
3538
state.setPause(false)
3639
}
37-
break;
38-
case "b":
40+
break
41+
case 'b':
3942
if (state.pause && state.palette.position > 1)
4043
state.setPalette((p) => ({ ...p, position: p.position - 1 }))
41-
break;
42-
case "n":
44+
break
45+
case 'n':
4346
if (state.pause && state.palette.position < state.palette.colors.length - 1)
4447
state.setPalette((p) => ({ ...p, position: p.position + 1 }))
45-
break;
46-
case "e":
48+
break
49+
case 'e':
4750
state.setPalette((p) => ({ ...p, position: 0, colors: [[]], display: false }))
4851
state.setSelectedIndex(0)
4952
clearTimeout(state.timeout)
50-
state.actionOptions("start")
51-
break;
52-
case "o":
53-
if (!state.palette.display)
54-
state.actionOptions("options")
55-
break;
53+
state.actionOptions('start')
54+
break
55+
case 'o':
56+
if (!state.palette.display) state.actionOptions('options')
57+
break
5658
}
5759
})
5860
}
5961

6062
export function useKeyboardStart(actionOptions: (option: displayT) => void) {
61-
6263
useKeyboard((key) => {
63-
if (key.name === "s")
64-
actionOptions("main")
65-
if (key.name === "o")
66-
actionOptions("options")
64+
if (key.name === 's') actionOptions('main')
65+
if (key.name === 'o') actionOptions('options')
6766
})
6867
}
6968

70-
export function useKeyboardOptions(selectionMode, setSelectionMode, setPositionFocusedInput, saveNewOptions, actionOptions) {
69+
export function useKeyboardOptions({
70+
selectionMode,
71+
setSelectionMode,
72+
setPositionFocusedInput,
73+
saveNewOptions,
74+
actionOptions,
75+
}: keyboardOptionsT) {
7176
useKeyboard((key) => {
72-
if (key.name === 'j' || key.name === 'down' && selectionMode) setPositionFocusedInput((pos) => pos > 1? 1:pos+1)
73-
else if (key.name === 'k' || key.name === 'up' && selectionMode) setPositionFocusedInput((pos) => (pos > 1 ? pos - 1 : pos))
77+
if (key.name === 'j' || (key.name === 'down' && selectionMode))
78+
setPositionFocusedInput((pos) => (pos > 1 ? 1 : pos + 1))
79+
else if (key.name === 'k' || (key.name === 'up' && selectionMode))
80+
setPositionFocusedInput((pos) => (pos > 1 ? pos - 1 : pos))
7481
else if (key.name === 'escape') setSelectionMode(true)
7582
else if (key.name === 'return' && selectionMode) setSelectionMode(false)
7683
else if (key.name === 'return' && !selectionMode) saveNewOptions()
77-
else if (key.name === 'e' && selectionMode) actionOptions("start")
84+
else if (key.name === 'e' && selectionMode) actionOptions('start')
7885
})
7986
}

‎src/types.ts‎

Lines changed: 39 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,56 @@
11
import { type Dispatch, type SetStateAction } from 'react'
22
import type { BaseHexColor } from './hex'
33
export interface ControlWheelProp {
4-
pause: boolean
5-
timeout: NodeJS.Timeout | null
6-
displayColors: boolean
4+
pause: boolean
5+
timeout: NodeJS.Timeout | null
6+
displayColors: boolean
77
}
88
export type ActionArgs =
9-
| { type: 'pauseColorWheel' }
10-
| { type: 'startColorWheel' }
11-
| { type: 'continueColorWheel' }
12-
| { type: 'savePalette' }
13-
| { type: 'backToStartScreen' }
9+
| { type: 'pauseColorWheel' }
10+
| { type: 'startColorWheel' }
11+
| { type: 'continueColorWheel' }
12+
| { type: 'savePalette' }
13+
| { type: 'backToStartScreen' }
1414

1515
export type HexValue = string
1616

1717
export type OptionValue = string | 'default' | 'cold' | 'warm' | 'pastel'
1818

1919
export const options = [
20-
{ name: 'default', description: '', value: 'default' },
21-
{ name: 'cold color', description: '', value: 'cold' },
22-
{ name: 'warm color', description: '', value: 'warm' },
23-
{ name: 'pastel color', description: '', value: 'pastel' },
20+
{ name: 'Random Colors', description: '', value: 'default' },
21+
{ name: 'Cold Colors', description: '', value: 'cold' },
22+
{ name: 'Warm Colors', description: '', value: 'warm' },
23+
{ name: 'Pastel Colors', description: '', value: 'pastel' },
2424
]
2525
export interface sizeT {
26-
height: number
27-
width: number
26+
height: number
27+
width: number
2828
}
2929
export type displayT = 'start' | 'options' | 'main'
3030
export type optionsT = [{ name: string; description: string; value: string }]
3131
export type UseState<T> = Dispatch<SetStateAction<T>>
32-
export type paletteT = {colors: BaseHexColor[][], size:number, display:boolean, position:number}
32+
export type paletteT = { colors: BaseHexColor[][]; size: number; display: boolean; position: number }
33+
export type modalState = 'success' | 'error'
34+
35+
export type keyboardMainT = {
36+
palette: paletteT
37+
setPalette: UseState<paletteT>
38+
selectedIndex: number
39+
setSelectedIndex: UseState<number>
40+
pause: boolean
41+
setPause: UseState<boolean>
42+
actionOptions: (option: displayT) => void
43+
setDisplayModal: UseState<boolean>
44+
timeout: NodeJS.Timeout
45+
setMyTimeout: UseState<NodeJS.Timeout>
46+
}
47+
export type keyboardOptionsT = {
48+
selectionMode: boolean
49+
setSelectionMode: UseState<boolean>
50+
setPositionFocusedInput: UseState<number>
51+
saveNewOptions: () => void
52+
actionOptions: (display: displayT) => void
53+
}
54+
55+
export type modalT = { display: boolean; text: string; state: modalState }
56+
export type newOption = 'savePath' | 'sizePalette'

0 commit comments

Comments
 (0)