Merge branch 'dev' into purse-redesign

src/events/inventory/InventoryBadgesRequestEvent.ts

@@ -0,0 +1,6 @@
+import { NitroEvent } from 'nitro-renderer';
+
+export class InventoryBadgesRequestEvent extends NitroEvent
+{
+    public static REQUEST_BADGES: string = 'IBRE_REQUEST_BADGES';
+}

src/events/inventory/InventoryBadgesUpdatedEvent.ts

@@ -0,0 +1,20 @@
+import { NitroEvent } from 'nitro-renderer';
+
+export class InventoryBadgesUpdatedEvent extends NitroEvent
+{
+    public static BADGES_UPDATED: string = 'IBUE_BADGES_UPDATED';
+
+    private _badges: string[] = [];
+
+    constructor(type: string, badges: string[] = [])
+    {
+        super(type);
+
+        this._badges = badges;
+    }
+
+    public get badges(): string[]
+    {
+        return this._badges;
+    }
+}

src/events/inventory/index.ts

@@ -1,3 +1,4 @@
+export * from './InventoryBadgesUpdatedEvent';
 export * from './InventoryEvent';
 export * from './InventoryTradeRequestEvent';
 export * from './InventoryTradeStartEvent';

src/views/catalog/CatalogView.tsx

@@ -1,7 +1,6 @@
-import { CatalogModeComposer, CatalogRequestGiftConfigurationComposer, ICatalogPageData, RoomPreviewer } from 'nitro-renderer';
+import { CatalogModeComposer, CatalogPageComposer, CatalogRequestGiftConfigurationComposer, ICatalogPageData, ILinkEventTracker, RoomPreviewer } from 'nitro-renderer';
 import { FC, useCallback, useEffect, useReducer, useState } from 'react';
-import { GetRoomEngine } from '../../api';
+import { AddEventLinkTracker, GetRoomEngine, RemoveLinkEventTracker } from '../../api';
-import { GetCatalogPageComposer } from '../../api/catalog/GetCatalogPageComposer';
 import { CatalogEvent } from '../../events';
 import { useUiEvent } from '../../hooks/events/ui/ui-event';
 import { SendMessageHook } from '../../hooks/messages/message-event';
@@ -9,6 +8,7 @@ import { NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, Nitro
 import { LocalizeText } from '../../utils/LocalizeText';
 import { CatalogMessageHandler } from './CatalogMessageHandler';
 import { CatalogMode, CatalogViewProps } from './CatalogView.types';
+import { GetCatalogPageTree } from './common/CatalogUtilities';
 import { CatalogContextProvider } from './context/CatalogContext';
 import { CatalogActions, CatalogReducer, initialCatalog } from './reducers/CatalogReducer';
 import { CatalogNavigationView } from './views/navigation/CatalogNavigationView';
@@ -42,6 +42,67 @@ export const CatalogView: FC<CatalogViewProps> = props =>
     useUiEvent(CatalogEvent.TOGGLE_CATALOG, onCatalogEvent);
     useUiEvent(CatalogEvent.CATALOG_RESET, onCatalogEvent);
 
+    const setCurrentTab = useCallback((page: ICatalogPageData) =>
+    {
+        dispatchCatalogState({
+            type: CatalogActions.SET_CATALOG_CURRENT_TAB,
+            payload: {
+                currentTab: page
+            }
+        });
+    }, [ dispatchCatalogState ]);
+
+    const navigateThroughTree = useCallback((tree: ICatalogPageData[]) =>
+    {
+        setCurrentTab(tree.shift());
+    }, [ setCurrentTab ]);
+
+    const navigateToPage = useCallback((pageId: number) =>
+    {
+        const pageTree: ICatalogPageData[] = [];
+
+        GetCatalogPageTree(root, pageId, pageTree);
+
+        if(!pageTree.length) return;
+
+        pageTree.reverse();
+
+        navigateThroughTree(pageTree);
+    }, [ root, navigateThroughTree ]);
+
+    const linkReceived = useCallback((url: string) =>
+    {
+        const parts = url.split('/');
+
+        if(parts.length < 2) return;
+
+        switch(parts[1])
+        {
+            case 'open':
+                if(parts.length > 2)
+                {
+                    navigateToPage(parseInt(parts[2]));
+                }
+                else
+                {
+                    setIsVisible(true);
+                }
+                return;
+        }
+    }, [ navigateToPage ]);
+
+    useEffect(() =>
+    {
+        const linkTracker: ILinkEventTracker = {
+            linkReceived,
+            eventUrlPrefix: 'catalog/'
+        };
+
+        AddEventLinkTracker(linkTracker);
+
+        return () => RemoveLinkEventTracker(linkTracker);
+    }, [ linkReceived]);
+
     useEffect(() =>
     {
         if(!isVisible) return;
@@ -51,13 +112,15 @@ export const CatalogView: FC<CatalogViewProps> = props =>
             SendMessageHook(new CatalogModeComposer(CatalogMode.MODE_NORMAL));
             SendMessageHook(new CatalogRequestGiftConfigurationComposer());
         }
+
+        console.log(catalogState.root)
     }, [ isVisible, catalogState.root ]);
 
     useEffect(() =>
     {
         if(!currentTab) return;
 
-        SendMessageHook(GetCatalogPageComposer(currentTab.pageId, -1, CatalogMode.MODE_NORMAL));
+        SendMessageHook(new CatalogPageComposer(currentTab.pageId, -1, CatalogMode.MODE_NORMAL));
     }, [ currentTab ]);
 
     useEffect(() =>
@@ -75,16 +138,6 @@ export const CatalogView: FC<CatalogViewProps> = props =>
         }
     }, []);
 
