function RoleCard(id, type) {
  this.id = id;
  this.type = type;
  this.isNew = true;

  this.setToNew = function() {
    this.drawSmallAt("role" + this.id);
    document.getElementById("role" + this.id).style.cursor = "pointer";
    this.isNew = true;
  }

  this.setToUsed = function() {
    this.drawGrayAt("role" + this.id);
    document.getElementById("role" + this.id).style.cursor = "default";
    this.isNew = false;
  }

  this.drawSmallAt = function(docId) {
    document.getElementById(docId).childNodes[0].src = "images/roles/" + this.type + "_sm.jpg";
  }

  this.drawGrayAt = function(docId) {
    document.getElementById(docId).childNodes[0].src = "images/roles/" + this.type + "_gray.jpg";
  }

  this.showLarge = function() {
    document.getElementById("largePic").childNodes[0].src = "images/roles/" + this.type + "_lg.jpg";
    document.getElementById("largePic").style.visibility = "visible";
  }

  this.hideLarge = function() {
    document.getElementById("largePic").style.visibility = "hidden";
  }
}



function resetRoles() {
  for (var i=0; i<roles.length; i++) {
    roles[i].setToNew();
  }
}