Clicky Hud (GUI)

[[email protected]]

//#CLIENTSIDE
function onCreated() {
    //How many bars there are... [in order]
  if (client.hud_barsactive == null) {
    client.hud_barsorder = {"hp", "armor", "weapon", "money", "time"};
    client.hud_barsactive = {1, 1, 1, 1, 1};
    client.inv_trans = 1;
  }
  this.onDisplay();
}

function onDisplay() {
  temp.ix = 5;
  temp.iy = 5;
  
  hideimgs(200, 300);
  this.buttons = {};
  for (temp.i = 0; temp.i < client.hud_barsorder.size(); temp.i++) {   
    temp.active = getRowByID(i);
    
    temp.img = showimg(201 + i, "era_gui_line2.png", ix, iy + (i * 16));
    temp.img.layer = 4;
    temp.img.partx = 0; temp.img.party = 0;
    temp.img.partw = (active? 112: 13); temp.img.parth = 16;
    temp.img.alpha = 1;    

    if (active) {
      this.("onDraw" @ getNameByID(i))({ix, iy + (i * 16)});
      this.buttons.add({i, {ix + 12, iy + (i * 16)}, {112, 12}, "row"}); 
    }
    
    temp.text = (active? "-":"+");
    temp.img = showtext(210 + i, ix + 4, iy + (i * 16), "Arial", "b", temp.text);
    temp.img.layer = 4;
    temp.img.zoom = (active? 0.75:0.7);
    
    this.buttons.add({i, {ix, iy + (i * 16)}, {16, 16}});
  }
}

function drawBars(bar) {
  temp.img = showimg(bar[0], "era_gui_hpbars.png", bar[1][0], bar[1][1]);
  temp.img.layer = 5;
  temp.img.partw = 66; temp.img.parth = 10; 
  
  temp.img = showimg(bar[0] + 1, "era_gui_hpbars.png", bar[1][0], bar[1][1]);
  temp.img.layer = 6;
  temp.img.partw = bar[2][0]; temp.img.parth = 10;
  temp.img.party = bar[2][1];
}

function onDrawHP(pos) {
  temp.img = showtext(230, temp.pos[0] + 43, temp.pos[1] + 1, "Arial", "b", "HP:" @ max(0, clientr.hp) @ "/" @ clientr.hpmax);
  temp.img.layer = 7; temp.img.zoom = 0.6;
  temp.img.alpha = 0.6;

  temp.img = showimg(231, "era_gui_symbols.png", temp.pos[0] + 15, temp.pos[1] + 1); 
  temp.img.layer = 6;  temp.img.partx = (level.nopkzone? 16: 0);
  temp.img.partw = 16; temp.img.parth = 16;
 
  this.drawBars({232, {pos[0] + 35, pos[1] + 3}, {max(1, roundTo((clientr.hp / clientr.hpmax) * 66, 10)), 10}});
}

function onDrawArmor(pos) {
  temp.img = showtext(240, temp.pos[0] + 43, temp.pos[1] + 1, "Arial", "b", "Armor:" @ max(0, clientr.armor) @ "/" @ max(0, clientr.armormax));
  temp.img.layer = 7; temp.img.zoom = 0.6;
  temp.img.alpha = 0.6;

  temp.img = showimg(241, "era_gui_symbols.png", temp.pos[0] + 15, temp.pos[1] + 1); 
  temp.img.layer = 26;  temp.img.partx = 32;
  temp.img.partw = 16; temp.img.parth = 16;

  this.drawBars({242, {pos[0] + 35, pos[1] + 3}, {max(1, roundTo((clientr.armor / clientr.armormax) * 66, 10)), 40}});
}

function onDrawMoney(pos) {
  temp.img = showtext(250, temp.pos[0] + 43, temp.pos[1] + 1, "Arial", "b", "$" @ player.rupees);
  temp.img.layer = 7; temp.img.zoom = 0.6;
  temp.img.alpha = 0.6;

  temp.img = showimg(251, "era_gui_symbols.png", temp.pos[0] + 15, temp.pos[1] + 1); 
  temp.img.layer = 26;  temp.img.partx = 64;
  temp.img.partw = 16; temp.img.parth = 16;
}

