diff --git a/src/components/MiniMap.tsx b/src/components/MiniMap.tsx index 01b48bb..986b17d 100644 --- a/src/components/MiniMap.tsx +++ b/src/components/MiniMap.tsx @@ -3,7 +3,7 @@ import notes, { NoteCardType } from "../signals/notes" import { canvasDimentsion } from "../signals" import { LayerEnum } from "../utils/enums" import images, { ImageCardType } from "../signals/images" -import texts from "../signals/texts" +import texts, { TextCardType } from "../signals/texts" const _MAP_OFFSET = 20 const _MAP_SCALE_FACTOR = 10 @@ -112,7 +112,7 @@ export function MiniMap() { ) })} - {Object.keys(texts.texts.value).map((textKey: textCardType['id']) => { + {Object.keys(texts.texts.value).map((textKey: TextCardType['id']) => { const text = texts.texts.value[textKey] const el = useRef(null) @@ -129,12 +129,11 @@ export function MiniMap() { onclick={_handleItemClick} style={{ position: 'absolute', - width: `${text.dimensions.w / _MAP_SCALE_FACTOR}px`, - height: `${text.dimensions.h / _MAP_SCALE_FACTOR}px`, + width: `${300 / _MAP_SCALE_FACTOR}px`, + height: `${100 / _MAP_SCALE_FACTOR}px`, top: `${(text.position.y / _MAP_SCALE_FACTOR)}px`, left: `${(text.position.x / _MAP_SCALE_FACTOR)}px`, border: '1px solid #222', - borderRadius: '2px', zIndex: `${LayerEnum.MINIMAP + 1}` }} > diff --git a/src/components/TextItem.tsx b/src/components/TextItem.tsx index 1455343..1b198de 100644 --- a/src/components/TextItem.tsx +++ b/src/components/TextItem.tsx @@ -18,7 +18,6 @@ export function TextItem({ key: itemKey, data: item }: TextItem.TextCardProps) { const offsetX = useRef(0) const offsetY = useRef(0) const initialResizeX = useRef(0) - const initialResizeY = useRef(0) const { debounce } = useDebounce() @@ -49,6 +48,7 @@ export function TextItem({ key: itemKey, data: item }: TextItem.TextCardProps) { function _handleMouseDown(e: MouseEvent) { e.preventDefault() + focusedItem.value = itemKey offsetX.current = e.offsetX offsetY.current = e.offsetY pressed.value = true @@ -57,12 +57,11 @@ export function TextItem({ key: itemKey, data: item }: TextItem.TextCardProps) { } function _handleResizeMove(e: MouseEvent) { - const { pageX, pageY } = e - const [newX, newY] = [initialResizeX.current - pageX, initialResizeY.current - pageY] + const { pageX } = e + const newX = initialResizeX.current - pageX const newW = -newX + item.dimensions.w - const newH = -newY + item.dimensions.h - const newDim = { w: newW, h: newH } + const newDim = { w: newW, h: 0 } TextSignal.default.updateTextProperty(itemKey, 'dimensions', newDim) TextSignal.default.texts.notify() @@ -71,7 +70,6 @@ export function TextItem({ key: itemKey, data: item }: TextItem.TextCardProps) { function _handleResizeMouseDown(e: MouseEvent) { initialResizeX.current = e.pageX - initialResizeY.current = e.pageY pressed.value = true window.addEventListener('mousemove', _handleResizeMove) window.addEventListener('mouseup', _handleResizeMouseUp) @@ -87,18 +85,37 @@ export function TextItem({ key: itemKey, data: item }: TextItem.TextCardProps) { return (
-
-

{item.contents}

+
+ {item.contents}
+ + + +
) diff --git a/src/components/cardSelector/ImportButton.tsx b/src/components/cardSelector/ImportButton.tsx index 5a41c7d..7226b8c 100644 --- a/src/components/cardSelector/ImportButton.tsx +++ b/src/components/cardSelector/ImportButton.tsx @@ -21,15 +21,15 @@ export function ImportButton() { let content = readerEvent.target?.result; // get only the base64 parts and not any identifiers content = (content as string).split(',')[1] - const data: Record | Card<'image'>> = convertBase64ToJson(content) + const data: Record | Card<'images'>> = convertBase64ToJson(content) for (let key in data) { const item = data[key] - if (item.type == 'image') { + if (item.type == 'images') { const { id, ...rest } = item images.addImage(rest) } - if (item.type == 'note') { + if (item.type == 'notes') { const { id, ...rest } = item notes.addNote(rest) } diff --git a/src/components/cardSelector/TextButton.tsx b/src/components/cardSelector/TextButton.tsx index 2b1d925..d253ddc 100644 --- a/src/components/cardSelector/TextButton.tsx +++ b/src/components/cardSelector/TextButton.tsx @@ -8,7 +8,7 @@ export function TextButton() { function _handleClick(e: MouseEvent) { TextSignal.default.addText({ - type: "text", + type: "texts", title: "New Note", contents: "todo: fill me", position: { @@ -20,12 +20,13 @@ export function TextButton() { h: 100 } }) - updateLocalStorage("text", texts.texts.value) + updateLocalStorage("texts", texts.texts.value) } return ( +export type ImageCardType = Card<"images"> const images = signal>({}) diff --git a/src/signals/notes.ts b/src/signals/notes.ts index 755fb69..71be04a 100644 --- a/src/signals/notes.ts +++ b/src/signals/notes.ts @@ -2,7 +2,7 @@ import { signal } from "kaioken" import { Card } from "../types" import { focusedItem } from "." -export type NoteCardType = Card<"note"> +export type NoteCardType = Card<"notes"> const notes = signal>({}) diff --git a/src/signals/texts.ts b/src/signals/texts.ts index 5f02e7f..72b5e5a 100644 --- a/src/signals/texts.ts +++ b/src/signals/texts.ts @@ -2,7 +2,7 @@ import { signal } from "kaioken" import { Card } from "../types" import { focusedItem } from "." -export type TextCardType = Card<"text"> +export type TextCardType = Card<"texts"> const texts = signal>({}) diff --git a/src/types/Card.ts b/src/types/Card.ts index e810a38..c2dad2e 100644 --- a/src/types/Card.ts +++ b/src/types/Card.ts @@ -1,4 +1,4 @@ -export type CardTypes = "note" | "image" | "text" +export type CardTypes = "notes" | "images" | "texts" export type positionCoords = { x: number; y: number } export type dimensionCoords = { w: number; h: number }