raymonf/lifeto-shop
1
0
Fork 0
forked from a/lifeto-shop
Code Pull Requests Activity

noot

Browse Source
This commit is contained in:
a 2025-06-20 00:41:10 -05:00
parent 8c9437c0be
commit bd20e23b15
No known key found for this signature in database
GPG Key ID: 2F22877AA4DFDADB
42 changed files with 10412 additions and 6466 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
.biomeignore Normal file
View File

@ -0,0 +1,7 @@
dist
**/vendor/**
**/locales/**
generated.*
node_modules
*.min.js
*.min.css

59
biome.json Normal file
View File

@ -0,0 +1,59 @@
{
"$schema": "https://biomejs.dev/schemas/2.0.0/schema.json",
"files": {
"ignoreUnknown": true
},
"linter": {
"enabled": true,
"rules": {
"recommended": true,
"style": {
"noUselessElse": "error",
"useConst": "warn",
"useImportType": "off",
"useNodejsImportProtocol": "off"
},
"suspicious": {
"noConsole": "error",
"noRedeclare": "off",
"noDoubleEquals": "warn",
"noExplicitAny": "off"
},
"correctness": {
"noUndeclaredVariables": "off",
"useExhaustiveDependencies": "off",
"noUnusedImports": "warn"
},
"complexity": {
"noExtraBooleanCast": "warn",
"noBannedTypes": "off"
}
}
},
"formatter": {
"enabled": true,
"formatWithErrors": false,
"indentStyle": "space",
"indentWidth": 2,
"lineWidth": 100
},
"javascript": {
"parser": {
"unsafeParameterDecoratorsEnabled": true
},
"formatter": {
"quoteStyle": "single",
"jsxQuoteStyle": "double",
"semicolons": "asNeeded",
"trailingCommas": "all",
"arrowParentheses": "asNeeded"
}
},
"json": {
"formatter": {
"enabled": true,
"indentStyle": "space",
"indentWidth": 2
}
}
}

54
eslint.config.cjs
View File

@ -1,54 +0,0 @@
module.exports = {
settings: {
react: {
version: 'detect',
},
},
root: true,
env: { browser: true, es2020: true },
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:react/recommended',
'plugin:react-hooks/recommended',
'plugin:react/jsx-runtime',
],
ignorePatterns: ['dist', '.eslintrc.cjs', '**/vendor/**', '**/locales/**', 'generated.*'],
parser: '@typescript-eslint/parser',
parserOptions: {
project: true,
tsconfigRootDir: __dirname,
ecmaFeatures: {
jsx: true,
},
},
plugins: ['react-refresh', 'react'],
rules: {
'no-extra-semi': 'off', // this one needs to stay off
'@react/no-children-prop': 'off', // tanstack form uses this as a pattern
'react/no-children-prop': 'off', // tanstack form uses this as a pattern
'no-duplicate-imports': 'warn',
'@typescript-eslint/no-extra-semi': 'off',
'sort-imports': 'off',
'react-hooks/exhaustive-deps': 'off',
'react-refresh/only-export-components': 'off',
'no-case-declarations': 'off',
'no-redeclare': 'off',
'no-undef': 'off',
'@typescript-eslint/no-explicit-any': 'off',
'@typescript-eslint/strict-boolean-expressions': ['error', {
"allowString": true,
"allowNumber": true,
"allowNullableObject": true,
"allowNullableBoolean": true,
"allowNullableString": true,
"allowNullableNumber": false,
"allowNullableEnum": true,
"allowAny": true
}],
'react/prop-types': 'off',
'no-lonely-if': 2,
'no-console': 2,
},
}

15
package.json
View File

@ -2,31 +2,29 @@
"name": "lifeto-shop",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
"preview": "vite preview",
"lint": "biome check .",
"lint:fix": "biome check --write .",
"format": "biome format --write ."
},
"dependencies": {
"@floating-ui/react": "^0.27.8",
"@handsontable/react": "^15.3.0",
"@mantine/hooks": "^8.0.0",
"@tailwindcss/vite": "^4.1.10",
"@tanstack/react-query": "^5.76.0",
"@tanstack/react-table": "^8.21.3",
"@types/qs": "^6.9.18",
"@types/react": "^19.1.4",
"@types/react-dom": "^19.1.5",
"@types/uuid": "^10.0.0",
"@typescript-eslint/eslint-plugin": "^8.32.1",
"@typescript-eslint/parser": "^8.32.1",
"@vitejs/plugin-react": "^4.4.1",
"arktype": "^2.1.20",
"axios": "^1.9.0",
"eslint": "^9.26.0",
"eslint-config-react-app": "^7.0.1",
"eslint-plugin-react": "^7.37.5",
"eslint-plugin-react-hooks": "^5.2.0",
"eslint-plugin-react-refresh": "^0.4.20",
"fuse.js": "^7.1.0",
"handsontable": "^15.3.0",
"jotai": "^2.12.4",
@ -49,6 +47,7 @@
"uuid": "^11.1.0"
},
"devDependencies": {
"@biomejs/biome": "^2.0.0",
"@tailwindcss/postcss": "^4.1.6",
"@types/node": "^22.15.18",
"postcss": "^8.5.3",

5
postcss.config.cjs
View File

@ -1,5 +0,0 @@
module.exports = {
plugins: {
'@tailwindcss/postcss': {},
},
}

0
public/cursor.png → public/assets/cursor.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.1 KiB

After

Width:  |  Height:  |  Size: 4.1 KiB

18
src/App.tsx
View File

@ -1,23 +1,23 @@
import { FC } from "react";
import { LoginWidget } from "./components/login";
import { CharacterRoulette } from "./components/characters";
import { Inventory } from "./components/inventory/index";
import { FC } from 'react'
import { CharacterRoulette } from './components/characters'
import { Inventory } from './components/inventory/index'
import { LoginWidget } from './components/login'
export const App: FC = () => {
return (
<>
<div className="flex flex-row mx-auto p-4 gap-8 w-full h-full">
<div className="flex flex-col">
<LoginWidget/>
<CharacterRoulette/>
<LoginWidget />
<CharacterRoulette />
</div>
<div className="flex-1">
<Inventory/>
<Inventory />
</div>
</div>
</>
);
};
)
}
/*
<div className="flex flex-col p-4 h-full">

220
src/components/characters.tsx
View File

@ -1,123 +1,122 @@
import { TricksterCharacter } from "../lib/trickster"
import Fuse from 'fuse.js'
import { useAtom } from "jotai"
import { charactersAtom, selectedCharacterAtom } from "../state/atoms"
import { useMemo, useState } from "react";
import {
useFloating,
autoUpdate,
offset,
FloatingPortal,
flip,
offset,
shift,
useHover,
useFocus,
useDismiss,
useRole,
useFloating,
useFocus,
useHover,
useInteractions,
FloatingPortal
} from "@floating-ui/react";
useRole,
} from '@floating-ui/react'
import Fuse from 'fuse.js'
import { useAtom } from 'jotai'
import { useMemo, useState } from 'react'
import { TricksterCharacter } from '../lib/trickster'
import { charactersAtom, selectedCharacterAtom } from '../state/atoms'
export const CharacterCard = ({character}:{
character: TricksterCharacter,
})=>{
const [isOpen, setIsOpen] = useState(false);
export const CharacterCard = ({ character }: { character: TricksterCharacter }) => {
const [isOpen, setIsOpen] = useState(false)
const { refs, floatingStyles, context } = useFloating({
open: isOpen,
onOpenChange: setIsOpen,
placement: "top",
placement: 'top',
// Make sure the tooltip stays on the screen
whileElementsMounted: autoUpdate,
middleware: [
offset(5),
flip({
fallbackAxisSideDirection: "start"
fallbackAxisSideDirection: 'start',
}),
shift()
]
});
shift(),
],
})
// Event listeners to change the open state
const hover = useHover(context, { move: false });
const focus = useFocus(context);
const dismiss = useDismiss(context);
const hover = useHover(context, { move: false })
const focus = useFocus(context)
const dismiss = useDismiss(context)
// Role props for screen readers
const role = useRole(context, { role: "tooltip" });
const role = useRole(context, { role: 'tooltip' })
// Merge all the interactions into prop getters
const { getReferenceProps, getFloatingProps } = useInteractions([
hover,
focus,
dismiss,
role
]);
const { getReferenceProps, getFloatingProps } = useInteractions([hover, focus, dismiss, role])
const [selectedCharacter, setSelectedCharacter] = useAtom(selectedCharacterAtom)
return <>
<div onClick={()=>{
setSelectedCharacter(character)
}}
ref={refs.setReference} {...getReferenceProps()}
className={`
return (
<>
<div
onClick={() => {
setSelectedCharacter(character)
}}
ref={refs.setReference}
{...getReferenceProps()}
className={`
flex flex-col border border-black
hover:cursor-pointer
hover:bg-blue-100
p-2 ${character.path === selectedCharacter?.path? `bg-blue-200 hover:bg-blue-100` : ""}`}>
<div className="flex flex-col justify-between h-full">
<div className="flex flex-col gap-2">
<div className="flex flex-row justify-center"
>
{character.base_job === -8 ?
<img
className="h-8"
src="https://beta.lifeto.co/item_img/gel.nri.003.000.png"
/>
:
<img
className="h-16"
src={`https://knowledge.lifeto.co/animations/character/chr${
(character.current_job - character.base_job - 1).toString().padStart(3,"0")
}_13.png`}/>
}
</div>
<FloatingPortal>
{isOpen && (
<div
className="Tooltip"
ref={refs.setFloating}
style={floatingStyles}
{...getFloatingProps()}
>
<div className="flex flex-col gap-1 bg-white">
{character.base_job === -8 ? "bank" : character.name}
p-2 ${character.path === selectedCharacter?.path ? `bg-blue-200 hover:bg-blue-100` : ''}`}
>
<div className="flex flex-col justify-between h-full">
<div className="flex flex-col gap-2">
<div className="flex flex-row justify-center">
{character.base_job === -8 ? (
<img className="h-8" src="https://beta.lifeto.co/item_img/gel.nri.003.000.png" />
) : (
<img
className="h-16"
src={`https://knowledge.lifeto.co/animations/character/chr${(
character.current_job -
character.base_job -
1
)
.toString()
.padStart(3, '0')}_13.png`}
/>
)}
</div>
<FloatingPortal>
{isOpen && (
<div
className="Tooltip"
ref={refs.setFloating}
style={floatingStyles}
{...getFloatingProps()}
>
<div className="flex flex-col gap-1 bg-white">
{character.base_job === -8 ? 'bank' : character.name}
</div>
</div>
</div>
)}
</FloatingPortal>
)}
</FloatingPortal>
</div>
</div>
</div>
</div>
</>
</>
)
}
const PleaseLogin = () => {
return <><div className="align-center">no characters (not logged in?)</div></>
return (
<>
<div className="align-center">no characters (not logged in?)</div>
</>
)
}
export const CharacterRoulette = ()=>{
const [{data: rawCharacters}] = useAtom(charactersAtom)
export const CharacterRoulette = () => {
const [{ data: rawCharacters }] = useAtom(charactersAtom)
const [search, setSearch] = useState("")
const [search, setSearch] = useState('')
const { characters, fuse } = useMemo(()=>{
if(!rawCharacters) {
const { characters, fuse } = useMemo(() => {
if (!rawCharacters) {
return {
characters: [],
fuse: new Fuse([], {})
fuse: new Fuse([], {}),
}
}
// transform characters into pairs between the bank and not bank
@ -127,37 +126,40 @@ export const CharacterRoulette = ()=>{
findAllMatches: true,
threshold: 0.8,
useExtendedSearch: true,
keys: ["character.name"],
keys: ['character.name'],
}),
}
}, [rawCharacters])
if(!characters || characters.length == 0) {
return <PleaseLogin/>
if (!characters || characters.length === 0) {
return <PleaseLogin />
}
const searchResults = fuse.search(search || "!-----", {
limit: 20,
}).map((x)=>{
return <div className="flex flex-col" key={`${x.item.character.account_id}`}>
<CharacterCard key={x.item.bank.id} character={x.item.bank} />
<CharacterCard key={x.item.character.id} character={x.item.character} />
</div>
})
return <>
<div className="flex flex-col gap-1">
<input
className="border border-black-1 bg-gray-100 placeholder-gray-600 p-1 max-w-[180px]"
placeholder="search character..."
value={search}
onChange={(e)=>{
setSearch(e.target.value)
}}
></input>
<div className="flex flex-row flex-wrap overflow-x-scroll gap-1 h-full min-h-36 max-w-48">
{searchResults ? searchResults : <>
</>}
const searchResults = fuse
.search(search || '!-----', {
limit: 20,
})
.map(x => {
return (
<div className="flex flex-col" key={`${x.item.character.account_id}`}>
<CharacterCard key={x.item.bank.id} character={x.item.bank} />
<CharacterCard key={x.item.character.id} character={x.item.character} />
</div>
)
})
return (
<>
<div className="flex flex-col gap-1">
<input
className="border border-black-1 bg-gray-100 placeholder-gray-600 p-1 max-w-[180px]"
placeholder="search character..."
value={search}
onChange={e => {
setSearch(e.target.value)
}}
></input>
<div className="flex flex-row flex-wrap overflow-x-scroll gap-1 h-full min-h-36 max-w-48">
{searchResults ? searchResults : <></>}
</div>
</div>
</div>
</>
</>
)
}

241
src/components/inventory/index.tsx
View File

@ -1,11 +1,19 @@
import { clearItemSelectionActionAtom, currentCharacterItemsAtom, filteredCharacterItemsAtom, inventoryFilterAtom, inventoryItemsCurrentPageAtom, inventoryPageRangeAtom, itemSelectionSelectAllFilterActionAtom, itemSelectionSelectAllPageActionAtom, paginateInventoryActionAtom, preferenceInventorySearch, selectedCharacterAtom, setInventoryFilterTabActionAtom} from "@/state/atoms";
import {useAtom, useAtomValue, useSetAtom } from "jotai";
import { InventoryTargetSelector } from './movetarget';
import { InventoryTable } from './table';
import { FaArrowLeft, FaArrowRight } from "react-icons/fa";
import { useAtom, useAtomValue, useSetAtom } from 'jotai'
import { FaArrowLeft, FaArrowRight } from 'react-icons/fa'
import {
clearItemSelectionActionAtom,
filteredCharacterItemsAtom,
inventoryFilterAtom,
inventoryPageRangeAtom,
itemSelectionSelectAllFilterActionAtom,
itemSelectionSelectAllPageActionAtom,
paginateInventoryActionAtom,
preferenceInventorySearch,
selectedCharacterAtom,
setInventoryFilterTabActionAtom,
} from '@/state/atoms'
import { InventoryTargetSelector } from './movetarget'
import { InventoryTable } from './table'
const sections = [
{ name: 'all', value: '' },
@ -14,7 +22,6 @@ const sections = [
{ name: 'drill', value: '3' },
{ name: 'pet', value: '4' },
{ name: 'etc', value: '5' },
]
const cardSections = [
@ -26,50 +33,59 @@ const cardSections = [
{ name: 'arcana', value: '15' },
]
const InventoryTabs = ()=> {
const inventoryFilter= useAtomValue(inventoryFilterAtom)
const InventoryTabs = () => {
const inventoryFilter = useAtomValue(inventoryFilterAtom)
const setInventoryFilterTab = useSetAtom(setInventoryFilterTabActionAtom)
const inventoryRange = useAtomValue(inventoryPageRangeAtom)
const items = useAtomValue(filteredCharacterItemsAtom)
console.log("items", items)
const sharedStyle = "hover:cursor-pointer hover:bg-gray-200 px-2 pr-4 border border-gray-200"
const selectedStyle = "bg-gray-200 border-b-2 border-black-1"
return <div className="flex flex-row gap-1 justify-between">
<div className="flex flex-col gap-1">
<div className="flex flex-row gap-1">
{sections.map(x=>{
return <div
onClick={()=>{
setInventoryFilterTab(x.value)
}}
key={x.name}
className={`${sharedStyle}
${inventoryFilter.tab === x.value ? selectedStyle : ""}`}
>{x.name}</div>
})}
const sharedStyle = 'hover:cursor-pointer hover:bg-gray-200 px-2 pr-4 border border-gray-200'
const selectedStyle = 'bg-gray-200 border-b-2 border-black-1'
return (
<div className="flex flex-row gap-1 justify-between">
<div className="flex flex-col gap-1">
<div className="flex flex-row gap-1">
{sections.map(x => {
return (
<div
onClick={() => {
setInventoryFilterTab(x.value)
}}
key={x.name}
className={`${sharedStyle}
${inventoryFilter.tab === x.value ? selectedStyle : ''}`}
>
{x.name}
</div>
)
})}
</div>
<div className="flex flex-row gap-1">
{cardSections.map(x => {
return (
<div
onClick={() => {
setInventoryFilterTab(x.value)
}}
key={x.name}
className={`${sharedStyle}
${inventoryFilter.tab === x.value ? selectedStyle : ''}`}
>
{x.name}
</div>
)
})}
</div>
</div>
<div className="flex flex-row gap-1">
{cardSections.map(x=>{
return <div
onClick={()=>{
setInventoryFilterTab(x.value)
}}
key={x.name}
className={`${sharedStyle}
${inventoryFilter.tab === x.value ? selectedStyle : ""}`}
>{x.name}</div>
})}
<div className="flex flex-row gap-1 items-center px-1 bg-yellow-100">
<div className="whitespace-pre select-none">
{inventoryRange.start}..{inventoryRange.end}/{items.length}{' '}
</div>
</div>
</div>
<div className="flex flex-row gap-1 items-center px-1 bg-yellow-100">
<div className="whitespace-pre select-none">{inventoryRange.start}..{inventoryRange.end}/{items.length} </div>
</div>
</div>
)
}
export const Inventory = () => {
const selectedCharacter = useAtomValue(selectedCharacterAtom)
const clearItemSelection = useSetAtom(clearItemSelectionActionAtom)
@ -77,73 +93,88 @@ export const Inventory = () => {
const addFilterItemSelection = useSetAtom(itemSelectionSelectAllFilterActionAtom)
const [search, setSearch] = useAtom(preferenceInventorySearch)
const paginateInventory = useSetAtom(paginateInventoryActionAtom)
if(!selectedCharacter){
return <div>
select a character
</div>
if (!selectedCharacter) {
return <div>select a character</div>
}
return <div className={`flex flex-col h-full w-full`}>
<div className="flex flex-col py-2 flex-0 justify-between h-full">
<div className="flex flex-row justify-between">
<div className="flex flex-row gap-2">
<div className="whitespace-pre bg-blue-200 px-2 py-1 rounded-xl hover:cursor-pointer hover:bg-blue-300"
onClick={()=>{
addPageItemSelection()
}}
>select filtered</div>
<div className="whitespace-pre bg-blue-200 px-2 py-1 rounded-xl hover:cursor-pointer hover:bg-blue-300"
onClick={()=>{
addFilterItemSelection()
}}
>select page</div>
<div className="whitespace-pre bg-blue-200 px-2 py-1 rounded-xl hover:cursor-pointer hover:bg-blue-300"
onClick={()=>{
clearItemSelection()
}}
>clear </div>
return (
<div className={`flex flex-col h-full w-full`}>
<div className="flex flex-col py-2 flex-0 justify-between h-full">
<div className="flex flex-row justify-between">
<div className="flex flex-row gap-2">
<div
className="whitespace-pre bg-blue-200 px-2 py-1 rounded-xl hover:cursor-pointer hover:bg-blue-300"
onClick={() => {
addPageItemSelection()
}}
>
select filtered
</div>
<div
className="whitespace-pre bg-blue-200 px-2 py-1 rounded-xl hover:cursor-pointer hover:bg-blue-300"
onClick={() => {
addFilterItemSelection()
}}
>
select page
</div>
<div
className="whitespace-pre bg-blue-200 px-2 py-1 rounded-xl hover:cursor-pointer hover:bg-blue-300"
onClick={() => {
clearItemSelection()
}}
>
clear{' '}
</div>
</div>
<div className="flex flex-row">
<InventoryTargetSelector />
<div
onClick={_e => {
// sendOrders()
}}
className="hover:cursor-pointer whitespace-preborder border-black-1 bg-orange-200 hover:bg-orange-300 px-2 py-1"
>
Move Selected
</div>
</div>
</div>
<div className="flex flex-row">
<InventoryTargetSelector/>
<div
onClick={(e)=>{
// sendOrders()
}}
className="hover:cursor-pointer whitespace-preborder border-black-1 bg-orange-200 hover:bg-orange-300 px-2 py-1">Move Selected</div>
</div>
</div>
<div className="flex flex-row gap-2 justify-between">
<div className="flex flex-row gap-0 items-center">
<input
type="text"
value={search}
className="border border-black-1 px-2 py-1"
placeholder="search..."
onChange={(e)=>{
setSearch(e.target.value)
}}
/>
<div
className="hover:cursor-pointer border border-black-1 bg-green-200 hover:bg-green-300 px-2 py-1 h-full flex items-center"
onClick={()=>{
paginateInventory(-1)
}}
><FaArrowLeft/></div>
<div
className="hover:cursor-pointer border border-black-1 bg-green-200 hover:bg-green-300 px-2 py-1 h-full flex items-center"
onClick={()=>{
paginateInventory(1)
}}
><FaArrowRight/></div>
<div className="flex flex-row gap-2 justify-between">
<div className="flex flex-row gap-0 items-center">
<input
type="text"
value={search}
className="border border-black-1 px-2 py-1"
placeholder="search..."
onChange={e => {
setSearch(e.target.value)
}}
/>
<div
className="hover:cursor-pointer border border-black-1 bg-green-200 hover:bg-green-300 px-2 py-1 h-full flex items-center"
onClick={() => {
paginateInventory(-1)
}}
>
<FaArrowLeft />
</div>
<div
className="hover:cursor-pointer border border-black-1 bg-green-200 hover:bg-green-300 px-2 py-1 h-full flex items-center"
onClick={() => {
paginateInventory(1)
}}
>
<FaArrowRight />
</div>
</div>
</div>
</div>
<InventoryTabs />
<div className="flex flex-col flex-1 h-full border border-black-2">
<InventoryTable />
</div>
</div>
<InventoryTabs />
<div className="flex flex-col flex-1 h-full border border-black-2">
<InventoryTable />
</div>
</div>
)
}

135
src/components/inventory/movetarget.tsx
View File

@ -1,22 +1,30 @@
import { forwardRef, useId, useMemo, useRef, useState} from "react";
import { useAtom, useAtomValue } from "jotai";
import { autoUpdate, flip, FloatingFocusManager, FloatingPortal, size, useDismiss, useFloating, useInteractions, useListNavigation, useRole } from "@floating-ui/react";
import Fuse from "fuse.js";
import { charactersAtom, selectedTargetInventoryAtom } from "@/state/atoms";
import {
autoUpdate,
FloatingFocusManager,
FloatingPortal,
flip,
size,
useDismiss,
useFloating,
useInteractions,
useListNavigation,
useRole,
} from '@floating-ui/react'
import Fuse from 'fuse.js'
import { useAtom, useAtomValue } from 'jotai'
import { forwardRef, useId, useMemo, useRef, useState } from 'react'
import { charactersAtom, selectedTargetInventoryAtom } from '@/state/atoms'
interface AccountInventorySelectorItemProps {
children: React.ReactNode;
active: boolean;
children: React.ReactNode
active: boolean
}
const AccountInventorySelectorItem = forwardRef<
HTMLDivElement,
AccountInventorySelectorItemProps & React.HTMLProps<HTMLDivElement>
>(({ children, active, ...rest }, ref) => {
const id = useId();
const id = useId()
return (
<div
ref={ref}
@ -25,22 +33,22 @@ const AccountInventorySelectorItem = forwardRef<
aria-selected={active}
{...rest}
style={{
background: active ? "lightblue" : "none",
background: active ? 'lightblue' : 'none',
padding: 4,
cursor: "default",
cursor: 'default',
...rest.style,
}}
>
{children}
</div>
);
});
)
})
export const InventoryTargetSelector = () => {
const [open, setOpen] = useState(false);
const [inputValue, setInputValue] = useState("");
const [activeIndex, setActiveIndex] = useState<number | null>(null);
const [open, setOpen] = useState(false)
const [inputValue, setInputValue] = useState('')
const [activeIndex, setActiveIndex] = useState<number | null>(null)
const listRef = useRef<Array<HTMLElement | null>>([]);
const listRef = useRef<Array<HTMLElement | null>>([])
const { refs, floatingStyles, context } = useFloating<HTMLInputElement>({
whileElementsMounted: autoUpdate,
@ -53,56 +61,55 @@ export const InventoryTargetSelector = () => {
Object.assign(elements.floating.style, {
width: `${rects.reference.width}px`,
maxHeight: `${availableHeight}px`,
});
})
},
padding: 10,
}),
],
});
})
const role = useRole(context, { role: "listbox" });
const dismiss = useDismiss(context);
const role = useRole(context, { role: 'listbox' })
const dismiss = useDismiss(context)
const listNav = useListNavigation(context, {
listRef,
activeIndex,
onNavigate: setActiveIndex,
virtual: true,
loop: true,
});
})
const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions(
[role, dismiss, listNav]
);
const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions([
role,
dismiss,
listNav,
])
function onChange(event: React.ChangeEvent<HTMLInputElement>) {
const value = event.target.value;
setInputValue(value);
const value = event.target.value
setInputValue(value)
setSelectedTargetInventory(undefined)
if (value) {
setOpen(true);
setActiveIndex(0);
setOpen(true)
setActiveIndex(0)
} else {
setOpen(false);
setOpen(false)
}
}
const { data: subaccounts } = useAtomValue(charactersAtom)
const [selectedTargetInventory, setSelectedTargetInventory] = useAtom(selectedTargetInventoryAtom)
const searcher = useMemo(()=>{
return new Fuse(subaccounts?.flatMap(x=>[
x.bank,
x.character,
])||[], {
keys:["path","name"],
findAllMatches: true,
threshold: 0.8,
useExtendedSearch: true,
})
const searcher = useMemo(() => {
return new Fuse(subaccounts?.flatMap(x => [x.bank, x.character]) || [], {
keys: ['path', 'name'],
findAllMatches: true,
threshold: 0.8,
useExtendedSearch: true,
})
}, [subaccounts])
const items = searcher.search(inputValue || "!-", {limit: 10}).map(x=>x.item)
const items = searcher.search(inputValue || '!-', { limit: 10 }).map(x => x.item)
return (
<>
<input
@ -111,40 +118,32 @@ export const InventoryTargetSelector = () => {
ref: refs.setReference,
onChange,
value: selectedTargetInventory !== undefined ? selectedTargetInventory.name : inputValue,
placeholder: "Target Inventory",
"aria-autocomplete": "list",
placeholder: 'Target Inventory',
'aria-autocomplete': 'list',
onFocus() {
setOpen(true);
setOpen(true)
},
onKeyDown(event) {
if (
event.key === "Enter" &&
activeIndex != null &&
items[activeIndex]
) {
if (event.key === 'Enter' && activeIndex != null && items[activeIndex]) {
setSelectedTargetInventory(items[activeIndex])
setInputValue(items[activeIndex].name);
setActiveIndex(null);
setOpen(false);
setInputValue(items[activeIndex].name)
setActiveIndex(null)
setOpen(false)
}
},
})}
/>
{open && (
<FloatingPortal>
<FloatingFocusManager
context={context}
initialFocus={-1}
visuallyHiddenDismiss
>
<FloatingFocusManager context={context} initialFocus={-1} visuallyHiddenDismiss>
<div
{...getFloatingProps({
ref: refs.setFloating,
style: {
...floatingStyles,
background: "#eee",
color: "black",
overflowY: "auto",
background: '#eee',
color: 'black',
overflowY: 'auto',
},
})}
>
@ -153,13 +152,13 @@ export const InventoryTargetSelector = () => {
{...getItemProps({
key: item.path,
ref(node) {
listRef.current[index] = node;
listRef.current[index] = node
},
onClick() {
setInputValue(item.name);
setSelectedTargetInventory(item);
setOpen(false);
refs.domReference.current?.focus();
setInputValue(item.name)
setSelectedTargetInventory(item)
setOpen(false)
refs.domReference.current?.focus()
},
})}
active={activeIndex === index}
@ -172,5 +171,5 @@ export const InventoryTargetSelector = () => {
</FloatingPortal>
)}
</>
);
)
}

65
src/components/inventory/table.tsx
View File

@ -1,38 +1,29 @@
import { StatsColumns } from "@/lib/columns"
import { ItemWithSelection } from "@/lib/table/defs"
import { InventoryColumns } from "@/lib/table/tanstack"
import { inventoryItemsCurrentPageAtom, preferenceInventoryTab } from "@/state/atoms"
import { flexRender, getCoreRowModel, useReactTable } from "@tanstack/react-table"
import { atom, useAtom, useAtomValue } from "jotai"
import { useMemo } from "react"
import { flexRender, getCoreRowModel, useReactTable } from '@tanstack/react-table'
import { atom, useAtomValue } from 'jotai'
import { useMemo } from 'react'
import { StatsColumns } from '@/lib/columns'
import { ItemWithSelection } from '@/lib/table/defs'
import { InventoryColumns } from '@/lib/table/tanstack'
import { inventoryItemsCurrentPageAtom, preferenceInventoryTab } from '@/state/atoms'
const columnVisibilityAtom = atom((get)=>{
const columnVisibilityAtom = atom(get => {
const itemTab = get(preferenceInventoryTab)
if(!["2","4"].includes(itemTab)) {
return Object.fromEntries([
...StatsColumns.map(x=>["stats."+x,false]),
["slots",false]
])
}
return {
if (!['2', '4'].includes(itemTab)) {
return Object.fromEntries([...StatsColumns.map(x => [`stats.${x}`, false]), ['slots', false]])
}
return {}
})
export const InventoryTable = () => {
const items = useAtomValue(inventoryItemsCurrentPageAtom)
const columns = useMemo(()=>{
return [
...Object.values(InventoryColumns)
]
const columns = useMemo(() => {
return [...Object.values(InventoryColumns)]
}, [])
const columnVisibility = useAtomValue(columnVisibilityAtom)
console.log(columnVisibility)
const table = useReactTable<ItemWithSelection>({
getRowId: row =>row.item.unique_id.toString(),
getRowId: row => row.item.unique_id.toString(),
data: items,
state: {
columnVisibility,
@ -44,27 +35,20 @@ export const InventoryTable = () => {
return (
<div className="overflow-y-auto h-full mb-32">
<table
onContextMenu={(e)=>{
onContextMenu={e => {
e.preventDefault()
return
}}
className="border-spacing-x-2 border-separate">
className="border-spacing-x-2 border-separate"
>
<thead className="sticky top-0 z-10 select-none bg-white">
{table.getHeaderGroups().map(headerGroup => (
<tr
className=""
key={headerGroup.id}>
<tr className="" key={headerGroup.id}>
{headerGroup.headers.map(header => (
<th
key={header.id}
className="text-left"
>
<th key={header.id} className="text-left">
{header.isPlaceholder
? null
: flexRender(
header.column.columnDef.header,
header.getContext()
)}
: flexRender(header.column.columnDef.header, header.getContext())}
</th>
))}
</tr>
@ -72,14 +56,9 @@ export const InventoryTable = () => {
</thead>
<tbody className="divide-y divide-gray-200">
{table.getRowModel().rows.map(row => (
<tr
key={row.id}
className={""}
>
<tr key={row.id} className={''}>
{row.getVisibleCells().map(cell => (
<td key={cell.id}>
{flexRender(cell.column.columnDef.cell, cell.getContext())}
</td>
<td key={cell.id}>{flexRender(cell.column.columnDef.cell, cell.getContext())}</td>
))}
</tr>
))}

149
src/components/login.tsx
View File

@ -1,80 +1,87 @@
import { useState } from "react"
import useLocalStorage from "use-local-storage"
import { useAtom } from "jotai"
import { loginStatusAtom } from "../state/atoms"
import { LoginHelper } from "../lib/session"
import { useAtom } from 'jotai'
import { useState } from 'react'
import useLocalStorage from 'use-local-storage'
import { LoginHelper } from '../lib/session'
import { loginStatusAtom } from '../state/atoms'
export const LoginWidget = () => {
const [username, setUsername] = useLocalStorage("input_username","", {syncData: false})
const [password, setPassword] = useState("")
const [username, setUsername] = useLocalStorage('input_username', '', { syncData: false })
const [password, setPassword] = useState('')
const [{data:loginState, refetch: refetchLoginState}] = useAtom(loginStatusAtom)
const [{ data: loginState, refetch: refetchLoginState }] = useAtom(loginStatusAtom)
const [loginError, setLoginError] = useState("")
const [loginError, setLoginError] = useState('')
if(loginState?.logged_in){
return <>
<div className="flex flex-row justify-between px-2">
<div>
{loginState.community_name}
if (loginState?.logged_in) {
return (
<>
<div className="flex flex-row justify-between px-2">
<div>{loginState.community_name}</div>
<div className="flex flex-row gap-2">
<button
onClick={() => {
LoginHelper.logout().finally(() => {
refetchLoginState()
})
return
}}
className="text-blue-400 text-xs hover:cursor-pointer hover:text-blue-600"
>
logout
</button>
</div>
</div>
<div className="flex flex-row gap-2">
<button
onClick={()=>{
LoginHelper.logout().finally(()=>{
refetchLoginState()
})
return
}}
className="text-blue-400 text-xs hover:cursor-pointer hover:text-blue-600">
logout
</button>
</div>
</div>
</>
</>
)
}
return <>
<div className="flex flex-col">
<form action={
()=>{
LoginHelper.login(username,password).catch((e)=>{
setLoginError(e.message)
}).finally(()=>{
refetchLoginState()
refetchLoginState()
})
}}
className="flex flex-col gap-1 p-2 justify-left">
{ loginError ? (<div className="text-red-500 text-xs">
{loginError}
</div>) : null}
<div>
<input
onChange={(e)=>{
setUsername(e.target.value)
}}
value={username}
id="username"
placeholder="username" className="w-32 pl-2 pb-1 border-b border-gray-600 placeholder-gray-500"/>
</div>
<div>
<input
onChange={(e)=>{
setPassword(e.target.value)
}}
value={password}
type="password" placeholder="password" className="w-32 pl-2 pb-1 border-b border-gray-600 placeholder-gray-500"/>
</div>
<button
type="submit"
className="border-b border-gray-600 px-2 py-1 hover:text-gray-600 hover:cursor-pointer">
login
</button>
</form>
</div>
</>
return (
<>
<div className="flex flex-col">
<form
action={() => {
LoginHelper.login(username, password)
.catch(e => {
setLoginError(e.message)
})
.finally(() => {
refetchLoginState()
refetchLoginState()
})
}}
className="flex flex-col gap-1 p-2 justify-left"
>
{loginError ? <div className="text-red-500 text-xs">{loginError}</div> : null}
<div>
<input
onChange={e => {
setUsername(e.target.value)
}}
value={username}
id="username"
placeholder="username"
className="w-32 pl-2 pb-1 border-b border-gray-600 placeholder-gray-500"
/>
</div>
<div>
<input
onChange={e => {
setPassword(e.target.value)
}}
value={password}
type="password"
placeholder="password"
className="w-32 pl-2 pb-1 border-b border-gray-600 placeholder-gray-500"
/>
</div>
<button
type="submit"
className="border-b border-gray-600 px-2 py-1 hover:text-gray-600 hover:cursor-pointer"
>
login
</button>
</form>
</div>
</>
)
}

19
src/context/AppContext.tsx
View File

@ -1,19 +1,14 @@
import { SessionContextProvider } from "./SessionContext";
import { SessionContextProvider } from './SessionContext'
interface IContext {
children: React.ReactNode;
children: React.ReactNode
}
function AppContext(props: IContext): any {
const { children } = props;
const providers = [
SessionContextProvider,
];
const res = providers.reduceRight(
(acc, CurrVal) => <CurrVal>{acc as any}</CurrVal>,
children,
);
return res as any;
const { children } = props
const providers = [SessionContextProvider]
const res = providers.reduceRight((acc, CurrVal) => <CurrVal>{acc as any}</CurrVal>, children)
return res as any
}
export default AppContext;
export default AppContext

93
src/context/SessionContext.tsx
View File

@ -1,21 +1,22 @@
import { createContext, Dispatch, SetStateAction, useContext, useState } from "react";
import { createContext, useContext, useState } from 'react'
type Setter<T> = React.Dispatch<React.SetStateAction<T | undefined>>;
type MustSetter<T> = React.Dispatch<React.SetStateAction<T>>;
import useLocalStorage from "use-local-storage";
import { OrderTracker } from "../lib/lifeto/order_manager";
import { ColumnSet } from "../lib/table";
import { StoreAccounts, StoreChars, StoreColSet, StoreStr } from "../lib/storage";
import { BasicColumns, ColumnInfo, ColumnName, Columns, DetailsColumns, MoveColumns } from '../lib/columns'
type Setter<T> = React.Dispatch<React.SetStateAction<T | undefined>>
type MustSetter<T> = React.Dispatch<React.SetStateAction<T>>
import useLocalStorage from 'use-local-storage'
import { BasicColumns, ColumnInfo, ColumnName, DetailsColumns, MoveColumns } from '../lib/columns'
import { OrderTracker } from '../lib/lifeto/order_manager'
import { StoreColSet } from '../lib/storage'
import { ColumnSet } from '../lib/table'
interface SessionContextProps {
orders: OrderTracker;
activeTable: string;
screen: string;
columns: ColumnSet;
tags: ColumnSet;
dirty: number;
currentSearch: string;
orders: OrderTracker
activeTable: string
screen: string
columns: ColumnSet
tags: ColumnSet
dirty: number
currentSearch: string
setActiveTable: Setter<string>
setScreen: Setter<string>
@ -23,49 +24,57 @@ interface SessionContextProps {
setCurrentSearch: MustSetter<string>
}
const _defaultColumn:(ColumnInfo| ColumnName)[] = [
const _defaultColumn: (ColumnInfo | ColumnName)[] = [
...BasicColumns,
...MoveColumns,
...DetailsColumns,
]
const SessionContext = createContext({} as SessionContextProps)
const SessionContext = createContext({} as SessionContextProps);
const dotry = (x:any, d: any)=>{
try{
const dotry = (x: any, d: any) => {
try {
return x()
}catch{
} catch {
return d
}
}
export const SessionContextProvider = ({ children }: { children: any }) => {
const [activeTable, setActiveTable] = useLocalStorage<string>("activeTable","")
const [screen, setScreen] = useLocalStorage<string>("screen","")
const [columns ] = useState<ColumnSet>(new ColumnSet(_defaultColumn));
const [tags ] = useState<ColumnSet>(dotry(()=>StoreColSet.Revive("tags"), new ColumnSet()));
const [activeTable, setActiveTable] = useLocalStorage<string>('activeTable', '')
const [screen, setScreen] = useLocalStorage<string>('screen', '')
const [columns] = useState<ColumnSet>(new ColumnSet(_defaultColumn))
const [tags] = useState<ColumnSet>(dotry(() => StoreColSet.Revive('tags'), new ColumnSet()))
const [orders ] = useState<OrderTracker>(new OrderTracker());
const [dirty, setDirty] = useState<number>(0);
const [currentSearch, setCurrentSearch] = useState<string>("");
const [orders] = useState<OrderTracker>(new OrderTracker())
const [dirty, setDirty] = useState<number>(0)
const [currentSearch, setCurrentSearch] = useState<string>('')
return (
<SessionContext.Provider value={{
orders, activeTable, screen, columns, tags, dirty, currentSearch,
setActiveTable, setScreen, setDirty, setCurrentSearch,
}}>{children}</SessionContext.Provider>
);
};
<SessionContext.Provider
value={{
orders,
activeTable,
screen,
columns,
tags,
dirty,
currentSearch,
setActiveTable,
setScreen,
setDirty,
setCurrentSearch,
}}
>
{children}
</SessionContext.Provider>
)
}
export const useSessionContext = (): SessionContextProps => {
const context = useContext<SessionContextProps>(SessionContext);
const context = useContext<SessionContextProps>(SessionContext)
if (context === null) {
throw new Error(
'"useSessionContext" should be used inside a "SessionContextProvider"',
);
throw new Error('"useSessionContext" should be used inside a "SessionContextProvider"')
}
return context;
};
return context
}

10
src/index.css
View File

@ -1,13 +1,13 @@
@import 'tailwindcss';
@import "tailwindcss";
html {
cursor: url(/public/cursor.png), auto !important;
cursor: url(/assets/cursor.png), auto !important;
}
@theme {
--cursor-default: url(/public/cursor.png), auto !important;
--cursor-pointer: url(/public/cursor.png), pointer !important;
--cursor-text: url(/public/cursor.png), pointer !important;
--cursor-default: url(/assets/cursor.png), auto !important;
--cursor-pointer: url(/assets/cursor.png), pointer !important;
--cursor-text: url(/assets/cursor.png), pointer !important;
}
/*
The default border color has changed to `currentcolor` in Tailwind CSS v4,

20
src/index.tsx
View File

@ -1,16 +1,16 @@
import React from "react";
import ReactDOM from "react-dom/client";
import { App } from "./App";
import AppContext from "./context/AppContext";
import React from 'react'
import ReactDOM from 'react-dom/client'
import { App } from './App'
import AppContext from './context/AppContext'
import './lib/superjson'
import './index.css'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import { Provider } from 'jotai'
import "./lib/superjson";
import "./index.css";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { Provider } from "jotai";
const queryClient = new QueryClient()
ReactDOM.createRoot(document.getElementById("app") as HTMLElement).render(
ReactDOM.createRoot(document.getElementById('app') as HTMLElement).render(
<React.StrictMode>
<Provider>
<QueryClientProvider client={queryClient}>
@ -20,4 +20,4 @@ ReactDOM.createRoot(document.getElementById("app") as HTMLElement).render(
</QueryClientProvider>
</Provider>
</React.StrictMode>,
);
)

78
src/lib/columns/column.ts
View File

@ -1,34 +1,33 @@
import { TricksterItem } from "../trickster"
import { TricksterItem } from '../trickster'
export const BasicColumns = [
"uid","Image","Name","Count",
] as const
export const BasicColumns = ['uid', 'Image', 'Name', 'Count'] as const
export const DetailsColumns = [
"Desc","Use",
] as const
export const DetailsColumns = ['Desc', 'Use'] as const
export const MoveColumns = [
"MoveCount","Move",
] as const
export const MoveColumns = ['MoveCount', 'Move'] as const
export const TagColumns = [
"All","Equip","Drill","Card","Quest","Consume", "Compound"
] as const
export const TagColumns = ['All', 'Equip', 'Drill', 'Card', 'Quest', 'Consume', 'Compound'] as const
export const EquipmentColumns = [
"MinLvl","Slots","RefineNumber","RefineState",
] as const
export const EquipmentColumns = ['MinLvl', 'Slots', 'RefineNumber', 'RefineState'] as const
export const StatsColumns = [
"HV","AC","LK","WT","HP","MA","DP","DX","MP","AP","MD","DA","GunAP"
'HV',
'AC',
'LK',
'WT',
'HP',
'MA',
'DP',
'DX',
'MP',
'AP',
'MD',
'DA',
'GunAP',
] as const
export const DebugColumns = [
]
export const HackColumns = [
] as const
export const DebugColumns = []
export const HackColumns = [] as const
export const ColumnNames = [
...BasicColumns,
@ -40,35 +39,34 @@ export const ColumnNames = [
...HackColumns,
] as const
export type ColumnName = typeof ColumnNames[number]
export type ColumnName = (typeof ColumnNames)[number]
const c = (a:ColumnName | ColumnInfo):ColumnName => {
switch(typeof a) {
case "string":
const c = (a: ColumnName | ColumnInfo): ColumnName => {
switch (typeof a) {
case 'string':
return a
case "object":
case 'object':
return a.name
}
}
export const LazyColumn = c;
export const LazyColumn = c
export const ColumnSorter = (a:ColumnName | ColumnInfo, b: ColumnName | ColumnInfo):number => {
let n1 = ColumnNames.indexOf(c(a))
let n2 = ColumnNames.indexOf(c(b))
if(n1 == n2) {
export const ColumnSorter = (a: ColumnName | ColumnInfo, b: ColumnName | ColumnInfo): number => {
const n1 = ColumnNames.indexOf(c(a))
const n2 = ColumnNames.indexOf(c(b))
if (n1 === n2) {
return 0
}
return n1 > n2 ? 1 : -1
}
export interface ColumnInfo {
export interface ColumnInfo {
name: ColumnName
displayName:string
displayName: string
options?:(s:string[])=>string[]
renderer?:any
filtering?:boolean
writable?:boolean
getter(item:TricksterItem):(string | number)
options?: (s: string[]) => string[]
renderer?: any
filtering?: boolean
writable?: boolean
getter(item: TricksterItem): string | number
}

546
src/lib/columns/column_impl.ts
View File

@ -1,464 +1,510 @@
import Handsontable from "handsontable"
import Core from "handsontable/core"
import { textRenderer } from "handsontable/renderers"
import numbro from "numbro"
import { TricksterItem } from "../trickster"
import {ColumnName, ColumnInfo} from "./column"
import Handsontable from 'handsontable'
import Core from 'handsontable/core'
import { textRenderer } from 'handsontable/renderers'
import numbro from 'numbro'
import { TricksterItem } from '../trickster'
import { ColumnInfo, ColumnName } from './column'
export const ColumnByNames = (...n:ColumnName[]) => {
export const ColumnByNames = (...n: ColumnName[]) => {
return n.map(ColumnByName)
}
export const ColumnByName = (n:ColumnName) => {
export const ColumnByName = (n: ColumnName) => {
return Columns[n]
}
class Image implements ColumnInfo {
name:ColumnName = 'Image'
displayName = " "
name: ColumnName = 'Image'
displayName = ' '
renderer = coverRenderer
getter(item:TricksterItem):(string|number) {
return item.item_image ? item.item_image : ""
getter(item: TricksterItem): string | number {
return item.item_image ? item.item_image : ''
}
}
function coverRenderer(instance:any, td:any, row:any, col:any, prop:any, value:any, cellProperties:any) {
const stringifiedValue = Handsontable.helper.stringify(value);
function coverRenderer(
_instance: any,
td: any,
_row: any,
_col: any,
_prop: any,
value: any,
_cellProperties: any,
) {
const stringifiedValue = Handsontable.helper.stringify(value)
if (stringifiedValue.startsWith('http')) {
const img:any = document.createElement('IMG');
img.src = value;
Handsontable.dom.addEvent(img, 'mousedown', event =>{
event!.preventDefault();
});
Handsontable.dom.empty(td);
td.appendChild(img);
const img: any = document.createElement('IMG')
img.src = value
Handsontable.dom.addEvent(img, 'mousedown', event => {
event?.preventDefault()
})
Handsontable.dom.empty(td)
td.appendChild(img)
}
}
class Name implements ColumnInfo {
name:ColumnName = "Name"
displayName = "Name"
name: ColumnName = 'Name'
displayName = 'Name'
filtering = true
renderer = nameRenderer
getter(item:TricksterItem):(string|number){
getter(item: TricksterItem): string | number {
return item.item_name
}
}
function nameRenderer(instance:any, td:any, row:any, col:any, prop:any, value:any, cellProperties:any) {
const stringifiedValue = Handsontable.helper.stringify(value);
let showText = stringifiedValue;
const div= document.createElement('div');
function nameRenderer(
_instance: any,
td: any,
_row: any,
_col: any,
_prop: any,
value: any,
_cellProperties: any,
) {
const stringifiedValue = Handsontable.helper.stringify(value)
const showText = stringifiedValue
const div = document.createElement('div')
div.innerHTML = showText
div.title = showText
div.style.maxWidth = "20ch"
div.style.textOverflow = "ellipsis"
div.style.overflow= "hidden"
div.style.whiteSpace= "nowrap"
Handsontable.dom.addEvent(div, 'mousedown', event =>{
event!.preventDefault();
});
Handsontable.dom.empty(td);
td.appendChild(div);
td.classList.add("htLeft")
div.style.maxWidth = '20ch'
div.style.textOverflow = 'ellipsis'
div.style.overflow = 'hidden'
div.style.whiteSpace = 'nowrap'
Handsontable.dom.addEvent(div, 'mousedown', event => {
event?.preventDefault()
})
Handsontable.dom.empty(td)
td.appendChild(div)
td.classList.add('htLeft')
}
class Count implements ColumnInfo {
name:ColumnName = "Count"
displayName = "Count"
renderer = "numeric"
name: ColumnName = 'Count'
displayName = 'Count'
renderer = 'numeric'
filtering = true
getter(item:TricksterItem):(string|number){
getter(item: TricksterItem): string | number {
return item.item_count
}
}
const spacer = "-----------"
const spacer = '-----------'
class Move implements ColumnInfo {
name:ColumnName = "Move"
displayName = "Target"
name: ColumnName = 'Move'
displayName = 'Target'
writable = true
options = getMoveTargets
getter(item:TricksterItem):(string|number){
getter(_item: TricksterItem): string | number {
return spacer
}
}
const getMoveTargets = (invs: string[]):string[] => {
let out:string[] = [];
const getMoveTargets = (invs: string[]): string[] => {
const out: string[] = []
out.push(spacer)
for(const k of invs){
for (const k of invs) {
out.push(k)
}
out.push("")
out.push("")
out.push("TRASH")
out.push('')
out.push('')
out.push('TRASH')
return out
}
class MoveCount implements ColumnInfo {
name:ColumnName = "MoveCount"
displayName = "Move #"
name: ColumnName = 'MoveCount'
displayName = 'Move #'
renderer = moveCountRenderer
writable = true
getter(item:TricksterItem):(string|number){
return ""
getter(_item: TricksterItem): string | number {
return ''
}
}
function moveCountRenderer(instance:Core, td:any, row:number, col:number, prop:any, value:any, cellProperties:any) {
let newValue = value;
function moveCountRenderer(
instance: Core,
td: any,
row: number,
col: number,
prop: any,
value: any,
cellProperties: any,
) {
let newValue = value
if (Handsontable.helper.isNumeric(newValue)) {
const numericFormat = cellProperties.numericFormat;
const cellCulture = numericFormat && numericFormat.culture || '-';
const cellFormatPattern = numericFormat && numericFormat.pattern;
const className = cellProperties.className || '';
const classArr = className.length ? className.split(' ') : [];
const numericFormat = cellProperties.numericFormat
const cellCulture = numericFormat?.culture || '-'
const cellFormatPattern = numericFormat?.pattern
const className = cellProperties.className || ''
const classArr = className.length ? className.split(' ') : []
if (typeof cellCulture !== 'undefined' && !numbro.languages()[cellCulture]) {
const shortTag:any = cellCulture.replace('-', '');
const langData = (numbro as any)[shortTag];
const shortTag: any = cellCulture.replace('-', '')
const langData = (numbro as any)[shortTag]
if (langData) {
numbro.registerLanguage(langData);
numbro.registerLanguage(langData)
}
}
const totalCount = Number(instance.getCell(row,col-1)?.innerHTML)
numbro.setLanguage(cellCulture);
const totalCount = Number(instance.getCell(row, col - 1)?.innerHTML)
numbro.setLanguage(cellCulture)
const num = numbro(newValue)
if(totalCount < num.value()) {
if (totalCount < num.value()) {
const newNum = numbro(totalCount)
newValue = newNum.format(cellFormatPattern || '0');
}else {
newValue = num.format(cellFormatPattern || '0');
newValue = newNum.format(cellFormatPattern || '0')
} else {
newValue = num.format(cellFormatPattern || '0')
}
if (classArr.indexOf('htLeft') < 0 && classArr.indexOf('htCenter') < 0 &&
classArr.indexOf('htRight') < 0 && classArr.indexOf('htJustify') < 0) {
classArr.push('htRight');
if (
classArr.indexOf('htLeft') < 0 &&
classArr.indexOf('htCenter') < 0 &&
classArr.indexOf('htRight') < 0 &&
classArr.indexOf('htJustify') < 0
) {
classArr.push('htRight')
}
if (classArr.indexOf('htNumeric') < 0) {
classArr.push('htNumeric');
classArr.push('htNumeric')
}
cellProperties.className = classArr.join(' ');
cellProperties.className = classArr.join(' ')
td.dir = 'ltr';
newValue = newValue + "x"
}else {
newValue = ""
td.dir = 'ltr'
newValue = `${newValue}x`
} else {
newValue = ''
}
textRenderer(instance, td, row, col, prop, newValue, cellProperties);
textRenderer(instance, td, row, col, prop, newValue, cellProperties)
}
class Equip implements ColumnInfo {
name:ColumnName = "Equip"
displayName = "equip"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Equip'
displayName = 'equip'
getter(item: TricksterItem): string | number {
return item.is_equip ? 1 : 0
}
}
class Drill implements ColumnInfo {
name:ColumnName = "Drill"
displayName = "drill"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Drill'
displayName = 'drill'
getter(item: TricksterItem): string | number {
return item.is_drill ? 1 : 0
}
}
class All implements ColumnInfo {
name:ColumnName = "All"
displayName = "swap"
getter(_:TricksterItem):(string|number){
name: ColumnName = 'All'
displayName = 'swap'
getter(_: TricksterItem): string | number {
return -10000
}
}
class uid implements ColumnInfo {
name:ColumnName = "uid"
displayName = "id"
name: ColumnName = 'uid'
displayName = 'id'
renderer = invisibleRenderer
getter(item:TricksterItem):(string|number){
getter(item: TricksterItem): string | number {
return item.unique_id
}
}
function invisibleRenderer(instance:Core, td:any, row:number, col:number, prop:any, value:any, cellProperties:any) {
Handsontable.dom.empty(td);
function invisibleRenderer(
_instance: Core,
td: any,
_row: number,
_col: number,
_prop: any,
_value: any,
_cellProperties: any,
) {
Handsontable.dom.empty(td)
}
class Card implements ColumnInfo {
name:ColumnName = "Card"
displayName = "card"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Card'
displayName = 'card'
getter(item: TricksterItem): string | number {
return cardFilter(item) ? 1 : 0
}
}
const cardFilter= (item:TricksterItem): boolean => {
return (item.item_name.endsWith(" Card") || item.item_name.startsWith("Star Card"))
const cardFilter = (item: TricksterItem): boolean => {
return item.item_name.endsWith(' Card') || item.item_name.startsWith('Star Card')
}
class Compound implements ColumnInfo {
name:ColumnName = "Compound"
displayName = "comp"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Compound'
displayName = 'comp'
getter(item: TricksterItem): string | number {
return compFilter(item) ? 1 : 0
}
}
const compFilter= (item:TricksterItem): boolean => {
return (item.item_comment.toLowerCase().includes("compound item"))
const compFilter = (item: TricksterItem): boolean => {
return item.item_comment.toLowerCase().includes('compound item')
}
class Quest implements ColumnInfo {
name:ColumnName = "Quest"
displayName = "quest"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Quest'
displayName = 'quest'
getter(item: TricksterItem): string | number {
return questFilter(item) ? 1 : 0
}
}
const questFilter= (item:TricksterItem): boolean => {
const questFilter = (_item: TricksterItem): boolean => {
return false
}
class Consume implements ColumnInfo {
name:ColumnName = "Consume"
displayName = "eat"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Consume'
displayName = 'eat'
getter(item: TricksterItem): string | number {
return consumeFilter(item) ? 1 : 0
}
}
const consumeFilter= (item:TricksterItem): boolean => {
const consumeFilter = (item: TricksterItem): boolean => {
const tl = item.item_use.toLowerCase()
return tl.includes("recover") || tl.includes("restores")
return tl.includes('recover') || tl.includes('restores')
}
class AP implements ColumnInfo {
name:ColumnName = "AP"
displayName = "AP"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["AP"] : ""
name: ColumnName = 'AP'
displayName = 'AP'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.AP : ''
}
}
class GunAP implements ColumnInfo {
name:ColumnName = "GunAP"
displayName = "Gun AP"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["Gun AP"] : ""
name: ColumnName = 'GunAP'
displayName = 'Gun AP'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats['Gun AP'] : ''
}
}
class AC implements ColumnInfo {
name:ColumnName = "AC"
displayName = "AC"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["AC"] : ""
name: ColumnName = 'AC'
displayName = 'AC'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.AC : ''
}
}
class DX implements ColumnInfo {
name:ColumnName = "DX"
displayName = "DX"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["DX"] : ""
name: ColumnName = 'DX'
displayName = 'DX'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.DX : ''
}
}
class MP implements ColumnInfo {
name:ColumnName = "MP"
displayName = "MP"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["MP"] : ""
name: ColumnName = 'MP'
displayName = 'MP'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.MP : ''
}
}
class MA implements ColumnInfo {
name:ColumnName = "MA"
displayName = "MA"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["MA"] : ""
name: ColumnName = 'MA'
displayName = 'MA'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.MA : ''
}
}
class MD implements ColumnInfo {
name:ColumnName = "MD"
displayName = "MD"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["MD"] : ""
name: ColumnName = 'MD'
displayName = 'MD'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.MD : ''
}
}
class WT implements ColumnInfo {
name:ColumnName = "WT"
displayName = "WT"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["WT"] : ""
name: ColumnName = 'WT'
displayName = 'WT'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.WT : ''
}
}
class DA implements ColumnInfo {
name:ColumnName = "DA"
displayName = "DA"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["DA"] : ""
name: ColumnName = 'DA'
displayName = 'DA'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.DA : ''
}
}
class LK implements ColumnInfo {
name:ColumnName = "LK"
displayName = "LK"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["LK"] : ""
name: ColumnName = 'LK'
displayName = 'LK'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.LK : ''
}
}
class HP implements ColumnInfo {
name:ColumnName = "HP"
displayName = "HP"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["HP"] : ""
name: ColumnName = 'HP'
displayName = 'HP'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.HP : ''
}
}
class DP implements ColumnInfo {
name:ColumnName = "DP"
displayName = "DP"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["DP"] : ""
name: ColumnName = 'DP'
displayName = 'DP'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.DP : ''
}
}
class HV implements ColumnInfo {
name:ColumnName = "HV"
displayName = "HV"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["HV"] : ""
name: ColumnName = 'HV'
displayName = 'HV'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.HV : ''
}
}
class MinLvl implements ColumnInfo {
name:ColumnName = "MinLvl"
displayName = "lvl"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'MinLvl'
displayName = 'lvl'
getter(item: TricksterItem): string | number {
//TODO:
return item.item_min_level? item.item_min_level:""
return item.item_min_level ? item.item_min_level : ''
}
}
class Slots implements ColumnInfo {
name:ColumnName = "Slots"
displayName = "slots"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Slots'
displayName = 'slots'
getter(item: TricksterItem): string | number {
//TODO:
return item.item_slots ? item.item_slots : ""
return item.item_slots ? item.item_slots : ''
}
}
class RefineNumber implements ColumnInfo {
name:ColumnName = "RefineNumber"
displayName = "refine"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'RefineNumber'
displayName = 'refine'
getter(item: TricksterItem): string | number {
return item.refine_level ? item.refine_level : 0
}
}
class RefineState implements ColumnInfo {
name:ColumnName = "RefineState"
displayName = "bork"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'RefineState'
displayName = 'bork'
getter(item: TricksterItem): string | number {
return item.refine_state ? item.refine_state : 0
}
}
class Desc implements ColumnInfo {
name:ColumnName = "Desc"
displayName = "desc"
name: ColumnName = 'Desc'
displayName = 'desc'
renderer = descRenderer
getter(item:TricksterItem):(string|number){
getter(item: TricksterItem): string | number {
return item.item_comment
}
}
function descRenderer(instance:any, td:any, row:any, col:any, prop:any, value:any, cellProperties:any) {
const stringifiedValue = Handsontable.helper.stringify(value);
let showText = stringifiedValue;
const div= document.createElement('div');
function descRenderer(
_instance: any,
td: any,
_row: any,
_col: any,
_prop: any,
value: any,
_cellProperties: any,
) {
const stringifiedValue = Handsontable.helper.stringify(value)
const showText = stringifiedValue
const div = document.createElement('div')
div.innerHTML = showText
div.title = showText
div.style.maxWidth = "30ch"
div.style.textOverflow = "ellipsis"
div.style.overflow= "hidden"
div.style.whiteSpace= "nowrap"
Handsontable.dom.addEvent(div, 'mousedown', event =>{
event!.preventDefault();
});
Handsontable.dom.empty(td);
td.appendChild(div);
td.classList.add("htLeft")
div.style.maxWidth = '30ch'
div.style.textOverflow = 'ellipsis'
div.style.overflow = 'hidden'
div.style.whiteSpace = 'nowrap'
Handsontable.dom.addEvent(div, 'mousedown', event => {
event?.preventDefault()
})
Handsontable.dom.empty(td)
td.appendChild(div)
td.classList.add('htLeft')
}
class Use implements ColumnInfo {
name:ColumnName = "Use"
displayName = "use"
renderer= useRenderer;
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Use'
displayName = 'use'
renderer = useRenderer
getter(item: TricksterItem): string | number {
return item.item_use
}
}
function useRenderer(instance:any, td:any, row:any, col:any, prop:any, value:any, cellProperties:any) {
const stringifiedValue = Handsontable.helper.stringify(value);
let showText = stringifiedValue;
const div= document.createElement('div');
function useRenderer(
_instance: any,
td: any,
_row: any,
_col: any,
_prop: any,
value: any,
_cellProperties: any,
) {
const stringifiedValue = Handsontable.helper.stringify(value)
const showText = stringifiedValue
const div = document.createElement('div')
div.title = showText
div.innerHTML = showText
div.style.maxWidth = "30ch"
div.style.textOverflow = "ellipsis"
div.style.overflow= "hidden"
div.style.whiteSpace= "nowrap"
Handsontable.dom.addEvent(div, 'mousedown', event =>{
event!.preventDefault();
});
Handsontable.dom.empty(td);
td.appendChild(div);
td.classList.add("htLeft")
div.style.maxWidth = '30ch'
div.style.textOverflow = 'ellipsis'
div.style.overflow = 'hidden'
div.style.whiteSpace = 'nowrap'
Handsontable.dom.addEvent(div, 'mousedown', event => {
event?.preventDefault()
})
Handsontable.dom.empty(td)
td.appendChild(div)
td.classList.add('htLeft')
}
export const Columns:{[Property in ColumnName]:ColumnInfo}= {
export const Columns: { [Property in ColumnName]: ColumnInfo } = {
Use: new Use(),
Desc: new Desc(),
Image: new Image(),
Name: new Name(),
Count: new Count(),
Move: new Move(),
MoveCount: new MoveCount(),
Equip: new Equip(),
Drill: new Drill(),
Card: new Card(),
Quest: new Quest(),
Consume: new Consume(),
AP: new AP(),
GunAP: new GunAP(),
AC: new AC(),
DX: new DX(),
MP: new MP(),
MA: new MA(),
MD: new MD(),
WT: new WT(),
DA: new DA(),
LK: new LK(),
HP: new HP(),
DP: new DP(),
HV: new HV(),
MinLvl: new MinLvl(),
Slots: new Slots(),
RefineNumber: new RefineNumber(),
RefineState: new RefineState(),
Image: new Image(),
Name: new Name(),
Count: new Count(),
Move: new Move(),
MoveCount: new MoveCount(),
Equip: new Equip(),
Drill: new Drill(),
Card: new Card(),
Quest: new Quest(),
Consume: new Consume(),
AP: new AP(),
GunAP: new GunAP(),
AC: new AC(),
DX: new DX(),
MP: new MP(),
MA: new MA(),
MD: new MD(),
WT: new WT(),
DA: new DA(),
LK: new LK(),
HP: new HP(),
DP: new DP(),
HV: new HV(),
MinLvl: new MinLvl(),
Slots: new Slots(),
RefineNumber: new RefineNumber(),
RefineState: new RefineState(),
All: new All(),
Compound: new Compound(),
uid: new uid(),
}

5
src/lib/columns/index.ts
View File

@ -1,3 +1,2 @@
export * from "./column"
export * from "./column_impl"
export * from './column'
export * from './column_impl'

20
src/lib/lifeto/api.ts
View File

@ -1,12 +1,18 @@
import { TricksterAccount, TricksterInventory } from "../trickster"
import { TricksterAccount, TricksterInventory } from '../trickster'
export const BankEndpoints = ["internal-xfer-item", "bank-item", "sell-item","buy-from-order","cancel-order"] as const
export type BankEndpoint = typeof BankEndpoints[number]
export const BankEndpoints = [
'internal-xfer-item',
'bank-item',
'sell-item',
'buy-from-order',
'cancel-order',
] as const
export type BankEndpoint = (typeof BankEndpoints)[number]
export interface LTOApi {
GetInventory:(path:string)=>Promise<TricksterInventory>
GetAccounts:() =>Promise<Array<TricksterAccount>>
GetLoggedin:() =>Promise<boolean>
GetInventory: (path: string) => Promise<TricksterInventory>
GetAccounts: () => Promise<Array<TricksterAccount>>
GetLoggedin: () => Promise<boolean>
BankAction:<T, D>(e:BankEndpoint, t:T) => Promise<D>
BankAction: <T, D>(e: BankEndpoint, t: T) => Promise<D>
}

6
src/lib/lifeto/index.ts
View File

@ -1,3 +1,3 @@
export * from "./lifeto"
export * from "./api"
export * from "./stateful"
export * from './api'
export * from './lifeto'
export * from './stateful'

166
src/lib/lifeto/lifeto.ts
View File

@ -1,115 +1,131 @@
import { Axios, AxiosResponse, Method } from "axios"
import log from "loglevel"
import { bank_endpoint, EndpointCreator, market_endpoint, Session } from "../session"
import { TricksterAccount, TricksterAccountInfo, TricksterInventory, TricksterItem} from "../trickster"
import { BankEndpoint, LTOApi } from "./api"
import { AxiosResponse, Method } from 'axios'
import log from 'loglevel'
import { bank_endpoint, EndpointCreator, market_endpoint, Session } from '../session'
import { TricksterAccount, TricksterInventory, TricksterItem } from '../trickster'
import { BankEndpoint, LTOApi } from './api'
export const pathIsBank = (path:string):boolean => {
if(path.includes("/")) {
export const pathIsBank = (path: string): boolean => {
if (path.includes('/')) {
return false
}
return true
}
export const splitPath = (path:string):[string,string]=>{
const spl = path.split("/")
switch(spl.length) {
export const splitPath = (path: string): [string, string] => {
const spl = path.split('/')
switch (spl.length) {
case 1:
return [spl[0], ""]
return [spl[0], '']
case 2:
return [spl[0],spl[1]]
return [spl[0], spl[1]]
}
return ["",""]
return ['', '']
}
export class LTOApiv0 implements LTOApi {
s: Session
constructor(s:Session) {
constructor(s: Session) {
this.s = s
}
BankAction = async <T,D>(e: BankEndpoint, t: T):Promise<D> => {
let VERB:Method | "POSTFORM" = "POST"
let endpoint:EndpointCreator = bank_endpoint
switch(e){
case "buy-from-order":
case "cancel-order":
BankAction = async <T, D>(e: BankEndpoint, t: T): Promise<D> => {
let VERB: Method | 'POSTFORM' = 'POST'
let endpoint: EndpointCreator = bank_endpoint
switch (e) {
case 'buy-from-order':
case 'cancel-order':
endpoint = market_endpoint
case "sell-item":
VERB = "POSTFORM"
case 'sell-item':
VERB = 'POSTFORM'
default:
}
return this.s.request(VERB as any,e,t,endpoint).then((x)=>{
return x.data
})
}
GetInventory = async (char_path: string):Promise<TricksterInventory> =>{
if(char_path.startsWith(":")) {
char_path = char_path.replace(":","")
}
let type = char_path.includes("/") ? "char" : "account"
return this.s.request("GET", `v3/item-manager/items/${type}/${char_path}`,undefined).then((ans:AxiosResponse)=>{
const o = ans.data
log.debug("GetInventory", o)
let name = "bank"
let id = 0
let galders = 0
if(pathIsBank(char_path)){
let [char, val] = Object.entries(o.characters)[0] as [string,any]
name = val.name
id = Number(char)
galders = 0
}else {
let [char, val] = Object.entries(o.characters)[0] as [string,any]
name = val.name
id = Number(char)
galders = val.galders
}
let out:TricksterInventory = {
account_name: o.account.account_gid,
account_id: o.account.account_code,
name,
id,
path: char_path,
galders,
items: new Map((Object.entries(o.items) as any).map(([k, v]: [string, TricksterItem]):[string, TricksterItem]=>{
v.unique_id = Number(k)
v.id = k
return [k, v]
})),
}
return out
return this.s.request(VERB as any, e, t, endpoint).then(x => {
return x.data
})
}
GetAccounts = async ():Promise<TricksterAccount[]> => {
return this.s.request("GET", "characters/list",undefined).then((ans:AxiosResponse)=>{
log.debug("GetAccounts", ans.data)
return ans.data.map((x:any):TricksterAccount=>{
GetInventory = async (char_path: string): Promise<TricksterInventory> => {
if (char_path.startsWith(':')) {
char_path = char_path.replace(':', '')
}
const type = char_path.includes('/') ? 'char' : 'account'
return this.s
.request('GET', `v3/item-manager/items/${type}/${char_path}`, undefined)
.then((ans: AxiosResponse) => {
const o = ans.data
log.debug('GetInventory', o)
let name = 'bank'
let id = 0
let galders = 0
if (pathIsBank(char_path)) {
const [char, val] = Object.entries(o.characters)[0] as [string, any]
name = val.name
id = Number(char)
galders = 0
} else {
const [char, val] = Object.entries(o.characters)[0] as [string, any]
name = val.name
id = Number(char)
galders = val.galders
}
const out: TricksterInventory = {
account_name: o.account.account_gid,
account_id: o.account.account_code,
name,
id,
path: char_path,
galders,
items: new Map(
(Object.entries(o.items) as any).map(
([k, v]: [string, TricksterItem]): [string, TricksterItem] => {
v.unique_id = Number(k)
v.id = k
return [k, v]
},
),
),
}
return out
})
}
GetAccounts = async (): Promise<TricksterAccount[]> => {
return this.s.request('GET', 'characters/list', undefined).then((ans: AxiosResponse) => {
log.debug('GetAccounts', ans.data)
return ans.data.map((x: any): TricksterAccount => {
return {
name: x.name,
characters: [
{account_name:x.name, id: x.id,account_id:x.id, path:x.name, name: x.name+'/bank', class:-8, base_job: -8, current_job: -8},
...Object.values(x.characters).map((z:any)=>{
{
account_name: x.name,
id: x.id,
account_id: x.id,
path: x.name,
name: `${x.name}/bank`,
class: -8,
base_job: -8,
current_job: -8,
},
...Object.values(x.characters).map((z: any) => {
return {
account_name:x.name,
account_name: x.name,
account_id: x.id,
id: z.id,
name: z.name,
path: x.name+"/"+z.name,
path: `${x.name}/${z.name}`,
class: z.class,
base_job: z.base_job,
current_job: z.current_job,
}
})],
}),
],
}
})
})
}
GetLoggedin = async ():Promise<boolean> => {
return this.s.request("POST", "accounts/list",undefined).then((ans:AxiosResponse)=>{
if(ans.status == 401) {
GetLoggedin = async (): Promise<boolean> => {
return this.s.request('POST', 'accounts/list', undefined).then((ans: AxiosResponse) => {
if (ans.status === 401) {
return false
}
if(ans.status == 200) {
if (ans.status === 200) {
return true
}
return false

469
src/lib/lifeto/order.ts
View File

@ -1,56 +1,55 @@
import { LTOApi } from "./api"
import { v4 as uuidv4 } from 'uuid';
import { RefStore } from "../../state/state";
import { debug } from "loglevel";
import { debug } from 'loglevel'
import { v4 as uuidv4 } from 'uuid'
import { RefStore } from '../../state/state'
import { LTOApi } from './api'
export const TxnStates = ["PENDING","INFLIGHT","WORKING","ERROR","SUCCESS"] as const
export const TxnStates = ['PENDING', 'INFLIGHT', 'WORKING', 'ERROR', 'SUCCESS'] as const
export type TxnState = typeof TxnStates[number]
export type TxnState = (typeof TxnStates)[number]
export interface TxnDetails {
item_uid: string | "galders"
count:number
origin:string
target:string
item_uid: string | 'galders'
count: number
origin: string
target: string
origin_path:string
target_path:string
origin_path: string
target_path: string
origin_account:string
target_account:string
origin_account: string
target_account: string
}
export interface Envelope<REQ,RESP> {
export interface Envelope<REQ, RESP> {
req: REQ
resp: RESP
state: TxnState
}
export abstract class Order {
action_id: string
details?:TxnDetails
created:Date
details?: TxnDetails
created: Date
state: TxnState
constructor(details?:TxnDetails) {
this.state = "PENDING"
constructor(details?: TxnDetails) {
this.state = 'PENDING'
this.details = details
this.created = new Date()
this.action_id = uuidv4();
this.action_id = uuidv4()
}
mark(t:TxnState) {
mark(t: TxnState) {
this.state = t
}
abstract tick(r:RefStore, api:LTOApi):Promise<any>
abstract status():string
abstract progress():[number, number]
abstract error():string
abstract tick(r: RefStore, api: LTOApi): Promise<any>
abstract status(): string
abstract progress(): [number, number]
abstract error(): string
abstract order_type:OrderType
abstract order_type: OrderType
parse(i:any):Order {
parse(i: any): Order {
this.action_id = i.action_id
this.details = i.details
this.created = new Date(i.created)
@ -63,20 +62,20 @@ export abstract class BasicOrder extends Order {
stage: number
err?: string
constructor(details:TxnDetails) {
constructor(details: TxnDetails) {
super(details)
this.stage = 0
}
progress():[number,number]{
progress(): [number, number] {
return [this.stage, 1]
}
status():string {
status(): string {
return this.state
}
error():string {
return this.err ? this.err : ""
error(): string {
return this.err ? this.err : ''
}
parse(i:any):BasicOrder {
parse(i: any): BasicOrder {
this.stage = i.stage
this.err = i.err
super.parse(i)
@ -85,31 +84,38 @@ export abstract class BasicOrder extends Order {
}
/// start user defined
export const OrderTypes = ["InvalidOrder","BankItem","InternalXfer", "PrivateMarket","MarketMove", "MarketMoveToChar"]
export type OrderType = typeof OrderTypes[number]
export const OrderTypes = [
'InvalidOrder',
'BankItem',
'InternalXfer',
'PrivateMarket',
'MarketMove',
'MarketMoveToChar',
]
export type OrderType = (typeof OrderTypes)[number]
export class InvalidOrder extends Order{
order_type = "InvalidOrder"
export class InvalidOrder extends Order {
order_type = 'InvalidOrder'
msg:string
constructor(msg: string){
msg: string
constructor(msg: string) {
super(undefined)
this.msg = msg
this.mark("ERROR")
this.mark('ERROR')
}
status():string {
return "ERROR"
status(): string {
return 'ERROR'
}
progress():[number, number] {
return [0,0]
progress(): [number, number] {
return [0, 0]
}
error(): string {
return this.msg
}
async tick(r:RefStore, api:LTOApi):Promise<void> {
async tick(_r: RefStore, _api: LTOApi): Promise<void> {
return
}
parse(i:any):InvalidOrder {
parse(i: any): InvalidOrder {
super.parse(i)
this.msg = i.msg
return this
@ -122,55 +128,60 @@ export interface BasicResponse {
message?: string
}
export interface InternalXferRequest {
item_uid:string
qty:string
account:string
new_char:string
item_uid: string
qty: string
account: string
new_char: string
}
export interface InternalXferResponse extends BasicResponse {}
export class InternalXfer extends BasicOrder{
order_type = "InternalXfer"
export class InternalXfer extends BasicOrder {
order_type = 'InternalXfer'
originalRequest:InternalXferRequest
originalResponse?:InternalXferResponse
constructor(details:TxnDetails) {
originalRequest: InternalXferRequest
originalResponse?: InternalXferResponse
constructor(details: TxnDetails) {
super(details)
this.originalRequest = {
this.originalRequest = {
item_uid: details.item_uid,
qty: details.count.toString(),
new_char: details.target,
account: details.origin,
}
}
async tick(r:RefStore, api:LTOApi):Promise<void> {
if(this.state !== "PENDING") {
async tick(r: RefStore, api: LTOApi): Promise<void> {
if (this.state !== 'PENDING') {
return
}
this.mark("WORKING")
return api.BankAction<InternalXferRequest, InternalXferResponse>("internal-xfer-item",this.originalRequest)
.then((x:InternalXferResponse)=>{
if(x.status === 'success'){
this.originalResponse = x
this.mark('WORKING')
return api
.BankAction<InternalXferRequest, InternalXferResponse>(
'internal-xfer-item',
this.originalRequest,
)
.then((x: InternalXferResponse) => {
if (x.status === 'success') {
this.originalResponse = x
this.stage = 1
this.mark('SUCCESS')
const origin_item = r.invs.value.get(this.details?.origin_path!)?.items[
this.details?.item_uid!
]!
origin_item.item_count = origin_item.item_count - this.details?.count!
} else {
throw x.message
}
})
.catch(e => {
debug('InternalXfer', e)
this.stage = 1
this.mark("SUCCESS")
const origin_item = r.invs.value.get(this.details?.origin_path!)!.items[this.details?.item_uid!]!
origin_item.item_count = origin_item.item_count - this.details?.count!
}else{
throw x.message
}
})
.catch((e)=>{
debug("InternalXfer",e)
this.stage = 1
this.err = e
this.mark("ERROR")
})
this.err = e
this.mark('ERROR')
})
}
parse(i:any):InternalXfer {
parse(i: any): InternalXfer {
super.parse(i)
this.originalRequest = i.originalRequest
this.originalResponse = i.originalResponse
@ -179,52 +190,55 @@ export class InternalXfer extends BasicOrder{
}
export interface BankItemRequest {
item_uid:string
qty:string
account:string
item_uid: string
qty: string
account: string
}
export interface BankItemResponse extends BasicResponse {}
export class BankItem extends BasicOrder{
order_type = "BankItem";
export class BankItem extends BasicOrder {
order_type = 'BankItem'
originalRequest:BankItemRequest
originalResponse?:BankItemResponse
constructor(details:TxnDetails) {
originalRequest: BankItemRequest
originalResponse?: BankItemResponse
constructor(details: TxnDetails) {
super(details)
this.originalRequest = {
this.originalRequest = {
item_uid: details.item_uid,
qty: details.count.toString(),
account: details.target,
}
}
async tick(r:RefStore, api:LTOApi):Promise<void> {
if(this.state !== "PENDING" ){
async tick(r: RefStore, api: LTOApi): Promise<void> {
if (this.state !== 'PENDING') {
return
}
this.mark("WORKING")
return api.BankAction<BankItemRequest, BankItemResponse>("bank-item",this.originalRequest)
.then((x)=>{
debug("BankItem",x)
if(x.status === 'success'){
this.stage = 1
this.originalResponse = x
this.mark("SUCCESS")
const origin_item = r.invs.value.get(this.details?.origin_path!)!.items[this.details?.item_uid!]!
origin_item.item_count = origin_item.item_count - this.details?.count!
}else {
throw x.message ? x.message : "unknown error"
this.mark('WORKING')
return api
.BankAction<BankItemRequest, BankItemResponse>('bank-item', this.originalRequest)
.then(x => {
debug('BankItem', x)
if (x.status === 'success') {
this.stage = 1
this.originalResponse = x
this.mark('SUCCESS')
const origin_item = r.invs.value.get(this.details?.origin_path!)?.items[
this.details?.item_uid!
]!
origin_item.item_count = origin_item.item_count - this.details?.count!
} else {
throw x.message ? x.message : 'unknown error'
}
})
.catch((e)=>{
this.stage = 1
this.err = e
this.mark("ERROR")
})
})
.catch(e => {
this.stage = 1
this.err = e
this.mark('ERROR')
})
}
parse(i:any):BankItem {
parse(i: any): BankItem {
super.parse(i)
this.originalRequest = i.originalRequest
this.originalResponse = i.originalResponse
@ -232,69 +246,70 @@ export class BankItem extends BasicOrder{
}
}
export interface PrivateMarketRequest {
item_uid:string
qty:string
account:string
currency:string
price:number
private:number
item_uid: string
qty: string
account: string
currency: string
price: number
private: number
}
export interface PrivateMarketResponse extends BasicResponse {}
export class PrivateMarket extends BasicOrder{
order_type = "PrivateMarket";
export class PrivateMarket extends BasicOrder {
order_type = 'PrivateMarket'
originalRequest:PrivateMarketRequest
originalResponse?:PrivateMarketResponse
originalRequest: PrivateMarketRequest
originalResponse?: PrivateMarketResponse
listingId?: string
listingHash?: string
constructor(details:TxnDetails) {
constructor(details: TxnDetails) {
super(details)
this.originalRequest = {
this.originalRequest = {
item_uid: details.item_uid,
qty: details.count.toString(),
account: details.origin_account,
private: 1,
currency: "0",
currency: '0',
price: 1,
}
}
async tick(r:RefStore, api:LTOApi):Promise<void> {
if(this.state !== "PENDING" ){
async tick(r: RefStore, api: LTOApi): Promise<void> {
if (this.state !== 'PENDING') {
return
}
this.mark("WORKING")
return api.BankAction<PrivateMarketRequest, PrivateMarketResponse>("sell-item",this.originalRequest)
.then((x)=>{
debug("PrivateMarket",x)
if(x.status === 'success'){
this.mark('WORKING')
return api
.BankAction<PrivateMarketRequest, PrivateMarketResponse>('sell-item', this.originalRequest)
.then(x => {
debug('PrivateMarket', x)
if (x.status === 'success') {
this.stage = 1
this.originalResponse = x
this.mark('SUCCESS')
this.listingId = x.data.listing_id
this.listingHash = x.data.hash
try {
const origin_item = r.invs.value.get(this.details?.origin_path!)?.items[
this.details?.item_uid!
]!
origin_item.item_count = origin_item.item_count - this.details?.count!
} catch (_e) {}
} else {
throw x.message ? x.message : 'unknown error'
}
})
.catch(e => {
this.stage = 1
this.originalResponse = x
this.mark("SUCCESS")
this.listingId = x.data["listing_id"]
this.listingHash = x.data["hash"]
try{
const origin_item = r.invs.value.get(this.details?.origin_path!)!.items[this.details?.item_uid!]!
origin_item.item_count = origin_item.item_count - this.details?.count!
}catch(e){
}
}else {
throw x.message ? x.message : "unknown error"
}
})
.catch((e)=>{
this.stage = 1
this.err = e
this.mark("ERROR")
})
this.err = e
this.mark('ERROR')
})
}
parse(i:any):PrivateMarket {
parse(i: any): PrivateMarket {
super.parse(i)
this.originalRequest = i.originalRequest
this.originalResponse = i.originalResponse
@ -304,11 +319,10 @@ export class PrivateMarket extends BasicOrder{
}
}
export interface MarketMoveRequest {
listing_id?: string
qty:string
account:string
qty: string
account: string
character: string
}
@ -316,77 +330,77 @@ export interface MarketMoveResponse extends BasicResponse {
item_uid: string
}
export class MarketMove extends PrivateMarket {
order_type = "MarketMove";
order_type = 'MarketMove'
moveRequest:MarketMoveRequest
moveResponse?:MarketMoveResponse
moveRequest: MarketMoveRequest
moveResponse?: MarketMoveResponse
moveStage:number
moveStage: number
moveState: TxnState
newUid: string
constructor(details:TxnDetails) {
constructor(details: TxnDetails) {
super(details)
this.moveStage = 0
this.moveState = "PENDING"
this.newUid = ""
this.moveRequest = {
this.moveState = 'PENDING'
this.newUid = ''
this.moveRequest = {
qty: details.count.toString(),
account: details.target_account,
character: (details.target_path.includes("/")) ? details.target : "0" ,
listing_id: "", // not initially populated
character: details.target_path.includes('/') ? details.target : '0',
listing_id: '', // not initially populated
}
}
async tick(r:RefStore, api:LTOApi):Promise<void> {
async tick(r: RefStore, api: LTOApi): Promise<void> {
try {
await super.tick(r, api)
}catch(e){
} catch (_e) {
return
}
switch(super.status()) {
case "SUCCESS":
break;
case "ERROR":
this.moveState = "ERROR"
switch (super.status()) {
case 'SUCCESS':
break
case 'ERROR':
this.moveState = 'ERROR'
return
default:
return
}
if(this.moveState !== "PENDING" ){
if (this.moveState !== 'PENDING') {
return
}
this.moveRequest.listing_id = `${this.listingId}-${this.listingHash}`
this.moveState = "WORKING"
return api.BankAction<MarketMoveRequest, MarketMoveResponse>("buy-from-order",this.moveRequest)
.then((x)=>{
debug("MarketMove",x)
this.moveResponse = x
if(x.status === 'success'){
this.moveStage = 1
this.moveState = "SUCCESS"
this.newUid = x.item_uid
}else {
throw x ? x : "unknown error"
this.moveState = 'WORKING'
return api
.BankAction<MarketMoveRequest, MarketMoveResponse>('buy-from-order', this.moveRequest)
.then(x => {
debug('MarketMove', x)
this.moveResponse = x
if (x.status === 'success') {
this.moveStage = 1
this.moveState = 'SUCCESS'
this.newUid = x.item_uid
} else {
throw x ? x : 'unknown error'
}
})
.catch((e)=>{
this.moveStage = 1
this.err = e
this.moveState = "ERROR"
})
})
.catch(e => {
this.moveStage = 1
this.err = e
this.moveState = 'ERROR'
})
}
progress():[number,number]{
progress(): [number, number] {
return [this.stage + this.moveStage, 2]
}
status():string {
status(): string {
return this.moveState
}
parse(i:any):MarketMove {
parse(i: any): MarketMove {
super.parse(i)
this.moveRequest = i.moveRequest
this.moveResponse = i.moveResponse
@ -397,71 +411,72 @@ export class MarketMove extends PrivateMarket {
}
export class MarketMoveToChar extends MarketMove {
order_type = "MarketMoveToChar";
order_type = 'MarketMoveToChar'
charRequest:InternalXferRequest
charResponse?:InternalXferResponse
charRequest: InternalXferRequest
charResponse?: InternalXferResponse
charStage:number
charStage: number
charState: TxnState
constructor(details:TxnDetails) {
constructor(details: TxnDetails) {
super(details)
this.charStage = 0
this.charState = "PENDING"
this.charRequest = {
item_uid: "",
this.charState = 'PENDING'
this.charRequest = {
item_uid: '',
qty: details.count.toString(),
new_char: details.target,
account: details.target_account,
}
}
async tick(r:RefStore, api:LTOApi):Promise<void> {
async tick(r: RefStore, api: LTOApi): Promise<void> {
try {
await super.tick(r, api)
}catch(e){
} catch (_e) {
return
}
switch(super.status()) {
case "SUCCESS":
break;
case "ERROR":
this.charState = "ERROR"
switch (super.status()) {
case 'SUCCESS':
break
case 'ERROR':
this.charState = 'ERROR'
return
default:
return
}
if(this.charState !== "PENDING" ){
if (this.charState !== 'PENDING') {
return
}
this.charState = "WORKING"
this.charState = 'WORKING'
this.charRequest.item_uid = this.newUid
return api.BankAction<InternalXferRequest, InternalXferResponse>("internal-xfer-item",this.charRequest)
.then((x)=>{
debug("MarketMoveToChar",x)
this.charResponse = x
if(x.status === 'success'){
this.charStage = 1
this.charState = "SUCCESS"
}else {
throw x ? x : "unknown error"
return api
.BankAction<InternalXferRequest, InternalXferResponse>('internal-xfer-item', this.charRequest)
.then(x => {
debug('MarketMoveToChar', x)
this.charResponse = x
if (x.status === 'success') {
this.charStage = 1
this.charState = 'SUCCESS'
} else {
throw x ? x : 'unknown error'
}
})
.catch((e)=>{
this.charStage = 1
this.err = e
this.charState = "ERROR"
})
})
.catch(e => {
this.charStage = 1
this.err = e
this.charState = 'ERROR'
})
}
progress():[number,number]{
return [this.stage +this.moveStage+ this.charStage, 3]
progress(): [number, number] {
return [this.stage + this.moveStage + this.charStage, 3]
}
status():string {
status(): string {
return this.charState
}
parse(i:any):MarketMoveToChar {
parse(i: any): MarketMoveToChar {
super.parse(i)
this.charRequest = i.charRequest
this.charResponse = i.charResponse

123
src/lib/lifeto/order_manager.ts
View File

@ -1,73 +1,78 @@
import { RefStore } from "../../state/state";
import { Serializable } from "../storage";
import { TricksterCharacter } from "../trickster";
import { LTOApi } from "./api";
import { pathIsBank, splitPath } from "./lifeto";
import { BankItem, InternalXfer, InvalidOrder, MarketMove, Order,MarketMoveToChar, TxnDetails } from "./order";
import { RefStore } from '../../state/state'
import { Serializable } from '../storage'
import { TricksterCharacter } from '../trickster'
import { LTOApi } from './api'
import { pathIsBank, splitPath } from './lifeto'
import {
BankItem,
InternalXfer,
InvalidOrder,
MarketMove,
MarketMoveToChar,
Order,
TxnDetails,
} from './order'
export interface OrderDetails {
item_uid: string | "galders"
count:number
origin_path:string
target_path:string
item_uid: string | 'galders'
count: number
origin_path: string
target_path: string
}
const notSupported = new InvalidOrder("not supported yet")
const notFound = new InvalidOrder("character not found")
const notSupported = new InvalidOrder('not supported yet')
const notFound = new InvalidOrder('character not found')
export class OrderTracker implements Serializable<OrderTracker> {
orders: {[key:string]:Order} = {}
orders: { [key: string]: Order } = {}
async tick(r:RefStore, api:LTOApi):Promise<any> {
async tick(r: RefStore, api: LTOApi): Promise<any> {
let hasDirty = false
console.log("ticking")
for(const [id, order] of Object.entries(this.orders)) {
if(order.status() == "SUCCESS" || order.status() == "ERROR") {
console.log("finished order", order)
for (const [id, order] of Object.entries(this.orders)) {
if (order.status() === 'SUCCESS' || order.status() === 'ERROR') {
hasDirty = true
delete this.orders[id]
}
order.tick(r,api)
order.tick(r, api)
}
if(hasDirty){
if (hasDirty) {
r.dirty.value++
}
return
}
parse(s: any): OrderTracker {
if(s == undefined) {
if (s === undefined) {
return new OrderTracker()
}
if(s.orders == undefined) {
if (s.orders === undefined) {
return new OrderTracker()
}
this.orders = {}
const raw: Order[] = Object.values(s.orders)
for(const o of raw) {
let newOrder:Order | undefined = undefined
console.log("loading", o)
if(o.details){
if(o.status() == "SUCCESS" || o.status() == "ERROR") {
for (const o of raw) {
let newOrder: Order | undefined
if (o.details) {
if (o.status() === 'SUCCESS' || o.status() === 'ERROR') {
continue
}
switch(o.order_type) {
case "InternalXfer":
switch (o.order_type) {
case 'InternalXfer':
newOrder = new InternalXfer(o.details).parse(o)
break;
case "BankItem":
break
case 'BankItem':
newOrder = new BankItem(o.details).parse(o)
break;
case "MarketMove":
break
case 'MarketMove':
newOrder = new MarketMove(o.details).parse(o)
case "MarketMoveToChar":
case 'MarketMoveToChar':
newOrder = new MarketMoveToChar(o.details).parse(o)
break;
case "InvalidOrder":
newOrder = new InvalidOrder("").parse(o)
break;
break
case 'InvalidOrder':
newOrder = new InvalidOrder('').parse(o)
break
}
if(newOrder) {
if (newOrder) {
this.orders[newOrder.action_id] = newOrder
}
}
@ -79,79 +84,78 @@ export class OrderTracker implements Serializable<OrderTracker> {
export class OrderSender {
constructor(
private orders: OrderTracker,
private chars: Map<string,TricksterCharacter>,
) {
}
private chars: Map<string, TricksterCharacter>,
) {}
send(o:OrderDetails):Order {
send(o: OrderDetails): Order {
const formed = this.form(o)
this.orders.orders[formed.action_id] = formed
return formed
}
form(o:OrderDetails):Order {
form(o: OrderDetails): Order {
// bank to bank
if(pathIsBank(o.origin_path) && pathIsBank(o.target_path)) {
if (pathIsBank(o.origin_path) && pathIsBank(o.target_path)) {
return this.bank_to_bank(o)
}
// bank to user
if(pathIsBank(o.origin_path) && !pathIsBank(o.target_path)) {
if (pathIsBank(o.origin_path) && !pathIsBank(o.target_path)) {
return this.bank_to_user(o)
}
// user to bank
if(!pathIsBank(o.origin_path) && pathIsBank(o.target_path)) {
if (!pathIsBank(o.origin_path) && pathIsBank(o.target_path)) {
return this.user_to_bank(o)
}
// user to user
if(!pathIsBank(o.origin_path) && !pathIsBank(o.target_path)) {
if (!pathIsBank(o.origin_path) && !pathIsBank(o.target_path)) {
return this.user_to_user(o)
}
return notSupported
}
bank_to_bank(o:OrderDetails): Order{
bank_to_bank(o: OrderDetails): Order {
const origin = this.chars.get(o.origin_path)
const target = this.chars.get(o.target_path)
if(!(origin && target)) {
if (!(origin && target)) {
return notFound
}
return new MarketMove(this.transformInternalOrder(o))
}
bank_to_user(o:OrderDetails): Order{
bank_to_user(o: OrderDetails): Order {
// get the uid of the bank
const origin = this.chars.get(o.origin_path)
const target = this.chars.get(o.target_path)
if(!(origin && target)) {
if (!(origin && target)) {
return notFound
}
const [account, name] = splitPath(target.path)
const [_account, _name] = splitPath(target.path)
/*if(account != origin.path) {
return new MarketMoveToChar(this.transformInternalOrder(o))
}*/
return new InternalXfer(this.transformInternalOrder(o))
}
user_to_bank(o:OrderDetails): Order{
user_to_bank(o: OrderDetails): Order {
const origin = this.chars.get(o.origin_path)
const target = this.chars.get(o.target_path)
if(!(origin && target)) {
if (!(origin && target)) {
return notFound
}
const [account, name] = splitPath(origin.path)
const [_account, _name] = splitPath(origin.path)
/*if(account != target.path) {
return new MarketMove(this.transformInternalOrder(o))
}*/
return new BankItem(this.transformInternalOrder(o))
}
user_to_user(o:OrderDetails): Order{
user_to_user(o: OrderDetails): Order {
const origin = this.chars.get(o.origin_path)
const target = this.chars.get(o.target_path)
if(!(origin && target)) {
if (!(origin && target)) {
return notFound
}
// return new MarketMoveToChar(this.transformInternalOrder(o))
return new InternalXfer(this.transformInternalOrder(o))
}
private transformInternalOrder(o:OrderDetails):TxnDetails {
private transformInternalOrder(o: OrderDetails): TxnDetails {
const origin = this.chars.get(o.origin_path)!
const target = this.chars.get(o.target_path)!
return {
@ -166,4 +170,3 @@ export class OrderSender {
}
}
}

47
src/lib/lifeto/stateful.ts
View File

@ -1,49 +1,52 @@
import { RefStore } from "../../state/state";
import { bank_endpoint, Session } from "../session";
import { TricksterAccount, TricksterInventory } from "../trickster";
import { BankEndpoint, LTOApi } from "./api";
import { RefStore } from '../../state/state'
import { Session } from '../session'
import { TricksterAccount, TricksterInventory } from '../trickster'
import { BankEndpoint, LTOApi } from './api'
export interface SessionBinding {
new(s:Session):LTOApi
new (s: Session): LTOApi
}
export const getLTOState = <A extends LTOApi>(c: new (s:Session) => A,s:Session, r:RefStore): LTOApi => {
return new StatefulLTOApi(new c(s),r);
export const getLTOState = <A extends LTOApi>(
c: new (s: Session) => A,
s: Session,
r: RefStore,
): LTOApi => {
return new StatefulLTOApi(new c(s), r)
}
export class StatefulLTOApi implements LTOApi {
u: LTOApi
r: RefStore
constructor(s:LTOApi, r:RefStore){
constructor(s: LTOApi, r: RefStore) {
this.u = s
this.r=r
this.r = r
}
BankAction = <T,D>(e: BankEndpoint, t: T):Promise<D> => {
return this.u.BankAction(e,t)
BankAction = <T, D>(e: BankEndpoint, t: T): Promise<D> => {
return this.u.BankAction(e, t)
}
GetInventory = async (path:string):Promise<TricksterInventory>=>{
GetInventory = async (path: string): Promise<TricksterInventory> => {
const inv = await this.u.GetInventory(path)
if(this.r.invs.value.get(inv.path)){
if (this.r.invs.value.get(inv.path)) {
this.r.invs.value.get(inv.path)!.items = inv.items
}else{
this.r.invs.value.set(inv.path,inv)
} else {
this.r.invs.value.set(inv.path, inv)
}
if(inv.galders) {
if (inv.galders) {
this.r.invs.value.get(inv.path)!.galders = inv.galders
}
this.r.dirty.value = this.r.dirty.value + 1
return inv
}
GetAccounts = async ():Promise<TricksterAccount[]> => {
GetAccounts = async (): Promise<TricksterAccount[]> => {
const xs = await this.u.GetAccounts()
xs.forEach((x)=>{
x.characters.forEach((ch)=>{
this.r.chars.value.set(ch.path,ch)
xs.forEach(x => {
x.characters.forEach(ch => {
this.r.chars.value.set(ch.path, ch)
})
})
return xs
}
GetLoggedin= async ():Promise<boolean>=>{
GetLoggedin = async (): Promise<boolean> => {
return this.u.GetLoggedin()
}
}

599
src/lib/old.ts
View File

@ -1,37 +1,36 @@
import Handsontable from "handsontable"
import numbro from 'numbro';
import { textRenderer } from "handsontable/renderers"
import { TricksterInventory, TricksterItem } from "./trickster"
import Core from "handsontable/core";
import { RefStore } from "../state/state";
import Handsontable from 'handsontable'
import Core from 'handsontable/core'
import { textRenderer } from 'handsontable/renderers'
import numbro from 'numbro'
import { TricksterItem } from './trickster'
export const BasicColumns = ['Image', 'Name', 'Count'] as const
export const BasicColumns = [
"Image","Name","Count",
] as const
export const DetailsColumns = ['Desc', 'Use'] as const
export const DetailsColumns = [
"Desc","Use",
] as const
export const MoveColumns = ['MoveCount', 'Move'] as const
export const MoveColumns = [
"MoveCount","Move",
] as const
export const TagColumns = ['All', 'Equip', 'Drill', 'Card', 'Quest', 'Consume', 'Compound'] as const
export const TagColumns = [
"All","Equip","Drill","Card","Quest","Consume", "Compound"
] as const
export const EquipmentColumns = [
"MinLvl","Slots","RefineNumber","RefineState",
] as const
export const EquipmentColumns = ['MinLvl', 'Slots', 'RefineNumber', 'RefineState'] as const
export const StatsColumns = [
"AP","GunAP","AC","DX","MP","MA","MD","WT","DA","LK","HP","DP","HV",
'AP',
'GunAP',
'AC',
'DX',
'MP',
'MA',
'MD',
'WT',
'DA',
'LK',
'HP',
'DP',
'HV',
] as const
export const HackColumns = [
] as const
export const HackColumns = [] as const
export const ColumnNames = [
...BasicColumns,
@ -43,478 +42,520 @@ export const ColumnNames = [
...HackColumns,
] as const
export type ColumnName = typeof ColumnNames[number]
export type ColumnName = (typeof ColumnNames)[number]
const c = (a:ColumnName | ColumnInfo):ColumnName => {
switch(typeof a) {
case "string":
const c = (a: ColumnName | ColumnInfo): ColumnName => {
switch (typeof a) {
case 'string':
return a
case "object":
case 'object':
return a.name
}
}
export const LazyColumn = c;
export const LazyColumn = c
export const ColumnSorter = (a:ColumnName | ColumnInfo, b: ColumnName | ColumnInfo):number => {
let n1 = ColumnNames.indexOf(c(a))
let n2 = ColumnNames.indexOf(c(b))
if(n1 == n2) {
export const ColumnSorter = (a: ColumnName | ColumnInfo, b: ColumnName | ColumnInfo): number => {
const n1 = ColumnNames.indexOf(c(a))
const n2 = ColumnNames.indexOf(c(b))
if (n1 === n2) {
return 0
}
return n1 > n2 ? 1 : -1
}
export interface ColumnInfo {
export interface ColumnInfo {
name: ColumnName
displayName:string
displayName: string
options?:(s:string[])=>string[]
renderer?:any
filtering?:boolean
writable?:boolean
getter(item:TricksterItem):(string | number)
options?: (s: string[]) => string[]
renderer?: any
filtering?: boolean
writable?: boolean
getter(item: TricksterItem): string | number
}
class Image implements ColumnInfo {
name:ColumnName = 'Image'
displayName = " "
name: ColumnName = 'Image'
displayName = ' '
renderer = coverRenderer
getter(item:TricksterItem):(string|number) {
return item.item_image ? item.item_image : ""
getter(item: TricksterItem): string | number {
return item.item_image ? item.item_image : ''
}
}
function coverRenderer(instance:any, td:any, row:any, col:any, prop:any, value:any, cellProperties:any) {
const stringifiedValue = Handsontable.helper.stringify(value);
function coverRenderer(
_instance: any,
td: any,
_row: any,
_col: any,
_prop: any,
value: any,
_cellProperties: any,
) {
const stringifiedValue = Handsontable.helper.stringify(value)
if (stringifiedValue.startsWith('http')) {
const img:any = document.createElement('IMG');
img.src = value;
Handsontable.dom.addEvent(img, 'mousedown', event =>{
event!.preventDefault();
});
Handsontable.dom.empty(td);
td.appendChild(img);
const img: any = document.createElement('IMG')
img.src = value
Handsontable.dom.addEvent(img, 'mousedown', event => {
event?.preventDefault()
})
Handsontable.dom.empty(td)
td.appendChild(img)
} else {
}
}
class Name implements ColumnInfo {
name:ColumnName = "Name"
displayName = "Name"
name: ColumnName = 'Name'
displayName = 'Name'
filtering = true
renderer = nameRenderer
getter(item:TricksterItem):(string|number){
getter(item: TricksterItem): string | number {
return item.item_name
}
}
function nameRenderer(instance:any, td:any, row:any, col:any, prop:any, value:any, cellProperties:any) {
const stringifiedValue = Handsontable.helper.stringify(value);
let showText = stringifiedValue;
const div= document.createElement('div');
function nameRenderer(
_instance: any,
td: any,
_row: any,
_col: any,
_prop: any,
value: any,
_cellProperties: any,
) {
const stringifiedValue = Handsontable.helper.stringify(value)
const showText = stringifiedValue
const div = document.createElement('div')
div.innerHTML = showText
div.title = showText
div.style.maxWidth = "20ch"
div.style.textOverflow = "ellipsis"
div.style.overflow= "hidden"
div.style.whiteSpace= "nowrap"
Handsontable.dom.addEvent(div, 'mousedown', event =>{
event!.preventDefault();
});
Handsontable.dom.empty(td);
td.appendChild(div);
td.classList.add("htLeft")
div.style.maxWidth = '20ch'
div.style.textOverflow = 'ellipsis'
div.style.overflow = 'hidden'
div.style.whiteSpace = 'nowrap'
Handsontable.dom.addEvent(div, 'mousedown', event => {
event?.preventDefault()
})
Handsontable.dom.empty(td)
td.appendChild(div)
td.classList.add('htLeft')
}
class Count implements ColumnInfo {
name:ColumnName = "Count"
displayName = "Count"
renderer = "numeric"
name: ColumnName = 'Count'
displayName = 'Count'
renderer = 'numeric'
filtering = true
getter(item:TricksterItem):(string|number){
getter(item: TricksterItem): string | number {
return item.item_count
}
}
class Move implements ColumnInfo {
name:ColumnName = "Move"
displayName = "Target"
name: ColumnName = 'Move'
displayName = 'Target'
writable = true
options = getMoveTargets
getter(item:TricksterItem):(string|number){
return "---------------------------------------------"
getter(_item: TricksterItem): string | number {
return '---------------------------------------------'
}
}
const getMoveTargets = (invs: string[]):string[] => {
let out:string[] = [];
for(const k of invs){
const getMoveTargets = (invs: string[]): string[] => {
const out: string[] = []
for (const k of invs) {
out.push(k)
}
out.push("")
out.push("")
out.push("!TRASH")
out.push('')
out.push('')
out.push('!TRASH')
return out
}
class MoveCount implements ColumnInfo {
name:ColumnName = "MoveCount"
displayName = "Move #"
name: ColumnName = 'MoveCount'
displayName = 'Move #'
renderer = moveCountRenderer
writable = true
getter(item:TricksterItem):(string|number){
return ""
getter(_item: TricksterItem): string | number {
return ''
}
}
function moveCountRenderer(instance:Core, td:any, row:number, col:number, prop:any, value:any, cellProperties:any) {
let newValue = value;
function moveCountRenderer(
instance: Core,
td: any,
row: number,
col: number,
prop: any,
value: any,
cellProperties: any,
) {
let newValue = value
if (Handsontable.helper.isNumeric(newValue)) {
const numericFormat = cellProperties.numericFormat;
const cellCulture = numericFormat && numericFormat.culture || '-';
const cellFormatPattern = numericFormat && numericFormat.pattern;
const className = cellProperties.className || '';
const classArr = className.length ? className.split(' ') : [];
const numericFormat = cellProperties.numericFormat
const cellCulture = numericFormat?.culture || '-'
const cellFormatPattern = numericFormat?.pattern
const className = cellProperties.className || ''
const classArr = className.length ? className.split(' ') : []
if (typeof cellCulture !== 'undefined' && !numbro.languages()[cellCulture]) {
const shortTag:any = cellCulture.replace('-', '');
const langData = (numbro as any)[shortTag];
const shortTag: any = cellCulture.replace('-', '')
const langData = (numbro as any)[shortTag]
if (langData) {
numbro.registerLanguage(langData);
numbro.registerLanguage(langData)
}
}
const totalCount = Number(instance.getCell(row,col-1)?.innerHTML)
numbro.setLanguage(cellCulture);
const totalCount = Number(instance.getCell(row, col - 1)?.innerHTML)
numbro.setLanguage(cellCulture)
const num = numbro(newValue)
if(totalCount < num.value()) {
if (totalCount < num.value()) {
const newNum = numbro(totalCount)
newValue = newNum.format(cellFormatPattern || '0');
}else {
newValue = num.format(cellFormatPattern || '0');
newValue = newNum.format(cellFormatPattern || '0')
} else {
newValue = num.format(cellFormatPattern || '0')
}
if (classArr.indexOf('htLeft') < 0 && classArr.indexOf('htCenter') < 0 &&
classArr.indexOf('htRight') < 0 && classArr.indexOf('htJustify') < 0) {
classArr.push('htRight');
if (
classArr.indexOf('htLeft') < 0 &&
classArr.indexOf('htCenter') < 0 &&
classArr.indexOf('htRight') < 0 &&
classArr.indexOf('htJustify') < 0
) {
classArr.push('htRight')
}
if (classArr.indexOf('htNumeric') < 0) {
classArr.push('htNumeric');
classArr.push('htNumeric')
}
cellProperties.className = classArr.join(' ');
cellProperties.className = classArr.join(' ')
td.dir = 'ltr';
newValue = newValue + "x"
}else {
newValue = ""
td.dir = 'ltr'
newValue = `${newValue}x`
} else {
newValue = ''
}
textRenderer(instance, td, row, col, prop, newValue, cellProperties);
textRenderer(instance, td, row, col, prop, newValue, cellProperties)
}
class Equip implements ColumnInfo {
name:ColumnName = "Equip"
displayName = "equip"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Equip'
displayName = 'equip'
getter(item: TricksterItem): string | number {
return item.is_equip ? 1 : 0
}
}
class Drill implements ColumnInfo {
name:ColumnName = "Drill"
displayName = "drill"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Drill'
displayName = 'drill'
getter(item: TricksterItem): string | number {
return item.is_drill ? 1 : 0
}
}
class All implements ColumnInfo {
name:ColumnName = "All"
displayName = "swap"
getter(_:TricksterItem):(string|number){
name: ColumnName = 'All'
displayName = 'swap'
getter(_: TricksterItem): string | number {
return -10000
}
}
class Card implements ColumnInfo {
name:ColumnName = "Card"
displayName = "card"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Card'
displayName = 'card'
getter(item: TricksterItem): string | number {
return cardFilter(item) ? 1 : 0
}
}
const cardFilter= (item:TricksterItem): boolean => {
return (item.item_name.endsWith(" Card") || item.item_name.startsWith("Star Card"))
const cardFilter = (item: TricksterItem): boolean => {
return item.item_name.endsWith(' Card') || item.item_name.startsWith('Star Card')
}
class Compound implements ColumnInfo {
name:ColumnName = "Compound"
displayName = "comp"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Compound'
displayName = 'comp'
getter(item: TricksterItem): string | number {
return compFilter(item) ? 1 : 0
}
}
const compFilter= (item:TricksterItem): boolean => {
return (item.item_comment.toLowerCase().includes("compound item"))
const compFilter = (item: TricksterItem): boolean => {
return item.item_comment.toLowerCase().includes('compound item')
}
class Quest implements ColumnInfo {
name:ColumnName = "Quest"
displayName = "quest"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Quest'
displayName = 'quest'
getter(item: TricksterItem): string | number {
return questFilter(item) ? 1 : 0
}
}
const questFilter= (item:TricksterItem): boolean => {
const questFilter = (_item: TricksterItem): boolean => {
return false
}
class Consume implements ColumnInfo {
name:ColumnName = "Consume"
displayName = "eat"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Consume'
displayName = 'eat'
getter(item: TricksterItem): string | number {
return consumeFilter(item) ? 1 : 0
}
}
const consumeFilter= (item:TricksterItem): boolean => {
const consumeFilter = (item: TricksterItem): boolean => {
const tl = item.item_use.toLowerCase()
return tl.includes("recover") || tl.includes("restores")
return tl.includes('recover') || tl.includes('restores')
}
class AP implements ColumnInfo {
name:ColumnName = "AP"
displayName = "AP"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["AP"] : ""
name: ColumnName = 'AP'
displayName = 'AP'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.AP : ''
}
}
class GunAP implements ColumnInfo {
name:ColumnName = "GunAP"
displayName = "Gun AP"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["Gun AP"] : ""
name: ColumnName = 'GunAP'
displayName = 'Gun AP'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats['Gun AP'] : ''
}
}
class AC implements ColumnInfo {
name:ColumnName = "AC"
displayName = "AC"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["AC"] : ""
name: ColumnName = 'AC'
displayName = 'AC'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.AC : ''
}
}
class DX implements ColumnInfo {
name:ColumnName = "DX"
displayName = "DX"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["DX"] : ""
name: ColumnName = 'DX'
displayName = 'DX'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.DX : ''
}
}
class MP implements ColumnInfo {
name:ColumnName = "MP"
displayName = "MP"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["MP"] : ""
name: ColumnName = 'MP'
displayName = 'MP'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.MP : ''
}
}
class MA implements ColumnInfo {
name:ColumnName = "MA"
displayName = "MA"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["MA"] : ""
name: ColumnName = 'MA'
displayName = 'MA'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.MA : ''
}
}
class MD implements ColumnInfo {
name:ColumnName = "MD"
displayName = "MD"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["MD"] : ""
name: ColumnName = 'MD'
displayName = 'MD'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.MD : ''
}
}
class WT implements ColumnInfo {
name:ColumnName = "WT"
displayName = "WT"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["WT"] : ""
name: ColumnName = 'WT'
displayName = 'WT'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.WT : ''
}
}
class DA implements ColumnInfo {
name:ColumnName = "DA"
displayName = "DA"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["DA"] : ""
name: ColumnName = 'DA'
displayName = 'DA'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.DA : ''
}
}
class LK implements ColumnInfo {
name:ColumnName = "LK"
displayName = "LK"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["LK"] : ""
name: ColumnName = 'LK'
displayName = 'LK'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.LK : ''
}
}
class HP implements ColumnInfo {
name:ColumnName = "HP"
displayName = "HP"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["HP"] : ""
name: ColumnName = 'HP'
displayName = 'HP'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.HP : ''
}
}
class DP implements ColumnInfo {
name:ColumnName = "DP"
displayName = "DP"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["DP"] : ""
name: ColumnName = 'DP'
displayName = 'DP'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.DP : ''
}
}
class HV implements ColumnInfo {
name:ColumnName = "HV"
displayName = "HV"
getter(item:TricksterItem):(string|number){
return item.stats ? item.stats["HV"] : ""
name: ColumnName = 'HV'
displayName = 'HV'
getter(item: TricksterItem): string | number {
return item.stats ? item.stats.HV : ''
}
}
class MinLvl implements ColumnInfo {
name:ColumnName = "MinLvl"
displayName = "lvl"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'MinLvl'
displayName = 'lvl'
getter(item: TricksterItem): string | number {
//TODO:
return item.item_min_level? item.item_min_level:""
return item.item_min_level ? item.item_min_level : ''
}
}
class Slots implements ColumnInfo {
name:ColumnName = "Slots"
displayName = "slots"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Slots'
displayName = 'slots'
getter(item: TricksterItem): string | number {
//TODO:
return item.item_slots ? item.item_slots : ""
return item.item_slots ? item.item_slots : ''
}
}
class RefineNumber implements ColumnInfo {
name:ColumnName = "RefineNumber"
displayName = "refine"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'RefineNumber'
displayName = 'refine'
getter(item: TricksterItem): string | number {
return item.refine_level ? item.refine_level : 0
}
}
class RefineState implements ColumnInfo {
name:ColumnName = "RefineState"
displayName = "bork"
getter(item:TricksterItem):(string|number){
name: ColumnName = 'RefineState'
displayName = 'bork'
getter(item: TricksterItem): string | number {
return item.refine_state ? item.refine_state : 0
}
}
class Desc implements ColumnInfo {
name:ColumnName = "Desc"
displayName = "desc"
name: ColumnName = 'Desc'
displayName = 'desc'
renderer = descRenderer
getter(item:TricksterItem):(string|number){
getter(item: TricksterItem): string | number {
return item.item_comment
}
}
function descRenderer(instance:any, td:any, row:any, col:any, prop:any, value:any, cellProperties:any) {
const stringifiedValue = Handsontable.helper.stringify(value);
let showText = stringifiedValue;
const div= document.createElement('div');
function descRenderer(
_instance: any,
td: any,
_row: any,
_col: any,
_prop: any,
value: any,
_cellProperties: any,
) {
const stringifiedValue = Handsontable.helper.stringify(value)
const showText = stringifiedValue
const div = document.createElement('div')
div.innerHTML = showText
div.title = showText
div.style.maxWidth = "30ch"
div.style.textOverflow = "ellipsis"
div.style.overflow= "hidden"
div.style.whiteSpace= "nowrap"
Handsontable.dom.addEvent(div, 'mousedown', event =>{
event!.preventDefault();
});
Handsontable.dom.empty(td);
td.appendChild(div);
td.classList.add("htLeft")
div.style.maxWidth = '30ch'
div.style.textOverflow = 'ellipsis'
div.style.overflow = 'hidden'
div.style.whiteSpace = 'nowrap'
Handsontable.dom.addEvent(div, 'mousedown', event => {
event?.preventDefault()
})
Handsontable.dom.empty(td)
td.appendChild(div)
td.classList.add('htLeft')
}
class Use implements ColumnInfo {
name:ColumnName = "Use"
displayName = "use"
renderer= useRenderer;
getter(item:TricksterItem):(string|number){
name: ColumnName = 'Use'
displayName = 'use'
renderer = useRenderer
getter(item: TricksterItem): string | number {
return item.item_use
}
}
function useRenderer(instance:any, td:any, row:any, col:any, prop:any, value:any, cellProperties:any) {
const stringifiedValue = Handsontable.helper.stringify(value);
let showText = stringifiedValue;
const div= document.createElement('div');
function useRenderer(
_instance: any,
td: any,
_row: any,
_col: any,
_prop: any,
value: any,
_cellProperties: any,
) {
const stringifiedValue = Handsontable.helper.stringify(value)
const showText = stringifiedValue
const div = document.createElement('div')
div.title = showText
div.innerHTML = showText
div.style.maxWidth = "30ch"
div.style.textOverflow = "ellipsis"
div.style.overflow= "hidden"
div.style.whiteSpace= "nowrap"
Handsontable.dom.addEvent(div, 'mousedown', event =>{
event!.preventDefault();
});
Handsontable.dom.empty(td);
td.appendChild(div);
td.classList.add("htLeft")
div.style.maxWidth = '30ch'
div.style.textOverflow = 'ellipsis'
div.style.overflow = 'hidden'
div.style.whiteSpace = 'nowrap'
Handsontable.dom.addEvent(div, 'mousedown', event => {
event?.preventDefault()
})
Handsontable.dom.empty(td)
td.appendChild(div)
td.classList.add('htLeft')
}
export const ColumnByNames = (...n:ColumnName[]) => {
export const ColumnByNames = (...n: ColumnName[]) => {
return n.map(ColumnByName)
}
export const ColumnByName = (n:ColumnName) => {
export const ColumnByName = (n: ColumnName) => {
return Columns[n]
}
export const test = <T extends ColumnInfo>(n:(new ()=>T)):[string,T] => {
let nn = new n()
export const test = <T extends ColumnInfo>(n: new () => T): [string, T] => {
const nn = new n()
return [nn.name, nn]
}
export const Columns:{[Property in ColumnName]:ColumnInfo}= {
export const Columns: { [Property in ColumnName]: ColumnInfo } = {
Use: new Use(),
Desc: new Desc(),
Image: new Image(),
Name: new Name(),
Count: new Count(),
Move: new Move(),
MoveCount: new MoveCount(),
Equip: new Equip(),
Drill: new Drill(),
Card: new Card(),
Quest: new Quest(),
Consume: new Consume(),
AP: new AP(),
GunAP: new GunAP(),
AC: new AC(),
DX: new DX(),
MP: new MP(),
MA: new MA(),
MD: new MD(),
WT: new WT(),
DA: new DA(),
LK: new LK(),
HP: new HP(),
DP: new DP(),
HV: new HV(),
MinLvl: new MinLvl(),
Slots: new Slots(),
RefineNumber: new RefineNumber(),
RefineState: new RefineState(),
Image: new Image(),
Name: new Name(),
Count: new Count(),
Move: new Move(),
MoveCount: new MoveCount(),
Equip: new Equip(),
Drill: new Drill(),
Card: new Card(),
Quest: new Quest(),
Consume: new Consume(),
AP: new AP(),
GunAP: new GunAP(),
AC: new AC(),
DX: new DX(),
MP: new MP(),
MA: new MA(),
MD: new MD(),
WT: new WT(),
DA: new DA(),
LK: new LK(),
HP: new HP(),
DP: new DP(),
HV: new HV(),
MinLvl: new MinLvl(),
Slots: new Slots(),
RefineNumber: new RefineNumber(),
RefineState: new RefineState(),
All: new All(),
Compound: new Compound(),
}

7965
src/lib/sample/ayshe.json
View File

File diff suppressed because one or more lines are too long

158
src/lib/session.ts
View File

@ -1,117 +1,121 @@
import axios, { AxiosError, AxiosResponse, Method } from "axios";
import qs from "qs";
import { getCookie, removeCookie } from "typescript-cookie";
import { TricksterAccountInfo } from "./trickster";
import axios, { AxiosError, AxiosResponse, Method } from 'axios'
import qs from 'qs'
import { TricksterAccountInfo } from './trickster'
export const SITE_ROOT = '/lifeto/'
export const SITE_ROOT = "/lifeto/"
export const API_ROOT = 'api/lifeto/'
export const BANK_ROOT = 'v2/item-manager/'
export const MARKET_ROOT = 'marketplace-api/'
export const API_ROOT = "api/lifeto/"
export const BANK_ROOT = "v2/item-manager/"
export const MARKET_ROOT = "marketplace-api/"
const raw_endpoint = (name:string):string =>{
return SITE_ROOT+name
const raw_endpoint = (name: string): string => {
return SITE_ROOT + name
}
const login_endpoint = (name:string)=>{
return SITE_ROOT + name + "?canonical=1"
const login_endpoint = (name: string) => {
return `${SITE_ROOT + name}?canonical=1`
}
export const api_endpoint = (name:string):string =>{
return SITE_ROOT+API_ROOT + name
export const api_endpoint = (name: string): string => {
return SITE_ROOT + API_ROOT + name
}
export const bank_endpoint = (name:string):string =>{
return SITE_ROOT+BANK_ROOT + name
export const bank_endpoint = (name: string): string => {
return SITE_ROOT + BANK_ROOT + name
}
export const market_endpoint = (name:string):string =>{
return SITE_ROOT+MARKET_ROOT+ name
export const market_endpoint = (name: string): string => {
return SITE_ROOT + MARKET_ROOT + name
}
export const EndpointCreators = [
api_endpoint,
bank_endpoint,
market_endpoint,
]
export const EndpointCreators = [api_endpoint, bank_endpoint, market_endpoint]
export type EndpointCreator = typeof EndpointCreators[number]
export type EndpointCreator = (typeof EndpointCreators)[number]
export interface Session {
request:(verb:Method,url:string,data:any,c?:EndpointCreator)=>Promise<any>
request: (verb: Method, url: string, data: any, c?: EndpointCreator) => Promise<any>
}
export class LoginHelper {
constructor(){
}
static login = async (user:string, pass: string):Promise<TokenSession> =>{
return axios.get(login_endpoint("login"),{
withCredentials:false,
maxRedirects: 0,
xsrfCookieName: "XSRF-TOKEN",
})
.then(async ()=>{
return axios.post(login_endpoint("login"),{
login:user,
password:pass,
redirectTo:"lifeto"
},{
withCredentials:false,
static login = async (user: string, pass: string): Promise<TokenSession> => {
return axios
.get(login_endpoint('login'), {
withCredentials: false,
maxRedirects: 0,
xsrfCookieName: 'XSRF-TOKEN',
})
.then(async () => {
return axios.post(
login_endpoint('login'),
{
login: user,
password: pass,
redirectTo: 'lifeto',
},
{
withCredentials: false,
maxRedirects: 0,
xsrfCookieName: "XSRF-TOKEN",
})
}).then(async ()=>{
xsrfCookieName: 'XSRF-TOKEN',
},
)
})
.then(async () => {
return new TokenSession()
}).catch((e)=>{
if(e instanceof AxiosError) {
if(e.code == "ERR_BAD_REQUEST") {
throw "invalid username/password"
})
.catch(e => {
if (e instanceof AxiosError) {
if (e.code === 'ERR_BAD_REQUEST') {
throw 'invalid username/password'
}
throw e.message
}
throw e
})
}
static info = async ():Promise<TricksterAccountInfo> =>{
return axios.get(raw_endpoint("settings/info"),{withCredentials:false}).then((ans:AxiosResponse)=>{
return ans.data
})
static info = async (): Promise<TricksterAccountInfo> => {
return axios
.get(raw_endpoint('settings/info'), { withCredentials: false })
.then((ans: AxiosResponse) => {
return ans.data
})
}
static logout = async ():Promise<void> =>{
return axios.get(login_endpoint("logout"),{withCredentials:false}).catch(()=>{}).then(()=>{})
static logout = async (): Promise<void> => {
return axios
.get(login_endpoint('logout'), { withCredentials: false })
.catch(() => {})
.then(() => {})
}
}
export class TokenSession implements Session {
constructor(){
}
request = async (verb:string,url:string,data:any, c:EndpointCreator = api_endpoint):Promise<AxiosResponse> => {
request = async (
verb: string,
url: string,
data: any,
c: EndpointCreator = api_endpoint,
): Promise<AxiosResponse> => {
let promise
switch (verb.toLowerCase()){
case "post":
promise = axios.post(c(url),data,this.genHeaders())
break;
case "postform":
promise = axios.postForm(c(url),data)
break;
case "postraw":
switch (verb.toLowerCase()) {
case 'post':
promise = axios.post(c(url), data, this.genHeaders())
break
case 'postform':
promise = axios.postForm(c(url), data)
break
case 'postraw': {
const querystring = qs.stringify(data)
promise = axios.post(c(url),querystring,this.genHeaders())
break;
case "get":
promise = axios.post(c(url), querystring, this.genHeaders())
break
}
default:
promise = axios.get(c(url),this.genHeaders())
promise = axios.get(c(url), this.genHeaders())
}
return promise
}
genHeaders = ()=>{
genHeaders = () => {
const out = {
headers:{
Accept: "application/json",
"Update-Insecure-Requests": 1,
headers: {
Accept: 'application/json',
'Update-Insecure-Requests': 1,
},
withCredentials:true
withCredentials: true,
}
return out
}

76
src/lib/storage.ts
View File

@ -1,76 +0,0 @@
//class helper {
// Revive<T>(t:string, _type:string):string {
// return t
// }
// Revive<T>(t:string, _type:string[]):string[]{
// return t.split(",")
// }
// Revive<T>(t:string, _type:number):number {
// return Number(t)
// }
// Revive<T>(t:string, _type:number[]):number[]{
// return t.split(",").map(Number)
// }
//}
import { ColumnSet } from "./table"
import { TricksterAccount, TricksterCharacter, TricksterInventory } from "./trickster"
export const ARRAY_SEPERATOR = ","
let as = ARRAY_SEPERATOR
export interface Reviver<T> {
Murder(t:T):string
Revive(s:string):T
}
export const StoreStr= {
Murder: (s:string):string=>s,
Revive: (s:string):string=>s
}
export const StoreNum = {
Murder: (s:number):string=>s.toString(),
Revive: (s:string):number=>Number(s)
}
export const StoreStrSet = {
Murder: (s:Set<string>):string=>Array.from(s).join(as),
Revive: (s:string):Set<string>=>new Set(s.split(as))
}
export const StoreColSet = {
Murder: (s:ColumnSet):string=>Array.from(s.s.values()).join(as),
Revive: (s:string):ColumnSet=>new ColumnSet(s.split(as) as any)
}
export const StoreChars = {
Murder: (s:Map<string,TricksterCharacter>):string=>{
let o = JSON.stringify(Array.from(s.entries()))
return o
},
Revive: (s:string):Map<string,TricksterCharacter>=>new Map(JSON.parse(s)),
}
export const StoreAccounts = {
Murder: (s:Map<string,TricksterAccount>):string=>{
let o = JSON.stringify(Array.from(s.entries()))
return o
},
Revive: (s:string):Map<string,TricksterAccount>=>new Map(JSON.parse(s)),
}
export const StoreJsonable = {
Murder: <T extends object>(s:T):string=>JSON.stringify(Object.entries(s)),
Revive: <T>(s:string):T=>JSON.parse(s),
}
export interface Serializable<T> {
parse(s:any):T
}
export const StoreSerializable = <T extends Serializable<T>>(n:(new ()=>T))=>{
return {
Murder: (s:T):string=>JSON.stringify(s),
Revive: (s:string):T=>new n().parse(JSON.parse(s))
}
}

1
src/lib/superjson.ts
View File

@ -1 +0,0 @@
import SuperJSON from "superjson";

130
src/lib/table.ts
View File

@ -1,8 +1,6 @@
import { TricksterInventory } from "./trickster"
import {ColumnInfo, ColumnName, Columns, ColumnSorter, LazyColumn} from "./columns"
import { HotTableProps } from "@handsontable/react"
import { HotTableProps } from '@handsontable/react'
import { ColumnInfo, ColumnName, ColumnSorter, Columns, LazyColumn } from './columns'
import { TricksterInventory } from './trickster'
export interface InventoryTableOptions {
columns: ColumnSet
@ -12,16 +10,16 @@ export interface InventoryTableOptions {
}
export interface Mappable<T> {
map<U>(callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): U[];
map<U>(callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): U[]
}
export class ColumnSet implements Mappable<ColumnInfo>{
export class ColumnSet implements Mappable<ColumnInfo> {
s: Set<ColumnName> = new Set()
size: number;
size: number
dirty = 0
constructor(i?:Iterable<ColumnInfo | ColumnName>){
if(i){
constructor(i?: Iterable<ColumnInfo | ColumnName>) {
if (i) {
for (const a of i) {
if(Columns[LazyColumn(a)]){
if (Columns[LazyColumn(a)]) {
this.s.add(LazyColumn(a))
}
}
@ -29,33 +27,46 @@ export class ColumnSet implements Mappable<ColumnInfo>{
this.size = 0
this.mark()
}
map<U>(callbackfn: (value: ColumnInfo, index: number, array: ColumnInfo[]) => U, thisArg?: any): U[] {
map<U>(
callbackfn: (value: ColumnInfo, index: number, array: ColumnInfo[]) => U,
thisArg?: any,
): U[] {
return Array.from(this.values()).map(callbackfn, thisArg)
}
[Symbol.iterator](): IterableIterator<ColumnInfo>{
[Symbol.iterator](): IterableIterator<ColumnInfo> {
return this.values()
}
[Symbol.toStringTag] = "ColumnSet";
entries(): IterableIterator<[ColumnInfo, ColumnInfo]>{
return Array.from(this.values()).map((x):[ColumnInfo,ColumnInfo]=>{return [x,x]}).values()
[Symbol.toStringTag] = 'ColumnSet'
entries(): IterableIterator<[ColumnInfo, ColumnInfo]> {
return Array.from(this.values())
.map((x): [ColumnInfo, ColumnInfo] => {
return [x, x]
})
.values()
}
keys(): IterableIterator<ColumnInfo>{
keys(): IterableIterator<ColumnInfo> {
return this.values()
}
forEach(callbackfn: (value: ColumnInfo, value2: ColumnInfo, set: Set<ColumnInfo>) => void, thisArg?: any): void{
Array.from(this.values()).forEach((v)=>{
if(this.has(v)) {
forEach(
callbackfn: (value: ColumnInfo, value2: ColumnInfo, set: Set<ColumnInfo>) => void,
thisArg?: any,
): void {
Array.from(this.values()).forEach(v => {
if (this.has(v)) {
callbackfn(v, v, new Set(this.values()))
}
}, thisArg)
}
values(): IterableIterator<ColumnInfo>{
return Array.from(this.s.values()).sort(ColumnSorter).map((a, b)=>{
return Columns[a]
}).values()
values(): IterableIterator<ColumnInfo> {
return Array.from(this.s.values())
.sort(ColumnSorter)
.map((a, _b) => {
return Columns[a]
})
.values()
}
mark() {
this.dirty= this.dirty+ 1
this.dirty = this.dirty + 1
this.size = this.s.size
}
add(value: ColumnInfo | ColumnName): this {
@ -67,72 +78,70 @@ export class ColumnSet implements Mappable<ColumnInfo>{
this.mark()
this.s.clear()
}
delete(value: ColumnInfo | ColumnName): boolean{
delete(value: ColumnInfo | ColumnName): boolean {
this.mark()
return this.s.delete(LazyColumn(value))
}
has(value: ColumnInfo | ColumnName): boolean{
has(value: ColumnInfo | ColumnName): boolean {
return this.s.has(LazyColumn(value))
}
}
export class InventoryTable {
inv!:TricksterInventory
inv!: TricksterInventory
o!: InventoryTableOptions
constructor(inv:TricksterInventory, o:InventoryTableOptions) {
constructor(inv: TricksterInventory, o: InventoryTableOptions) {
this.setInv(inv)
this.setOptions(o)
}
setOptions(o:InventoryTableOptions) {
setOptions(o: InventoryTableOptions) {
this.o = o
}
setInv(inv:TricksterInventory) {
setInv(inv: TricksterInventory) {
this.inv = inv
}
getTableColumnNames(): string[] {
return this.o.columns.map(x=>x.displayName)
return this.o.columns.map(x => x.displayName)
}
getTableColumnSettings(){
}
getTableRows():any[][] {
getTableColumnSettings() {}
getTableRows(): any[][] {
return Object.values(this.inv.items)
.filter((item):boolean=>{
if(item.item_count <= 0) {
return false
}
let found = true
let hasAll = this.o.tags.has("All")
if(this.o.tags.s.size > 0) {
found = hasAll
for(const tag of this.o.tags.values()) {
if(tag.name =="All") {
continue
}
if(tag.getter(item) === 1) {
.filter((item): boolean => {
if (item.item_count <= 0) {
return false
}
let found = true
const hasAll = this.o.tags.has('All')
if (this.o.tags.s.size > 0) {
found = hasAll
for (const tag of this.o.tags.values()) {
if (tag.name === 'All') {
continue
}
if (tag.getter(item) === 1) {
return !hasAll
}
}
}
}
return found
})
.map((item)=>{
return this.o.columns.map(x=>{
return x.getter(item)
return found
})
.map(item => {
return this.o.columns.map(x => {
return x.getter(item)
})
})
})
}
BuildTable():TableRecipe {
BuildTable(): TableRecipe {
const s = DefaultSettings()
const dat = this.getTableRows()
return {
data: dat,
settings: {
data: dat,
colHeaders:this.getTableColumnNames(),
columns:this.getTableColumnSettings(),
...s
colHeaders: this.getTableColumnNames(),
columns: this.getTableColumnSettings(),
...s,
},
}
}
@ -142,4 +151,3 @@ export interface TableRecipe {
data: any[][]
settings: HotTableProps
}

8
src/lib/table/defs.ts
View File

@ -1,11 +1,11 @@
import { TricksterItem } from "../trickster";
import { TricksterItem } from '../trickster'
export interface ItemSelectionStatus {
selected: boolean;
amount?: number;
selected: boolean
amount?: number
}
export interface ItemWithSelection {
item: TricksterItem
status?: ItemSelectionStatus;
status?: ItemSelectionStatus
}

197
src/lib/table/tanstack.tsx
View File

@ -1,138 +1,145 @@
import { createColumnHelper } from '@tanstack/react-table';
import { ItemWithSelection } from './defs';
import { useAtomValue, useSetAtom } from 'jotai';
import { currentItemSelectionAtom, itemSelectionSetActionAtom } from '@/state/atoms';
import { useMemo } from 'react';
import { StatsColumns } from '../columns';
import { createColumnHelper } from '@tanstack/react-table'
import { useAtomValue, useSetAtom } from 'jotai'
import { useMemo } from 'react'
import { currentItemSelectionAtom, itemSelectionSetActionAtom } from '@/state/atoms'
import { StatsColumns } from '../columns'
import { ItemWithSelection } from './defs'
const ch = createColumnHelper<ItemWithSelection>();
const ch = createColumnHelper<ItemWithSelection>()
const columns = {
icon: ch.display({
id: 'icon',
header: function Component(col) {
header: function Component(_col) {
return <div className="flex flex-row justify-center"></div>
},
cell: function Component({ row }){
const setItemSelection= useSetAtom(itemSelectionSetActionAtom);
const c = useAtomValue(currentItemSelectionAtom);
const selected = useMemo(()=> {
return c[0].has(row.original.item.id);
cell: function Component({ row }) {
const setItemSelection = useSetAtom(itemSelectionSetActionAtom)
const c = useAtomValue(currentItemSelectionAtom)
const selected = useMemo(() => {
return c[0].has(row.original.item.id)
}, [c])
return <div
className={`no-select flex flex-row ${ row.original.status?.selected ? "animate-pulse" : ""}`}
onClick={(e)=>{
setItemSelection({
[row.original.item.id]: selected ? undefined : row.original.item.item_count,
})
}}
>
<div className="flex flex-row w-6 h-6 justify-center">
<img src={row.original.item.item_image || ""} alt="icon" className="select-none object-contain select-none"/>
return (
<div
className={`no-select flex flex-row ${row.original.status?.selected ? 'animate-pulse' : ''}`}
onClick={_e => {
setItemSelection({
[row.original.item.id]: selected ? undefined : row.original.item.item_count,
})
}}
>
<div className="flex flex-row w-6 h-6 justify-center">
<img
src={row.original.item.item_image || ''}
alt="icon"
className="select-none object-contain select-none"
/>
</div>
</div>
</div>
)
},
}),
count: ch.display({
id: 'count',
header: function Component(col){
header: function Component(_col) {
return <div className="flex flex-row justify-center">#</div>
},
cell: function Component({ row }){
const c = useAtomValue(currentItemSelectionAtom);
const setItemSelection= useSetAtom(itemSelectionSetActionAtom);
const currentValue = useMemo(()=> {
const got = c[0].get(row.original.item.id);
if(got !== undefined) {
return got.toString();
cell: function Component({ row }) {
const c = useAtomValue(currentItemSelectionAtom)
const setItemSelection = useSetAtom(itemSelectionSetActionAtom)
const currentValue = useMemo(() => {
const got = c[0].get(row.original.item.id)
if (got !== undefined) {
return got.toString()
}
return ""
return ''
}, [c])
const itemCount = row.original.item.item_count
return <div
className={`flex flex-row select-none ${ row.original.status?.selected ? "bg-gray-200" : ""}`}
>
<input
className="w-10 text-center "
value={currentValue}
onChange={(e)=>{
if(e.target.value === ""){
setItemSelection({[row.original.item.id]: undefined});
return
}
if(e.target.value === "-"){
return (
<div
className={`flex flex-row select-none ${row.original.status?.selected ? 'bg-gray-200' : ''}`}
>
<input
className="w-10 text-center "
value={currentValue}
onChange={e => {
if (e.target.value === '') {
setItemSelection({ [row.original.item.id]: undefined })
return
}
if (e.target.value === '-') {
setItemSelection({
[row.original.item.id]: itemCount,
})
}
let parsedInt = parseInt(e.target.value)
if (Number.isNaN(parsedInt)) {
return
}
if (parsedInt > itemCount) {
parsedInt = itemCount
}
setItemSelection({
[row.original.item.id]: itemCount,
[row.original.item.id]: parsedInt,
})
}
let parsedInt = parseInt(e.target.value);
if (isNaN(parsedInt)) {
return;
}
if(parsedInt > itemCount){
parsedInt = itemCount;
}
setItemSelection({
[row.original.item.id]: parsedInt,
})
}}
placeholder={itemCount.toString()} />
</div>
}}
placeholder={itemCount.toString()}
/>
</div>
)
},
}),
name: ch.display({
id: 'name',
header: (col)=> {
return <div
className="flex flex-row text-sm"
>name</div>
header: _col => {
return <div className="flex flex-row text-sm">name</div>
},
cell: function Component({ row }){
return <div className="flex flex-row whitespace-pre">
<span>{row.original.item.item_name}</span>
</div>
cell: function Component({ row }) {
return (
<div className="flex flex-row whitespace-pre">
<span>{row.original.item.item_name}</span>
</div>
)
},
}),
slots: ch.display({
id: 'slots',
header: (col)=>{
return <div
className="flex flex-row text-sm"
>slots</div>
header: _col => {
return <div className="flex flex-row text-sm">slots</div>
},
cell: function Component({ row }){
return <div className="flex flex-row justify-center">
<span>{row.original.item.item_slots}</span>
</div>
cell: function Component({ row }) {
return (
<div className="flex flex-row justify-center">
<span>{row.original.item.item_slots}</span>
</div>
)
},
}),
stats: ch.group({
id: 'stats',
header: (col)=>{
return <div
className="flex flex-row text-sm"
>stats</div>
header: _col => {
return <div className="flex flex-row text-sm">stats</div>
},
columns: [
...StatsColumns.map((c)=>{
...StatsColumns.map(c => {
return ch.display({
id: 'stats.'+c,
header: (col)=>{
return <div
className="flex flex-row text-sm justify-center"
>{c}</div>
id: `stats.${c}`,
header: _col => {
return <div className="flex flex-row text-sm justify-center">{c}</div>
},
cell: function Component({ row }){
cell: function Component({ row }) {
const stats = row.original.item.stats
const stat = stats ? stats[c] : ""
return <div className={`flex flex-row justify-start ${stat ? "border" : ""}`}>
<span>{stat}</span>
</div>
const stat = stats ? stats[c] : ''
return (
<div className={`flex flex-row justify-start ${stat ? 'border' : ''}`}>
<span>{stat}</span>
</div>
)
},
})
})
]
}),
],
}),
} as const;
} as const
export const InventoryColumns = columns;
export const InventoryColumns = columns

117
src/lib/trickster.ts
View File

@ -1,22 +1,22 @@
export interface TricksterItem {
id: string;
unique_id: number;
item_name: string;
item_count: number;
item_comment: string;
item_use: string;
item_slots?: number;
id: string
unique_id: number
item_name: string
item_count: number
item_comment: string
item_use: string
item_slots?: number
item_tab: number
item_type: number,
item_min_level?: number;
is_equip?: boolean;
is_drill?: boolean;
item_expire_time?: string;
refine_level?: number;
refine_type?: number;
refine_state?: number;
item_image?: string;
stats?: {[key: string]:any}
item_type: number
item_min_level?: number
is_equip?: boolean
is_drill?: boolean
item_expire_time?: string
refine_level?: number
refine_type?: number
refine_state?: number
item_image?: string
stats?: { [key: string]: any }
}
export interface TricksterAccountInfo {
@ -25,7 +25,7 @@ export interface TricksterAccountInfo {
}
export interface TricksterAccount {
name:string
name: string
characters: TricksterCharacter[]
}
@ -43,56 +43,55 @@ export interface TricksterCharacter extends Identifier {
current_job: number
}
export interface TricksterInventory extends Identifier{
galders?:number
export interface TricksterInventory extends Identifier {
galders?: number
items: Map<string, TricksterItem>
}
const jobMap:{[key:number]:string} = {
const jobMap: { [key: number]: string } = {
//---- job 1, fm
1: "schoolgirl",
2: "fighter",
3: "librarian",
4: "shaman",
5: "archeologist",
6: "engineer",
7: "model",
8: "teacher",
1: 'schoolgirl',
2: 'fighter',
3: 'librarian',
4: 'shaman',
5: 'archeologist',
6: 'engineer',
7: 'model',
8: 'teacher',
//---- job 2 fm
9: "boxer",
10: "warrior",
11: "bard",
12: "magician",
13: "explorer",
14: "inventor",
15: "entertainer",
16: "card master",
9: 'boxer',
10: 'warrior',
11: 'bard',
12: 'magician',
13: 'explorer',
14: 'inventor',
15: 'entertainer',
16: 'card master',
//----
17: "champion",
18: "duelist",
19: "mercinary",
20: "gladiator",
21: "soul master",
22: "witch",
23: "wizard",
24: "dark lord",
25: "priest",
26: "thief master",
27: "hunter lord",
28: "cyber hunter",
29: "scientist",
30: "primadonna",
31: "diva",
32: "duke",
33: "gambler",
17: 'champion',
18: 'duelist',
19: 'mercinary',
20: 'gladiator',
21: 'soul master',
22: 'witch',
23: 'wizard',
24: 'dark lord',
25: 'priest',
26: 'thief master',
27: 'hunter lord',
28: 'cyber hunter',
29: 'scientist',
30: 'primadonna',
31: 'diva',
32: 'duke',
33: 'gambler',
}
export const JobNumberToString = (n:number):string=> {
if(n == -8) {
return "bank"
export const JobNumberToString = (n: number): string => {
if (n === -8) {
return 'bank'
}
if(jobMap[n] != undefined) {
if (jobMap[n] !== undefined) {
return jobMap[n]
}
return n.toString()

19
src/session_storage.ts
View File

@ -1,24 +1,19 @@
import { Session, TokenSession } from './lib/session'
export const LIFETO_COOKIE_PREFIX = 'LIFETO_PANEL_'
export const LIFETO_COOKIE_PREFIX="LIFETO_PANEL_"
export const nameCookie = (...s:string[]):string=>{
return LIFETO_COOKIE_PREFIX+s.join("_").toUpperCase()
export const nameCookie = (...s: string[]): string => {
return LIFETO_COOKIE_PREFIX + s.join('_').toUpperCase()
}
export class Storage {
GetSession():Session {
GetSession(): Session {
return new TokenSession()
}
RemoveSession() {
}
AddSession(s:Session) {
// setCookie(nameCookie("xsrf"),s.xsrf)
RemoveSession() {}
AddSession(_s: Session) {
// setCookie(nameCookie("xsrf"),s.xsrf)
}
}
export const storage = new Storage()

280
src/state/atoms.ts
View File

@ -1,37 +1,38 @@
import { AxiosError } from 'axios';
import { AxiosError } from 'axios'
import Fuse from 'fuse.js'
import { atom } from 'jotai'
import { atomWithStorage } from 'jotai/utils'
import { focusAtom } from 'jotai-optics'
import { atomWithQuery } from 'jotai-tanstack-query'
import { ItemWithSelection } from '@/lib/table/defs'
import { LTOApiv0 } from '../lib/lifeto'
import { LoginHelper, TokenSession } from '../lib/session'
import { atomWithQuery } from 'jotai-tanstack-query'
import {atomWithStorage} from "jotai/utils";
import { atom } from 'jotai';
import { TricksterCharacter, TricksterInventory, TricksterItem } from '../lib/trickster';
import {focusAtom} from "jotai-optics";
import { createSuperjsonStorage, superJsonStorage } from './storage';
import { ItemWithSelection } from '@/lib/table/defs';
import Fuse from 'fuse.js';
import { TricksterCharacter, TricksterItem } from '../lib/trickster'
import { createSuperjsonStorage } from './storage'
export const LTOApi = new LTOApiv0(new TokenSession())
export const loginStatusAtom = atomWithQuery((get) => {
export const loginStatusAtom = atomWithQuery(_get => {
return {
queryKey: ['login_status'],
enabled: true,
placeholderData: {
logged_in: false,
community_name: "...",
community_name: '...',
},
queryFn: async () => {
return LoginHelper.info().then(info => {
return {
logged_in: true,
community_name: info.community_name,
}
}).catch(e => {
if(e instanceof AxiosError) {
return LoginHelper.info()
.then(info => {
return {
logged_in: true,
community_name: info.community_name,
}
})
.catch(e => {
if (e instanceof AxiosError) {
return {
logged_in: false,
community_name: "...",
community_name: '...',
}
}
throw e
@ -40,40 +41,45 @@ export const loginStatusAtom = atomWithQuery((get) => {
}
})
export const charactersAtom = atomWithQuery((get) => {
const {data: loginStatus} = get(loginStatusAtom)
console.log("charactersAtom", loginStatus)
export const charactersAtom = atomWithQuery(get => {
const { data: loginStatus } = get(loginStatusAtom)
return {
queryKey: ['characters', loginStatus?.community_name || "..."],
queryKey: ['characters', loginStatus?.community_name || '...'],
enabled: !!loginStatus?.logged_in,
refetchOnMount: true,
queryFn: async ()=> {
return LTOApi.GetAccounts().then(x=>{
if(!x) {
queryFn: async () => {
return LTOApi.GetAccounts().then(x => {
if (!x) {
return undefined
}
const rawCharacters = x.flatMap(x=>{return x?.characters})
const characterPairs: Record<string, {bank?: TricksterCharacter, character?: TricksterCharacter}> = {}
rawCharacters.forEach(x=>{
let item = characterPairs[x.account_name]
if(!item) {
item = {}
}
if(x.class === -8) {
item.bank = x
} else {
item.character = x
}
characterPairs[x.account_name] = item
}, [rawCharacters])
const cleanCharacterPairs = Object.values(characterPairs).filter(x=>{
if(!(!!x.bank && !!x.character)) {
const rawCharacters = x.flatMap(x => {
return x?.characters
})
const characterPairs: Record<
string,
{ bank?: TricksterCharacter; character?: TricksterCharacter }
> = {}
rawCharacters.forEach(
x => {
let item = characterPairs[x.account_name]
if (!item) {
item = {}
}
if (x.class === -8) {
item.bank = x
} else {
item.character = x
}
characterPairs[x.account_name] = item
},
[rawCharacters],
)
const cleanCharacterPairs = Object.values(characterPairs).filter(x => {
if (!(!!x.bank && !!x.character)) {
return false
}
return true
}) as Array<{bank: TricksterCharacter, character: TricksterCharacter}>
}) as Array<{ bank: TricksterCharacter; character: TricksterCharacter }>
return cleanCharacterPairs
})
@ -81,46 +87,49 @@ export const charactersAtom = atomWithQuery((get) => {
}
})
export const selectedCharacterAtom = atomWithStorage<TricksterCharacter | undefined>("lto_state.selected_character", undefined)
export const selectedCharacterAtom = atomWithStorage<TricksterCharacter | undefined>(
'lto_state.selected_character',
undefined,
)
export const selectedTargetInventoryAtom = atom<TricksterCharacter | undefined>(undefined)
export const currentFilter = atom<undefined>(undefined)
export const currentCharacterInventoryAtom = atomWithQuery((get) => {
export const currentCharacterInventoryAtom = atomWithQuery(get => {
const currentCharacter = get(selectedCharacterAtom)
return {
queryKey:["inventory", currentCharacter?.path || "-"],
queryFn: async ()=> {
return LTOApi.GetInventory(currentCharacter?.path|| "-")
queryKey: ['inventory', currentCharacter?.path || '-'],
queryFn: async () => {
return LTOApi.GetInventory(currentCharacter?.path || '-')
},
enabled: !!currentCharacter,
// placeholderData: keepPreviousData,
}
})
const inventoryDisplaySettings= atomWithStorage<{
const inventoryDisplaySettings = atomWithStorage<{
page_size: number
}>("preference.inventory_display_settings", {
page_size: 25,
}, createSuperjsonStorage())
}>(
'preference.inventory_display_settings',
{
page_size: 25,
},
createSuperjsonStorage(),
)
export const inventoryDisplaySettingsAtoms = {
pageSize: focusAtom(inventoryDisplaySettings, x=>x.prop('page_size')),
pageSize: focusAtom(inventoryDisplaySettings, x => x.prop('page_size')),
}
export const currentCharacterItemsAtom = atom((get)=>{
const {data: inventory} = get(currentCharacterInventoryAtom)
export const currentCharacterItemsAtom = atom(get => {
const { data: inventory } = get(currentCharacterInventoryAtom)
const items = inventory?.items || new Map<string, TricksterItem>()
return {
items,
searcher: new Fuse(Array.from(items.values()), {
keys: [
'item_name',
],
keys: ['item_name'],
useExtendedSearch: true,
})
}),
}
})
@ -131,23 +140,26 @@ export interface InventoryFilter {
sort_reverse: boolean
}
export const inventoryFilterAtom = atomWithStorage<InventoryFilter>("preference.inventory_filter", {
search: "",
tab: "",
sort: "",
sort_reverse:false,
}, createSuperjsonStorage())
export const preferenceInventorySearch = focusAtom(inventoryFilterAtom, x=>x.prop('search'))
export const preferenceInventoryTab = focusAtom(inventoryFilterAtom, x=>x.prop('tab'))
export const preferenceInventorySort = focusAtom(inventoryFilterAtom, x=>x.prop('sort'))
export const preferenceInventorySortReverse = focusAtom(inventoryFilterAtom, x=>x.prop('sort_reverse'))
export const inventoryFilterAtom = atomWithStorage<InventoryFilter>(
'preference.inventory_filter',
{
search: '',
tab: '',
sort: '',
sort_reverse: false,
},
createSuperjsonStorage(),
)
export const preferenceInventorySearch = focusAtom(inventoryFilterAtom, x => x.prop('search'))
export const preferenceInventoryTab = focusAtom(inventoryFilterAtom, x => x.prop('tab'))
export const preferenceInventorySort = focusAtom(inventoryFilterAtom, x => x.prop('sort'))
export const preferenceInventorySortReverse = focusAtom(inventoryFilterAtom, x =>
x.prop('sort_reverse'),
)
export const setInventoryFilterTabActionAtom = atom(null, (_get, set, tab: string) => {
set(inventoryFilterAtom, x=>{
set(inventoryFilterAtom, x => {
return {
...x,
tab,
@ -161,98 +173,106 @@ export const inventoryPageRangeAtom = atom({
})
export const nextInventoryPageActionAtom = atom(null, (get, set) => {
const {start, end} = get(inventoryPageRangeAtom)
const { start, end } = get(inventoryPageRangeAtom)
set(inventoryPageRangeAtom, {
start: start + end,
end: end + end,
})
})
export const currentItemSelectionAtom = atom<[Map<string, number>, number]>([new Map<string, number>(), 0])
export const currentInventorySearchQueryAtom = atom("")
export const currentItemSelectionAtom = atom<[Map<string, number>, number]>([
new Map<string, number>(),
0,
])
export const currentInventorySearchQueryAtom = atom('')
export const filteredCharacterItemsAtom = atom((get)=>{
const { items, searcher } = get(currentCharacterItemsAtom)
export const filteredCharacterItemsAtom = atom(get => {
const { items, searcher } = get(currentCharacterItemsAtom)
const [selection] = get(currentItemSelectionAtom)
const filter = get(inventoryFilterAtom)
const out: ItemWithSelection[] = []
for (const [_, value] of items.entries()) {
if(filter.search !== "") {
if(!value.item_name.toLowerCase().includes(filter.search)) {
if (filter.search !== '') {
if (!value.item_name.toLowerCase().includes(filter.search)) {
continue
}
}
if(filter.tab !== "") {
if(value.item_tab !== parseInt(filter.tab)) {
if (filter.tab !== '') {
if (value.item_tab !== parseInt(filter.tab)) {
continue
}
}
let status = undefined
if(selection.has(value.id)) {
let status
if (selection.has(value.id)) {
status = {
selected: true,
}
}
out.push({item: value, status})
out.push({ item: value, status })
}
switch(filter.sort) {
case "count":
out.sort((a, b)=>{
switch (filter.sort) {
case 'count':
out.sort((a, b) => {
return b.item.item_count - a.item.item_count
})
break;
case "type":
out.sort((a, b)=>{
break
case 'type':
out.sort((a, b) => {
return a.item.item_tab - b.item.item_tab
})
break;
case "name":
out.sort((a, b)=>{
break
case 'name':
out.sort((a, b) => {
return a.item.item_name.localeCompare(b.item.item_name)
})
break;
break
}
if(filter.sort && filter.sort_reverse) {
if (filter.sort && filter.sort_reverse) {
out.reverse()
}
return out
})
export const inventoryItemsCurrentPageAtom = atom((get)=>{
export const inventoryItemsCurrentPageAtom = atom(get => {
const items = get(filteredCharacterItemsAtom)
const {start, end} = get(inventoryPageRangeAtom)
return items.slice(start, end).map((item): ItemWithSelection =>{
const { start, end } = get(inventoryPageRangeAtom)
return items.slice(start, end).map((item): ItemWithSelection => {
return item
})
})
export const rowSelectionLastActionAtom = atom<{
index: number
action: "add" | "remove"
}| undefined>(undefined)
export const rowSelectionLastActionAtom = atom<
| {
index: number
action: 'add' | 'remove'
}
| undefined
>(undefined)
export const clearItemSelectionActionAtom = atom(null, (_get, set) => {
set(currentItemSelectionAtom, [new Map<string,number>(), 0])
set(currentItemSelectionAtom, [new Map<string, number>(), 0])
})
export const itemSelectionSetActionAtom = atom(null, (get, set, arg: Record<string,number | undefined> ) => {
const cur = get(currentItemSelectionAtom)
for(const [key, value] of Object.entries(arg)) {
if(value === undefined) {
cur[0].delete(key)
} else {
cur[0].set(key, value)
export const itemSelectionSetActionAtom = atom(
null,
(get, set, arg: Record<string, number | undefined>) => {
const cur = get(currentItemSelectionAtom)
for (const [key, value] of Object.entries(arg)) {
if (value === undefined) {
cur[0].delete(key)
} else {
cur[0].set(key, value)
}
}
}
set(currentItemSelectionAtom, [cur[0], cur[1] + 1])
})
set(currentItemSelectionAtom, [cur[0], cur[1] + 1])
},
)
export const itemSelectionSelectAllFilterActionAtom = atom(null, (get, set) => {
const cur = get(currentItemSelectionAtom)
const items = get(filteredCharacterItemsAtom)
for(const item of items) {
for (const item of items) {
cur[0].set(item.item.id, item.item.item_count)
}
set(currentItemSelectionAtom, [cur[0], cur[1] + 1])
@ -261,7 +281,7 @@ export const itemSelectionSelectAllFilterActionAtom = atom(null, (get, set) => {
export const itemSelectionSelectAllPageActionAtom = atom(null, (get, set) => {
const cur = get(currentItemSelectionAtom)
const items = get(inventoryItemsCurrentPageAtom)
for(const item of items) {
for (const item of items) {
cur[0].set(item.item.id, item.item.item_count)
}
set(currentItemSelectionAtom, [cur[0], cur[1] + 1])
@ -271,30 +291,30 @@ export const paginateInventoryActionAtom = atom(null, (get, set, pages: number |
const inventoryRange = get(inventoryPageRangeAtom)
const pageSize = get(inventoryDisplaySettingsAtoms.pageSize)
const filteredItems = get(filteredCharacterItemsAtom)
if(pages === undefined) {
if (pages === undefined) {
set(inventoryPageRangeAtom, {
start: 0,
end: pageSize,
})
return
}
if(pageSize > filteredItems.length) {
if (pageSize > filteredItems.length) {
set(inventoryPageRangeAtom, {
start: 0,
end: filteredItems.length,
})
return
}
if(pages > 0) {
if(inventoryRange.end >= filteredItems.length) {
if (pages > 0) {
if (inventoryRange.end >= filteredItems.length) {
set(inventoryPageRangeAtom, {
start: 0,
end: pageSize,
})
return
}
}else if(pages < 0) {
if(inventoryRange.start <= 0) {
} else if (pages < 0) {
if (inventoryRange.start <= 0) {
set(inventoryPageRangeAtom, {
start: filteredItems.length - pageSize,
end: filteredItems.length,
@ -305,10 +325,10 @@ export const paginateInventoryActionAtom = atom(null, (get, set, pages: number |
const delta = pages * pageSize
let newStart = inventoryRange.start + delta
let newEnd = inventoryRange.end + delta
if(newEnd > filteredItems.length) {
if (newEnd > filteredItems.length) {
newEnd = filteredItems.length
}
if(newEnd - newStart != pageSize) {
if (newEnd - newStart !== pageSize) {
newStart = newEnd - pageSize
}

67
src/state/state.ts
View File

@ -1,12 +1,12 @@
import { defineStore, storeToRefs } from 'pinia'
import { BasicColumns, ColumnInfo, ColumnName, Columns, DetailsColumns, MoveColumns } from '../lib/columns'
import { BasicColumns, ColumnInfo, ColumnName, DetailsColumns, MoveColumns } from '../lib/columns'
import { OrderTracker } from '../lib/lifeto/order_manager'
import { StoreAccounts, StoreChars, StoreColSet, StoreStr } from '../lib/storage'
import { ColumnSet } from '../lib/table'
import { TricksterAccount, TricksterCharacter, TricksterInventory } from '../lib/trickster'
import { nameCookie} from '../session_storage'
import { nameCookie } from '../session_storage'
const _defaultColumn:(ColumnInfo| ColumnName)[] = [
const _defaultColumn: (ColumnInfo | ColumnName)[] = [
...BasicColumns,
...MoveColumns,
...DetailsColumns,
@ -20,11 +20,11 @@ export const StoreReviver = {
screen: StoreStr,
columns: StoreColSet,
tags: StoreColSet,
// orders: StoreSerializable(OrderTracker)
// orders: StoreSerializable(OrderTracker)
}
export interface StoreProps {
invs: Map<string,TricksterInventory>
export interface StoreProps {
invs: Map<string, TricksterInventory>
chars: Map<string, TricksterCharacter>
accs: Map<string, TricksterAccount>
orders: OrderTracker
@ -37,53 +37,50 @@ export interface StoreProps {
}
export const useStore = defineStore('state', {
state: ()=> {
let store = {
invs: new Map() as Map<string,TricksterInventory>,
chars: new Map() as Map<string,TricksterCharacter>,
accs: new Map() as Map<string,TricksterAccount>,
state: () => {
const store = {
invs: new Map() as Map<string, TricksterInventory>,
chars: new Map() as Map<string, TricksterCharacter>,
accs: new Map() as Map<string, TricksterAccount>,
orders: new OrderTracker(),
activeTable: "none",
screen: "default",
columns:new ColumnSet(_defaultColumn),
activeTable: 'none',
screen: 'default',
columns: new ColumnSet(_defaultColumn),
tags: new ColumnSet(),
dirty: 0,
currentSearch: "",
currentSearch: '',
}
return store
}
},
})
export const loadStore = ()=> {
let store = useStoreRef()
for(const [k, v] of Object.entries(StoreReviver)){
const coke = localStorage.getItem(nameCookie("last_"+k))
if(coke){
if((store[k as keyof RefStore]) != undefined){
export const loadStore = () => {
const store = useStoreRef()
for (const [k, v] of Object.entries(StoreReviver)) {
const coke = localStorage.getItem(nameCookie(`last_${k}`))
if (coke) {
if (store[k as keyof RefStore] !== undefined) {
store[k as keyof RefStore].value = v.Revive(coke) as any
}
}
}
}
export const saveStore = ()=> {
let store = useStoreRef()
for(const [k, v] of Object.entries(StoreReviver)){
let coke;
if((store[k as keyof RefStore]) != undefined){
export const saveStore = () => {
const store = useStoreRef()
for (const [k, v] of Object.entries(StoreReviver)) {
let coke
if (store[k as keyof RefStore] !== undefined) {
coke = v.Murder(store[k as keyof RefStore].value as any)
}
if(coke){
localStorage.setItem(nameCookie("last_"+k),coke)
if (coke) {
localStorage.setItem(nameCookie(`last_${k}`), coke)
}
}
}
export const useStoreRef = ()=>{
export const useStoreRef = () => {
const refs = storeToRefs(useStore())
return refs
};
export type RefStore = ReturnType<typeof useStoreRef>;
}
export type RefStore = ReturnType<typeof useStoreRef>

25
src/state/storage.ts
View File

@ -1,4 +1,9 @@
import { AsyncStorage, AsyncStringStorage, SyncStorage, SyncStringStorage } from "jotai/vanilla/utils/atomWithStorage"
import {
AsyncStorage,
AsyncStringStorage,
SyncStorage,
SyncStringStorage,
} from 'jotai/vanilla/utils/atomWithStorage'
import superjson from 'superjson'
const isPromiseLike = (x: unknown): x is PromiseLike<unknown> =>
@ -19,16 +24,12 @@ type StringSubscribe = (
export function createSuperjsonStorage<Value>(): SyncStorage<Value>
export function createSuperjsonStorage<Value>(
getStringStorage: () =>
| AsyncStringStorage
| SyncStringStorage
| undefined = () => {
getStringStorage: () => AsyncStringStorage | SyncStringStorage | undefined = () => {
try {
return window.localStorage
} catch (e) {
} catch (_e) {
if (import.meta.env?.MODE !== 'production') {
if (typeof window !== 'undefined') {
console.warn(e)
}
}
return undefined
@ -58,18 +59,14 @@ export function createSuperjsonStorage<Value>(
}
return parse(str) as never
},
setItem: (key, newValue) =>
getStringStorage()?.setItem(
key,
superjson.stringify(newValue),
),
removeItem: (key) => getStringStorage()?.removeItem(key),
setItem: (key, newValue) => getStringStorage()?.setItem(key, superjson.stringify(newValue)),
removeItem: key => getStringStorage()?.removeItem(key),
}
const createHandleSubscribe =
(subscriber: StringSubscribe): Subscribe<Value> =>
(key, callback, initialValue) =>
subscriber(key, (v) => {
subscriber(key, v => {
let newValue: Value
try {
newValue = superjson.parse(v || '')

12
tsconfig.json
View File

@ -7,7 +7,7 @@
"paths": {
"@/*": ["./src/*"]
},
"types": [ "node" ],
"types": ["node"],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
@ -21,13 +21,7 @@
"noEmit": true,
"jsx": "react-jsx"
},
"include": [
"src",
"app",
"index",
],
"exclude": [
"node_modules",
],
"include": ["src", "app", "index"],
"exclude": ["node_modules"],
"references": [{ "path": "./tsconfig.node.json" }]
}

1
tsconfig.node.json
View File

@ -7,4 +7,3 @@
},
"include": ["vite.config.ts"]
}

16
vite.config.ts
View File

@ -1,10 +1,12 @@
import { defineConfig } from 'vite'
// ignore the type error onthe next line
// @ts-ignore
import tailwindcss from '@tailwindcss/vite'
import react from '@vitejs/plugin-react'
import path from 'path'
import { defineConfig } from 'vite'
export default defineConfig({
plugins: [react()],
plugins: [react(), tailwindcss()],
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
@ -14,12 +16,12 @@ export default defineConfig({
proxy: {
// with options
'/lifeto': {
target: "https://beta.lifeto.co/",
target: 'https://beta.lifeto.co/',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/lifeto/, ''),
rewrite: path => path.replace(/^\/lifeto/, ''),
},
}
}
},
},
})
// https://vitejs.dev/config/

4637
yarn.lock
View File

File diff suppressed because it is too large Load Diff