import { responsiveClassesFor } from './footer'

wp.customize('sticky_sidebar', val =>
	val.bind(to => {
		const sidebar = document.querySelector('.ct-sidebar')
		if (!sidebar) return

		sidebar.removeAttribute('data-sticky')

		if (to !== 'yes') return

		document.querySelector('.ct-sidebar').dataset.sticky = ''
	})
)

wp.customize('sidebar_type', val =>
	val.bind(to => {
		const sidebar = document.querySelector('.ct-sidebar')
		if (!sidebar) return

		document.querySelector('.ct-sidebar').dataset.type = to
	})
)

wp.customize('sidebar_visibility', val =>
	val.bind(to => {
		const sidebar = document.querySelector('.ct-sidebar')
		if (!sidebar) return

		responsiveClassesFor(
			'sidebar_visibility',
			document.querySelector('.ct-sidebar').parentNode
		)
	})
)