HeroEngine Forums
Welcome, Guest. Please login or Register for HeroCloud Account.

Author Topic: Item system - pick up/put down  (Read 5385 times)

Thazager

  • General Accounts
  • *
  • Posts: 1160
  • Never stop learning
    • View Profile
Item system - pick up/put down
« on: Mar 20, 13, 09:47:18 PM »

Medium Scripting

This Item system uses pick up and put down instead of drag and drop. It uses a simpler method by creating slots with Icons already in them, but invisible. When the Icon is picked up, we make a MovePanel and add it to the mouse. When we place the Icon, we remove it from the mouse and set the texture into the Icon in the slot, then make it visible.

This will let you move items from 1 chest to the other and back. There are 5 chests and 2 random items per chest. The chests can be moved around with drag. Right click will open/close chest, left click will pick up / put down item. (With the swap, you need to click on the item, and not the slot behind it or it will remove the old item in that slot. One way to fix this is by making the backgrounds of items solid rather than transparent.)
(Not the HE Item system)

In the DOM, create a new (client side) class

name = TMP_Chest
archtype = guicontrol
add a parent to the class, _GUIBaseWindow

click open script

In new (client side) script TMP_Chest

Code: [Select]
// init value
shared function start()
  var win = getChestClass()
  if win != None
    DestroyNode( win )
  .
  win = CreateNodeFromPrototype( "TMP_Chest" )
  win.build = true
  win.owner = 0

  addSlots(win)
  addItems(win)
.

// make a few chests
// this is for showing how it might be done
// your players might buy them
public function MakeChests()
  win as NodeRef of Class TMP_Chest

  loop i from 1 to 5
    win = CreateNodeFromPrototype( "TMP_Chest" )
    win.build = true
    win.owner = 0
    win.name = "Chest"+i
    win.position.x = (win.size.x * i) + 100

    addSlots(win)
    addItems(win)
  .
.

// put slots in chest
function addSlots(win as NodeRef of Class TMP_Chest)
  inside as NodeRef of Class GUIControl = FindGUIControlByName(win, "inside")
  slot as NodeRef of Class GUIControl
  num as Integer

  // 2 columns of 5
  loop i from 1 to 10 by 2
    slot = CreateNodeFromPrototype("TMP_ChestSlot")   // col 1
    slot.build = true
    slot.name = "slot"+i
    slot.position.x = 0
    slot.position.y = (i-1) *20
    add back slot to inside.children

    slot = CreateNodeFromPrototype("TMP_ChestSlot")   // col 2
    slot.build = true
    num = i+1
    slot.name = "slot"+num
    slot.position.x = 40
    slot.position.y = (i-1) *20
    add back slot to inside.children
  .
.

// put in 2 items - testing
// again players miught buy these or find items
function addItems(win as NodeRef of Class TMP_Chest)
  inside as NodeRef of Class GUIControl = FindGUIControlByName(win, "inside")
  slots as String = "47"    // each digit is a slot location, if using 2 digits then read 2 digits

  loop i from 1 to 2
    slot as Integer = SubString(slots,i,1)      // reading 1 digit starting at i
    panel as NodeRef of Class GUIControl = FindGuiControlByName(inside, "slot"+slot)

    // random pics from texture sheet
    picX as Integer = (RandomInteger(1, 10) -1) * 96
    picY as Integer = (RandomInteger(1, 5) -1) * 128

    // create item
    icon as NodeRef of Class TMP_Icon = FindGuiControlByName(panel, "IconPic")
    icon.visible = true
    icon.defaultStatePresentation.position.x = picX   // get picture location
    icon.defaultStatePresentation.position.y = picY
    icon.hoverStatePresentation.position.x = picX
    icon.hoverStatePresentation.position.y = picY
  .
.

// mouse click left/right on chest and item/slot
method onMouseDown(args references Class GUIMouseEvent)
  target as NodeRef of Class GUIControl = args.source
  name as String = subString(target.name,1,4)

  if args.leftButton      // place/grab item with left click  ===================================
    when target.name
      is "IconPic"
        var movIcon = TMP_IconClassMethods:getHeldIcon()
        if movIcon = None
          TMP_IconClassMethods:pullOutItem(target)    // just grab icon
        else
          TMP_IconClassMethods:SwapItem(target)       // swap icon with held icon
        .
      .
    .
    when name
      is "slot"
        var movIcon = TMP_IconClassMethods:getHeldIcon()
        if movIcon <> None
          TMP_IconClassMethods:putItemHere(target)    // place icon in slot
        .
      .
    .
  .
  if args.rightButton     // open/close chest when right click  ================================
    when target.name
      is "outside"        // outside going in
        openChest()
      .
      is "inside"         // inside going out
        closeChest()
      .
    .
    when name
      is "slot"           // inside going out
        closeChest()
      .
    .
  .
