webmc/src/client/module/InventoryBar.js at dde4de85500f823c01d3d71fdc8adeacff208f68 · ghzhost/webmc · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
// Generated by CoffeeScript 2.5.1
var InventoryBar;

InventoryBar = class InventoryBar {
  constructor(options) {
    this.boxSize = options.boxSize;
    this.div = options.div;
    this.padding = options.padding;
    this.boxes = 9;
    this.activeBox = 1;
    document.querySelector(this.div).style = `position:fixed;bottom:50px;left:50%;width:${(this.boxSize + 2) * this.boxes}px;margin-left:-${this.boxSize * this.boxes / 2}px;height:${this.boxSize}px;`;
  }

  setBox(number, imageSrc) {
    if (imageSrc === null) {
      imageSrc = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=";
    }
    document.querySelector(`.inv_box_${number}`).src = imageSrc;
  }

  setFocus(number, state) {
    if (state) {
      document.querySelector(`.inv_box_${number}`).style.background = "rgba(0,0,0,0.7)";
      document.querySelector(`.inv_box_${number}`).style.border = "1px solid black";
    } else {
      document.querySelector(`.inv_box_${number}`).style.background = "rgba(54,54,54,0.5)";
      document.querySelector(`.inv_box_${number}`).style.border = "1px solid #363636";
    }
  }

  setFocusOnly(number) {
    var i, j, ref;
    for (i = j = 1, ref = this.boxes; (1 <= ref ? j <= ref : j >= ref); i = 1 <= ref ? ++j : --j) {
      this.setFocus(i, i === number);
    }
    this.activeBox = number;
    return this;
  }

  moveBoxMinus() {
    if (this.activeBox + 1 > this.boxes) {
      this.setFocusOnly(1);
    } else {
      this.setFocusOnly(this.activeBox + 1);
    }
  }

  moveBoxPlus() {
    if (this.activeBox - 1 === 0) {
      return this.setFocusOnly(this.boxes);
    } else {
      return this.setFocusOnly(this.activeBox - 1);
    }
  }

  directBoxChange(event) {
    var code;
    code = event.keyCode;
    if (code >= 49 && code < 49 + this.boxes) {
      return this.setFocusOnly(code - 48);
    }
  }

  setBoxes(images) {
    var i, j, ref;
    for (i = j = 0, ref = images.length - 1; (0 <= ref ? j <= ref : j >= ref); i = 0 <= ref ? ++j : --j) {
      this.setBox(i + 1, images[i]);
    }
    return this;
  }

  setHp(points) {
    var i, j, k, ref;
    for (i = j = 1; j <= 10; i = ++j) {
      document.querySelector(`.hp_${i}`).src = "assets/images/heart/black.png";
    }
    if (points !== 0) {
      for (i = k = 1, ref = (points + points % 2) / 2; (1 <= ref ? k <= ref : k >= ref); i = 1 <= ref ? ++k : --k) {
        document.querySelector(`.hp_${i}`).src = "assets/images/heart/red.png";
      }
      if (points % 2 === 1) {
        document.querySelector(`.hp_${(points + points % 2) / 2}`).src = "assets/images/heart/half.png";
      }
    }
  }

  setFood(points) {
    var i, j, k, ref;
    for (i = j = 1; j <= 10; i = ++j) {
      document.querySelector(`.food_${i}`).src = "assets/images/hunger/black.png";
    }
    if (points !== 0) {
      for (i = k = 1, ref = (points + points % 2) / 2; (1 <= ref ? k <= ref : k >= ref); i = 1 <= ref ? ++k : --k) {
        document.querySelector(`.food_${i}`).src = "assets/images/hunger/full.png";
      }
      if (points % 2 === 1) {
        document.querySelector(`.food_${(points + points % 2) / 2}`).src = "assets/images/hunger/half.png";
      }
    }
  }

  listen() {
    var _this;
    _this = this;
    $(window).on('wheel', function(event) {
      if (event.originalEvent.deltaY < 0) {
        return _this.moveBoxPlus();
      } else {
        return _this.moveBoxMinus();
      }
    });
    $(document).keydown(function(z) {
      return _this.directBoxChange(z);
    });
    return this;
  }

};

export {
  InventoryBar
};