const Routing = require('./routing')

class Post {
    constructor(w) {
        this.window = w
    }

    commentsEvents() {
        const document = this.window.document

        const parentCommentIdField = document.getElementById('user_comment_parentCommentId')

        if (!parentCommentIdField) {
            return
        }

        const isAnswerAlert = document.getElementById('answer-alert')
        const cancelAnswerButton = document.getElementById('cancel-answer')

        const toogleAnswerAlert = function() {
            if (parentCommentIdField.value) {
                isAnswerAlert.classList.remove('hidden')
            } else {
                isAnswerAlert.classList.add('hidden')
            }
        }

        toogleAnswerAlert()

        const answerButtons = document.querySelectorAll('a[data-answer]')

        for (let i = 0, len = answerButtons.length; i < len; i++) {
            answerButtons[i].addEventListener('click', function(e) {
                parentCommentIdField.value = e.target.getAttribute('data-answer')
                toogleAnswerAlert()
            }, false)
        }

        cancelAnswerButton.addEventListener('click', function(e) {
            e.preventDefault()

            parentCommentIdField.value = null
            toogleAnswerAlert()
        }, false)

        const previewButton = document.querySelector('.preview-button')
        const previewRender = document.querySelector('#preview')

        previewButton.addEventListener('click', function() {
            if (previewRender.innerHTML === '') {
                previewRender.innerHTML = '<p>Chargement en cours…</p>'
            }

            const content = document.querySelector('#user_comment_content').value
            const httpRequest = new XMLHttpRequest()

            httpRequest.onreadystatechange = function(data) {
                if (httpRequest.readyState === 4 && httpRequest.status === 200) {
                    const json = JSON.parse(httpRequest.response)
                    previewRender.innerHTML = json.render
                    document.location.href = '#preview'
                }
            }

            httpRequest.open('POST', Routing.generate('api_blog_comment_preview'))
            httpRequest.setRequestHeader(
                'Content-Type',
                'application/x-www-form-urlencoded'
            )
            httpRequest.send('content=' + encodeURIComponent(content))
        }, false)
    }

    imagesEvents() {
        const document = this.window.document
        let isFullscreen = false
        const images = document.querySelectorAll('.body img')

        const handleClick = function(image) {
            if (isFullscreen) {
                if (document.exitFullscreen) {
                    document.exitFullscreen()
                } else if (document.webkitExitFullscreen) {
                    document.webkitExitFullscreen()
                } else if (document.mozCancelFullScreen) {
                    document.mozCancelFullScreen()
                }
            } else {
                if (image.requestFullscreen) {
                    image.requestFullscreen()
                } else if (image.webkitRequestFullscreen) {
                    image.webkitRequestFullscreen()
                } else if (image.mozRequestFullScreen) {
                    image.mozRequestFullScreen()
                }
            }

            isFullscreen = !isFullscreen
        }

        for (let i = 0, len = images.length; i < len; i++) {
            const image = images[i]

            if (image.parentNode.tagName === 'A') {
                continue
            }

            (function(i) {
                i.addEventListener('click', function() {
                    handleClick(i)
                }, false)
            })(image)
        }
    }

    init() {
        this.commentsEvents()
        this.imagesEvents()
    }
}

module.exports = Post