/**
 * A base fragment for onboarding page.
 */
abstract class OnboardingPageFragment<V> : Fragment() {
    companion object {
        const val KEY_VALUE = "value"
        const val KEY_ANIMATED = "animated"
    }

    abstract var value: V
    var animated: Boolean = false

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        if (savedInstanceState != null) {
            value = savedInstanceState.getSerializable(KEY_VALUE) as V
            animated = savedInstanceState.getBoolean(KEY_ANIMATED)
        }
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        if (!animated) {
            view.post({
                initAnimation()
            })
        }

        if (!animated && userVisibleHint) {
            onFragmentVisible()
        }
    }

    override fun setUserVisibleHint(isVisibleToUser: Boolean) {
        super.setUserVisibleHint(isVisibleToUser)

        if (isVisibleToUser && !animated && view != null) {
            onFragmentVisible()
        }
    }

    override fun onSaveInstanceState(outState: Bundle) {
        outState.putSerializable(KEY_VALUE, value as Serializable)
        outState.putBoolean(KEY_ANIMATED, animated)
    }

    open fun onFragmentVisible() {
        view?.post({
            startAnimation()
        })
        animated = true
    }

    abstract fun initAnimation()
    abstract fun startAnimation()
}



/**
 * A fragment for onboarding goal and fitness pages.
 */
abstract class OnboardingButtonsFragment<V> : OnboardingPageFragment<V>() {
    var endWidth: Int = 0

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        return inflater.inflate(R.layout.fragment_onboarding_buttons, container, false)
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        btn1.setOnClickListener {
            setButtonSelected(it)
        }

        btn2.setOnClickListener {
            setButtonSelected(it)
        }

        btn3.setOnClickListener {
            setButtonSelected(it)
        }
    }

    abstract fun setButtonSelected(view: View)

    override fun initAnimation() {
        val btns = arrayOf(btn1, btn2, btn3)
        val labels = arrayOf(btn1Label, btn2Label, btn3Label)

        for (i in 0 until btns.size) {
            val btn = btns[i]
            val startWidth = context!!.dip(50)
            endWidth = btn.width
            val params = btn.layoutParams
            params.width = startWidth
            btn.layoutParams = params

            val label = labels[i]
            label.alpha = 0f
        }
    }

    override fun startAnimation() {
        val btns = arrayOf(btn1, btn2, btn3)
        val labels = arrayOf(btn1Label, btn2Label, btn3Label)

        for (i in 0 until btns.size) {
            val btn = btns[i]
            val startWidth = context!!.dip(50)

            val animator = ValueAnimator.ofInt(startWidth, endWidth)
            animator.startDelay = 100 + i * 50L
            animator.duration = 300
            animator.interpolator = AccelerateDecelerateInterpolator()
            animator.addUpdateListener { animation ->
                // TODO: make own view for better performance
                btn.layoutParams.width = animation.animatedValue as Int
                btn.requestLayout()
            }
            animator.start()

            val label = labels[i]
            label.animate()
                    .alpha(1f)
                    .setDuration(200)
                    .setStartDelay(200 + i * 50L)
                    .start()
        }
    }
}