import m from 'mithril'

export default {
	tests : [
		[ 'offsetTop',    el => el.scrollTop  > 0,
		[ 'offsetRight',  el => el.scrollWidth  - ( el.scrollLeft + el.offsetWidth  ) > 2,
		[ 'offsetBottom', el => el.scrollHeight - ( el.scrollTop  + el.offsetHeight ) > 2,
		[ 'offsetLeft',   el => el.scrollLeft > 0
	],
	controller( { style } ){
		let child   = m.prop( document.createElement( 'x' ) )
		let apply   = () => {
			for( let [ className, test ] of tests )
				if( test( el ) )
					this.parentAttrs.className += ' ' + className
		}

		this.parentAttrs = {
			style : Object.assign( {
				overflow : 'scroll'
			}, style )
		}

		this.childAttrs  = {
			config   : ( el, init, ctxt ) => {
				if( !init ){
					child( el )
					apply()
				}
			},
			onscroll : () => {
				window.cancelAnimationFrame( pending )

				pending = window.requestAnimationFrame( apply )
			}
		}
	},
	view : ( { parentAttrs, childAttrs }, { contents } ) =>
		m( '.scrollBox',
			Object.assign( parentAttrs, { style } ),
			Object.assign( contents, { attrs : childAttrs } )
		)
}