import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { PlotConfig, PlotRequest, PlotResponse, RenderOptions } from './plot.service';

@Injectable({
  providedIn: 'root'
})
export class DashboardService {

  constructor(private http: HttpClient) { }

  createDashboard(data: DashboardCreationData): Observable<Dashboard>{
    return this.http.post<Dashboard>('//'+window.location.hostname+':'+window.location.port+'/api/dashboards/', data);
  }

  getDashboards(): Observable<DashboardList>{
    return this.http.get<DashboardList>('//'+window.location.hostname+':'+window.location.port+'/api/dashboards/');
  }

  getDashboard(id: string): Observable<Dashboard>{
    return this.http.get<Dashboard>('//'+window.location.hostname+':'+window.location.port+'/api/dashboards/'+id);
  }

  saveDashboard(dashboard: Dashboard): Observable<Dashboard>{
    return this.http.put<Dashboard>('//'+window.location.hostname+':'+window.location.port+'/api/dashboards/'+dashboard.id, dashboard);
  }

  deleteDashboard(id: string): Observable<void> {
    return this.http.delete<void>('//'+window.location.hostname+':'+window.location.port+'/api/dashboards/'+id);
  }
}


export class DashboardCreationData{
  constructor(public name: string, public description: string){}
}

export interface HasId {
  id: string;
}

export class Dashboard{
  constructor(
    public id: string, 
    public name: string, 
    public description: string, 
    public texts: TextWidget[], 
    public plots: PlotWidget[],
    public arrangement: string[][]){}
}

export class DashboardList{
  constructor(public dashboards: [Dashboard]){}
}

export abstract class BaseWidget implements HasId {
  constructor(public id: string, public type: PlotType, public size: PlotSize) {}
}

export class TextWidget  extends BaseWidget {
  constructor(override id: string, override size: PlotSize, public text: string) {
    super(id, 'TEXT', size);
  }
}
export class PlotWidget extends BaseWidget {
  constructor(override id: string, override size: 'SMALL'|'MEDIUM'|'LARGE', public config: PlotConfig) {
    super(id, 'PLOT', size);
  }

  public static createPlotRequest(widget: PlotWidget, submitterId: string): PlotRequest {
    
    const height = this.height(widget.size);
    const width  = this.width(widget.size);

    const fullWidth = window.innerWidth-30; 
    const fullHeight = window.innerHeight-30;

    const request = new PlotRequest(
      submitterId,
      widget.config, 
      {
        'main': new RenderOptions(height,width, false, true),
        'fullScreen': new RenderOptions(fullHeight,fullWidth, false, true)
      }
    );
    return request;
  }


  static height(size: PlotSize): number{
    switch (size) {
      case 'SMALL':
        return 300;
      case 'MEDIUM':
        return 400;
      case 'LARGE':
        return 600;
    }
  }
  static width(size: PlotSize): number{
    switch (size) {
      case 'SMALL':
        return 400;
      case 'MEDIUM':
        return 600;
      case 'LARGE':
        return 900;
    }
  }
}

export type PlotSize = 'SMALL'|'MEDIUM'|'LARGE';

export type PlotType = 'TEXT'|'PLOT';

export class PlotWidgetRenderData  {
  public isAborted = false;
  public error: string|boolean = false;
  constructor(public widget: PlotWidget, public submitterId: string, public plotResponse?: PlotResponse) {
  }
}

export class WidgetDimensions{
  constructor(public width: number, public height: number){}
}