Impact

This forum is read only and just serves as an archive. If you have any questions, please post them on github.com/phoboslab/impact

7 years ago by bitmapshades

So far I'm unable to resolve how to invoke the draw() function from my player inventory class and display the panel which would be the ideal solution.

So now I'm doing the drawing using my HUD entity I wrote, but I'm having issues trying to simplify drawing inventory slots from this which is quite verbose:

// hud.js
drawItemSlot: function(string){
    ig.system.context.beginPath();
    
    switch(string){
        case('head'):
            ig.system.context.rect(this.slots.head.x, this.slots.head.y, this.slots.head.w, this.slots.head.h);
            break;
        case('chest'):
            ig.system.context.rect(this.slots.chest.x, this.slots.chest.y, this.slots.chest.w, this.slots.chest.h);
            break;
        case('weapon'):
            ig.system.context.rect(this.slots.weapon.x, this.slots.weapon.y, this.slots.weapon.w, this.slots.weapon.h);
            break;
        case('comms'):
            ig.system.context.rect(this.slots.chest.x, this.slots.chest.y, this.slots.chest.w, this.slots.chest.h);
            break;
    }
    
    ig.system.context.closePath();
    ig.system.context.fill();
},

to the following which is cleaner but throws an object undefined error in the console. The console traces the object props fine though.

// generates an error when passing an object in from a function called 
drawItemSlot: function(slot){
  ig.system.context.beginPath();
  ig.system.context.rect(slot.x, slot.y. slot.w, slot.h);
  ig.system.context.closePath();
  ig.system.context.fill();
},

7 years ago by StuartTresadern

Any Chance you can show the code you are using to call this function.

7 years ago by bitmapshades

Hi Stuart some more of that code to put it in context..

// hud.js function header stuff..

init: function( x, y, settings ) {
  this.parent( x, y, settings );
  this.name = 'hud';
  
  // Equip slots
  this.slotsize = 50;
  this.slots.offset = {x: 10, y: 70};

  this.slots.head = {x: ig.system.width - (this.slotsize * 2 + 20),
                      y: 10,
                      w: this.slotsize,
                      h: this.slotsize};

  this.slots.chest = {x: ig.system.width - (this.slotsize * 2 + 20),
                      y: this.slots.offset.y,
                      w: this.slotsize,
                      h: this.slotsize};

  this.slots.weapon = {x: ig.system.width - (this.slotsize * 3 + 30),
                      y: this.slots.offset.y,
                      w: this.slotsize,
                      h: this.slotsize};

  this.slots.comms = {x: ig.system.width - (this.slotsize + 10),
                      y: this.slots.offset.y,
                      w: this.slotsize,
                      h: this.slotsize};
},

draw: function(){
  this.parent();
  
  var player = ig.game.player;
  if(player){
    this.inventory();
  }
},

// generates an error when passing an object in from inventory()  function
drawItemSlot: function(slot){
  ig.system.context.beginPath();
  ig.system.context.rect(slot.x, slot.y. slot.w, slot.h);
  ig.system.context.closePath();
  ig.system.context.fill();
},

inventory: function(){
  var x = ig.system.width/2,
    y = 0,
    w = ig.system.width/2,
    h = ig.system.height,
    slotFill = 'rgb(60,60,60)',
    equipSlotStroke = 'rgb(0,125,125)',
    slotStroke = 'rgb(0,0,0)';
  
    if(ig.game.inventory.show){
        // Draw panel
        ig.system.context.fillStyle = 'rgba(125,125,125,0.9)';
        ig.system.context.strokeStyle = equipSlotStroke;
        ig.system.context.beginPath();
        ig.system.context.rect(x, y, w, h);
        ig.system.context.closePath();
        ig.system.context.fill();
        ig.system.context.stroke();
        ig.game.font.draw('Inventory', x + 10, y + 10);
        ig.system.context.fillStyle = slotFill;
  
        // Equip slots
        this.drawItemSlot('head');
        this.drawItemSlot('chest');
        this.drawItemSlot('weapon');
        this.drawItemSlot('comms');
  
    }
},

7 years ago by StuartTresadern

Syntax error in the drw rect: dot instead of comma.

 ig.system.context.rect(slot.x, slot.y, slot.w, slot.h);


Are These not the objects you want to pass in !

        // Equip slots
        this.drawItemSlot(this.slots.head);
        this.drawItemSlot(this.slots.chest);
        this.drawItemSlot(this.slots.weapon);
        this.drawItemSlot(this.slots.comms);

7 years ago by bitmapshades

Yes those are the objects I want to pass in. I'll check whether I introduced that error while copying across the edited version of that script.

7 years ago by bitmapshades

Good shout thanks for spotting that!

7 years ago by bitmapshades

Cool my inventory class can be called from my HUD entity so the inventory class can handles all its logic from there.
Page 1 of 1
« first « previous next › last »