{"version":3,"file":"user_profile.min.js","sources":["../../js/dom.js","../../js/data_tables.js","../../js/utils.js","../../js/tag_input.js","../../js/main.js","../../js/user_profile.js"],"sourcesContent":["const $ = function(selector) {\n return document.querySelector(selector);\n};\n\nconst $$ = function(selector) {\n return document.querySelectorAll(selector) || [];\n};\n\nconst makeEl = function(html) {\n const template = document.createElement('template');\n\n template.innerHTML = html.trim();\n\n return template.content.firstChild;\n};\n\nconst clearEl = function(el) {\n while (el.firstChild) {\n el.removeChild(el.firstChild);\n }\n};\n\nconst toggleEl = function(el) {\n if (el.classList.contains('is-hidden')) {\n el.classList.remove('is-hidden');\n } else {\n el.classList.add('is-hidden');\n }\n};\n\nconst escape = function(unsafe) {\n return unsafe\n .replace(/&/g, \"&\")\n .replace(//g, \">\")\n .replace(/\"/g, \""\")\n .replace(/'/g, \"'\");\n}\n\nconst whenReady = function(funcp) {\n if (document.readyState !== 'loading') {\n funcp();\n } else {\n document.addEventListener('DOMContentLoaded', funcp);\n }\n}\n\nexport { whenReady, $, $$, makeEl, clearEl, toggleEl, escape };","import { makeEl, clearEl } from \"./dom\";\n\nclass SimplePaginator {\n constructor(element) {\n this.element = element;\n }\n\n attach(pageCallback) {\n this.element.addEventListener('click', evt => {\n if (evt.target && evt.target.classList.contains('paginator__button')) {\n pageCallback(+evt.target.dataset.page);\n }\n });\n }\n\n update(totalRecords, perPage, currentPage) {\n clearEl(this.element);\n\n /* First and last page in existence */\n const firstPage = 0;\n const lastPage = Math.floor(totalRecords / perPage); // ish?\n const numPagesToShow = 2;\n\n if (lastPage === firstPage) {\n return;\n }\n\n /* First and last page the main paginator will show */\n const firstPageShow = (currentPage - numPagesToShow) < firstPage ? firstPage : (currentPage - numPagesToShow);\n const lastPageShow = (currentPage + numPagesToShow) > lastPage ? lastPage : (currentPage + numPagesToShow);\n\n /* Whether to show the first and last pages in existence at the ends of the paginator */\n const showFirstPage = (Math.abs(firstPage - currentPage)) > (numPagesToShow);\n const showLastPage = (Math.abs(lastPage - currentPage)) > (numPagesToShow);\n\n\n const prevButtonDisabled = currentPage === firstPage ? 'disabled' : ''\n\n /* Previous button */\n this.element.appendChild(makeEl(\n ``\n ));\n\n /* First page button */\n if (showFirstPage) {\n this.element.appendChild(makeEl(\n ``\n ));\n this.element.appendChild(makeEl(`…`));\n }\n\n /* \"window\" buttons */\n for (let i = firstPageShow; i <= lastPageShow; i++) {\n const selected = (i === currentPage ? 'paginator__button--selected' : '');\n this.element.appendChild(makeEl(\n ``\n ));\n }\n\n /* Last page button */\n if (showLastPage) {\n this.element.appendChild(makeEl(`…`));\n this.element.appendChild(makeEl(\n ``\n ));\n }\n\n const nextButtonDisabled = currentPage === lastPage ? 'disabled' : ''\n /* Next button */\n this.element.appendChild(makeEl(\n ``\n ));\n }\n}\n\nclass DataTable {\n constructor(element, options) {\n this.element = element;\n this.container = element.parentElement;\n this.options = options;\n\n this.ajaxCallback = options.ajaxCallback;\n this.data = [];\n this.unfilteredData = [];\n\n this.totalRecords = -1;\n this.perPage = 20;\n this.currentPage = 0;\n\n this.paginator = new SimplePaginator(this.container.querySelector('.paginator'));\n\n this.filterCallback = options.filterCallback;\n this.sortField = null;\n this.sortDir = true;\n }\n\n attach() {\n this.filterField = this.container.querySelector('input.search');\n if (this.filterField && this.filterCallback) {\n this.filterField.addEventListener('keyup', evt => {\n if (evt.target) {\n this._updateFilter(evt.target.value);\n }\n });\n\n if (this.options.preFilter) {\n this.filterField.value = this.options.preFilter;\n }\n }\n\n this.perPageField = this.container.querySelector('select[name=per_page]');\n\n if (this.perPageField) {\n this.perPageField.addEventListener('change', evt => {\n this.perPage = Number(evt.target.value);\n this._updatePage(0);\n });\n }\n\n const header = this.element.querySelector('tr.paginator__sort');\n\n if (header) {\n header.addEventListener('click', evt => {\n const target = evt.target;\n\n if (!target.dataset.sortField) {\n return;\n }\n\n if (this.sortField) {\n const elem = this.element.querySelector(`th[data-sort-field=${this.sortField}]`)\n elem.classList.remove('paginator__sort--down');\n elem.classList.remove('paginator__sort--up');\n }\n\n this._updateSort(target.dataset.sortField, !this.sortDir);\n\n target.classList.add(this.sortDir ? 'paginator__sort--up' : 'paginator__sort--down');\n });\n }\n\n this.paginator.attach(this._updatePage.bind(this));\n this._loadEntries();\n }\n\n /* Load the requested data from the server, and when done, update the DOM. */\n _loadEntries() {\n new Promise(this.ajaxCallback)\n .then(data => {\n this.element.classList.remove('hidden');\n this.unfilteredData = data.data;\n this._updateFilter(this.options.preFilter);\n });\n }\n\n /* Update the DOM to reflect the current state of the data we have loaded */\n _updateEntries(data) {\n this.data = data;\n this.totalRecords = this.data.length;\n\n const bodyElement = this.element.querySelector('tbody');\n clearEl(bodyElement);\n\n const firstIndex = (this.perPage * this.currentPage);\n const lastIndex = (firstIndex + this.perPage) > this.totalRecords ? this.totalRecords : (firstIndex + this.perPage);\n\n\n for (let i = firstIndex; i < lastIndex; i++) {\n const rowElem = makeEl(this.options.rowCallback(this.data[i]));\n rowElem.classList.add(i % 2 === 0 ? 'odd' : 'even');\n\n bodyElement.appendChild(rowElem);\n }\n\n this.paginator.update(this.totalRecords, this.perPage, this.currentPage);\n }\n\n _updatePage(n) {\n this.currentPage = n;\n this.paginator.update(this.totalRecords, this.perPage, this.currentPage);\n this._updateEntries(this.data);\n }\n\n _updateFilter(query) {\n /* clearing the query */\n if (query === null || query === '') {\n this._updateEntries(this.unfilteredData);\n return;\n }\n\n let data = [];\n for (const datum of this.unfilteredData) {\n if (this.filterCallback(datum, query)) {\n data.push(datum);\n }\n }\n\n this._updatePage(0)\n this._updateEntries(data);\n }\n\n _updateSort(field, direction) {\n this.sortField = field;\n this.sortDir = direction;\n\n let newEntries = [...this.data].sort((a, b) => {\n let sorter = 0;\n\n if (a[field] > b[field]) {\n sorter = 1;\n } else if (a[field] < b[field]) {\n sorter = -1;\n }\n\n if (!direction) {\n sorter = -sorter;\n }\n\n return sorter;\n });\n\n this._updatePage(0);\n this._updateEntries(newEntries);\n }\n}\n\nconst dumbFilterCallback = (datum, query) => {\n if (!query) {\n return true;\n }\n\n if (datum.title.indexOf(query) !== -1) {\n return true;\n }\n\n /* this is inefficient */\n for (const tag of datum.tags) {\n if (tag.name.toLowerCase() === query.toLowerCase()) {\n return true;\n }\n }\n\n return false;\n};\n\nexport { DataTable, dumbFilterCallback };\n","import { escape } from \"./dom\";\n\nconst tagsToHtml = (tags) => {\n\n return tags.map(tagData => {\n let tagColorClass;\n if (tagData.name.indexOf('nsfw') !== -1) {\n tagColorClass = 'is-danger';\n } else if (tagData.name.indexOf('safe') !== -1) {\n tagColorClass = 'is-success';\n } else if (tagData.name.indexOf('/') !== -1) {\n tagColorClass = 'is-primary';\n } else {\n tagColorClass = 'is-info';\n }\n\n return `\n ${escape(tagData.name)}\n `;\n }).join('');\n};\n\nexport { tagsToHtml };\n","import { makeEl, escape } from \"./dom\";\n\nclass TagsInput {\n constructor(element, options = {}) {\n this.element = element;\n this.tags = [];\n this.options = options\n\n this.maxTags = options.maxTags || 10;\n this.inputNode = null;\n this.containerNode = null;\n }\n\n attach() {\n this.element.style.display = 'none';\n\n this.containerNode = makeEl('
');\n this.inputNode = makeEl('');\n this.containerNode.appendChild(this.inputNode);\n\n this.element.parentNode.insertBefore(this.containerNode, this.element.nextSibling);\n\n /* Load existing tags from input */\n if (this.element.value) {\n for (const tag of this.element.value.split(',')) {\n this.addTag(tag);\n }\n }\n\n /* Handle addition and removal of tags via key-presses */\n this.containerNode.addEventListener('keydown', this._handleInputKeyUp.bind(this));\n\n /* Handle deletions by clicking the delete button */\n this.containerNode.addEventListener('click', this._handleContainerClick.bind(this));\n }\n\n detach() {\n this.tags.clear();\n this.containerNode.remove();\n this.element.style.display = 'inline-block';\n }\n\n updateHiddenInputValue() {\n this.element.value = this.tags.join(',');\n }\n\n deleteTagNode(node) {\n this.tags.splice(this.tags.indexOf(node.dataset.value.toLowerCase()), 1);\n node.remove();\n\n /* Below the limit? Make sure the input is enabled. */\n if (this.tags.length < this.maxTags) {\n this.inputNode.disabled = false;\n }\n }\n\n addTag(tagValue) {\n tagValue = tagValue.trim();\n\n /* Tag value is probably not empty and we don't already have the same tag. */\n if (tagValue !== '' && this.tags.indexOf(tagValue.toLowerCase()) === -1) {\n this.tags.push(tagValue.toLowerCase());\n\n this.inputNode.parentNode.insertBefore(\n makeEl('' + escape(tagValue) + ''),\n this.inputNode\n );\n\n /* Too many tags, disable the input for now. */\n if (this.tags.length >= this.maxTags) {\n this.inputNode.disabled = true;\n }\n }\n }\n\n _handleInputKeyUp(evt) {\n let tagValue = this.inputNode.value;\n\n if (evt.key === 'Backspace' && tagValue === '') {\n // Remove the child\n if (this.inputNode.previousSibling) {\n this.deleteTagNode(this.inputNode.previousSibling);\n\n this.updateHiddenInputValue();\n }\n } else if (evt.key === ',') {\n this.addTag(tagValue);\n\n this.inputNode.value = ''\n this.updateHiddenInputValue();\n\n evt.preventDefault();\n }\n }\n\n _handleContainerClick(evt) {\n if (evt.target && evt.target.classList.contains('delete')) {\n this.deleteTagNode(evt.target.closest('.tag'));\n this.updateHiddenInputValue();\n }\n }\n}\n\nexport { TagsInput };\n","import { $, $$, toggleEl } from './dom';\nimport { TagsInput } from \"./tag_input\";\n\nconst setupSignupModal = () => {\n const signupButton = $('[data-target~=\"#signin\"],[data-target~=\"#signup\"]');\n\n if (signupButton) {\n signupButton.addEventListener('click', () => {\n $('.modal').classList.add('is-active');\n });\n\n $('.modal-button-close').addEventListener('click', () => {\n $('.modal').classList.remove('is-active');\n });\n }\n}\n\nconst globalSetup = () => {\n Array.prototype.forEach.call($$('.js-tag-input'), (el) => {\n new TagsInput(el).attach();\n });\n\n setupSignupModal();\n\n const embedButton = $('.panel-tools .embed-tool');\n\n if (embedButton){\n embedButton.addEventListener('click', (evt) => {\n if (evt.target && evt.target.closest('.panel-tools')) {\n toggleEl(evt.target.closest('.panel-tools').querySelector('.panel-embed'));\n }\n });\n }\n\n const expandButton = $('.expand-tool');\n\n if (expandButton) {\n expandButton.addEventListener('click', (evt) => {\n if (evt.target && evt.target.closest('.panel')) {\n const panel = evt.target.closest('.panel');\n\n if (panel.classList.contains('panel-fullsize')) {\n panel.classList.remove('panel-fullsize');\n } else {\n panel.classList.add('panel-fullsize');\n }\n }\n });\n }\n\n // Notifications\n (document.querySelectorAll('.notification .delete') || []).forEach(($delete) => {\n const $notification = $delete.parentNode;\n\n $delete.addEventListener('click', () => {\n $notification.parentNode.removeChild($notification);\n });\n });\n\n // Hamburger menu\n const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);\n if ($navbarBurgers.length > 0) {\n $navbarBurgers.forEach(el => {\n el.addEventListener('click', () => {\n const target = el.dataset.target;\n const $target = document.getElementById(target);\n el.classList.toggle('is-active');\n $target.classList.toggle('is-active');\n });\n });\n }\n\n const preloader = $('.preloader');\n const main = $('main');\n\n if (preloader && main) {\n preloader.remove();\n main.id = '';\n }\n}\n\nexport { globalSetup };","import { escape, whenReady } from './dom';\nimport { DataTable, dumbFilterCallback } from './data_tables';\nimport { tagsToHtml } from \"./utils\";\nimport { globalSetup } from './main';\n\nconst getUserInfo = () => {\n const elem = document.getElementById('js-data-holder');\n\n if (!elem) {\n return { userId: null, csrfToken: null };\n }\n\n return { userId: elem.dataset.userId, csrfToken: elem.dataset.csrfToken };\n};\n\nconst parsePasteInfo = (elem) => {\n if (!elem.dataset.pasteInfo) {\n return null;\n }\n\n return JSON.parse(elem.dataset.pasteInfo);\n};\n\nwhenReady(() => {\n globalSetup();\n\n const urlParams = new URLSearchParams(window.location.search);\n const myParam = urlParams.get('q');\n const myPastesElem = document.getElementById('archive');\n const table = new DataTable(myPastesElem, {\n ajaxCallback: (resolve) => {\n resolve({\n data: Array.prototype.map.call(myPastesElem.querySelectorAll('tbody > tr'), parsePasteInfo)\n });\n },\n rowCallback: (rowData) => {\n const userData = getUserInfo();\n const ownedByUser = (parseInt(rowData.user_id) === parseInt(userData.userId));\n\n const deleteElem = ownedByUser ? `