import { toWon } from './util.currency.js'
import * as tagging from './util/tagging.js'

console.log('[Loaded] bts.purchase.js --1')

const searchParams = new URLSearchParams(window.location.search)
const pform = document.querySelector('#form-purchase')
export let currentTags

if (data) {
	currentTags = data.find(x => x.name == searchParams.get('product')).tags
	if (currentTags?.includes('delisted')) moveToProductPage('BTC1')

	setBanner(searchParams.get('product'), searchParams.get('strategy') ? 'new' : 'old') // 상단배너
	pform.querySelector('select[name=product_name]').value = searchParams.get('product') // 저금종류
	pform.min_cost.value = tagging.minCostFromTags(currentTags) // 최소금액
  pform.querySelectorAll('span.min_cost')
		.forEach(el => el.textContent = toWon(pform.min_cost.value))

	if (currentTags?.includes('smart')) displayAmountForSmartPygg() // 스마트 구간비율
	if (searchParams.get('strategy')) // 수확하기 섹션 show
		pform.querySelector('#section-strategy').classList.remove('hidden')
}

// Set banner to represent chosen product
function setBanner(product, version) {
  const productInfo = data.find(p => p.name == product)
	const { fullname } = productInfo

	if (version == 'new') {
		pform.querySelector('.banner-wrap').classList.add('hidden')
		pform.querySelector('ul li:first-child').classList.add('hidden')
		pform.querySelector('ul li:nth-child(2)').style.marginTop = '5rem'
		pform.querySelector('ul .gap').classList.add('hidden')
		pform.querySelector('img.product-img').src 
    	= `https://cdn.bitsaving.kr/img/bts.coinbank.${product}.png`
	} else { // old
		pform.querySelector('figcaption span').textContent = `${fullname} 저금통`
		pform.querySelector('figure img').src = `https://cdn.bitsaving.kr/img/bts.coinbank.${product}.png`
		pform.querySelector('figure').style.border = `1px solid var(--color-${product})`
		pform.querySelector('figure').style.backgroundColor = `var(--color-${product})`
		pform.querySelector('img.product-img').classList.add('hidden')
	}
}

// Reflow the page reflecting newly chosen product
function moveToProductPage(product) {
  const { tags, description } = data.find(p => p.name === product)
	const newSearchParams = new URLSearchParams({
		...Object.fromEntries(searchParams.entries()),
		product,
	})
	
  if (tags?.includes('smart')) {
		document.querySelector('#linkToSmartModal .modal-body span').textContent = description
		document.querySelector('#linkToSmartModal .btn-move').onclick = 
			() => window.location.href=`/purchase/intro?${decodeURIComponent(newSearchParams.toString())}`
		document.querySelector('.btn-option').click()
  } else {
    window.location.href = `/purchase/exchange?${decodeURIComponent(newSearchParams.toString())}`
  }
}
window.moveToProductPage = moveToProductPage

/* 
 * 스맛 구간비율에 따른 저금 금액을 계산합니다.
 * - 금액 인풋에서 onfocusout 할 때
 * - 금액 인풋 아래 버튼들을 클릭할 때 각각 실행됩니다.
*/
export function displayAmountForSmartPygg(amt) {
	amt = amt? amt: pform.min_cost.value // amt default: 유저에게 요구되는 최소 저금기준금액
	const low = amt * 0.5, middle1 = amt * 0.9, middle2 = amt * 1.1, high = amt * 2

  // min, normal, max 구간별 금액표시
	pform.querySelector('.low span:nth-child(1)').textContent = toWon(low)
	pform.querySelector('.low span:nth-child(2)').textContent = toWon(middle1 - 1)
	pform.querySelector('.normal span:nth-child(1)').textContent = toWon(middle1)
	pform.querySelector('.normal span:nth-child(2)').textContent = toWon(middle2 - 1)
	pform.querySelector('.high span:nth-child(1)').textContent = toWon(middle2)
	pform.querySelector('.high span:nth-child(2)').textContent = toWon(high)
}
window.displayAmountForSmartPygg = displayAmountForSmartPygg