import Tone from 'tone'
import StartAudioContext from './startAudioContext'

const isIphone = (navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))
const isIpad = (navigator.userAgent.match(/iPad/i))
const isAndroid = (navigator.userAgent.match(/Android/i))
const isMobile = isIphone || isIpad || isAndroid
const isDesktop = ! isMobile

document.body.classList.add(isMobile ? 'mobile' : 'desktop')

const browser = { isIphone, isIpad, isMobile, isDesktop }

function clamp(n,a,b){ return n<a?a:n<b?n:b }
function choice (a){ return a[ Math.floor(Math.random() * a.length) ] }
function mod(n,m){ return n-(m * Math.floor(n/m)) }
function randint(n){ return (Math.random()*n)|0 }
function randrange(a,b){ return a + Math.random() * (b-a) }
function randsign(){ return Math.random() >= 0.5 ? -1 : 1 }

function requestAudioContext (fn) {
	if (isMobile) {
    const container = document.createElement('div')
    const button = document.createElement('div')
    button.innerHTML = 'Tap to start - please unmute your phone'
    Object.assign(container.style, {
			display: 'block',
      position: 'absolute',
      width: '100%',
      height: '100%',
      zIndex: '10000',
      top: '0px',
      left: '0px',
      backgroundColor: 'rgba(0, 0, 0, 0.8)',
    })
		Object.assign(button.style, {
			display: 'block',
		  position: 'absolute',
		  left: '50%',
		  top: '50%',
			padding: '20px',
		  backgroundColor: '#7F33ED',
		  color: 'white',
		  fontFamily: 'monospace',
		  borderRadius: '3px',
		  transform: 'translate3D(-50%,-50%,0)',
		  textAlign: 'center',
			lineHeight: '1.5',
			width: '150px',
    })
    container.appendChild(button)
    document.body.appendChild(container)
    StartAudioContext.setContext(Tone.context)
    StartAudioContext.on(button)
    StartAudioContext.onStarted(_ => {
      container.remove()
			fn()
  	})
	} else {
		fn()
	}
}

export {
  choice, mod, clamp,
  randint, randrange, randsign,
  browser, requestAudioContext,
}