Object Playground

index.html

<div id="output"></div>

Object Playground.markdown

Object Playground

Playground for NPC(non-player character)<->PC(player character) interaction.

A Pen by V on CodePen.

License.

script.babel

function xpReward(){
  this.xpReward = () => {return (this.base * 2 * (this.level+1) * this.damage);};
}
function levelUp(){
  this.levelUp = () => {
    this.level += 1;
    this.hp = this.base * 2 * (this.level+1);
    this.damage = this.base * (this.level+1);
  };
}
function protoNPC(name, lvl){
  this.name = name;
  this.level = lvl;
  this.base = 5;
  this.hp = this.base * 2 * (this.level+1);
  this.damage = this.base * (this.level+1);
  xpReward.call(this);
  levelUp.call(this);
}
protoNPC.prototype.attack = function(){
  output.append('action: npc attacks and deals '+this.damage+' points of damage<br>');
}
protoNPC.prototype.takeDamage = function(dmg){
  this.hp = this.hp - dmg;
  output.append('action: npc is attacked and takes '+dmg+' points of damage, hp left: '+this.hp+'<br>');
}

function gainXP(){
  this.gainXP = (reward) => {
    this.xp += reward;
    if (this.xp >= this.nextLevel){
      this.level += 1;
      this.nextLevel = this.base * 2 * (this.level+1);
      if (this.xp >= this.nextLevel){
        this.level += 1;
        this.nextLevel = this.base * 2 * (this.level+1);
      }
    }
    this.hp = this.base * 2 * (this.level+1);
    this.damage = this.base * (this.level+1);
  };
}
function protoPC(name, lvl){
  this.name = name;
  this.level = lvl;
  this.base = 50;
  this.xp = 0;
  this.nextLevel = this.base * 2 * (this.level+1);
  this.hp = this.base * 2 * (this.level+1);
  this.damage = this.base * (this.level+1);
  gainXP.call(this);
}
var warrior = new protoPC('Player Character',0);
var warriorKeys = Object.keys(warrior);

var lesserSpawn = new protoNPC('Lesser Spawn',0);
var keys = Object.keys(lesserSpawn);

var output = $('#output');

setTimeout(function(){
  lesserSpawn.attack();
  setTimeout(function(){
    lesserSpawn.takeDamage(3);
    setTimeout(function(){
      output.append('<br>If a Lesser Spawn is not killed...<br>');
      for (var i in keys) output.append(keys[i]+': '+lesserSpawn[keys[i]]+'<br>');
      setTimeout(function(){
        output.append('<hr id="1">...it will invoke a levelled up Lesser Respawn to help battle the warior.<br>');
        setTimeout(function(){
          var lesserRespawn = new Object(lesserSpawn);
          lesserRespawn.name = 'Lesser Respawn';
          lesserRespawn.levelUp();
          keys = Object.keys(lesserRespawn);
          for (var i in keys) output.append(keys[i]+': '+lesserRespawn[keys[i]]+'<br>');
          $(window).scrollTop($('#1').offset().top);
          setTimeout(function(){
            output.append('<hr id="2">');
            lesserSpawn.attack();
            lesserSpawn.takeDamage(warrior.damage);
            output.append('<br>If a warrior kills a spawn...<br>');
            for (var i in warriorKeys) output.append(warriorKeys[i]+': '+warrior[warriorKeys[i]]+'<br>');
            $(window).scrollTop($('#2').offset().top);
            setTimeout(function(){
              output.append('<hr id="3">...the warrior will be rewarded with proper amount of XP: '+lesserSpawn.xpReward()+'<br>');
              warrior.gainXP(lesserSpawn.xpReward());
              for (var i in warriorKeys) output.append(warriorKeys[i]+': '+warrior[warriorKeys[i]]+'<br>');
              $(window).scrollTop($('#3').offset().top);
            },1500);
          },1500);
        },1500);
      },1500);
    },1500);
  },1500);
},1500);

scripts

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>