class Role {

  constructor(json) {
    this.json = json;
    if (json.tag == 'payload-reference') {
      this.name = json['payload-label'];
    } else if (json.authorized) {
      this.name = json.authorized['dnf-terms'][0][0].var + ' (auth)';
    } else if (json.user) {
      this.name = json.user;
    } else if (json.tag) {
      this.name = json.tag + ' (tag)';
    } else {
      this.name = JSON.stringify(json);
    }
  }

  format() {
    return [document.createTextNode(this.name)];
  }
}

class Roles {
  constructor(json, roleName) {
    this.roleName = roleName
    this.anchor = json.anchor && new Anchor(json.anchor)
    this[roleName] = [];
    for (const role of json[roleName])
      this[roleName].push(new Role(role));
    this.comment = json.comment;
  }

  format() {
    var r = document.createElement('h4');
    var roles = document.createTextNode('Roles');
    r.appendChild(roles);
    var rolesList = document.createElement('ul');
    this[this.roleName].forEach(r => {
      var role = document.createElement('li');
      role.appendChild(document.createTextNode(r.name));
      rolesList.appendChild(role);
    });
    var result = [];
    if (this.comment.length > 0) {
      var c = document.createElement('h4');
      c.innerText = 'Comment';
      var comment = document.createElement('p');
      comment.innerText = this.comment.join(' ');
      result.push(c, comment);
    }
    if (this.anchor) {
      var a = document.createElement('h4');
      a.appendChild(this.anchor.format());
      result.push(a);
    } else result.push(r)
    result.push(rolesList);
    return result;
  }
}

class Viewers extends Roles {
  constructor(json) {
    super(json, 'viewers');
  }
}

class Actors extends Roles {
  constructor(json) {
    super(json, 'actors');
  }
}
class Anchor {
  constructor(json) {
    this.name = json.name;
    this.type = json.type;
  }

  format() {
    return document.createTextNode(`${this.type == 'alias' ? '*' : '&'}${this.name}`);
  }
}

class Message {

  constructor(json) {
    var content = json.content;
    this.fallback = content.fallback;
    this.fallbackLang = content['fallback-lang'];
    this.translations = content.translations;
    this.status = json.status;
    this.viewers = new Viewers(json.viewers);
    
  }

  format() {
    var v = document.createElement('h3');
    var viewers = document.createTextNode('Viewers');
    v.appendChild(viewers);
    var viewerList = this.viewers.format();
    var h = document.createElement('h3');
    var heading = document.createTextNode('Status');
    h.appendChild(heading);
    var p = document.createElement('p');
    var text = document.createTextNode(this.status);
    p.appendChild(text);
    var result = [v];
    result = result.concat(viewerList);
    result.push(h, p);
    h = document.createElement('h3');
    heading = document.createTextNode(this.fallbackLang);
    h.appendChild(heading);
    p = document.createElement('html');
    p.setAttribute('lang', this.fallbackLang);
    p.innerHTML = this.fallback;
    result.push(h, p);
    for (var t in this.translations) {
      h = document.createElement('h3');
      heading = document.createTextNode(t);
      h.appendChild(heading);
      p = document.createElement('html');
      p.setAttribute('lang', this.translations[t]);
      p.innerHTML = this.translations[t];
      result.push(h, p);
    }
    return result;
  }
}

class Payload {

  constructor(json) {
    this.fields = [];
    if (json === null) return;
    for (var f in json) {
      this.fields.push(f);
    }
  }

  format() {
    var fieldList = document.createElement('ul');
    this.fields.forEach(f => {
      var field = document.createElement('li');
      field.appendChild(document.createTextNode(f));
      fieldList.appendChild(field);
    });
    return [fieldList];
  }
}