path: root/src/renderer/gameserver/server.ts

import GameServerProfile from './profile';
import { shell } from 'electron';
import { switchPage } from '../CustomEvents';


export default class GameServer {
  constructor(
    public profile:GameServerProfile,
    public menuName:string,
    public name:string,
    public shortDescription:string,// the server in 1-2 sentences
    public newsFeed:string,
    public backgrounds:{isVideo:boolean,file:string}[],
    public icon:string,
    public socialLinks:socialLink[]
  ){}

  getMenuEntry():HTMLElement{
    const sidebarItem = document.createElement('div');
    sidebarItem.classList.add("sidebarItem");

    //Title
    const title = document.createElement('div');
    title.classList.add("title");

    const titleIMG = document.createElement('img');
    titleIMG.src = `./media/server/${this.icon}`;

    const titleText = document.createElement('div');
    titleText.innerText = this.menuName;

    title.appendChild(titleIMG);
    title.appendChild(titleText);

    title.addEventListener('click', ()=>{
      switchPage("SERVER",this.name);
    });

    sidebarItem.appendChild(title);
    //Collapsable
    const container = document.createElement('div');
    container.classList.add("colapse");

    const info = document.createElement('div');
    info.innerHTML = '<i class="fas fa-info fa-fw"></i>Information';
    container.appendChild(info);

    info.addEventListener('click', ()=>{
      switchPage("SERVER",this.name);
    });

    const news = document.createElement('div');
    news.innerHTML = '<i class="far fa-newspaper fa-fw"></i>News';
    if(this.newsFeed && this.newsFeed!==null){
      news.addEventListener('click', ()=>{
        switchPage("SERVER",this.name,"NEWS");
      });
    } else {
      news.hidden = true;
    }

    container.appendChild(news);

    const preferences = document.createElement('div');
    preferences.innerHTML = '<i class="fas fa-sliders-h fa-fw"></i>Preferences';
    preferences.addEventListener('click', ()=>{
      switchPage("SERVER",this.name,"PREF");
    });
    container.appendChild(preferences);

    sidebarItem.appendChild(container);
    //event Target / interactivity
    const events = document.createElement('span');
    events.classList.add("switch-page-event");
    events.addEventListener("site-changed", (event:CustomEvent)=>{
      sidebarItem.classList.remove("selected");
      info.classList.remove("selected");
      news.classList.remove("selected");
      preferences.classList.remove("selected");
      if(event.detail.sitetype === "SERVER" && event.detail.page === this.name){
        sidebarItem.classList.add("selected");
        if(event.detail.subPage === "NEWS") {
          news.classList.add("selected");
        } else if(event.detail.subPage === "PREF") {
          preferences.classList.add("selected");
        } else {
          info.classList.add("selected");
        }
      }
    });

    sidebarItem.appendChild(events);
    return sidebarItem;
  }

  getPage(type:string):HTMLElement{
    const page = document.createElement('div');
    if (typeof(type) === undefined || type == null){
      page.appendChild(this.getInfoPage());
    } else {
      const content = document.createElement('div');
      content.classList.add("unknownServerPage");
      content.innerText = `Unknown page for${this.name}`;
      page.appendChild(content);
    }
    return page;
  }

  private getInfoPage():HTMLElement{
    const content = document.createElement('div');
    content.classList.add("infoServerPage");

    const title = document.createElement('div');
    title.classList.add("title");
    title.innerText = this.name;
    content.appendChild(title);

    const shrtDsrption = document.createElement('div');
    shrtDsrption.classList.add("shortDescription");
    shrtDsrption.innerText = this.shortDescription;
    content.appendChild(shrtDsrption);

    return content;
  }
}

export class socialLink {
  constructor(
    public icon:string,// has to be one from font awesome -https://fontawesome.com/icons
    public tooltip:string,
    public url:string
  ){}

  getHTML():HTMLElement{
    //<button onclick="sv.openSocialLink(this)" socialLink="abc"><i class="fa fa-user"></i></button><br>
    const element = document.createElement('button');
    element.onclick = this.open;
    element.innerHTML = `<i class="${this.icon}"></i>`;
    element.title = this.tooltip;
    return element;
  }

  open(){
      if(this.url)
        shell.openExternal(this.url.indexOf("://")!==-1?this.url:`https://${this.url}`);
  }
}