-    const setCurrentTab = useCallback((page: ICatalogPageData) =>
-    {
-        dispatchCatalogState({
-            type: CatalogActions.SET_CATALOG_CURRENT_TAB,
-            payload: {
-                currentTab: page
-            }
-        });
-    }, [ dispatchCatalogState ]);
-
     const currentNavigationPage = ((searchResult && searchResult.page) || currentTab);
 
     return (

src/views/catalog/common/CatalogUtilities.ts

@@ -149,3 +149,20 @@ export function GetPetAvailableColors(petIndex: number, palettes: SellablePetPal
         }
     }
 }
+
+export function GetCatalogPageTree(page: ICatalogPageData, targetPageId: number, tree: ICatalogPageData[])
+{
+    if(page.pageId === targetPageId) return page;
+
+    for(const pageData of page.children)
+    {
+        const foundPageData = GetCatalogPageTree(pageData, targetPageId, tree);
+
+        if(foundPageData)
+        {
+            tree.push(pageData);
+
+            return pageData;
+        }
+    }
+}

src/views/catalog/views/page/layout/CatalogLayout.scss

@@ -1,3 +1,4 @@
+@import './badge-display/CatalogLayoutBadgeDisplayView';
 @import './default/CatalogLayoutDefaultView';
 @import './frontpage4/CatalogLayoutFrontpage4View';
 @import './pets/CatalogLayoutPetView';

src/views/catalog/views/page/layout/GetCatalogLayout.tsx

@@ -1,4 +1,5 @@
 import { ICatalogPageParser, RoomPreviewer } from 'nitro-renderer';
+import { CatalogLayoutBadgeDisplayView } from './badge-display/CatalogLayoutBadgeDisplayView';
 import { CatalogLayoutDefaultView } from './default/CatalogLayoutDefaultView';
 import { CatalogLayoutFrontpage4View } from './frontpage4/CatalogLayoutFrontpage4View';
 import { CatalogLayouGuildCustomFurniView } from './guild-custom-furni/CatalogLayoutGuildCustomFurniView';
