import * as PIXI from 'pixi.js' ; import FD from '../core/factorioData' ; import G from '../common/globals' ; import F from './controls/functions' ; import { Dialog } from './controls/Dialog' ; import { Button } from './controls/Button' ; import { colors , styles } from './style' ; /** Inventory Dialog - Displayed to the user if there is a need to select an item */ export class InventoryDialog extends Dialog { /** Container for Inventory Group Buttons */ private readonly m_InventoryGroups : PIXI . Container ; /** Container for Inventory Group Items */ private readonly m_InventoryItems : PIXI . Container ; /** Text for Recipe Tooltip */ private readonly m_RecipeLabel : PIXI . Text ; /** Container for Recipe Tooltip */ private readonly m_RecipeContainer : PIXI . Container ; /** Hovered item for item pointerout check */ private m_hoveredItem : string ; public constructor ( title = 'Inventory' , itemsFilter ? , selectedCallBack ? ) { super ( 404 , 442 , title ) ; this . m_InventoryGroups = new PIXI . Container ( ) ; this . m_InventoryGroups . position . set ( 12 , 46 ) ; this . addChild ( this . m_InventoryGroups ) ; this . m_InventoryItems = new PIXI . Container ( ) ; this . m_InventoryItems . position . set ( 12 , 126 ) ; this . addChild ( this . m_InventoryItems ) ; let groupIndex = 0 ; for ( const group of FD . inventoryLayout ) { if ( group . name === 'creative' && itemsFilter !== undefined ) { continue ; } const inventoryGroupItems = new PIXI . Container ( ) ; let itemColIndex = 0 ; let itemRowIndex = 0 ; for ( const subgroup of group . subgroups ) { let subgroupHasItems = false ; for ( const item of subgroup . items ) { if ( itemsFilter === undefined ) { const itemData = FD . items [ item . name ] ; if ( ! itemData ) continue ; if ( ! itemData . place_result && ! itemData . place_as_tile ) continue ; if ( itemData . place_result && ! FD . entities [ itemData . place_result ] ) continue ; } else { if ( ! itemsFilter . includes ( item . name ) ) continue ; } if ( itemColIndex === 10 ) { itemColIndex = 0 ; itemRowIndex += 1 ; } const button = new Button ( 36 , 36 ) ; button . position . set ( itemColIndex * 38 , itemRowIndex * 38 ) ; button . content = F . CreateIcon ( item . name ) ; button . on ( 'pointerdown' , ( e ) => { e . stopPropagation ( ) ; if ( e . data . button === 0 ) { selectedCallBack ( item . name ) ; this . close ( ) ; } } ) ; button . on ( 'pointerover' , ( ) => { this . m_hoveredItem = item . name ; this . updateRecipeVisualization ( item . name ) ; } ) ; button . on ( 'pointerout' , ( ) => { if ( this . m_hoveredItem === item . name ) { this . m_hoveredItem = undefined ; this . updateRecipeVisualization ( undefined ) ; } } ) ; inventoryGroupItems . addChild ( button ) ; itemColIndex += 1 ; subgroupHasItems = true ; } if ( subgroupHasItems ) { itemRowIndex += 1 ; itemColIndex = 0 ; } } if ( inventoryGroupItems . children . length > 0 ) { inventoryGroupItems . visible = groupIndex === 0 ; this . m_InventoryItems . addChild ( inventoryGroupItems ) ; const button = new Button ( 68 , 68 , 3 ) ; button . active = groupIndex === 0 ; button . position . set ( groupIndex * 70 , 0 ) ; button . content = F . CreateIcon ( group . name , group . name === 'creative' ? 32 : 64 ) ; button . data = inventoryGroupItems ; button . on ( 'pointerdown' , ( e ) => { if ( e . data . button === 0 ) { if ( ! button . active ) { for ( const inventoryGroup of this . m_InventoryGroups . children as Button [ ] ) { inventoryGroup . active = inventoryGroup === button ; } } const buttonData = button . data as PIXI . Container ; if ( ! buttonData . visible ) { for ( const inventoryGroupItems of this . m_InventoryItems . children as PIXI . Container [ ] ) { inventoryGroupItems . visible = inventoryGroupItems === buttonData ; inventoryGroupItems . interactiveChildren = inventoryGroupItems === buttonData ; } } } } ) ; this . m_InventoryGroups . addChild ( button ) ; groupIndex += 1 ; } } const recipePanel = new PIXI . Container ( ) ; recipePanel . position . set ( 0 , 442 ) ; this . addChild ( recipePanel ) ; const recipeBackground = F . DrawRectangle ( 404 , 78 , colors . dialog . background . color , colors . dialog . background . alpha , colors . dialog . background . border ) ; recipeBackground . position . set ( 0 , 0 ) ; recipePanel . addChild ( recipeBackground ) ; this . m_RecipeLabel = new PIXI . Text ( '' , styles . dialog . label ) ; this . m_RecipeLabel . position . set ( 12 , 10 ) ; recipePanel . addChild ( this . m_RecipeLabel ) ; this . m_RecipeContainer = new PIXI . Container ( ) ; this . m_RecipeContainer . position . set ( 12 , 36 ) ; recipePanel . addChild ( this . m_RecipeContainer ) ; } /** Override automatically set position of dialog due to additional area for recipe */ protected setPosition ( ) { this . position . set ( G . app . screen . width / 2 - this . width / 2 , G . app . screen . height / 2 - 520 / 2 ) ; } /** Update recipe visulaization */ private updateRecipeVisualization ( recipeName ? ) { this . m_RecipeLabel . text = undefined ; this . m_RecipeContainer . removeChildren ( ) ; if ( recipeName === undefined ) return ; const item = FD . items [ recipeName ] ; if ( item && item . subgroup === 'creative' ) { this . m_RecipeLabel . text = `[CREATIVE] - ${ item . localised_name }` ; } const recipe = FD . recipes [ recipeName ] ; if ( recipe === undefined ) return ; this . m_RecipeLabel . text = recipe . localised_name ; F . CreateRecipe ( this . m_RecipeContainer , 0 , 0 , recipe . ingredients , recipe . results , recipe . time ) ; } }