/* global alert */

class Screen {
  constructor () {
    this._el = document.createElement('canvas')
    this.resize()
    this._gl = this._el.getContext('webgl', { alpha: false })

    if (!this._gl) {
      alert('Your machine or browser does not support WebGL!')
      return
    }

    this.loadExtensions()
    document.body.appendChild(this._el)
  }

  get gl () {
    return this._gl
  }

  get ctx () {
    return this._gl
  }

  resize () {
    this._el.width = window.innerWidth
    this._el.height = window.innerHeight
  }

  loadExtensions () {
    // this._gl.drawBuffers = this._gl.getExtension('WEBGL_draw_buffers')
    this._gl.getExtension('WEBGL_depth_texture')
    this._gl.getExtension('OES_texture_float')
  }

  get width () {
    return this._el.width
  }

  get height () {
    return this._el.height
  }

  get aspectRatio () {
    return this.width / this.height
  }
}

export default new Screen()