@@ -47,9 +48,11 @@ export const GetCatalogLayout = (pageParser: ICatalogPageParser, roomPreviewer:
         case 'spaces_new':
             return <CatalogLayoutSpacesView roomPreviewer={ roomPreviewer } pageParser={ pageParser } />;
         case 'trophies':
-            return <CatalogLayoutTrophiesView roomPreviewer={roomPreviewer} pageParser={pageParser} />;
+            return <CatalogLayoutTrophiesView roomPreviewer={roomPreviewer} pageParser={ pageParser } />;
         case 'info_loyalty':
             return <CatalogLayoutInfoLoyaltyView roomPreviewer={ roomPreviewer } pageParser={ pageParser } />;
+        case 'badge_display':
+            return <CatalogLayoutBadgeDisplayView roomPreviewer={roomPreviewer} pageParser={ pageParser } />;
         case 'bots':
         case 'default_3x3':
         default:

src/views/catalog/views/page/layout/badge-display/CatalogLayoutBadgeDisplayView.scss

@@ -0,0 +1,7 @@
+.nitro-catalog-layout-badge-display {
+
+    .inventory-badge-grid {
+        height: 200px;
+        max-height: 200px;
+    }
+}

src/views/catalog/views/page/layout/badge-display/CatalogLayoutBadgeDisplayView.tsx

@@ -0,0 +1,80 @@
+import { StringDataType } from 'nitro-renderer';
+import { FC, useCallback, useEffect, useMemo, useState } from 'react';
+import { InventoryBadgesUpdatedEvent } from '../../../../../../events';
+import { InventoryBadgesRequestEvent } from '../../../../../../events/inventory/InventoryBadgesRequestEvent';
+import { dispatchUiEvent, useUiEvent } from '../../../../../../hooks';
+import { NitroCardGridItemView } from '../../../../../../layout/card/grid/item/NitroCardGridItemView';
+import { NitroCardGridView } from '../../../../../../layout/card/grid/NitroCardGridView';
+import { BadgeImageView } from '../../../../../shared/badge-image/BadgeImageView';
+import { GetOfferName } from '../../../../common/CatalogUtilities';
+import { useCatalogContext } from '../../../../context/CatalogContext';
+import { CatalogRoomPreviewerView } from '../../../catalog-room-previewer/CatalogRoomPreviewerView';
+import { CatalogPageOffersView } from '../../offers/CatalogPageOffersView';
+import { CatalogPurchaseView } from '../../purchase/CatalogPurchaseView';
+import { CatalogLayoutBadgeDisplayViewProps } from './CatalogLayoutBadgeDisplayView.types';
+
+export const CatalogLayoutBadgeDisplayView: FC<CatalogLayoutBadgeDisplayViewProps> = props =>
+{
+    const { roomPreviewer = null, pageParser = null } = props;
+    const { catalogState = null, dispatchCatalogState = null } = useCatalogContext();
+    const { activeOffer = null } = catalogState;
+    const [ currentBadge, setCurrentBadge ] = useState<string>(null);
+    const [ badges, setBadges ] = useState<string[]>([]);
+
+    const product = ((activeOffer && activeOffer.products[0]) || null);
+
+    const onInventoryBadgesUpdatedEvent = useCallback((event: InventoryBadgesUpdatedEvent) =>
+    {
+        console.log(event);
+        setBadges(event.badges);
+    }, []);
+
+    useUiEvent(InventoryBadgesUpdatedEvent.BADGES_UPDATED, onInventoryBadgesUpdatedEvent);
+
+    const badgeElements = useMemo(() =>
+    {
+        return badges.map(code =>
+            {
+                return (
+                    <NitroCardGridItemView key={ code } itemActive={ (currentBadge === code) } onMouseDown={ event => setCurrentBadge(code) }> 
+                        <BadgeImageView badgeCode={ code } />
+                    </NitroCardGridItemView>
+                );
+            });
+    }, [ badges, currentBadge ]);
+
+    useEffect(() =>
+    {
+        dispatchUiEvent(new InventoryBadgesRequestEvent(InventoryBadgesRequestEvent.REQUEST_BADGES));
+    }, []);
+
+    useEffect(() =>
+    {
+        if(!currentBadge || !activeOffer) return;
+
+        const stuffData = new StringDataType();
+
+        stuffData.setValue([ null, currentBadge ]);
+
+        roomPreviewer.updateObjectStuffData(stuffData);
+    }, [ currentBadge, activeOffer, roomPreviewer ]);
+
+    return (
+        <div className="row h-100 nitro-catalog-layout-badge-display">
+            <div className="d-flex flex-column col-7 h-100">
+                <CatalogPageOffersView offers={ pageParser.offers } />
+                <div className="d-flex mt-2">
+                    <NitroCardGridView className="inventory-badge-grid">
+                        { badgeElements }
+                    </NitroCardGridView>
+                </div>
+            </div>
+            { product &&
+                <div className="position-relative d-flex flex-column col">
+                    <CatalogRoomPreviewerView roomPreviewer={ roomPreviewer } height={ 140 } />
+                    <div className="fs-6 text-black mt-1 overflow-hidden">{ GetOfferName(activeOffer) }</div>
+                    <CatalogPurchaseView offer={ activeOffer } pageId={ pageParser.pageId } extra={ 'Bill	22-7-2021	ADM' } />
+                </div> }
+        </div>
+    );
+}

src/views/catalog/views/page/layout/badge-display/CatalogLayoutBadgeDisplayView.types.ts

@@ -0,0 +1,6 @@
+import { CatalogLayoutProps } from '../CatalogLayout.types';
+
+export interface CatalogLayoutBadgeDisplayViewProps extends CatalogLayoutProps
+{
+
+}

src/views/inventory/InventoryMessageHandler.tsx

@@ -1,7 +1,10 @@
-import { AdvancedMap, BadgesEvent, BotAddedToInventoryEvent, BotInventoryMessageEvent, BotRemovedFromInventoryEvent, FurnitureListAddOrUpdateEvent, FurnitureListEvent, FurnitureListInvalidateEvent, FurnitureListItemParser, FurnitureListRemovedEvent, FurniturePostItPlacedEvent, PetAddedToInventoryEvent, PetData, PetInventoryEvent, PetRemovedFromInventory, TradingAcceptEvent, TradingCloseEvent, TradingCompletedEvent, TradingConfirmationEvent, TradingListItemEvent, TradingNotOpenEvent, TradingOpenEvent, TradingOpenFailedEvent, TradingOtherNotAllowedEvent, TradingYouAreNotAllowedEvent, UnseenItemsEvent } from 'nitro-renderer';
+import { AdvancedMap, BadgeReceivedEvent, BadgesEvent, BotAddedToInventoryEvent, BotInventoryMessageEvent, BotRemovedFromInventoryEvent, FurnitureListAddOrUpdateEvent, FurnitureListEvent, FurnitureListInvalidateEvent, FurnitureListItemParser, FurnitureListRemovedEvent, FurniturePostItPlacedEvent, PetAddedToInventoryEvent, PetData, PetInventoryEvent, PetRemovedFromInventory, RequestBadgesComposer, TradingAcceptEvent, TradingCloseEvent, TradingCompletedEvent, TradingConfirmationEvent, TradingListItemEvent, TradingNotOpenEvent, TradingOpenEvent, TradingOpenFailedEvent, TradingOtherNotAllowedEvent, TradingYouAreNotAllowedEvent, UnseenItemsEvent } from 'nitro-renderer';
 import { FC, useCallback } from 'react';
 import { GetRoomSession, GetSessionDataManager } from '../../api';
-import { CreateMessageHook } from '../../hooks/messages/message-event';
+import { InventoryBadgesUpdatedEvent } from '../../events';
+import { InventoryBadgesRequestEvent } from '../../events/inventory/InventoryBadgesRequestEvent';
+import { dispatchUiEvent, useUiEvent } from '../../hooks';
+import { CreateMessageHook, SendMessageHook } from '../../hooks/messages/message-event';
 import { mergeFurniFragments } from './common/FurnitureUtilities';
 import { mergePetFragments } from './common/PetUtilities';
 import { TradeState } from './common/TradeState';
@@ -17,7 +20,7 @@ let petMsgFragments: Map<number, PetData>[] = null;
  
 export const InventoryMessageHandler: FC<InventoryMessageHandlerProps> = props =>
 {
-    const { dispatchFurnitureState = null, dispatchBotState = null, dispatchPetState = null, dispatchBadgeState = null, unseenTracker = null } = useInventoryContext();
+    const { dispatchFurnitureState = null, dispatchBotState = null, dispatchPetState = null, badgeState = null, dispatchBadgeState = null, unseenTracker = null } = useInventoryContext();
 
     const onFurnitureListAddOrUpdateEvent = useCallback((event: FurnitureListAddOrUpdateEvent) =>
     {
@@ -163,6 +166,18 @@ export const InventoryMessageHandler: FC<InventoryMessageHandlerProps> = props =
         });
     }, [ dispatchBadgeState ]);
 
