git.plutz.net Git - flarejs/blob - engine.js

   1 function Mob(textdef) {
   2   this.direction = 0;
   3   this.position = [0, 0];
   4   this.info = gamedata[textdef];
   5   this.animation = "stance";
   6   this.previous_animation = "";
   7   this.frametime = performance.now();
   8   this.image = document.querySelector("img[src='"+ this.info.image +"']");
   9
  10   this.place = function(x, y) { this.position = [x, y]; return this; }
  11   this.direct = function(d) { this.direction = d % 8; return this; }
  12   this.animate = function(a) {
  13     this.previous_animation = this.animation;
  14     this.animation = a;
  15     this.frametime = performance.now();
  16     return this;
  17   }
  18
  19   this.draw = function(){
  20     var f, a = this.info[this.animation];
  21     var frame = ( performance.now() - this.frametime ) * a.frames.length / a.duration | 0;
  22
  23     switch(a.type){
  24       case "looped":
  25         frame = frame % a.frames.length;
  26         break;
  27       case "play_once":
  28         if ( frame >= a.frames.length ){
  29           this.animation = this.previous_animation;
  30           this.previous_animation = "";
  31           this.frametime = performance.now();
  32           a = this.info[this.animation];
  33           frame = 0;
  34         }
  35         break;
  36       case "back_forth":
  37         frame = frame % (a.frames.length * 2 - 2);
  38         if ( frame >= a.frames.length ){
  39          frame = a.frames.length - frame % a.frames.length - 1;
  40         }
  41         break;
  42       default: break;
  43     }
  44     f = a.frames[frame][this.direction];
  45
  46     canvas.drawImage(this.image, f[0], f[1], f[2], f[3],
  47                      this.position[0] - f[4], this.position[1] - f[5],
  48                      f[2], f[3]);
  49
  50   // var fetch = new XMLHttpRequest();
  51   // fetch.open("GET", textdef, false); fetch.send();
  52   // this.description = fetch.responseText.split('\n');
  53   }
  54 }
  55
  56 function Player(gender = "female", hair = "short"){
  57   // this.head  = new Mob("/animations/avatar/"+gender+"/head_short.txt")
  58   // this.chest = new Mob("/animations/avatar/"+gender+"/default_chest.txt")
  59   // this.hands = new Mob("/animations/avatar/"+gender+"/default_hands.txt")
  60   // this.legs  = new Mob("/animations/avatar/"+gender+"/default_legs.txt")
  61   // this.feet  = new Mob("/animations/avatar/"+gender+"/default_feet.txt")
  62   this.limbs = [
  63     (gender == "female")?new Mob("/animations/avatar/female/head_long.txt"):new Mob("/animations/avatar/male/head_"+hair+".txt"),
  64     new Mob("/animations/avatar/"+gender+"/default_chest.txt"),
  65     new Mob("/animations/avatar/"+gender+"/default_hands.txt"),
  66     new Mob("/animations/avatar/"+gender+"/default_legs.txt"),
  67     new Mob("/animations/avatar/"+gender+"/default_feet.txt")
  68   ]
  69
  70   this.place   = function(x,y){ this.limbs.forEach(limb => limb.place(x,y));   return this; }
  71   this.direct  = function(x,y){ this.limbs.forEach(limb => limb.direct(x,y));  return this; }
  72   this.animate = function(x,y){ this.limbs.forEach(limb => limb.animate(x,y)); return this; }
  73   this.draw    = function(x,y){ this.limbs.forEach(limb => limb.draw(x,y));    return this; }
  74 }
  75
  76 canvas = document.getElementById("view").getContext("2d");
  77 // player = new Mob("/animations/avatar/male/clothes.txt");
  78 player = new Player().place(240, 160).direct(5);
  79
  80 setInterval( function() { canvas.clearRect(0,0, 480, 320); player.draw(); }, 50);