Table of Contents
frontend: node v20.11.0 vue js 3 vitest quasar
backend: dotnet webapi mongodb + compass swagger
vuetest playwright simple gui test postman Thunder Client extension
TODO
https://vuejs.org/ https://quasar.dev/docs
see addon ./addon
/hlm p export Pending items
/hlm i import auctioned items
v0:
- Create a room with adjustable auction settings
- Participate in an auction as user / admin
- Export / Import auctions from ingame <--> web
v1:
- Role management (Admin, User)
- User management, balance, name, icon
- Web socket instead of polling
Addon export [ ]
- export game data
- import game data
- data model adjustments
- adjust addon to remove unneeded features
- add amount of items
Roles / Auth
- join room as viewer or lootmaster
- authenticate viewer
- authenticate lootmaster
- show users that are participating
Style
- add dark theme
- status bar with some content
- room settings form design
- form slider for fee %, bid duration, countdown
- display item level on top of icon
- wrap item name
Data
- same data format addon
- design room mongoDB document structure
- validate form input backend
- validate form input frontend
- Make generic datastore based on PonyStore, ItemInfo loads from datastore
- Add BoE tag when pulling from API
Pages/navigation
- join room with a code
- navigate to index, a room
- index page
- go to a new room
- form page and navigate to a room
- [j] display auctions of room from db
- display a list of auctions
- increment auction
- load room settings from db
- make scrollable list for many auctions
- display valid room
- conditional load of valid room
- global room data
- load room data when creating
- load room data when loading
Items
- create new auction form items CSV
- create new auction from ID list
- load itemInfo data from Blizzard API
- fix increment
- add caching before API
- add item data for each namespace
- add amount of items
Session
- submit auction to db
- refresh auction data from db
- auto refreshing
- optimize refreshing
- session state. Start auctions
- session state. End auctions
- Add loot master / admin authentication
Admin controls
- Admin buttons, delete, countdown, close, restart, etc
Session / General controls
- Filter by item name
- Filter by "watched"
- Filter by usable
- Add BoE bid as a group
Live / real time updates
- Display progression bars
- Timer 1: fast update to update current time which updates progression timers
- Timer 2: 1 sec or slower: Server updates
data / schema
https://dbdiagram.io/d/auction-65c9ab1aac844320aeec5e81
- meta data
flowchart LR;
game-->in-->website-->out-->game
in[(items.csv)]
out[(encodedItems)]
website([website])
- Loot master interaction addon handles exporting of items website handles auctions + cuts addon handles trading player items
flowchart LR;
in-->website-->out-->trade
out[(sold_items.csv)]
in([addon export items])
out([addon import auctions])
trade([trade items])
website([auctions website])
- Player interaction no addon required for player
flowchart LR;
website-->game
game([trade loot master for item])
website([bid with website gui])
- Addon export items
flowchart LR;
export-->data
data[(items.csv)]
export(["Session:ExportAllPendingAuctionsToGUI()"])
see ./addon under "addon" branch
/hlm e export
Add items with hlma (from id) or with shift+click (from bags)
note: items created with /hlma do not have a guid and when importing are not auto-tradeable shift+click items to add. will export/import the guid and allow auto-trading
Test string for /hlma
/hlma 19137 18814 17076 18563 17069 17071 17105 17204 16795 16808 16813 16821 16834 16842 16846 16854 16866 18264 18260 17011
smaller
/hlma 19137 18814 17076
/hlm e
rowId,id,name,quality,ilvl,minLevel,itemType,itemSubType,infoStatus,infoMinPrice,guid
1,19137,Onslaught Girdle,4,78,60,Armor,Plate,1,3000,noguid
2,18814,Choker of the Fire Lord,4,78,60,Armor,Miscellaneous,1,3000,noguid
3,17076,Bonereaver's Edge,4,77,60,Weapon,Two-Handed Swords,1,3000,noguid
4,12282,Worn Battleaxe,1,2,1,Weapon,Two-Handed Axes,1,3000,Item-5827-0-40000000C90648E0
5,140,Brawler's Boots,1,1,0,Armor,Miscellaneous,1,3000,Item-5827-0-40000000C90648DE
/hlm i
itemIdreateForId(tonumber(elements[1])) item.info = { status = tonumber(elements[2]), minPrice = tonumber(elements[3]), exp = tonumber(elements[4]), winner = elements[5], salePrice = tonumber(elements[6]) } item.guid = elements[7] -- Encode != Decode. Field is only needed to be decoded from GUI
rowID,itemId,status,minPrice,exp,winner,salePrice,guid
1:12282,3,3000,1707706195,Anonuwu,3000:2:19137,3,3000,1707706195,Anonuwu,3100,Item-5827-0-40000000C90648DE
flowchart LR;
input-->magic-->output
output
rowID,itemId,status,minPrice,exp,winner,salePrice,guid
1:12282,3,3000,1707706195,Anonuwu,3000:2:19137,3,3000,1707706195,Anonuwu,3100,Item-5827-0-40000000C90648DE
ItemIds from molten core
19137,18814,17076,12282,16901, 18815, 18816, 17204, 17082,7078, 18646, 18803, 19140, 17073, 17069, 18821, 18879, 18264, 18260
Toggle options group
Options for toggles
group: ref(['op1'])
options: [ { label: 'Option 1', value: 'op1' }, { label: 'Option 2', value: 'op2' }, { label: 'Option 3', value: 'op3' } ]
<div class="q-pa-lg">
<q-option-group
v-model="group"
:options="options"
color="yellow"
type="toggle"
/>
</div>
Typescript JSX Vue Router Pinia Vitest E2E Playright ESLINT+Prettier
npm create vite@latestnpm install primevue✔ Project name: … auction
✔ Add TypeScript? … No / Yes
✔ Add JSX Support? … No / Yes
✔ Add Vue Router for Single Page Application development? … No / Yes
✔ Add Pinia for state management? … No / Yes
✔ Add Vitest for Unit Testing? … No / Yes
✔ Add an End-to-End Testing Solution? › Playwright
✔ Add ESLint for code quality? … No / Yes
✔ Add Prettier for code formatting? … No / Yes
TODO: Use pony client to gather data. Does it cache? Store item data in mongo
dotnet add package ArgentPonyWarcraftClient --version 8.1.8
dotnet user-secrets init dotnet user-secrets set "Blizzard:ClientId" "clientId-xxxxxxxxxxxxxxxxxxxx" dotnet user-secrets set "Blizzard:ClientSecret" "clientSecret-xxxxxxxxxxxxxxxxxxxx"
mongodb compass
mongodb://localhost:27017
response of GET request to /api/auctions
[
{
"id": "65d1eeb92ba931f1cf61f531",
"rowId": 1,
"itemId": 19137,
"status": 1,
"minimumPrice": 3000,
"expiration": 1708217000,
"itemName": "Onslaught Girdle",
"quality": 4,
"itemLevel": 78,
"minLevel": 60,
"itemType": "Armor",
"itemSubType": "Plate",
"guid": "noguid"
},
...
]
Document data format
// JSON Room
{
"name": "Lootmaster",
"enableDiscordProtection": false,
"organiserFee": 10,
"minimumBid": 10,
"minimumBidIncrement": 1,
"bidDurationInSeconds": 240,
"countDownTimeInSeconds": 40,
"restrictBidsToEquipable": false,
"hideNameOfHighestBidder": false,
"hidePayoutDetails": false,
"users": [
{ "name": "user1" },
{ "name": "user2" },
{ "name": "user3" },
{ "name": "user4" },
],
"auctions": [
{
"rowId": 1,
"status": 1,
"expiration": 1708217000,
"itemId": 19137,
"guid": "noguid"
"minimumPrice": 3000,
"itemName": "Onslaught Girdle",
"quality": 4,
"itemLevel": 78,
"minLevel": 60,
"itemType": "Armor",
"itemSubType": "Plate",
},
{
"rowId": 2,
"status": 1,
"expiration": 1708217000,
"itemId": 18814,
"guid": "noguid"
"minimumPrice": 3000,
"itemName": "Choker of the Fire Lord",
"quality": 4,
"itemLevel": 78,
"minLevel": 60,
"itemType": "Armor",
"itemSubType": "Miscellaneous",
},
{
"rowId": 3,
"status": 1, "expiration": 1708217000,
"itemId": 12282,
"guid": "Item-5827-0-40000000C90648E0"
"minimumPrice": 1000,
"itemName": "Worn Battleaxe",
"quality": 1,
"itemLevel": 2,
"minLevel": 1,
"itemType": "Weapon",
"itemSubType": "Weapon,Two-Handed Axes",
},
{
"rowId": 4,
"status": 1,
"expiration": 1708217000,
"itemId": 12282,
"guid": "Item-5827-0-40000000C90648DE"
"minimumPrice": 1000,
"itemName": "Brawler's Boots",
"quality": 1,
"itemLevel": 1,
"minLevel": 1,
"itemType": "Armor",
"itemSubType": "Miscellaneous",
},
]
}
recording.mp4
