const iframe = document.getElementById('iframe'),
  config = {"games":["bonanza","wild_patrick"],"token":"b4d96919-84da-40ed-9116-b17fca30bdd5","operator":"dreamPlay"},
  gamesListData = document.getElementById('games_list'),
  inputGamesList = document.getElementById('gamesList'),
  openGameButton = document.getElementById('open_game'),
  // reloadGameButton = document.getElementById('reload_game'),
  rotateGameButton = document.getElementById('rotate_game'),
  fullscreenGameButton = document.getElementById('fullscreen_game'),
  // resendCheatButton = document.getElementById('resend_cheat'),
  newTabGameButton = document.getElementById('new_tab_game'),
  gameWrapper = document.getElementById('game_wrapper'),
  // getCheatsListButton = document.getElementById('get_cheats_list'),
  inputCheatsList = document.getElementById('cheatsList'),
  cheatsListData = document.getElementById('cheats_list'),
  cheatToCustomButton = document.getElementById('cheat_to_custom'),
  inputCustomCheat = document.getElementById('custom_cheat'),
  clearCustomCheatButton = document.getElementById('clear_custom_cheat'),
  setCheatRemoteButton = document.getElementById('set_cheat_remote'),
  getCurrentCheatButton = document.getElementById('get_current_cheat'),
  clearCurrentCheatButton = document.getElementById('clear_current_cheat'),
  currentCheatField = document.getElementById('current_cheat_field'),
  newBalanceField = document.getElementById('new_balance'),
  newBalanceButton = document.getElementById('set_new_balance')

newBalanceField.onchange = e => {
  if (isDisable(e.currentTarget)) {
    newBalanceField.value = ''
    return
  }
  newBalanceField.value ? enable(newBalanceButton) : disable(newBalanceButton)
}
newBalanceButton.onclick = e => {
  if (isDisable(e.currentTarget) || !newBalanceField.value) {
    return
  }
  request(`${window.location.href}user/balance?value=${newBalanceField.value}&token=${config.token}`, 'GET')
    .then(data => {
      console.log(`balance update- value:${newBalanceField.value} success:${data.success}`)
      newBalanceField.value = ''
    })
}

let cheatsMap = {}

if (localStorage.getItem('token')) {
  request(`${window.location.href}token?value=${localStorage.getItem('token')}`, 'GET')
    .then(data => data.value ?
      (config.token = localStorage.getItem('token')) :
      localStorage.setItem('token', config.token))
}
else {
  localStorage.setItem('token', config.token)
}

function disable(view) {
  view.classList.contains('disabled') || view.classList.add('disabled')
}
function enable(view) {
  view.classList.contains('disabled') && view.classList.remove('disabled')
}
function isDisable(view) {
  return view.classList.contains('disabled')
}

config.games.forEach(gameName => {
  const el = document.createElement('option')
  el.value = gameName
  gamesListData.append(el)
})

let currentGame = ''
inputGamesList.onchange = e => {
  if (isDisable(e.currentTarget)) {
    // todo mb new game open
    e.currentTarget.value = currentGame
    return
  }
  currentGame = e.currentTarget.value
  if (config.games.includes(currentGame)) {
    enable(openGameButton)
    enable(newTabGameButton)
  }
  else {
    disable(openGameButton)
    disable(newTabGameButton)
    e.currentTarget.value = currentGame = ''
  }
}
inputGamesList.onclick = e => { e.currentTarget.value = '' }

openGameButton.onclick = e => {
  if (isDisable(e.currentTarget)) {
    return
  }
  openGame()
  // disable(inputGamesList) //???
  disable(newTabGameButton)
}

fullscreenGameButton.onclick = e => {
  if (isDisable(e.currentTarget)) {
    return
  }
  gameWrapper.classList.toggle('fullscreen')
}

rotateGameButton.onclick = e => {
  if(gameWrapper.classList.contains('port')) {
    gameWrapper.classList.remove('port')
  } else {
    gameWrapper.classList.add('port')
  }
}

newTabGameButton.onclick = e => {
  if (isDisable(e.currentTarget)) {
    return
  }
  window.open(getGameUrl())
}