+    const onBadgeReceivedEvent = useCallback((event: BadgeReceivedEvent) =>
+    {
+        const parser = event.getParser();
+
+        dispatchBadgeState({
+            type: InventoryBadgeActions.ADD_BADGE,
+            payload: {
+                badgeCode: parser.badgeCode
+            }
+        });
+    }, [ dispatchBadgeState ]);
+
     const onTradingAcceptEvent = useCallback((event: TradingAcceptEvent) =>
     {
         const parser = event.getParser();
@@ -318,6 +333,7 @@ export const InventoryMessageHandler: FC<InventoryMessageHandlerProps> = props =
     CreateMessageHook(PetRemovedFromInventory, onPetRemovedFromInventory);
     CreateMessageHook(PetAddedToInventoryEvent, onPetAddedToInventoryEvent);
     CreateMessageHook(BadgesEvent, onBadgesEvent);
+    CreateMessageHook(BadgeReceivedEvent, onBadgeReceivedEvent);
     CreateMessageHook(TradingAcceptEvent, onTradingAcceptEvent);
     CreateMessageHook(TradingCloseEvent, onTradingCloseEvent);
     CreateMessageHook(TradingCompletedEvent, onTradingCompletedEvent);
@@ -330,5 +346,19 @@ export const InventoryMessageHandler: FC<InventoryMessageHandlerProps> = props =
     CreateMessageHook(TradingYouAreNotAllowedEvent, onTradingYouAreNotAllowedEvent);
     CreateMessageHook(UnseenItemsEvent, onUnseenItemsEvent);
 
+    const onInventoryBadgesRequestEvent = useCallback((event: InventoryBadgesRequestEvent) =>
+    {
+        if(badgeState.needsBadgeUpdate)
+        {
+            SendMessageHook(new RequestBadgesComposer());
+
+            return;
+        }
+
+        dispatchUiEvent(new InventoryBadgesUpdatedEvent(InventoryBadgesUpdatedEvent.BADGES_UPDATED, badgeState.badges));
+    }, [ badgeState ])
+
+    useUiEvent(InventoryBadgesRequestEvent.REQUEST_BADGES, onInventoryBadgesRequestEvent);
+
     return null;
 }

src/views/inventory/InventoryView.tsx

@@ -1,10 +1,10 @@
 import { IRoomSession, RoomEngineObjectEvent, RoomEngineObjectPlacedEvent, RoomPreviewer, RoomSessionEvent, TradingCancelComposer, TradingCloseComposer, TradingOpenComposer } from 'nitro-renderer';
 import { FC, useCallback, useEffect, useReducer, useState } from 'react';
 import { GetRoomEngine } from '../../api';
-import { InventoryEvent, InventoryTradeRequestEvent } from '../../events';
+import { InventoryBadgesUpdatedEvent, InventoryEvent, InventoryTradeRequestEvent } from '../../events';
 import { useRoomEngineEvent } from '../../hooks/events/nitro/room/room-engine-event';
 import { useRoomSessionManagerEvent } from '../../hooks/events/nitro/session/room-session-manager-event';
-import { useUiEvent } from '../../hooks/events/ui/ui-event';
+import { dispatchUiEvent, useUiEvent } from '../../hooks/events/ui/ui-event';
 import { SendMessageHook } from '../../hooks/messages';
 import { NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, NitroCardTabsView, NitroCardView } from '../../layout';
 import { LocalizeText } from '../../utils/LocalizeText';
@@ -186,6 +186,13 @@ export const InventoryView: FC<InventoryViewProps> = props =>
         }
     }, [ furnitureState.tradeData, isVisible ]);
 