.

//======================================================================================================
// get main class
public function getChestClass() as NodeRef of Class TMP_Chest
  win as NodeRef of Class TMP_Chest = FindGUIControlByName(None, "game.TMP_Chest")
  return win
.

// show inside
function openChest()
  over as NodeRef of Class GUIControl = GetGUIControlUnderMouse()
  parent as NodeRef of Class TMP_Chest = over.rootParent()
  inside as NodeRef of Class GUIControl = FindGUIControlByName(parent, "inside")
  outside as NodeRef of Class GUIControl = FindGUIControlByName(parent, "outside")

  outside.visible = false
  inside.visible = true
  parent.size.x = 84
  parent.size.y = 206
.

// show outside
function closeChest()
  over as NodeRef of Class GUIControl = GetGUIControlUnderMouse()
  parent as NodeRef of Class TMP_Chest = over.rootParent()
  inside as NodeRef of Class GUIControl = FindGUIControlByName(parent, "inside")
  outside as NodeRef of Class GUIControl = FindGUIControlByName(parent, "outside")

  outside.visible = true
  inside.visible = false
  parent.size.x = 96
  parent.size.y = 125
.


Create new XML script TMP_Chest

Code: [Select]
<createControlType inheritFrom='_movePanel' class='TMP_Chest' type='TMP_Chest' description='chest for items' treePath='CleanEngine' name="TMP_Chest" texture="\GUI\inventory_v3.dds" layer="game" allowTitlebar="false" allowCloseButton="false" allowDragging="false" resizeable="ALL" scrollable="VERTICAL" allowHelpButton="false" allowMinimizeButton="false">
  <position x="300" y="300"/>
  <size x="96" y="125"/>
  <defaultStatePresentation>
    <position x="9" y="315"/>
    <size x="282" y="323"/>
  </defaultStatePresentation>
  <_panel name="outside" dockMode="FILL" texture="\GUI\tempIventoryIcons.dds" ignoreMouseEvents="false">
    <size x="96" y="125"/>
    <defaultStatePresentation>
      <position x="768" y="252"/>
      <size x="96" y="125"/>
    </defaultStatePresentation>
  </_panel>
  <_panel name="inside" visible="false" ignoreMouseEvents="false">
    <size x="84" y="206"/>
    <defaultStatePresentation>
      <color a="0"/>
    </defaultStatePresentation>
  </_panel>
</createControlType>

//========================================================
// this is the same class and script from Icon system

In the DOM, create a new (client side) class

name = TMP_Icon
archtype = guicontrol
add a parent to the class, GUIMovePanel

click open script

In new (client side) script TMP_Icon

Code: [Select]
// items that go in the slots

// set pointer to item on mouse
public function getHeldIcon() as NodeRef of Class TMP_Icon
  movIcon as NodeRef of Class TMP_Icon = FindGUIControlByName(None, "cinematics.icon")
  return movIcon
.

// grab the item
public function grabItem(over as NodeRef of Class GUIControl)
  var movIcon = getHeldIcon()
  var mouse = GetMousePosition()

  if movIcon <> None
    destroynode(movIcon)
  .
  movIcon = CreateNodeFromPrototype("TMP_Icon")
  movIcon.build = true
  movIcon.name = "icon"
  movIcon.layer = "cinematics"
  movIcon.size = over.size
  movIcon.texture = over.texture
  movIcon.tooltip = over.tooltip
  movIcon.position.x = mouse.x
  movIcon.position.y = mouse.y
  movIcon.defaultStatePresentation = over.defaultStatePresentation
  movIcon.hoverStatePresentation = over.hoverStatePresentation

  DragNDrop:StartDragging(movIcon)
  MakeHud()
.

// grab the item and remove from slot
public function pullOutItem(over as NodeRef of Class GUIControl)
  grabItem(over)
  over.visible = false                         // make it not seen
  MakeHud()
.

// put item here - turn on the picture
// over = slot
public function putItemHere(over as NodeRef of Class GUIControl)
  var movIcon = getHeldIcon()
  Icon as NodeRef of Class TMP_Icon = FindGuiControlByName(over, "IconPic")

  if Icon <> None
    Icon.visible = true                         // make it seen
    Icon.tooltip = movIcon.tooltip
    Icon.texture = movIcon.texture
    Icon.defaultStatePresentation = movIcon.defaultStatePresentation
    Icon.hoverStatePresentation = movIcon.hoverStatePresentation

    destroynode(movIcon)  // remove held Icon
    RemoveHud()
  .
