{"version":3,"sources":["webpack:///./components/comment/js/comment.ts"],"names":["selectors","modal","disclosureCheckbox","disclosuresWrapper","form","formSubmit","resetForm","modalToggle","commentMessageToggle","commentDescription","elements","inputs","name","title","affiliation","comment","disclosures","tinyMCE","shouldAddListeners","this","init","setElements","unEscapeCommentDescriptionHTML","addListeners","document","querySelector","Array","from","querySelectorAll","key","getElementById","triggerDialog","targetNode","observer","MutationObserver","mutationList","click","disconnect","observe","childList","txt","createElement","forEach","innerHTML","value","addEventListener","toggleDisclosure","bind","initTinyMCE","e","wrapper","classList","toggle","setAttribute","contains","toString","remove","add","element","mce","editors","setContent","selector","length","tinyMCEScript","settings","plugins","height","toolbar","setup","editor","on","save","push","window","tinymce","Promise","resolve","reject","type","src","body","appendChild"],"mappings":"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","file":"js/comment-b6f23eb4e282906adb1d.js","sourcesContent":["export default class ACPComment {\n    selectors = {\n        modal: '#submit-comment',\n        disclosureCheckbox: '#comment-disclosures-checkbox',\n        disclosuresWrapper: '.disclosures__wrapper',\n        form: 'form',\n        formSubmit: '[type=submit]',\n        resetForm: '.reset-form',\n        modalToggle: '.comments__info [data-toggle=\"modal\"]',\n        commentMessageToggle: 'comment-message-toggle',\n        commentDescription: '.comment__description'\n    };\n\n    elements = {\n        modal: null,\n        disclosureCheckbox: null,\n        form: null,\n        formSubmit: null,\n        disclosuresWrapper: null,\n        resetForm: null,\n        commentMessageToggle: null,\n        modalToggle: null,\n        commentDescription: []\n    };\n\n    inputs = {\n        name: null,\n        title: null,\n        affiliation: null,\n        comment: null,\n        disclosures: null,\n    };\n\n    tinyMCE = [];\n    doi: string;\n    shouldAddListeners = false;\n\n    constructor() {\n        this.init();\n    }\n\n    init() {\n        this.setElements();\n        this.unEscapeCommentDescriptionHTML();\n        this.addListeners();\n    }\n\n    private setElements() {\n        this.elements.modal = document.querySelector(this.selectors.modal);\n        this.elements.commentDescription = Array.from(document.querySelectorAll(this.selectors.commentDescription));\n        this.shouldAddListeners = this.elements.modal != null;\n        if (!this.shouldAddListeners) {\n            return;\n        }\n        this.elements.modalToggle = document.querySelector(this.selectors.modalToggle);\n        for (let key in this.elements) {\n            if (!!this.elements[key]) {\n                continue;\n            }\n            if (key === 'commentMessageToggle') {\n                this.elements.commentMessageToggle = document.getElementById(this.selectors.commentMessageToggle);\n                continue;\n            }\n            this.elements[key] = this.elements.modal.querySelector(this.selectors[key]);\n        }\n\n        this.triggerDialog();\n    }\n\n    private triggerDialog(){\n        const targetNode = document.querySelector('[data-pb-dropzone=\"main\"]');\n\n        const config = { childList: true};\n\n        const callback = (mutationList, observer) => {\n            const dialog = document.querySelector('#comment-message');\n            if(!dialog) return;\n            this.elements.commentMessageToggle?.click();\n            observer.disconnect();\n            };\n\n        const observer = new MutationObserver(callback);\n        targetNode && observer.observe(targetNode, config); \n    }\n\n    /**\n     * since the comment body is escaped on back-end side, and it's not safe to unescape it from their end,\n     * there might CSRF attacks in the content and we need to prevent that.\n     * since it's already escaped from their end, just to make the comment visualized we unescape it from our end\n     *\n     * @private\n     */\n    private unEscapeCommentDescriptionHTML() {\n        const txt = document.createElement(\"textarea\");\n        this.elements.commentDescription.forEach(comment => {\n            txt.innerHTML = comment.innerHTML;\n            comment.innerHTML = txt.value;\n        });\n    }\n\n    private addListeners() {\n        if (!this.shouldAddListeners) {\n            return;\n        }\n        this.elements.disclosureCheckbox?.addEventListener('click', this.toggleDisclosure.bind(this));\n        this.elements.resetForm?.addEventListener('click', this.resetForm.bind(this));\n        this.elements.modalToggle?.addEventListener('click', this.initTinyMCE.bind(this, '#comment-body'));\n    }\n\n    private async toggleDisclosure(e) {\n        const wrapper: HTMLElement = this.elements.disclosuresWrapper;\n        wrapper?.classList.toggle('active');\n        await this.initTinyMCE('#comment-disclosures');\n        wrapper?.setAttribute('aria-hidden', (!wrapper.classList?.contains('active')).toString());\n    }\n\n    private resetForm() {\n        this.elements.modal.querySelector('.modal__form')?.classList.remove('hidden');\n        this.elements.modal.querySelector('.modal__message')?.classList.add('hidden');\n        for (let key in this.inputs) {\n            this.inputs[key].element.value = null;\n        }\n        this.tinyMCE.forEach(mce => mce.editors[0].setContent(''))\n    }\n\n    private async initTinyMCE(selector) {\n        if (this.tinyMCE.length > 1) {\n            return;\n        }\n        try {\n            await this.tinyMCEScript();\n            const settings = {\n                plugins: 'lists paste',\n                height: 200,\n                toolbar: [\n                    'bold italic | alignleft aligncenter alignright | bullist numlist outdent indent',\n                ],\n                setup: function (editor) {\n                    editor.on('change', function () {\n                        editor.save();\n                    });\n                }\n            };\n            // @ts-ignore\n            this.tinyMCE.push(window.tinymce.init({\n                selector,\n                ...settings\n            }));\n\n        } catch (e) {\n        }\n    }\n\n    private async tinyMCEScript() {\n        return new Promise<void>((resolve, reject) => {\n            // @ts-ignore\n            if (window.tinymce) {\n                resolve();\n            } else {\n                let htmlTag = document.createElement('script');\n                htmlTag.type = 'text/javascript';\n                htmlTag.src = '/resources/page-builder/js/lib/tinymce-5.0.13/tinymce.min.js';\n                htmlTag.addEventListener('load', () => resolve(), false);\n                htmlTag.addEventListener('error', () => {\n                    htmlTag.remove();\n                    reject();\n                }, false);\n                document.body.appendChild(htmlTag);\n            }\n\n        });\n    };\n}\n"],"sourceRoot":""}