function getGameUrl() {
  updateCheatsList()

  enable(getCurrentCheatButton)
  enable(inputCustomCheat)

  const backUrl = window.location.href.lastIndexOf('/') === window.location.href.length - 1 ?
    window.location.href.slice(0, window.location.href.length - 1) : window.location.href

  console.log(config)

  return `${window.location.href}${currentGame}?game=${currentGame}&token=${config.token}&backURL=${
    backUrl}&language=en&device=mobile&operatorName=${config.operator}&emulation=local&metadata=${config.metadata}`
}

function openGame() {
  iframe.src = getGameUrl()
}

inputCheatsList.onchange = e => {
  if (isDisable(e.currentTarget)) {
    e.currentTarget.value = ''
    return
  }
  if (cheatsMap[e.currentTarget.value]) {
    enable(cheatToCustomButton)
  }
  else {
    disable(cheatToCustomButton)
    e.currentTarget.value = ''
  }
}

inputCheatsList.onclick = e => { e.currentTarget.value = '' }

cheatToCustomButton.onclick = e => {
  inputCustomCheat.value = cheatsMap[inputCheatsList.value].join(',')
  inputCustomCheat.onchange({ currentTarget: inputCustomCheat })
}

inputCustomCheat.onchange = e => {
  if (isDisable(e.currentTarget)) {
    e.currentTarget.value = ''
    return
  }
  const values = e.currentTarget.value.split(',')
    .filter(val => val && (parseInt(val) || parseInt(val) === 0))
    .map(val => parseInt(val))
  e.currentTarget.value = values.join(',')
  values.length ?
    (enable(setCheatRemoteButton), enable(clearCustomCheatButton)) :
    (disable(setCheatRemoteButton), disable(clearCustomCheatButton))
}

setCheatRemoteButton.onclick = e => {
  const values = inputCustomCheat.value.split(',')
    .filter(val => val && (parseInt(val) || parseInt(val) === 0))
    .map(val => parseInt(val))

  values.length && currentGame && request(`${window.location.href}cheats/set?game=${currentGame}&token=${
    config.token}&values=${JSON.stringify(values)}`, 'GET')
    .then(data => {
      if(data.success) {
        enable(getCurrentCheatButton)
        getCurrentCheatButton.onclick()
      }
    })
}

clearCustomCheatButton.onclick = e => {
  inputCustomCheat.value = ''
  inputCustomCheat.onchange({ currentTarget: inputCustomCheat })
}

getCurrentCheatButton.onclick = e => {
  !isDisable(getCurrentCheatButton) && currentGame &&
    request(`${window.location.href}cheats/get?game=${currentGame}&token=${config.token}`, 'GET')
    .then(data => {
      currentCheatField.innerText = data.value.join(',')
      data.value.length ?
        enable(clearCurrentCheatButton) :
        (disable(clearCurrentCheatButton), disable(getCurrentCheatButton))
    })
}

clearCurrentCheatButton.onclick = e => {
  currentGame && request(`${window.location.href}cheats/clear?game=${currentGame}&token=${config.token}`, 'GET')
    .then(data => {
      if(data.success) {
        currentCheatField.innerText = ''
        disable(getCurrentCheatButton)
        disable(clearCurrentCheatButton)
      }
    })
}

function updateCheatsList() {
  request(`${window.location.href}cheats/list?game=${currentGame}`, 'GET')
    .then(data => {
      if (data.data) {
        cheatsMap = data.data
        Object.keys(data.data).length ?
          enable(inputCheatsList) :
          disable(inputCheatsList)
        Object.entries(data.data).forEach(([key, value]) => {
          const el = document.createElement('option')
          el.value = key
          cheatsListData.append(el)
        })
      }
    })
}

async function request(url, method = 'POST', body, addHeaders = {}) {
  return new Promise(resolve => {
    const headers = Object.assign({
      'Accept': 'application/json',
      'Content-Type': 'application/json',
      // 'x-session-id': 'ababagalamaga',
    }, addHeaders)
    fetch(url, {
      method,
      headers,
      body,
    })
      .then(response =>
        response.headers.has('content-type') ?
          response.headers.get('content-type').includes('application/json') ?
            response.json() :
            response :
          response,
      )
      .then(resolve, () => resolve(false))
  })
}