.

// exchange the held Icon for the current in place
// over = IconPic
public function SwapItem(over as NodeRef of Class TMP_Icon)
  var movIcon = getHeldIcon()
  temp as NodeRef of Class TMP_Icon = createNodeFromPrototype("TMP_Icon")

  if movIcon <> None        // no swap if not holding Icon
   // save our current Icon
    temp.tooltip = over.tooltip
    temp.texture = over.texture
    temp.defaultStatePresentation = over.defaultStatePresentation
    temp.hoverStatePresentation = over.hoverStatePresentation

    //set in new Icon
    over.tooltip = movIcon.tooltip
    over.texture = movIcon.texture
    over.defaultStatePresentation = movIcon.defaultStatePresentation
    over.hoverStatePresentation = movIcon.hoverStatePresentation

    // set saved in mouse
    movIcon.tooltip = temp.tooltip
    movIcon.texture = temp.texture
    movIcon.defaultStatePresentation = temp.defaultStatePresentation
    movIcon.hoverStatePresentation = temp.hoverStatePresentation
  .
  destroynode(temp)  // remove temp node
.

// make hud when picking up item
public function MakeHud()
  hud as NodeRef of Class GUIControl = FindGUIControlByName(None, "default.TMP_hud")
  if hud = None
    hud = CreateNodeFromPrototype("TMP_hud")
    hud.build = true
  .
.

// remove the hud after dropping item
public function RemoveHud()
  hud as NodeRef of Class GUIControl = FindGUIControlByName(None, "default.TMP_hud")
  if hud <> None
    destroynode(hud)
  .
.


Create new XML script TMP_Icon

Code: [Select]
<createControlType class='TMP_Icon' type='TMP_Icon' description='' treePath='' name="TMP_Icon" texture="\GUI\tempIventoryIcons.dds">
  <size x="40" y="40"/>
  <defaultStatePresentation>
    <size x="96" y="128"/>
  </defaultStatePresentation>
  <hoverStatePresentation>
    <size x="96" y="128"/>
  </hoverStatePresentation>
</createControlType>

//========================================================

In the DOM, create a new (client side) class

name = TMP_ChestSlot
archtype = guicontrol
add a parent to the class, GUIPanel

// no script

Create new XML script TMP_ChestSlot

Code: [Select]
<createControlType inheritFrom='_panel' type='TMP_ChestSlot' description='slots for items' treePath='CleanEngine' name="TMP_ChestSlot" texture="\GUI\inventory_v3.dds" ignoreMouseEvents="false">
  <size x="40" y="40"/>
  <defaultStatePresentation>
    <position x="652" y="138"/>
    <size x="56" y="73"/>
  </defaultStatePresentation>
  <TMP_Icon name="IconPic" visible="false"/>
</createControlType>

//========================================================

Create new XML script TMP_hud

Code: [Select]
<createControlType inheritFrom='_panel' type='TMP_hud' description='' treePath='CleanEngine' name="TMP_hud" dockMode="FILL">
  <size x="1035" y="715"/>
  <defaultStatePresentation>
    <color r="0" g="0" a="0.100000001"/>
  </defaultStatePresentation>
</createControlType>

//========================================================

In (client side) script E_PlayerAccountClassMethods under the chatwindow

Code: [Select]
        TMP_ChestClassMethods:MakeChests()

« Last Edit: Oct 02, 14, 08:16:22 PM by Thazager »
Logged
Lead scripter for EO, Repop helper.
HSL Video tutorials:
https://community.heroengine.com/forums/index.php/topic,1719.msg36858.html#msg3685

Viper155

  • World Owners
  • ****
  • Posts: 73
    • View Profile
Re: DragNDrop Item system
« Reply #1 on: Apr 08, 13, 03:18:19 PM »

would this be a good start for a basic inventory system?
Logged

Thazager

  • General Accounts
  • *
  • Posts: 1160
  • Never stop learning
    • View Profile
Re: DragNDrop Item system
« Reply #2 on: Apr 08, 13, 03:46:24 PM »

It is most likely different from the one HE or HJref has, but it is the one we have.
Logged
Lead scripter for EO, Repop helper.
HSL Video tutorials:
https://community.heroengine.com/forums/index.php/topic,1719.msg36858.html#msg3685

Viper155

  • World Owners
  • ****
  • Posts: 73
    • View Profile
Re: DragNDrop Item system
« Reply #3 on: May 05, 13, 05:32:01 PM »

I think my server was acting up, resolved this issue.
« Last Edit: May 05, 13, 09:51:19 PM by Viper155 »
Logged

Thazager

  • General Accounts
  • *
  • Posts: 1160
  • Never stop learning
    • View Profile