function onDrawTime(pos) {
  if (!getRowByName("time")) return false;

  temp.cHours = int(hours);
  if (cHours >= 12) cHours -= 12;
  if (cHours == 0) cHours = 12;

  //Replace the £ with the percentage sign
  temp.cTime = int(cHours / 10) @ int(cHours £ 10) @ ":" @ int(mins / 10) @ int(mins £ 10);
  
  cTime = cTime SPC (hours >= 12? "PM":"AM");

  temp.img = showtext(260, temp.pos[0] + 43, temp.pos[1] + 1, "Arial", "b", cTime);
  temp.img.layer = 7; temp.img.zoom = 0.6;
  temp.img.alpha = 0.6;

  temp.img = showimg(261, "era_gui_symbols.png", temp.pos[0] + 15, temp.pos[1] + 1); 
  temp.img.layer = 26;  temp.img.partx = 48;
  temp.img.partw = 16; temp.img.parth = 16;
  
  cancelevents("DrawTime");
  scheduleevent(3, "DrawTime", {temp.pos});
}

function onDrawWeapon(pos) {
  temp.img = showimg(270, "era_gui_symbols.png", temp.pos[0] + 15, temp.pos[1] + 1); 
  temp.img.layer = 26;  temp.img.partx = 80;
  temp.img.partw = 16; temp.img.parth = 16;
}

function onMouseDown(click) {
  if (!(temp.click in {"right", "left"})) return false;
  
  temp.m = {mousescreenx, mousescreeny};
  for (temp.i: this.buttons) {
    if (m[0] in |i[1][0], i[1][0] + i[2][0]| && m[1] in |i[1][1], i[1][1] + i[2][1]|) {
      if (click == "right") {
        client.inv_trans -= 0.2;
        if (client.inv_trans < 0) client.inv_trans = 1; 
        this.onDisplay();
        break;
      }
      if (i[3] == null) {
        this.onToggleRow(i[0]);
        this.onDisplay();
        break;
      } else {
        if (mousebuttons > 0) {
          this.data = i;
          setTimer(0.05);
        }
      }
    }
  }
}

function onTimeout() {
  temp.i = this.data;
  if (mousescreeny in |i[1][1] + i[2][1], i[1][1] + (i[2][1] * 2)|) {
    if (i[0] == (client.hud_barsorder.size() - 1)) return false;
            
    temp.index = client.hud_barsorder.index(getNameByID(i[0]));
    temp.data = client.hud_barsorder[temp.index + 1];
            
    temp.copy = client.hud_barsorder;
    temp.copy.replace(index, data);
    temp.copy.replace(index + 1, getNameByID(i[0]));
    client.hud_barsorder = temp.copy;
            
    this.data = {i[0] + 1, {i[1][0], i[1][1] + 16}, {112, 12}, "row"};
    this.onDisplay();
  }
   else 
  if (mousescreeny in |i[1][1] - (i[2][1] + 12), i[1][1] - i[2][1]|) {
    if (i[0] == 0) return false;
            
    temp.index = client.hud_barsorder.index(getNameByID(i[0]));
    temp.data = client.hud_barsorder[temp.index-1];
           
    temp.copy = client.hud_barsorder;
    temp.copy.replace(index, data);
    temp.copy.replace(index - 1, getNameByID(i[0]));
    client.hud_barsorder = temp.copy;

    this.data = {i[0] - 1, {i[1][0], i[1][1] - 16}, {112, 12}, "row"};            
    this.onDisplay();
  }
  if (mousebuttons > 0) setTimer(0.05);
}

function onToggleRow(flag) {
  client.hud_barsactive[temp.flag] = !client.hud_barsactive[temp.flag];
}

function getRowByName(flag) {
  return client.hud_barsactive[client.hud_barsorder.index(temp.flag)];
}

function getRowByID(flag) {
  return client.hud_barsactive[temp.flag];
}

function getNameByID(flag) {
  return client.hud_barsorder[temp.flag];
}

function roundTo(val, place) {
  return int(temp.val / temp.place + 0.5) * temp.place;
}

function onUpdateVariable(temp.varName) {
  if (!(varName in {"hp", "hpmax", "armor", "armormax"}))
    return false;
    
  this.onCreated();
}

I designed this for Era Dev, but it was never used. Here's the HUD

[cbk1994]

I'd like to point out that since these images are being used by Era currently and in the future, you're going to have to make your own graphics if you use this.

Also, the script looks okay, but I would add a way to update a single bar without updating the entire interface.

[Samposse]

I will Edit those Image / make my own but im just testing the scrit whit Era's image to see it the Script self works .. and it dont wher do i put it in and is it a GUI system ?

[Switch]

Originally Posted by Samposse

I will Edit those Image / make my own but im just testing the scrit whit Era's image to see it the Script self works .. and it dont wher do i put it in and is it a GUI system ?

Put it in a weapon named something like "-System/HUD" and make sure you have the weapon. Also, "Replace the £ with the percentage sign"

[Samposse]

Originally Posted by Switch

Replace the £ with the percentage sign

????
i dont know what to do or where that is ... may you just Post me the Script Complete ?
whit that Replace the £ with the percentage sign done ?

plz