+    useEffect(() =>
+    {
+        if(!badgeState.badges) return;
+        
+        dispatchUiEvent(new InventoryBadgesUpdatedEvent(InventoryBadgesUpdatedEvent.BADGES_UPDATED, badgeState.badges));
+    }, [ badgeState.badges ]);
+
     return (
         <InventoryContextProvider value={ { furnitureState, dispatchFurnitureState, botState, dispatchBotState, petState, dispatchPetState, badgeState, dispatchBadgeState, unseenTracker } }>
             <InventoryMessageHandler />

src/views/inventory/reducers/InventoryBadgeReducer.tsx

@@ -23,11 +23,12 @@ export interface IInventoryBadgeAction
 
 export class InventoryBadgeActions
 {
-    public static SET_NEEDS_UPDATE: string = 'IBDA_SET_NEEDS_UPDATE';
+    public static SET_NEEDS_UPDATE: string = 'IBA_SET_NEEDS_UPDATE';
-    public static SET_BADGE: string = 'IBDA_SET_BADGE';
+    public static SET_BADGE: string = 'IBA_SET_BADGE';
-    public static SET_BADGES: string = 'IBDA_SET_BADGES';
+    public static SET_BADGES: string = 'IBA_SET_BADGES';
-    public static ADD_ACTIVE_BADGE: string = 'IBDA_ADD_ACTIVE_BADGE';
+    public static ADD_BADGE: string = 'IBA_ADD_BADGE';
-    public static REMOVE_ACTIVE_BADGE: string = 'IBDA_REMOVE_ACTIVE_BADGE';
+    public static ADD_ACTIVE_BADGE: string = 'IBA_ADD_ACTIVE_BADGE';
+    public static REMOVE_ACTIVE_BADGE: string = 'IBA_REMOVE_ACTIVE_BADGE';
 }
 
 export const initialInventoryBadge: IInventoryBadgeState = {
@@ -77,6 +78,14 @@ export const InventoryBadgeReducer: Reducer<IInventoryBadgeState, IInventoryBadg
 
             return { ...state, badges, activeBadges };
         }
+        case InventoryBadgeActions.ADD_BADGE: {
+            const badges = [ ...state.badges ];
+            const badge = (action.payload.badgeCode);
+
+            if(badges.indexOf(badge) === -1) badges.push(badge);
+
+            return { ...state, badges };
+        }
         case InventoryBadgeActions.ADD_ACTIVE_BADGE: {
             const badgeCode = action.payload.badgeCode;
 

src/views/inventory/views/badge/InventoryBadgeView.tsx

@@ -19,6 +19,7 @@ export const InventoryBadgeView: FC<InventoryBadgeViewProps> = props =>
     {
         if(needsBadgeUpdate)
         {
+            console.log('yee')
             dispatchBadgeState({
                 type: InventoryBadgeActions.SET_NEEDS_UPDATE,
                 payload: {

src/views/navigator/NavigatorView.tsx

@@ -1,6 +1,7 @@
 import { ILinkEventTracker, NavigatorInitComposer, NavigatorSearchComposer, RoomSessionEvent } from 'nitro-renderer';
 import { FC, useCallback, useEffect, useReducer, useState } from 'react';
 import { AddEventLinkTracker, RemoveLinkEventTracker } from '../../api';
+import { TryVisitRoom } from '../../api/navigator/TryVisitRoom';
 import { NavigatorEvent } from '../../events';
 import { useRoomSessionManagerEvent } from '../../hooks/events/nitro/session/room-session-manager-event';
 import { useUiEvent } from '../../hooks/events/ui/ui-event';
@@ -93,7 +94,7 @@ export const NavigatorView: FC<NavigatorViewProps> = props =>
                         default: {
                             const roomId = parseInt(parts[2]);
 
-                            //if(roomId > 0) this.goToPrivateRoom(roomId);
+                            TryVisitRoom(roomId);
                         }
                     }
                 }
@@ -105,7 +106,7 @@ export const NavigatorView: FC<NavigatorViewProps> = props =>
     {
         const linkTracker: ILinkEventTracker = {
             linkReceived,
-            eventUrlPrefix: 'navigator'
+            eventUrlPrefix: 'navigator/'
         };
 
         AddEventLinkTracker(linkTracker);