function rand_in_range(from, to) {
  
  const rand = Math.floor(Math.random() * (to - from + 1)) + from
  const is_neg = Math.random() < 0.5

  return is_neg ? -rand : rand
}



function shuffle_cards() {

  const cards = document.querySelectorAll('.card')
  const random_index = Math.floor(Math.random() * cards.length);

  cards.forEach((card, index) => {
    if (index == random_index) {
      card.classList.add('active')
      card.style.zIndex = '1'
      card.style.transform = `none`
    } else {
      card.classList.remove('active')
      card.style.zIndex = 'auto'
      card.style.transform = `rotate(${rand_in_range(2,5)}deg) translate(${rand_in_range(2,5)}px, ${rand_in_range(2,5)}px)`
    }
  })

}

document.querySelectorAll('.button_shuffle_cards').forEach((item, index) => {
  item.addEventListener('click', (e) => {
    shuffle_cards()
  })
  if (index == 0) 
    shuffle_cards()
})


// Choose language confirmation button
document.querySelectorAll('#confirm_btn').forEach((confirm_btn) => {
  confirm_btn.addEventListener('click', (e) => {    
    window.location.href = '/' + document.getElementById('language_select').value
  })
})

// Copy link to clipboard
document.querySelectorAll('[data-share-url]').forEach((share_btn) => {  
  share_btn.addEventListener('click', (e) => {        
    navigator.clipboard.writeText(e.currentTarget.getAttribute('data-share-url'))
    alert('URL copied to clipboard!')
  })
})

// Open all external links in ny tab
for (const link of document.links) {
  if (link.hostname.replace(/^www\./i, "") != window.location.hostname.replace(/^www\./i, "") && (link.protocol == 'https:' || link.protocol == 'http:'))
    link.target = '_blank'
}


const input_range = document.getElementsByClassName('reveal')[0]
const max_value = 200
const speed = 12

var curr_value
var raf_id

if (input_range) {
  input_range.min = 0;
  input_range.max = max_value;
}
    
function unlockStartHandler() {
  window.cancelAnimationFrame(raf_id);    
  curr_value = +this.value;
}

function unlockEndHandler() {    
  curr_value = +this.value;
    
  if (curr_value >= this.max) {    
    
    const card = document.querySelector('.card.active')
    window.location.href = card.parentNode.getAttribute('href')
    
    // reset 
    this.value = 0;
    this.closest('.reveal__container').style.setProperty('--opacity', 1);
  } else {
    raf_id = window.requestAnimationFrame(animateHandler);
  }
}

// handle range animation
function animateHandler() {
    
  input_range.value = curr_value;
  input_range.closest('.reveal__container').style.setProperty('--opacity', 1 - (input_range.value/input_range.max));
  
  // continue?
  if (curr_value > -1) {
    window.requestAnimationFrame(animateHandler);   
  }
  
  // decrement
  curr_value = curr_value - speed;
}

if (input_range) {
  input_range.addEventListener('mousedown', unlockStartHandler, false)
  input_range.addEventListener('mousestart', unlockStartHandler, false)
  input_range.addEventListener('mouseup', unlockEndHandler, false)
  input_range.addEventListener('touchend', unlockEndHandler, false)

  input_range.addEventListener("input", (e) => {
    e.currentTarget.closest('.reveal__container').style.setProperty('--opacity', 1 - (e.currentTarget.value/e.currentTarget.max))
  }) 
}