Re: DragNDrop Item system
« Reply #4 on: May 05, 13, 06:52:10 PM »

Did you get this class in? There are a few GUIs being made along with a few DOM entrys.

In the DOM, create a new (clientside) class
name = TMP_ChestSlot
archtype = guicontrol
add a parent to the class, _GUIIcon
Logged
Lead scripter for EO, Repop helper.
HSL Video tutorials:
https://community.heroengine.com/forums/index.php/topic,1719.msg36858.html#msg3685

Viper155

  • World Owners
  • ****
  • Posts: 73
    • View Profile
Re: DragNDrop Item system
« Reply #5 on: May 05, 13, 07:09:04 PM »

Resolved this
« Last Edit: May 05, 13, 09:45:12 PM by Viper155 »
Logged

Viper155

  • World Owners
  • ****
  • Posts: 73
    • View Profile
Re: DragNDrop Item system
« Reply #6 on: May 05, 13, 07:18:14 PM »

Having a few issues.  The picture below shows the first chest(Left) the way that it loads when I start the game.  The chest on the right is what it looks like when I right click it. 

I can pick up 1 item but I cannot place it back into any chest.



« Last Edit: May 05, 13, 09:49:01 PM by Viper155 »
Logged

Thazager

  • General Accounts
  • *
  • Posts: 1160
  • Never stop learning
    • View Profile
Re: DragNDrop Item system
« Reply #7 on: May 06, 13, 01:01:37 AM »

It looks like it is missing the texture. Did you set in the texture part? To actually place the item in chest, a 2nd left click is needed. Unlike the icon which just drops into the right location, the item needs another click.

In the properties section of TMP_Chest
set texture to    \GUI\inventory_v3.dds
set pos to 300, 300
set size to 96, 125
set defaultStatePresentation  color to 1,1,1,0      // transparent
         pos to 9, 315
         size to 282, 323
set allowmove to true
Logged
Lead scripter for EO, Repop helper.
HSL Video tutorials:
https://community.heroengine.com/forums/index.php/topic,1719.msg36858.html#msg3685

Viper155

  • World Owners
  • ****
  • Posts: 73
    • View Profile
Re: DragNDrop Item system
« Reply #8 on: May 06, 13, 10:36:17 AM »

Quote
It looks like it is missing the texture. Did you set in the texture part?

I have that setup correctly. 

Quote
Unlike the icon which just drops into the right location, the item needs another click.

I believe I have tried everything to get it to drop back down into a chest.

When I first load up they both look like the picture on the left(above), I was just showing you what happens to them when I right click it.  I'm not sure what the closed texture is suppose to look like but it wont open back up either.

Here is my GUI structure for chest 1 and chest 2, maybe I set it up wrong.


Logged

Thazager

  • General Accounts
  • *
  • Posts: 1160
  • Never stop learning
    • View Profile
Re: DragNDrop Item system
« Reply #9 on: May 06, 13, 07:55:35 PM »

Sorry, I see that part is missing from the tutorial.

 add in \GUI\tempIventoryIcons.dds to outside panel texture.

also a missing script file TMP_ItemClassMethods
This looks like the missing part to drop the item.

Code: [Select]

method _AllowIconDragAway(icon as NodeRef of Class _GUIIcon) as Boolean
  return true
.

// checks for GUIs under mouse
method onMouseMove(args references Class GUIMouseEvent)
  over as NodeRef of Class GUIControl = GetGUIControlUnderMouse()
  if over <> None
//    println("I am over: (item)" + over.name)
  .
.


updated.
« Last Edit: May 06, 13, 08:02:10 PM by Thazager »
Logged
Lead scripter for EO, Repop helper.
HSL Video tutorials:
https://community.heroengine.com/forums/index.php/topic,1719.msg36858.html#msg3685

Viper155

  • World Owners
  • ****
  • Posts: 73
    • View Profile
Re: DragNDrop Item system
« Reply #10 on: May 06, 13, 11:16:23 PM »

Still no luck, but I can see the chests now!

Sent you a pm if you feel like checking it out.
Logged

Thazager

  • General Accounts
  • *
  • Posts: 1160
  • Never stop learning
    • View Profile
Re: DragNDrop Item system
« Reply #11 on: May 07, 13, 02:02:59 AM »

Ok, found and fixed. Adding it to the tutorial.

updated.
It was missing a field setting - ignoreMouseEvents = false in 3 places.
« Last Edit: May 07, 13, 02:12:33 AM by Thazager »
Logged
Lead scripter for EO, Repop helper.
HSL Video tutorials:
https://community.heroengine.com/forums/index.php/topic,1719.msg36858.html#msg3685