2698 lines
101 KiB
JavaScript
2698 lines
101 KiB
JavaScript
/* global $, axios, bootstrap, currentPagePath, initPagination, removeAllChildNodes, unsavedData */
|
|
|
|
// Temporary workaround (use of currentPagePath).
|
|
|
|
window.addEventListener('load', () => {
|
|
initDictionaries()
|
|
})
|
|
|
|
function initDictionaries() {
|
|
const ce = {}
|
|
window.dictionaryElements = ce
|
|
ce.textDescription = document.getElementById('text-description')
|
|
ce.headerTitle = document.getElementById('site-header-title')
|
|
ce.fixedTopSection = document.getElementById('fixed-top-section')
|
|
ce.offsetMain = document.getElementById('offset-main')
|
|
|
|
window.addEventListener('resize', () => {
|
|
adjustOffsetBy()
|
|
mobileMoveContent()
|
|
})
|
|
mobileMoveContent()
|
|
adjustOffsetBy()
|
|
window.onscroll = hideAndShowHeader
|
|
if (
|
|
/\/slovarji\/\d+\/podatki/.test(currentPagePath) ||
|
|
currentPagePath === '/slovarji/nov'
|
|
) {
|
|
ce.inputNewAuthor = document.getElementById('input-new-author')
|
|
ce.inputNewArea = document.getElementById('input-new-area')
|
|
}
|
|
|
|
if (currentPagePath === '/slovarji/nov') {
|
|
changePreview()
|
|
ce.newDictionaryForm = document.getElementById('form-dictionary-new')
|
|
ce.checkLanguageGroup = document.getElementById('language-group')
|
|
ce.languagesInput = document.getElementById('languages-input')
|
|
|
|
ce.terminLanguageSubgroup = document.getElementById(
|
|
'termin-language-subgroup'
|
|
)
|
|
ce.definitionLanguageSubgroup = document.getElementById(
|
|
'definition-language-subgroup'
|
|
)
|
|
ce.synonymLanguageSubgroup = document.getElementById(
|
|
'synonym-language-subgroup'
|
|
)
|
|
ce.definitionCheckBox = document.getElementById('definition-check-box')
|
|
ce.submitDictionaryBtn = document.getElementById('submit-dictionary-btn')
|
|
ce.checkLanguageGroup.addEventListener('click', checkBoxLanguageChecker)
|
|
ce.definitionCheckBox.addEventListener('click', checkBoxDefinitionChecker)
|
|
const switchForm = document.querySelector('.switch-forms')
|
|
switchForm.addEventListener('click', () => changePreview())
|
|
|
|
ce.inputNewAuthor.addEventListener('click', () => {
|
|
addField(ce.newDictionaryForm, ce.inputNewAuthor)
|
|
})
|
|
|
|
ce.inputNewArea.addEventListener('click', () => {
|
|
createNewAreaInput(ce.newDictionaryForm)
|
|
})
|
|
|
|
ce.newDictionaryForm.addEventListener('submit', event => {
|
|
// checkform()
|
|
checkLanguages()
|
|
if (!event.target.checkValidity()) {
|
|
event.preventDefault()
|
|
}
|
|
event.target.classList.add('was-validated')
|
|
})
|
|
}
|
|
|
|
if (/\/slovarji\/\d+\/struktura/.test(currentPagePath)) {
|
|
changePreview()
|
|
const switchForm = document.querySelector('.switch-forms')
|
|
switchForm.addEventListener('click', () => changePreview())
|
|
ce.dictionaryStructureForm = document.getElementById(
|
|
'form-dictionary-structure'
|
|
)
|
|
const dictSideMenu = document.querySelector('.admin-nav-content')
|
|
unsavedData(ce.dictionaryStructureForm, dictSideMenu)
|
|
ce.checkLanguageGroup = document.getElementById('language-group')
|
|
ce.languagesInput = document.getElementById('languages-input')
|
|
ce.terminLanguageSubgroup = document.getElementById(
|
|
'termin-language-subgroup'
|
|
)
|
|
ce.definitionLanguageSubgroup = document.getElementById(
|
|
'definition-language-subgroup'
|
|
)
|
|
ce.synonymLanguageSubgroup = document.getElementById(
|
|
'synonym-language-subgroup'
|
|
)
|
|
|
|
// jquery event listener for a select2 field
|
|
$('.multiple').on('change', enableButton)
|
|
|
|
ce.dictionaryStructureForm.addEventListener('input', enableButton)
|
|
ce.definitionCheckBox = document.getElementById('definition-check-box')
|
|
ce.submitDictionaryBtn = document.getElementById('submit-dictionary-btn')
|
|
ce.checkLanguageGroup.addEventListener('click', checkBoxLanguageChecker)
|
|
ce.definitionCheckBox.addEventListener('click', checkBoxDefinitionChecker)
|
|
|
|
ce.dictionaryStructureForm.addEventListener('submit', event => {
|
|
// checkform()
|
|
checkLanguages()
|
|
if (!event.target.checkValidity()) {
|
|
event.preventDefault()
|
|
}
|
|
event.target.classList.add('was-validated')
|
|
})
|
|
}
|
|
|
|
if (/\/slovarji\/\d+\/podatki/.test(currentPagePath)) {
|
|
ce.descriptionDictionaryForm = document.getElementById(
|
|
'form-dictionary-description'
|
|
)
|
|
ce.descriptionDictionaryForm.addEventListener('input', enableButton)
|
|
const dictSideMenu = document.querySelector('.admin-nav-content')
|
|
unsavedData(ce.descriptionDictionaryForm, dictSideMenu)
|
|
ce.inputElements = document.querySelectorAll('input')
|
|
ce.imgTrashIcon = document.querySelectorAll('.delete-author-btn')
|
|
ce.inputElements.forEach(el => el.addEventListener('input', enableButton))
|
|
ce.inputElements.forEach(el => el.addEventListener('change', enableButton))
|
|
ce.inputNewAuthor.addEventListener('click', () => {
|
|
addField(ce.descriptionDictionaryForm, ce.inputNewAuthor)
|
|
})
|
|
ce.inputNewAuthor.addEventListener('click', enableButton)
|
|
ce.inputNewArea.addEventListener('click', () => {
|
|
createNewAreaInput(ce.descriptionDictionaryForm)
|
|
})
|
|
ce.inputNewArea.addEventListener('click', enableButton)
|
|
if (ce.imgTrashIcon !== null) {
|
|
ce.imgTrashIcon.forEach(el => el.addEventListener('click', deleteField))
|
|
ce.imgTrashIcon.forEach(el => el.addEventListener('click', enableButton))
|
|
}
|
|
|
|
// jquery event listener for select2 fields
|
|
$('.without-addition').on('change', enableButton)
|
|
$('.multiple').on('change', enableButton)
|
|
|
|
// JQuery for summernote text editor
|
|
$('.summernote').on('summernote.change', enableButton)
|
|
|
|
ce.descriptionDictionaryForm.addEventListener('submit', event => {
|
|
// checkform()
|
|
if (!event.target.checkValidity()) {
|
|
event.preventDefault()
|
|
}
|
|
event.target.classList.add('was-validated')
|
|
})
|
|
}
|
|
|
|
if (/\/slovarji\/\d+\/uvoz\/datoteka/.test(currentPagePath)) {
|
|
ce.fileUploadInput = document.getElementById('upload')
|
|
const btnImportEl = document.getElementById('button-import')
|
|
btnImportEl.addEventListener('click', () => ce.fileUploadInput.click())
|
|
const fileUploadInputValue = ce.fileUploadInput.value
|
|
const chosenFile = document.getElementById('chosen-file')
|
|
const fileTypeSelectionContainer = document.getElementById(
|
|
'file-type-selection'
|
|
)
|
|
ce.fileImportForm = document.getElementById('file-import-form')
|
|
|
|
ce.fileUploadInput.addEventListener('change', function () {
|
|
if (chosenFile.textContent !== fileUploadInputValue) {
|
|
chosenFile.textContent = ''
|
|
if (ce.fileUploadInput.files.item(0) !== null)
|
|
chosenFile.textContent = ce.fileUploadInput.files.item(0).name
|
|
else {
|
|
chosenFile.textContent = 'Izberi datoteko'
|
|
}
|
|
}
|
|
})
|
|
|
|
fileTypeSelectionContainer.addEventListener(
|
|
'change',
|
|
updateAcceptedFileTypes
|
|
)
|
|
|
|
ce.fileImportForm.addEventListener('submit', submitFormMultipart)
|
|
|
|
async function submitFormMultipart(event) {
|
|
try {
|
|
event.preventDefault()
|
|
const payload = new FormData(event.target)
|
|
|
|
await axios.post(event.target.action, payload)
|
|
|
|
alert('SLOVAR UVOŽEN')
|
|
} catch (error) {
|
|
alert('NAPAKA V UVOZU')
|
|
}
|
|
}
|
|
}
|
|
if (/\/slovarji\/\d+\/vsebina/.test(currentPagePath)) {
|
|
ce.formEditContent = document.getElementById('form-edit-content')
|
|
ce.formEditContent.addEventListener('submit', updateEntry)
|
|
ce.previewBtnEl = document.getElementById('content-preview')
|
|
ce.editBtnEl = document.getElementById('content-edit')
|
|
ce.commentsBtnEl = document.getElementById('content-comments')
|
|
ce.previewButtonsGroup = document.getElementById('preview-buttons')
|
|
ce.commentsButtonsGroup = document.getElementById('comments-buttons')
|
|
ce.previewSection = document.getElementById('preview-section')
|
|
ce.editSection = document.getElementById('edit-section')
|
|
ce.commentsSection = document.getElementById('comments-section')
|
|
ce.goLeftBtn = document.getElementById('go-left')
|
|
ce.goRightBtn = document.getElementById('go-right')
|
|
ce.dateListContainer = document.getElementById('date-list')
|
|
ce.dateSection = document.getElementById('date-section')
|
|
ce.showDates = document.getElementById('show-dates')
|
|
ce.selectAllDates = document.querySelectorAll('input[name=date]')
|
|
ce.classicOverview = document.getElementById('classic-overview')
|
|
// ce.selectedOverview = document.getElementById('selected-date-overview')
|
|
ce.btnSaveIcon = document.getElementById('btn-save-icon')
|
|
ce.filterCheckBoxes = document.querySelectorAll('.indeterminate-cbox')
|
|
ce.showFilterBtn = document.getElementById('show-filter')
|
|
ce.explanationField = document.getElementById('explanation-field')
|
|
ce.definitionField = document.getElementById('definition-field')
|
|
ce.termInputField = document.getElementById('term-name')
|
|
ce.newHeadwordGroupBtn = document.getElementById('btn-new-headword-grp')
|
|
ce.headerwordTable = document.getElementById('headword-table')
|
|
ce.newConnectionBtn = document.getElementById('input-new-connection')
|
|
ce.newImageBtn = document.getElementById('input-new-image')
|
|
ce.newAudioBtn = document.getElementById('input-new-audio')
|
|
ce.newVideoBtn = document.getElementById('input-new-video')
|
|
ce.foreignDefinitionField = document.querySelectorAll(
|
|
'.foreign-definition-field'
|
|
)
|
|
ce.entryPreviewSection = document.getElementById('entry-preview-section')
|
|
ce.noEntriesText = document.getElementById('no-entries-text')
|
|
ce.newEntryBtn = document.getElementById('new-entry-btn')
|
|
ce.deleteEntryBtn = document.getElementById('delete-entry')
|
|
ce.searchInput = document.querySelector('.input-search')
|
|
ce.clearSearchInput = document.querySelector('.clear-search-input')
|
|
ce.collapsablePart = document.querySelectorAll('.collapsable-entry-part')
|
|
ce.scrollEl = document.querySelector('.content-nav-content')
|
|
ce.collapsablePart.forEach(el => {
|
|
el.addEventListener('hide.bs.collapse', () =>
|
|
changePageContent('collapse-hidden')
|
|
)
|
|
})
|
|
ce.collapsablePart.forEach(el => {
|
|
el.addEventListener('shown.bs.collapse', () =>
|
|
changePageContent('collapse-shown')
|
|
)
|
|
})
|
|
ce.collapsablePart.forEach(el => {
|
|
el.addEventListener('show.bs.collapse', () =>
|
|
changePageContent('collapse-show')
|
|
)
|
|
})
|
|
const filterSelect = document.querySelector('.filter-select')
|
|
ce.clearSearchInput.addEventListener('click', () => {
|
|
filterSelect.value = 'term'
|
|
ce.searchInput.value = ''
|
|
ce.filterCheckBoxes.forEach(el => (el.checked = false))
|
|
useSearchEngine()
|
|
})
|
|
ce.statusEditEl = document.getElementById('status-edit')
|
|
// ce.deleteEntryBtn.addEventListener('click', () => ajaxDeleteEntry())
|
|
ce.newEntryBtn.addEventListener('click', () => {
|
|
ce.formEditContent.reset()
|
|
changePageContent('new-entry-btn')
|
|
})
|
|
const duplicateEntry = document.getElementById('duplicate-entry')
|
|
duplicateEntry.addEventListener('click', () =>
|
|
changePageContent('duplicate-entry')
|
|
)
|
|
if (ce.foreignDefinitionField) {
|
|
ce.foreignDefinitionField.forEach(el =>
|
|
el.addEventListener('input', autoResize)
|
|
)
|
|
}
|
|
ce.previewBtnEl.addEventListener('click', () =>
|
|
changePageContent('content-preview')
|
|
)
|
|
ce.editBtnEl.addEventListener('click', () =>
|
|
changePageContent('content-edit')
|
|
)
|
|
ce.commentsBtnEl.addEventListener('click', () =>
|
|
changePageContent('content-comments')
|
|
)
|
|
ce.goLeftBtn.addEventListener('click', () => letsScroll(ce.goLeftBtn))
|
|
ce.goRightBtn.addEventListener('click', () => letsScroll(ce.goRightBtn))
|
|
ce.showDates.addEventListener('click', () =>
|
|
changePageContent(ce.showDates.id)
|
|
)
|
|
ce.selectAllDates.forEach(el =>
|
|
el.addEventListener('click', () => showSelectedDateData(el))
|
|
)
|
|
ce.filterCheckBoxes.forEach(el =>
|
|
el.addEventListener('click', () => indeterminateTheBox(el))
|
|
)
|
|
ce.showFilterBtn.addEventListener('click', () =>
|
|
changePageContent(ce.showFilterBtn.getAttribute('aria-expanded'))
|
|
)
|
|
ce.formEditContent.addEventListener('input', enableButton)
|
|
ce.resizeFields = document.querySelectorAll('.explanation-field')
|
|
if (ce.resizeFields.length) {
|
|
ce.resizeFields.forEach(el =>
|
|
el.addEventListener('input', () => autoResize(el))
|
|
)
|
|
}
|
|
const eventText = document.createEvent('Event')
|
|
eventText.initEvent('input', true, true)
|
|
ce.resizeFields.forEach(el => el.dispatchEvent(eventText))
|
|
const mcBtnsGrp = document.querySelectorAll('.mc-buttons-group')
|
|
if (mcBtnsGrp.length) {
|
|
mcBtnsGrp.forEach(e => e.addEventListener('click', enableButton))
|
|
}
|
|
ce.newHeadwordGroupBtn.addEventListener('click', createHeadword)
|
|
if (ce.newConnectionBtn)
|
|
ce.newConnectionBtn.addEventListener('click', () =>
|
|
addConnectionField(ce.formEditContent, ce.newConnectionBtn)
|
|
)
|
|
if (ce.newImageBtn)
|
|
ce.newImageBtn.addEventListener('click', () =>
|
|
addField(ce.formEditContent, ce.newImageBtn)
|
|
)
|
|
if (ce.newAudioBtn)
|
|
ce.newAudioBtn.addEventListener('click', () =>
|
|
addField(ce.formEditContent, ce.newAudioBtn)
|
|
)
|
|
if (ce.newVideoBtn)
|
|
ce.newVideoBtn.addEventListener('click', () =>
|
|
addField(ce.formEditContent, ce.newVideoBtn)
|
|
)
|
|
ce.statusEditEl.addEventListener('change', () => checkIfValid())
|
|
ce.termInputField.addEventListener('input', () => checkIfValid())
|
|
if (ce.definitionField !== null)
|
|
ce.definitionField.addEventListener('input', () => checkIfValid())
|
|
ce.authorEl = document.getElementById('edit-name-el')
|
|
ce.versionEl = document.getElementById('edit-version-el')
|
|
ce.previewVersion = document.getElementById('preview-version')
|
|
ce.previewAuthor = document.getElementById('preview-author')
|
|
$('.foreign-term-el').on('change', checkIfValid)
|
|
const searchBtn = document.getElementById('inline-search-btn')
|
|
searchBtn.addEventListener('click', e => {
|
|
e.preventDefault()
|
|
useSearchEngine()
|
|
})
|
|
const dateScrollerEl = document.querySelector('.date-scroller')
|
|
dateScrollerEl.addEventListener('change', handleClick)
|
|
ce.scrollEl.addEventListener('keydown', e => {
|
|
if (
|
|
e.key === 'ArrowDown' ||
|
|
e.key === 'ArrowUp' ||
|
|
e.key === 'PageUp' ||
|
|
e.key === 'PageDown'
|
|
)
|
|
e.preventDefault()
|
|
})
|
|
const termListMenu = document.getElementById('term-list')
|
|
termListMenu.addEventListener('keydown', throttle(onKeyDownNavigation, 80))
|
|
termListMenu.addEventListener(
|
|
'keydown',
|
|
throttle(onPageUpDownNavigation, 600)
|
|
)
|
|
// Coppied from https://github.com/you-dont-need/You-Dont-Need-Lodash-Underscore#_throttle
|
|
function throttle(func, timeFrame) {
|
|
let lastTime = 0
|
|
return function (...args) {
|
|
const now = new Date()
|
|
if (now - lastTime >= timeFrame) {
|
|
func(...args)
|
|
lastTime = now
|
|
}
|
|
}
|
|
}
|
|
termListMenu.addEventListener('keyup', onKeyUpLoad)
|
|
disableButton()
|
|
termListMenu.addEventListener('mouseover', e => showTitle(e))
|
|
termListMenu.addEventListener('mouseout', e => hideTitle(e))
|
|
|
|
async function useSearchEngine() {
|
|
const { searchInput } = window.dictionaryElements
|
|
const payload = new URLSearchParams()
|
|
const searchQuery = searchInput.value
|
|
const filterSelect = document.querySelector('.filter-select')
|
|
const filterSelectValue = filterSelect.value
|
|
|
|
payload.append('q', searchQuery)
|
|
payload.append('field', filterSelectValue)
|
|
const filteredSection = document.querySelectorAll('.indeterminate-cbox')
|
|
filteredSection.forEach(el => {
|
|
if (el.indeterminate && !el.checked) payload.append(el.name, 'false')
|
|
if (el.checked) payload.append(el.name, 'on')
|
|
})
|
|
const hiddenEl = document.getElementById('hidden-dictionary-id')
|
|
const dictionaryId = hiddenEl.value
|
|
const url = `/api/v1/search/editor/${dictionaryId}?` + payload.toString()
|
|
try {
|
|
const { data } = await axios.get(url)
|
|
renderTerms(data)
|
|
if (data.length) {
|
|
const termListLabels = termListMenu.querySelectorAll('label')
|
|
termListLabels[0].click()
|
|
}
|
|
} catch (error) {
|
|
alert(error)
|
|
}
|
|
}
|
|
|
|
let unsaved = false
|
|
ce.deleteEntryBtn.addEventListener('click', handleClick)
|
|
// Ajax render entry data
|
|
const messageContainer = document.querySelectorAll('.message-container')
|
|
termListMenu.addEventListener('click', handleClick)
|
|
|
|
if (termListMenu.childElementCount > 1) {
|
|
const termListLabels = termListMenu.querySelectorAll('label')
|
|
termListLabels[0].click()
|
|
}
|
|
|
|
function handleClick({ target }) {
|
|
const term = target.closest('.terms-label')
|
|
const versionEl = target.closest('.date-element')
|
|
const deleteEntryEl = target.closest('#delete-entry')
|
|
if (term) {
|
|
if (unsaved) {
|
|
const modalUseBtn = document.getElementById('modal-use-btn')
|
|
const modalCnclBtn = document.getElementById('modal-cancel-btn')
|
|
const modalMain = document.getElementById('alert-text')
|
|
const okBtnText = modalUseBtn.textContent
|
|
const cnclBtnTxt = modalCnclBtn.textContent
|
|
const modalMainTxt = modalMain.textContent
|
|
modalUseBtn.textContent = 'Shrani'
|
|
modalCnclBtn.textContent = 'Ne shrani'
|
|
modalMain.textContent =
|
|
'Imate neshranjene spremembe. Ali jih želite shraniti?'
|
|
const alertModal = new bootstrap.Modal(
|
|
document.getElementById('alert-modal')
|
|
)
|
|
alertModal.toggle()
|
|
|
|
modalUseBtn.addEventListener('click', () => {
|
|
const termId = term.getAttribute('data-term-id')
|
|
updateEntry(event, termId)
|
|
renderTermData(termId, event)
|
|
activateMe(term)
|
|
disableButton()
|
|
term.classList.add('selected-term-btn')
|
|
modalUseBtn.textContent = okBtnText
|
|
modalCnclBtn.textContent = cnclBtnTxt
|
|
modalMain.textContent = modalMainTxt
|
|
})
|
|
modalCnclBtn.addEventListener('click', () => {
|
|
const termId = term.getAttribute('data-term-id')
|
|
renderTermData(termId, event)
|
|
activateMe(term)
|
|
disableButton()
|
|
term.classList.add('selected-term-btn')
|
|
modalUseBtn.textContent = okBtnText
|
|
modalCnclBtn.textContent = cnclBtnTxt
|
|
modalMain.textContent = modalMainTxt
|
|
})
|
|
} else {
|
|
const termId = term.getAttribute('data-term-id')
|
|
renderTermData(termId, event)
|
|
activateMe(term)
|
|
disableButton()
|
|
term.classList.add('selected-term-btn')
|
|
}
|
|
}
|
|
if (versionEl) {
|
|
const versionId = document.querySelector(
|
|
'input[name="date"]:checked'
|
|
).value
|
|
const entryEl = document.querySelector('.selected-term-btn')
|
|
const entryId = entryEl.getAttribute('data-term-id')
|
|
if (versionId !== 'latest-version') {
|
|
fetchEntryVersionData(entryId, versionId)
|
|
} else {
|
|
const selectedBtnEl = document.querySelector('.selected-term-btn')
|
|
const termId = selectedBtnEl.getAttribute('data-term-id')
|
|
renderTermData(termId)
|
|
}
|
|
}
|
|
if (deleteEntryEl) {
|
|
const modalUseBtn = document.getElementById('modal-del-btn')
|
|
const modalCnclBtn = document.getElementById('cancel-btn')
|
|
modalUseBtn.textContent = 'Izbriši'
|
|
modalCnclBtn.textContent = 'Ne izbriši'
|
|
const alertModal = new bootstrap.Modal(
|
|
document.getElementById('delete-modal')
|
|
)
|
|
alertModal.toggle()
|
|
|
|
modalUseBtn.addEventListener('click', () => {
|
|
ajaxDeleteEntry()
|
|
})
|
|
}
|
|
}
|
|
|
|
async function fetchEntryVersionData(entryId, versionId) {
|
|
const { formEditContent } = window.dictionaryElements
|
|
try {
|
|
const { data } = await axios.get(
|
|
`/api/v1/entries/${entryId}/version-snapshots/${versionId}`
|
|
)
|
|
const payload = { entry: data }
|
|
insertTermData(entryId, payload)
|
|
const isPublishedEl = payload.entry.is_published
|
|
const info = new FormData(formEditContent)
|
|
info.append('isPublishedEl', isPublishedEl)
|
|
loadPreview(info)
|
|
} catch (error) {
|
|
console.log(error)
|
|
alert('Prišlo je do napake.')
|
|
}
|
|
}
|
|
|
|
async function renderTermData(entryId, event) {
|
|
const {
|
|
formEditContent,
|
|
resizeFields,
|
|
previewBtnEl,
|
|
commentsBtnEl,
|
|
showDates
|
|
} = window.dictionaryElements
|
|
event?.preventDefault()
|
|
const dictionaryIdElem = document.getElementById('hidden-dictionary-id')
|
|
const dictctionaryId = dictionaryIdElem.value
|
|
const deleteEntry = document.getElementById('delete-entry')
|
|
try {
|
|
const { data } = await axios.get('/api/v1/entries', {
|
|
params: { id: entryId, dictctionaryId: dictctionaryId }
|
|
})
|
|
insertTermData(entryId, data)
|
|
const isPublishedEl = data.entry.is_published
|
|
const info = new FormData(formEditContent)
|
|
info.append('isPublishedEl', isPublishedEl)
|
|
loadPreview(info)
|
|
changeVersionList(data.entry.versions)
|
|
ce.formEditContent.addEventListener('input', () => (unsaved = true))
|
|
formEditContent.dataset.entryId = entryId
|
|
formEditContent.action = '/api/v1/entries/update'
|
|
previewBtnEl.disabled = false
|
|
previewBtnEl.classList.remove('disabled')
|
|
commentsBtnEl.disabled = false
|
|
commentsBtnEl.classList.remove('disabled')
|
|
formEditContent.action = '/api/v1/entries/update'
|
|
showDates.disabled = false
|
|
duplicateEntry.disabled = false
|
|
deleteEntry.disabled = false
|
|
changeCollapsedContent()
|
|
checkIfValid()
|
|
unsaved = false
|
|
} catch (error) {
|
|
console.log(error)
|
|
} finally {
|
|
resizeFields.forEach(el => autoResize(el))
|
|
window.scrollTo({ top: 0, behavior: 'smooth' })
|
|
}
|
|
}
|
|
|
|
function insertTermData(entryId, data) {
|
|
const { newConnectionBtn } = window.dictionaryElements
|
|
const localeOptions = {
|
|
day: '2-digit',
|
|
month: '2-digit',
|
|
year: 'numeric'
|
|
}
|
|
const termName = document.getElementById('term-name')
|
|
const domainsSecondary = $('#domain-secondary')
|
|
const label = document.getElementById('explanation-field')
|
|
const definition = document.getElementById('definition-field')
|
|
const otherField = document.getElementById('other-field')
|
|
const synonym = $('#synonyms-input')
|
|
const linkRow = document.querySelector('.link-row')
|
|
const image = document.getElementById('image-input-field')
|
|
const video = document.getElementById('video-input-field')
|
|
const audio = document.getElementById('audio-input-field')
|
|
const listForeignDefinitions = document.querySelectorAll(
|
|
'.foreign-definition-el'
|
|
)
|
|
const listForeignTerms = document.querySelectorAll('.foreign-term-el')
|
|
const listForeignSynonyms = document.querySelectorAll(
|
|
'.foreign-synonym-el'
|
|
)
|
|
const foreignContentData = data.entry.foreign_entries
|
|
const termIdText = document.getElementsByClassName('term-id')
|
|
const statusEl = document.getElementById('status-edit')
|
|
const publishedCbox = document.getElementById('published-cbox')
|
|
const terminologyCbox = document.getElementById('terminology-cbox')
|
|
const languageCbox = document.getElementById('language-cbox')
|
|
const languageGroup = document.getElementsByClassName('language')
|
|
const homonymSort = document.getElementById('homonym-sort')
|
|
const latestVersionLabel = document.getElementById('latest-version-label')
|
|
deleteContentData(
|
|
domainsSecondary,
|
|
synonym,
|
|
listForeignDefinitions,
|
|
listForeignTerms,
|
|
listForeignSynonyms,
|
|
image,
|
|
audio,
|
|
video,
|
|
linkRow
|
|
)
|
|
if (data.entry.time_modified) {
|
|
const dateModified = new Date(
|
|
data.entry.time_modified
|
|
).toLocaleDateString('sl-SL', localeOptions)
|
|
latestVersionLabel.textContent = dateModified
|
|
}
|
|
if (entryId)
|
|
for (let i = 0; i < termIdText.length; i++) {
|
|
termIdText[i].textContent = `ID:${entryId}`
|
|
}
|
|
else
|
|
for (let i = 0; i < termIdText.length; i++) {
|
|
termIdText[i].textContent = `ID: Ni idja`
|
|
}
|
|
ce.authorEl.textContent = data.entry.version_author
|
|
ce.versionEl.textContent = `Verzija ${data.entry.version}`
|
|
ce.previewVersion.textContent = `Verzija ${data.entry.version}`
|
|
ce.previewAuthor.textContent = data.entry.version_author
|
|
termName.value = data.entry.term
|
|
? data.entry.term.replace(/"/g, '"')
|
|
: ''
|
|
if (data.entry.status) {
|
|
if (data.entry.status === 'in_edit') statusEl.value = 'in_edit'
|
|
if (data.entry.status === 'complete') statusEl.value = 'complete'
|
|
}
|
|
if (data.entry.is_published) publishedCbox.checked = true
|
|
else publishedCbox.checked = false
|
|
if (data.entry.is_terminology_reviewed) terminologyCbox.checked = true
|
|
if (!data.entry.is_terminology_reviewed) terminologyCbox.checked = false
|
|
if (data.entry.is_language_reviewed) languageCbox.checked = true
|
|
if (!data.entry.is_language_reviewed) languageCbox.checked = false
|
|
if (data.entry.homonym_sort) homonymSort.value = data.entry.homonym_sort
|
|
if (!data.entry.homonym_sort) homonymSort.value = ''
|
|
if (data.allDomainLabels) {
|
|
data.allDomainLabels.forEach(el => {
|
|
const newOption = new Option(el.name, el.name)
|
|
domainsSecondary.append(newOption).trigger('change')
|
|
})
|
|
if (data.entry.domain_labels) {
|
|
domainsSecondary.val(data.entry.domain_labels)
|
|
domainsSecondary.trigger('change')
|
|
}
|
|
}
|
|
if (label) label.value = data.entry.label ? data.entry.label : ''
|
|
if (definition) {
|
|
definition.value = data.entry.definition ? data.entry.definition : ''
|
|
}
|
|
if (otherField) {
|
|
otherField.value = data.entry.other ? data.entry.other : ''
|
|
}
|
|
if (data.entry.synonyms) {
|
|
data.entry.synonyms.forEach(element => {
|
|
if (element.length) {
|
|
const option = new Option(element, element, true, true)
|
|
synonym.append(option).trigger('change')
|
|
}
|
|
})
|
|
}
|
|
if (data.entry.links) {
|
|
data.entry.links.forEach((el, index) => {
|
|
if (index > 0) {
|
|
addConnectionField(ce.formEditContent, newConnectionBtn, el)
|
|
} else {
|
|
const linkType = linkRow.querySelector('.form-select')
|
|
const linkText = linkRow.querySelector('.mc-field')
|
|
linkType.value = el.type
|
|
linkText.value = el.link
|
|
}
|
|
})
|
|
}
|
|
Array.prototype.forEach.call(languageGroup, child => {
|
|
const childLangId = child.dataset.langaugeId
|
|
if (foreignContentData)
|
|
if (foreignContentData.length) {
|
|
foreignContentData.forEach((el, index) => {
|
|
if (parseInt(el.language_id) === parseInt(childLangId)) {
|
|
if (listForeignDefinitions.length) {
|
|
const eleToChange = child.querySelector(
|
|
'.foreign-definition-el'
|
|
)
|
|
if (el.definition) {
|
|
eleToChange.value = el.definition
|
|
} else {
|
|
eleToChange.value = ''
|
|
}
|
|
}
|
|
if (listForeignTerms.length) {
|
|
if (el.term !== undefined) {
|
|
el.term.forEach(element => {
|
|
if (element.length) {
|
|
// eslint-disable-next-line
|
|
var selectTerm = $(
|
|
`[name="foreign[${el.language_id}][term]"]`
|
|
)
|
|
const newOption = new Option(
|
|
element,
|
|
element,
|
|
true,
|
|
true
|
|
)
|
|
selectTerm.append(newOption).trigger('change')
|
|
}
|
|
})
|
|
}
|
|
}
|
|
if (listForeignSynonyms.length) {
|
|
if (el.synonym != null)
|
|
el.synonym.forEach(element => {
|
|
if (element.length) {
|
|
// eslint-disable-next-line
|
|
var selectSyn = $(
|
|
`[name="foreign[${el.language_id}][synonym]"]`
|
|
)
|
|
const newOption = new Option(
|
|
element,
|
|
element,
|
|
true,
|
|
true
|
|
)
|
|
selectSyn.append(newOption).trigger('change')
|
|
}
|
|
})
|
|
}
|
|
}
|
|
})
|
|
}
|
|
})
|
|
|
|
if (image)
|
|
if (data.entry.image) {
|
|
data.entry.image.forEach((el, index) => {
|
|
if (index > 0) addField(ce.formEditContent, ce.newImageBtn, el)
|
|
else image.value = el
|
|
})
|
|
} else image.value = ''
|
|
if (video)
|
|
if (data.entry.video) {
|
|
data.entry.video.forEach((el, index) => {
|
|
if (index > 0) addField(ce.formEditContent, ce.newVideoBtn, el)
|
|
else video.value = el
|
|
})
|
|
} else video.value = ''
|
|
if (audio)
|
|
if (data.entry.audio) {
|
|
data.entry.audio.forEach((el, index) => {
|
|
if (index > 0) addField(ce.formEditContent, ce.newAudioBtn, el)
|
|
else audio.value = el
|
|
})
|
|
} else audio.value = ''
|
|
}
|
|
|
|
async function updateEntry(event, id) {
|
|
const spinnerEl = document.querySelector('.lds-default')
|
|
const saveBtn = document.querySelector('#disabled-submit-btn')
|
|
if (ce.formEditContent.hasAttribute('data-entry-id')) {
|
|
event.preventDefault()
|
|
let entryId = ce.formEditContent.getAttribute('data-entry-id')
|
|
const payload = new URLSearchParams(new FormData(ce.formEditContent))
|
|
payload.set('entryId', entryId)
|
|
try {
|
|
await axios.post(ce.formEditContent.action, payload)
|
|
spinnerEl.classList.remove('d-none')
|
|
saveBtn.classList.add('saved-entry-btn')
|
|
saveBtn.textContent = 'Shranjeno'
|
|
if (id != null) entryId = id
|
|
ajaxSideMenu(entryId)
|
|
} catch (error) {
|
|
let message = 'Prišlo je do napake.'
|
|
if (error.response) {
|
|
message = error.response.data
|
|
} else if (error.request) {
|
|
message = 'Strežnik ni dosegljiv. Poskusite kasneje.'
|
|
}
|
|
messageContainer.textContent = message
|
|
}
|
|
} else {
|
|
event.preventDefault()
|
|
const payload = new URLSearchParams(new FormData(ce.formEditContent))
|
|
try {
|
|
const res = await axios.post(ce.formEditContent.action, payload)
|
|
spinnerEl.classList.remove('d-none')
|
|
saveBtn.classList.add('saved-entry-btn')
|
|
saveBtn.textContent = 'Shranjeno'
|
|
let entryId = res.data.entryId
|
|
if (id != null) entryId = id
|
|
ajaxSideMenu(entryId)
|
|
} catch (error) {
|
|
let message = 'Prišlo je do napake.'
|
|
if (error.response) {
|
|
message = error.response.data
|
|
} else if (error.request) {
|
|
message = 'Strežnik ni dosegljiv. Poskusite kasneje.'
|
|
}
|
|
messageContainer.textContent = message
|
|
} finally {
|
|
changePageContent('first')
|
|
}
|
|
}
|
|
}
|
|
|
|
async function ajaxSideMenu(entryId) {
|
|
const hiddenEl = document.getElementById('hidden-dictionary-id')
|
|
const dictionaryId = hiddenEl.value
|
|
try {
|
|
const { data } = await axios.get('/api/v1/entries/fetch-terms', {
|
|
params: { id: dictionaryId }
|
|
})
|
|
renderTerms(data, entryId)
|
|
} catch (error) {
|
|
let message = 'Prišlo je do napake.'
|
|
if (error.response) {
|
|
message = error.response.data
|
|
} else if (error.request) {
|
|
message = 'Strežnik ni dosegljiv. Poskusite kasneje.'
|
|
}
|
|
messageContainer.textContent = message
|
|
}
|
|
}
|
|
|
|
async function ajaxDeleteEntry() {
|
|
const formData = document.getElementById('form-edit-content')
|
|
const entryId = formData.getAttribute('data-entry-id')
|
|
const selectedEntryEl = document.querySelector('.selected-term-btn')
|
|
const selectedIndex = selectedEntryEl.dataset.index
|
|
try {
|
|
await axios.delete('/api/v1/entries/delete-entry', {
|
|
params: { entryId: entryId }
|
|
})
|
|
await ajaxSideMenu()
|
|
selectNextEntry(selectedIndex)
|
|
} catch (error) {
|
|
console.log(error)
|
|
const message = 'Prišlo je do napake.'
|
|
messageContainer.textContent = message
|
|
}
|
|
}
|
|
|
|
function renderTerms(data, id) {
|
|
const termListMenu = document.getElementById('term-list')
|
|
const linkLabel = document.querySelectorAll(
|
|
'.d-flex .justify-content-between'
|
|
)
|
|
const spinnerEl = document.querySelector('.lds-default')
|
|
spinnerEl.classList.add('d-none')
|
|
const pagination = document.getElementById('data-length')
|
|
linkLabel.forEach(el => el.remove())
|
|
const allTerms = data
|
|
|
|
pagination.textContent = data.length
|
|
const paginationEl = document.getElementById('pagination-content')
|
|
|
|
allTerms.forEach((el, index) => {
|
|
const divEl = document.createElement('div')
|
|
const labelElement = document.createElement('label')
|
|
const spanStatusEl = document.createElement('span')
|
|
labelElement.tabIndex = '0'
|
|
labelElement.title = ''
|
|
labelElement.dataset.bsCustomClass = 'label-tooltip'
|
|
labelElement.dataset.bsOriginalTitle = ''
|
|
divEl.className = 'd-flex justify-content-between'
|
|
spanStatusEl.className = 'me-4'
|
|
spanStatusEl.textContent = el.commentActivityIndicator
|
|
labelElement.dataset.index = index
|
|
const sloTerm = el.term ? el.term.replace(/"/g, '"') : ''
|
|
if (!el.term) {
|
|
labelElement.className =
|
|
'terms-label not-valid-not-published btn p-2 ms-2 me-3 text-truncate justify-content-start d-inline-block'
|
|
if (el.foreignTerm) {
|
|
if (el.foreignTerm.length) {
|
|
labelElement.textContent = `#${el.foreignTerm.replace(
|
|
/"/g,
|
|
'"'
|
|
)}`
|
|
} else labelElement.textContent = '[ni termina]'
|
|
} else labelElement.textContent = '[ni termina]'
|
|
} else {
|
|
if (el.isValid) {
|
|
if (el.isPublished) {
|
|
labelElement.textContent = sloTerm
|
|
labelElement.className =
|
|
'terms-label term-good-btn btn p-2 ms-2 me-3 text-truncate justify-content-start d-inline-block'
|
|
} else {
|
|
labelElement.className =
|
|
'terms-label btn p-2 ms-2 me-3 text-truncate justify-content-start d-inline-block'
|
|
labelElement.textContent = sloTerm
|
|
}
|
|
} else {
|
|
labelElement.textContent = sloTerm
|
|
labelElement.className =
|
|
'terms-label not-valid-not-published btn p-2 ms-2 me-3 text-truncate justify-content-start d-inline-block'
|
|
}
|
|
}
|
|
|
|
labelElement.dataset.termId = el.id
|
|
divEl.appendChild(labelElement)
|
|
divEl.appendChild(spanStatusEl)
|
|
termListMenu.insertBefore(divEl, paginationEl)
|
|
})
|
|
if (id != null) {
|
|
const termListChildren = document.querySelectorAll('.terms-label')
|
|
termListChildren.forEach(el => {
|
|
if (parseInt(id) === parseInt(el.getAttribute('data-term-id'))) {
|
|
activateMe(el)
|
|
return renderTermData(id)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
|
|
if (/\/slovarji\/\d+\/podrocne-oznake/.test(currentPagePath)) {
|
|
const { offsetMain } = window.dictionaryElements
|
|
const noSubareas = document.getElementById('no-subareas-section')
|
|
offsetMain.addEventListener('click', handleAreasClick)
|
|
ce.inputAreaEl = document.getElementById('subarea-input')
|
|
ce.inputAreaEl.addEventListener('input', inputFieldsChecker)
|
|
ce.domainLabelsForm = document.getElementById('dictionary-domain-labels')
|
|
ce.domainLabelsForm.addEventListener('submit', domainLabelsToDb)
|
|
const addAreaBtn = document.getElementById('add-area')
|
|
addAreaBtn.addEventListener('click', () => subareasContent(noSubareas))
|
|
addAreaBtn.addEventListener('click', enableButton)
|
|
const formLabes = document.getElementById('dictionary-domain-labels')
|
|
formLabes.addEventListener('input', enableButton)
|
|
const useBtn = document.getElementById('modal-use-btn')
|
|
useBtn.addEventListener('click', enableButton)
|
|
const dictSideMenu = document.querySelector('.admin-nav-content')
|
|
unsavedData(ce.domainLabelsForm, dictSideMenu, domainLabelsToDb)
|
|
async function domainLabelsToDb(event) {
|
|
const data = domainLabelsForChange()
|
|
const idEl = document.getElementById('subareas-dict-id')
|
|
const id = idEl.value
|
|
event.preventDefault()
|
|
|
|
try {
|
|
await axios.post('/api/v1/dictionaries/update-domain-labels', {
|
|
params: { payload: data, dictionaryId: id }
|
|
})
|
|
} catch (error) {
|
|
console.log(error)
|
|
} finally {
|
|
location.reload(true)
|
|
}
|
|
}
|
|
|
|
function subareasContent(el) {
|
|
const subareasInfo = document.getElementById('subareas-info')
|
|
if (el) {
|
|
if (subareasInfo) subareasInfo.classList.add('d-none')
|
|
el.classList.remove('d-none')
|
|
}
|
|
}
|
|
|
|
{
|
|
const resultsListEl = document.getElementById('page-results')
|
|
const dictionaryId = document.getElementById('subareas-dict-id').value
|
|
|
|
const updatePager = initPagination('pagination', onPageChange)
|
|
|
|
async function onPageChange(newPage) {
|
|
try {
|
|
const { page, numberOfAllPages, results } = await getDataForPage(
|
|
newPage
|
|
)
|
|
removeAllChildNodes(resultsListEl)
|
|
renderResults(results)
|
|
updatePager(page, numberOfAllPages)
|
|
} catch (error) {
|
|
let message = 'Prišlo je do napake.'
|
|
if (error.response?.data) {
|
|
message = error.response.data
|
|
} else if (error.request) {
|
|
message = 'Strežnik ni dosegljiv. Poskusite kasneje.'
|
|
}
|
|
alert(message)
|
|
updatePager()
|
|
}
|
|
}
|
|
|
|
async function getDataForPage(page) {
|
|
const url = `/api/v1/dictionaries/${dictionaryId}/listDomainLabels?p=${page}`
|
|
const { data } = await axios.get(url)
|
|
return data
|
|
}
|
|
|
|
function renderResults(results) {
|
|
results.forEach(result => {
|
|
const rowEl = document.createElement('tr')
|
|
const input = document.createElement('input')
|
|
const th = document.createElement('th')
|
|
const input2 = document.createElement('input')
|
|
const td1 = document.createElement('td')
|
|
const td2 = document.createElement('td')
|
|
const div = document.createElement('div')
|
|
const editBtn = document.createElement('button')
|
|
const deleteBtn = document.createElement('button')
|
|
const imgEditEl = document.createElement('img')
|
|
const imgDelEl = document.createElement('img')
|
|
input.value = result.id
|
|
input.type = 'hidden'
|
|
input.name = 'domainLabelId'
|
|
th.scope = 'row'
|
|
input2.className = 'form-check checkbox-table'
|
|
input2.type = 'checkbox'
|
|
input2.name = 'isVisible'
|
|
input2.disabled = true
|
|
input2.checked = !!result.isVisible
|
|
th.append(input2)
|
|
td1.className = 'tdata-area'
|
|
td1.textContent = result.name
|
|
|
|
td2.classList.add('buttons-group')
|
|
div.classList.add('table-buttons')
|
|
editBtn.className = 'p-0 table-button-grp me-3 edit-row-btn'
|
|
editBtn.type = 'button'
|
|
imgEditEl.src = '/images/u_edit-alt.svg'
|
|
deleteBtn.className = 'p-0 table-button-grp delete-row-btn'
|
|
deleteBtn.dataset.bsTarget = '#alert-modal'
|
|
deleteBtn.dataset.bsToggle = 'modal'
|
|
deleteBtn.type = 'button'
|
|
imgDelEl.src = '/images/red-trash-icon.svg'
|
|
td2.append(div)
|
|
div.append(editBtn, deleteBtn)
|
|
editBtn.append(imgEditEl)
|
|
deleteBtn.append(imgDelEl)
|
|
|
|
rowEl.append(input, th, td1, td2)
|
|
resultsListEl.appendChild(rowEl)
|
|
})
|
|
}
|
|
}
|
|
}
|
|
|
|
if (/\/slovarji\/\d+\/napredno/.test(currentPagePath)) {
|
|
const dictionaryId = document.getElementById('adv-dictionary-id').value
|
|
const indexEntriesBtn = document.getElementById('index-entries-btn')
|
|
const deleteAllEntriesBtn = document.getElementById(
|
|
'adv-delete-all-entries'
|
|
)
|
|
const deleteDictionaryBtn = document.getElementById('adv-delete-dictionary')
|
|
const publishAllEntriesBtn = document.getElementById(
|
|
'adv-publish-all-entries'
|
|
)
|
|
if (document.getElementById('index-entries')) {
|
|
const indexEntries = new bootstrap.Modal(
|
|
document.getElementById('index-entries')
|
|
)
|
|
}
|
|
const deleteEntriesModal = new bootstrap.Modal(
|
|
document.getElementById('delete-entries')
|
|
)
|
|
const deleteDictionaryModal = new bootstrap.Modal(
|
|
document.getElementById('delete-dictionary')
|
|
)
|
|
const publishEntriesModal = new bootstrap.Modal(
|
|
document.getElementById('publish-entries')
|
|
)
|
|
const modalUseBtns = document.querySelectorAll('.modal-use-btn')
|
|
|
|
const deleteEntriesRes = new bootstrap.Modal(
|
|
document.getElementById('delete-entries-res')
|
|
)
|
|
const deleteDictionaryRes = new bootstrap.Modal(
|
|
document.getElementById('delete-dict-res')
|
|
)
|
|
const publishEntriesRes = new bootstrap.Modal(
|
|
document.getElementById('publish-entries-res')
|
|
)
|
|
|
|
let reqUrl, reqMethod, resType
|
|
|
|
// TODO: Aljaž to Luka: Section down below is where index API will be called. (From pug: express/views/pages/admin/dictionary-advanced.pug)
|
|
// indexEntriesBtn.addEventListener('click', () =>
|
|
// showConfirmation(`url`, 'index', indexEntries)
|
|
// )
|
|
deleteAllEntriesBtn.addEventListener('click', () =>
|
|
showConfirmation(
|
|
`/api/v1/dictionaries/${dictionaryId}/entries/all`,
|
|
'delete',
|
|
deleteEntriesModal,
|
|
deleteEntriesRes
|
|
)
|
|
)
|
|
deleteDictionaryBtn.addEventListener('click', () =>
|
|
showConfirmation(
|
|
`/api/v1/dictionaries/${dictionaryId}`,
|
|
'delete',
|
|
deleteDictionaryModal,
|
|
deleteDictionaryRes
|
|
)
|
|
)
|
|
publishAllEntriesBtn.addEventListener('click', () =>
|
|
showConfirmation(
|
|
`/api/v1/dictionaries/${dictionaryId}/entries/all/publish`,
|
|
'put',
|
|
publishEntriesModal,
|
|
publishEntriesRes
|
|
)
|
|
)
|
|
|
|
function showConfirmation(url, method, alertType, responseType) {
|
|
reqUrl = url
|
|
reqMethod = method
|
|
alertType.show()
|
|
resType = responseType
|
|
}
|
|
|
|
modalUseBtns.forEach(el => el.addEventListener('click', sendAjaxReq))
|
|
|
|
async function sendAjaxReq() {
|
|
const modalSpinner = new bootstrap.Modal(
|
|
document.getElementById('modal-spinner')
|
|
)
|
|
try {
|
|
modalSpinner.toggle()
|
|
await axios[reqMethod](reqUrl)
|
|
resType.show()
|
|
modalSpinner.hide()
|
|
} catch (error) {
|
|
console.log(error)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
function adjustOffsetBy() {
|
|
const { offsetMain, fixedTopSection } = window.dictionaryElements
|
|
const referenceHeight = fixedTopSection.offsetHeight
|
|
const offsetHeader = document.getElementsByClassName('offset-header')
|
|
const offsetHeaderPadding = document.getElementById('offset-padding')
|
|
// const adminNavMobile = document.getElementsByClassName('admin-nav')
|
|
const headerPadding = document.getElementById('header-padding')
|
|
if (
|
|
(!/\/slovarji\/\d+\/vsebina/.test(currentPagePath) &&
|
|
document.body.clientWidth < 1200) ||
|
|
(/\/slovarji\/\d+\/vsebina/.test(currentPagePath) &&
|
|
document.body.clientWidth < 768)
|
|
) {
|
|
if (offsetHeaderPadding !== null) offsetMain.style.paddingTop = `0px`
|
|
} else {
|
|
for (let i = 0; i < offsetHeader.length; i++) {
|
|
offsetHeader[i].style.paddingTop = `${referenceHeight}px`
|
|
}
|
|
if (headerPadding !== null) {
|
|
const headerPaddingHeight = headerPadding.offsetHeight
|
|
offsetMain.style.paddingTop = `${headerPaddingHeight}px`
|
|
}
|
|
if (offsetHeaderPadding !== null) {
|
|
const offsetHeaderHeight = offsetHeaderPadding.offsetHeight
|
|
offsetMain.style.paddingTop = `${
|
|
referenceHeight + offsetHeaderHeight - 10
|
|
}px`
|
|
}
|
|
}
|
|
}
|
|
|
|
function hideAndShowHeader() {
|
|
const { textDescription, headerTitle } = window.dictionaryElements
|
|
if (!/\/slovarji\/\d+\/vsebina/.test(currentPagePath)) {
|
|
if (document.documentElement.scrollTop < 50) {
|
|
textDescription.style.display = 'block'
|
|
headerTitle.style.display = 'block'
|
|
} else {
|
|
textDescription.style.display = 'none'
|
|
headerTitle.style.display = 'none'
|
|
}
|
|
}
|
|
}
|
|
|
|
function mobileMoveContent() {
|
|
if (!/\/slovarji\/\d+\/vsebina/.test(currentPagePath)) {
|
|
const adminNavMobileEl = document.getElementById('admin-nav-mobile')
|
|
const mobileRightHolder = document.getElementById('mobile-right-holder')
|
|
const secondaryButton = document.querySelector('.header-btn-secondary')
|
|
const primaryButton = document.querySelector('.header-btn')
|
|
const siteHeading = document.getElementById('site-heading')
|
|
const siteHeadingTextContent = siteHeading.textContent
|
|
const navTitle = document.getElementById('nav-title')
|
|
const headerContainerRight = document.querySelector(
|
|
'.header-container-divider-right'
|
|
)
|
|
if (document.body.clientWidth <= 1200) {
|
|
if (secondaryButton) {
|
|
mobileRightHolder.appendChild(secondaryButton)
|
|
secondaryButton.style.height = '28px'
|
|
// secondaryButton.style.width = '99px'
|
|
secondaryButton.style.marginRight = '10px'
|
|
}
|
|
if (primaryButton) {
|
|
mobileRightHolder.appendChild(primaryButton)
|
|
adminNavMobileEl.classList.add('align-items-center')
|
|
adminNavMobileEl.classList.add('justify-content-between')
|
|
// primaryButton.style.height = '28px'
|
|
// primaryButton.style.width = '99px'
|
|
// primaryButton.style.marginRight = '10px'
|
|
primaryButton.style.whiteSpace = 'nowrap'
|
|
}
|
|
navTitle.textContent = siteHeadingTextContent
|
|
siteHeading.style.display = 'none'
|
|
}
|
|
if (document.body.clientWidth > 1200) {
|
|
if (secondaryButton) {
|
|
headerContainerRight.appendChild(secondaryButton)
|
|
secondaryButton.style.height = ''
|
|
secondaryButton.style.width = ''
|
|
secondaryButton.style.marginRight = ''
|
|
}
|
|
if (primaryButton) {
|
|
headerContainerRight.appendChild(primaryButton)
|
|
adminNavMobileEl.classList.remove('align-items-center')
|
|
adminNavMobileEl.classList.remove('justify-content-between')
|
|
primaryButton.style.height = ''
|
|
primaryButton.style.width = ''
|
|
primaryButton.style.marginRight = ''
|
|
primaryButton.style.whiteSpace = ''
|
|
}
|
|
|
|
if (
|
|
currentPagePath.includes('slovarji') &&
|
|
!currentPagePath.includes('admin')
|
|
)
|
|
navTitle.textContent = 'Urejanje'
|
|
else navTitle.textContent = 'Administrator'
|
|
siteHeading.style.display = 'block'
|
|
}
|
|
}
|
|
}
|
|
|
|
function checkIfValid() {
|
|
const { formEditContent } = window.dictionaryElements
|
|
const entryId = formEditContent.getAttribute('data-entry-id')
|
|
if (entryId) {
|
|
const info = new FormData(formEditContent)
|
|
const langList = []
|
|
const termList = []
|
|
let isValid
|
|
let hasForeignTerm = false
|
|
info.forEach(function (value, key) {
|
|
if (key.startsWith('foreign') && key.endsWith('[code]'))
|
|
langList.push(key)
|
|
if (key.startsWith('foreign') && key.endsWith('[term]'))
|
|
termList.push(key)
|
|
})
|
|
if (langList.length) {
|
|
termList.forEach(el => {
|
|
if (info.get(el).length) {
|
|
hasForeignTerm = true
|
|
}
|
|
})
|
|
}
|
|
const messageContainer = document.querySelectorAll('.message-container')
|
|
const errorType1 = document.querySelectorAll('.error-type-1')
|
|
const errorType2 = document.querySelectorAll('.error-type-2')
|
|
const noteSectionLine = document.querySelector('.note-section-line')
|
|
const termLength = !!info.get('term').length
|
|
let defLength
|
|
if (info.has('definition')) defLength = !!info.get('definition').length
|
|
if (termLength && (defLength || hasForeignTerm)) {
|
|
messageContainer.forEach(el => el.classList.add('d-none'))
|
|
isValid = true
|
|
noteSectionLine.classList.remove('d-none')
|
|
enablePublishBtn(isValid)
|
|
} else {
|
|
messageContainer.forEach(el => el.classList.remove('d-none'))
|
|
isValid = false
|
|
noteSectionLine.classList.add('d-none')
|
|
enablePublishBtn(isValid)
|
|
}
|
|
if (!termLength) errorType1.forEach(el => el.classList.remove('d-none'))
|
|
else errorType1.forEach(el => el.classList.add('d-none'))
|
|
if (defLength || hasForeignTerm)
|
|
errorType2.forEach(el => el.classList.add('d-none'))
|
|
else errorType2.forEach(el => el.classList.remove('d-none'))
|
|
}
|
|
}
|
|
|
|
function enablePublishBtn(isValid) {
|
|
const publishedCbox = document.getElementById('published-cbox')
|
|
const canPublishEl = document.getElementById('can-publish-entries-in-edit')
|
|
const canPublishElValue = canPublishEl.checked
|
|
const statusEl = document.getElementById('status-edit')
|
|
const statusElValue = statusEl.value
|
|
if (statusElValue === 'in_edit')
|
|
if (canPublishElValue && isValid) publishedCbox.disabled = false
|
|
else publishedCbox.disabled = true
|
|
if (statusElValue === 'complete')
|
|
if (isValid) publishedCbox.disabled = false
|
|
else publishedCbox.disabled = true
|
|
if (statusElValue === 'suggestion') publishedCbox.disabled = true
|
|
}
|
|
|
|
function createNewAreaInput(pageForm) {
|
|
const divSmallNameArea = document.createElement('div')
|
|
const divSubjectName = document.createElement('div')
|
|
const spanInputNameTxtSlo = document.createElement('span')
|
|
const spanInputNameTxtEng = document.createElement('span')
|
|
const divRow = document.createElement('div')
|
|
const divRow2 = document.createElement('div')
|
|
const divColSm5 = document.createElement('div')
|
|
const divColSm52 = document.createElement('div')
|
|
const inputGroup = document.createElement('div')
|
|
const inputFieldSlo = document.createElement('input')
|
|
const inputFieldEng = document.createElement('input')
|
|
const spanDeleteAreaBtn = document.createElement('span')
|
|
const imgTrashIcon = document.createElement('img')
|
|
const divColSm = document.createElement('div')
|
|
const divColSm2 = document.createElement('div')
|
|
const divEnglishInput = document.createElement('div')
|
|
const spanNameInfoTxt = document.createElement('span')
|
|
const spanNameInfoTxtEng = document.createElement('span')
|
|
|
|
divSmallNameArea.className = 'author mt-4 added-field'
|
|
divSubjectName.className = 'subject-name'
|
|
spanInputNameTxtSlo.className = 'input-name-txt'
|
|
spanInputNameTxtSlo.textContent = 'NOVO PODPODROČJE (slovensko)'
|
|
spanInputNameTxtEng.className = 'input-name-txt mt-4'
|
|
spanInputNameTxtEng.textContent = 'NOVO PODPODROČJE (angleško)'
|
|
divRow.className = 'row align-items-center'
|
|
divRow2.className = 'row align-items-center'
|
|
divEnglishInput.className = 'mt-4'
|
|
divColSm5.className = 'col-sm-6'
|
|
divColSm52.className = 'col-sm-6'
|
|
inputGroup.className = 'input-group d-flex'
|
|
inputFieldSlo.className = 'name-input d-inline form-control icon-trash w-75'
|
|
inputFieldSlo.name = 'domainSecondaryNewNameSl'
|
|
inputFieldSlo.maxLength = '64'
|
|
inputFieldEng.className = 'name-input form-control w-100'
|
|
inputFieldEng.name = 'domainSecondaryNewNameEn'
|
|
inputFieldEng.maxLength = '64'
|
|
spanDeleteAreaBtn.className = 'input-group-text delete-author-btn'
|
|
spanDeleteAreaBtn.id = 'trash-icon-btn'
|
|
spanDeleteAreaBtn.addEventListener('click', deleteField)
|
|
imgTrashIcon.src = '/images/red-trash-icon.svg'
|
|
imgTrashIcon.alt = 'Delete'
|
|
divColSm.className = 'col-sm mt-3 mt-sm-0'
|
|
divColSm2.className = 'col-sm mt-3 mt-sm-0'
|
|
spanNameInfoTxt.className = 'd-sm-inline name-info-txt ms-xxl-3 ms-md-3'
|
|
spanNameInfoTxt.textContent =
|
|
'Vpišite novo podpodročje. Na seznamu podpodročij bo vidno takoj po potrditvi administratorja portala.'
|
|
spanNameInfoTxtEng.className =
|
|
'd-sm-inline name-info-txt ms-xxl-3 ms-md-3 mt-4'
|
|
spanNameInfoTxtEng.textContent = 'Novo podpodročje (angleško).'
|
|
|
|
divSmallNameArea.appendChild(divSubjectName)
|
|
divSubjectName.appendChild(spanInputNameTxtSlo)
|
|
divSmallNameArea.appendChild(divRow)
|
|
divRow.appendChild(divColSm5)
|
|
divColSm5.appendChild(inputGroup)
|
|
inputGroup.appendChild(inputFieldSlo)
|
|
inputGroup.appendChild(spanDeleteAreaBtn)
|
|
spanDeleteAreaBtn.appendChild(imgTrashIcon)
|
|
|
|
divSmallNameArea.appendChild(divEnglishInput)
|
|
divEnglishInput.appendChild(spanInputNameTxtEng)
|
|
divRow.appendChild(divColSm)
|
|
divColSm.appendChild(spanNameInfoTxt)
|
|
divSmallNameArea.appendChild(divRow2)
|
|
divRow2.appendChild(divColSm52)
|
|
divColSm52.appendChild(inputFieldEng)
|
|
divRow2.appendChild(divColSm2)
|
|
divColSm2.appendChild(spanNameInfoTxtEng)
|
|
|
|
const addNewSmallAreaBtn = document.getElementById('add-new-area')
|
|
|
|
pageForm.insertBefore(divSmallNameArea, addNewSmallAreaBtn)
|
|
}
|
|
|
|
function deleteField({ target }) {
|
|
const element = target.closest('.added-field')
|
|
const alertModal = new bootstrap.Modal(document.getElementById('alert-modal'))
|
|
alertModal.toggle()
|
|
const modalUseBtn = document.getElementById('modal-use-btn')
|
|
modalUseBtn.addEventListener('click', () => {
|
|
element.remove()
|
|
alertModal.hide()
|
|
})
|
|
}
|
|
|
|
function checkBoxLanguageChecker() {
|
|
const {
|
|
checkLanguageGroup,
|
|
languagesInput,
|
|
definitionLanguageSubgroup,
|
|
terminLanguageSubgroup,
|
|
synonymLanguageSubgroup,
|
|
definitionCheckBox
|
|
} = window.dictionaryElements
|
|
|
|
if (checkLanguageGroup.checked) {
|
|
languagesInput.disabled = false
|
|
terminLanguageSubgroup.checked = true
|
|
definitionLanguageSubgroup.classList.remove('disabled-input')
|
|
synonymLanguageSubgroup.classList.remove('disabled-input')
|
|
definitionCheckBox.classList.remove('disabled-input')
|
|
} else {
|
|
$('.without-addition').val(null).trigger('change')
|
|
languagesInput.disabled = true
|
|
terminLanguageSubgroup.checked = false
|
|
definitionLanguageSubgroup.checked = false
|
|
definitionLanguageSubgroup.classList.add('disabled-input')
|
|
synonymLanguageSubgroup.checked = false
|
|
synonymLanguageSubgroup.classList.add('disabled-input')
|
|
definitionCheckBox.classList.add('disabled-input')
|
|
}
|
|
}
|
|
|
|
function checkBoxDefinitionChecker() {
|
|
const { checkLanguageGroup, definitionCheckBox } = window.dictionaryElements
|
|
|
|
if (definitionCheckBox.checked === false) {
|
|
checkLanguageGroup.classList.add('disabled-input')
|
|
}
|
|
|
|
if (definitionCheckBox.checked === true) {
|
|
checkLanguageGroup.classList.remove('disabled-input')
|
|
}
|
|
}
|
|
|
|
function enableButton() {
|
|
const disabledBtn = document.getElementById('disabled-submit-btn')
|
|
disabledBtn.disabled = false
|
|
if (disabledBtn.classList.contains('saved-entry-btn')) {
|
|
disabledBtn.classList.remove('saved-entry-btn')
|
|
disabledBtn.textContent = 'Shrani'
|
|
}
|
|
}
|
|
|
|
function disableButton() {
|
|
const disabledBtn = document.getElementById('disabled-submit-btn')
|
|
disabledBtn.disabled = true
|
|
if (disabledBtn.classList.contains('saved-entry-btn')) {
|
|
disabledBtn.classList.remove('saved-entry-btn')
|
|
disabledBtn.textContent = 'Shrani'
|
|
}
|
|
}
|
|
|
|
function changePageContent(el) {
|
|
const {
|
|
previewBtnEl,
|
|
editBtnEl,
|
|
commentsBtnEl,
|
|
commentsButtonsGroup,
|
|
previewButtonsGroup,
|
|
showDates,
|
|
previewSection,
|
|
editSection,
|
|
commentsSection,
|
|
classicOverview,
|
|
// selectedOverview,
|
|
selectAllDates,
|
|
btnSaveIcon,
|
|
formEditContent,
|
|
noEntriesText,
|
|
newEntryBtn,
|
|
entryPreviewSection,
|
|
resizeFields,
|
|
authorEl,
|
|
versionEl,
|
|
previewVersion,
|
|
previewAuthor,
|
|
termInputField
|
|
} = window.dictionaryElements
|
|
const info = new FormData(formEditContent)
|
|
const spanFilterText = document.getElementById('span-filter')
|
|
const duplicateEntry = document.getElementById('duplicate-entry')
|
|
const deleteEntry = document.getElementById('delete-entry')
|
|
const termIdText = document.querySelectorAll('.term-id')
|
|
const selectedEntry = document.querySelector('.selected-term-btn')
|
|
const collapsedText = document.querySelectorAll('.collapsed-text')
|
|
const collapsableBtn = document.querySelectorAll('.collapsable-entry-btn')
|
|
const addedFields = document.querySelectorAll('.added-field')
|
|
const collapsibleData = document.querySelectorAll('.collapsible-data')
|
|
switch (el) {
|
|
case 'content-preview':
|
|
loadPreview(info)
|
|
previewBtnEl.classList.add('active-site-link')
|
|
editBtnEl.classList.remove('active-site-link')
|
|
commentsBtnEl.classList.remove('active-site-link')
|
|
previewButtonsGroup.classList.remove('d-none')
|
|
commentsButtonsGroup.classList.add('d-none')
|
|
previewSection.classList.remove('d-none')
|
|
editSection.classList.add('d-none')
|
|
commentsSection.classList.add('d-none')
|
|
break
|
|
case 'content-edit':
|
|
editBtnEl.classList.add('active-site-link')
|
|
previewBtnEl.classList.remove('active-site-link')
|
|
commentsBtnEl.classList.remove('active-site-link')
|
|
previewButtonsGroup.classList.remove('d-none')
|
|
commentsButtonsGroup.classList.add('d-none')
|
|
previewSection.classList.add('d-none')
|
|
editSection.classList.remove('d-none')
|
|
commentsSection.classList.add('d-none')
|
|
resizeFields.forEach(el => autoResize(el))
|
|
break
|
|
case 'content-comments':
|
|
commentsBtnEl.classList.add('active-site-link')
|
|
editBtnEl.classList.remove('active-site-link')
|
|
previewBtnEl.classList.remove('active-site-link')
|
|
previewButtonsGroup.classList.add('d-none')
|
|
commentsButtonsGroup.classList.remove('d-none')
|
|
previewSection.classList.add('d-none')
|
|
editSection.classList.add('d-none')
|
|
commentsSection.classList.remove('d-none')
|
|
break
|
|
case 'show-dates':
|
|
window.scrollTo({ top: 0, behavior: 'smooth' })
|
|
showDates.classList.remove('btn-secondary')
|
|
showDates.classList.add('btn-primary')
|
|
showDates.firstChild.src = '/images/fi_calendar-white.svg'
|
|
showDates.id = 'hide-dates'
|
|
showDates.children[0].setAttribute(
|
|
'data-bs-original-title',
|
|
'Skrij verzije'
|
|
)
|
|
break
|
|
case 'hide-dates':
|
|
showDates.classList.remove('btn-primary')
|
|
showDates.classList.add('btn-secondary')
|
|
showDates.children[0].setAttribute(
|
|
'data-bs-original-title',
|
|
'Prikaži verzije'
|
|
)
|
|
// selectedOverview.classList.add('d-none')
|
|
classicOverview.classList.remove('d-none')
|
|
selectAllDates.forEach(el => (el.checked = false))
|
|
showDates.firstChild.src = '/images/fi_blue-calendar.svg'
|
|
showDates.id = 'show-dates'
|
|
btnSaveIcon.firstChild.src = '/images/fi_save.svg'
|
|
btnSaveIcon.children[1].textContent = 'Shrani'
|
|
btnSaveIcon.id = 'btn-save-icon'
|
|
break
|
|
case 'new-entry-btn': {
|
|
// formEditContent.reset()
|
|
formEditContent.removeAttribute('data-entry-id')
|
|
formEditContent.action = '/api/v1/entries/create'
|
|
if (editSection.classList.contains('d-none'))
|
|
editSection.classList.remove('d-none')
|
|
if (noEntriesText)
|
|
if (!noEntriesText.classList.contains('d-none'))
|
|
noEntriesText.classList.add('d-none')
|
|
if (editBtnEl.classList.contains('disabled')) {
|
|
editBtnEl.classList.remove('disabled')
|
|
editBtnEl.disabled = false
|
|
}
|
|
if (newEntryBtn.dataset.term) {
|
|
previewBtnEl.classList.add('disabled')
|
|
previewBtnEl.disabled = true
|
|
delete newEntryBtn.dataset.term
|
|
}
|
|
authorEl.textContent = ''
|
|
versionEl.textContent = 'Verzija 1'
|
|
previewAuthor.textContent = ''
|
|
previewVersion.textContent = 'Verzija 1'
|
|
termIdText.forEach(el => (el.textContent = 'ID:'))
|
|
commentsBtnEl.disabled = true
|
|
commentsBtnEl.classList.add('disabled')
|
|
showDates.disabled = true
|
|
duplicateEntry.disabled = true
|
|
deleteEntry.disabled = true
|
|
changeCollapsedContent()
|
|
if (addedFields.length) addedFields.forEach(el => el.remove())
|
|
editBtnEl.click()
|
|
termInputField.focus()
|
|
const messageContainer = document.querySelectorAll('.message-container')
|
|
messageContainer.forEach(el => el.classList.add('d-none'))
|
|
window.scrollTo({ top: 0, behavior: 'smooth' })
|
|
selectedEntry.classList.remove('selected-term-btn')
|
|
$('.multiple').val(null).trigger('change')
|
|
$('.without-dropdown').val(null).trigger('change')
|
|
editBtnEl.click()
|
|
break
|
|
}
|
|
case 'first':
|
|
if (entryPreviewSection)
|
|
if (entryPreviewSection.classList.contains('d-none'))
|
|
entryPreviewSection.classList.remove('d-none')
|
|
if (!previewBtnEl.classList.contains('d-none'))
|
|
previewBtnEl.classList.remove('d-none')
|
|
previewBtnEl.disabled = false
|
|
previewBtnEl.classList.remove('disabled')
|
|
commentsBtnEl.disabled = false
|
|
commentsBtnEl.classList.remove('disabled')
|
|
formEditContent.action = '/api/v1/entries/update'
|
|
showDates.disabled = false
|
|
duplicateEntry.disabled = false
|
|
deleteEntry.disabled = false
|
|
previewBtnEl.click()
|
|
break
|
|
case 'duplicate-entry':
|
|
formEditContent.removeAttribute('data-entry-id')
|
|
formEditContent.action = '/api/v1/entries/create'
|
|
if (editSection.classList.contains('d-none'))
|
|
editSection.classList.remove('d-none')
|
|
if (noEntriesText)
|
|
if (!noEntriesText.classList.contains('d-none'))
|
|
noEntriesText.classList.add('d-none')
|
|
if (editBtnEl.classList.contains('disabled')) {
|
|
editBtnEl.classList.remove('disabled')
|
|
editBtnEl.disabled = false
|
|
}
|
|
if (newEntryBtn.dataset.term) {
|
|
previewBtnEl.classList.add('disabled')
|
|
previewBtnEl.disabled = true
|
|
delete newEntryBtn.dataset.term
|
|
}
|
|
authorEl.textContent = ''
|
|
versionEl.textContent = 'Verzija 1'
|
|
previewAuthor.textContent = ''
|
|
previewVersion.textContent = 'Verzija 1'
|
|
termIdText.forEach(el => (el.textContent = 'ID:'))
|
|
commentsBtnEl.disabled = true
|
|
commentsBtnEl.classList.add('disabled')
|
|
showDates.disabled = true
|
|
duplicateEntry.disabled = true
|
|
deleteEntry.disabled = true
|
|
changeCollapsedContent()
|
|
editBtnEl.click()
|
|
termInputField.focus()
|
|
window.scrollTo({ top: 0, behavior: 'smooth' })
|
|
selectedEntry.classList.remove('selected-term-btn')
|
|
editBtnEl.click()
|
|
break
|
|
case 'true':
|
|
spanFilterText.classList.remove('normal-gray-label')
|
|
spanFilterText.classList.add('small-blue-text')
|
|
break
|
|
case 'false':
|
|
spanFilterText.classList.remove('small-blue-text')
|
|
spanFilterText.classList.add('normal-gray-label')
|
|
break
|
|
case 'collapse-hidden':
|
|
collapsibleData.forEach(e => e.classList.remove('opened-row-data'))
|
|
collapsedText.forEach(el => el.classList.remove('d-none'))
|
|
changeCollapsedContent()
|
|
collapsableBtn.forEach(el => el.classList.remove('entry-uncollapsed'))
|
|
collapsableBtn.forEach(el => el.classList.add('entry-collapsed'))
|
|
break
|
|
case 'collapse-shown':
|
|
collapsibleData.forEach(e => e.classList.add('opened-row-data'))
|
|
collapsableBtn.forEach(el => el.classList.remove('entry-collapsed'))
|
|
collapsableBtn.forEach(el => el.classList.add('entry-uncollapsed'))
|
|
break
|
|
case 'collapse-show':
|
|
collapsibleData.forEach(e => e.classList.add('opened-row-data'))
|
|
collapsedText.forEach(el => el.classList.add('d-none'))
|
|
break
|
|
}
|
|
}
|
|
|
|
function loadPreview(info) {
|
|
const previewDomainSec = document.getElementById('preview-domain-secondary')
|
|
const previewLabel = document.getElementById('preview-label')
|
|
const previewDefinition = document.getElementById('preview-definition')
|
|
const previewSynonym = document.getElementById('preview-synonym')
|
|
const previewLinkedTerms = document.getElementById('preview-linked-term')
|
|
const previewOther = document.getElementById('preview-other-field')
|
|
const selectedOther = document.getElementById('selected-other-field')
|
|
const previewImages = document.getElementById('preview-images')
|
|
const previewAudio = document.getElementById('preview-audio')
|
|
const previewVideos = document.getElementById('preview-video')
|
|
const selectedTerm = document.getElementById('selected-term')
|
|
const selectedDomainSec = document.getElementById('selected-domain-secondary')
|
|
const selectedLabel = document.getElementById('selected-label')
|
|
const selectedDef = document.getElementById('selected-definition')
|
|
const selectedSynonyms = document.getElementById('selected-synonyms')
|
|
const linkedTerms = document.getElementById('linked-terms')
|
|
const listForeignTerm = document.querySelectorAll('.preview-f-term')
|
|
const listForeignDefinitions = document.querySelectorAll('.preview-f-def')
|
|
const listForeignSynonyms = document.querySelectorAll('.preview-f-synonym')
|
|
const selectedImages = document.getElementById('selected-images')
|
|
const selectedAudio = document.getElementById('selected-audio')
|
|
const selectedVideo = document.getElementById('selected-video')
|
|
const selectedStatus = document.getElementById('status-overview')
|
|
const publishedOverview = document.getElementById('published-overview')
|
|
const terminologyOverview = document.getElementById('terminology-overview')
|
|
const languageOverview = document.getElementById('language-overview')
|
|
const previewHomonym = document.getElementById('preview-homonym')
|
|
const data = {}
|
|
for (const [key, value] of info.entries()) {
|
|
if (!Object.prototype.hasOwnProperty.call(data, key)) {
|
|
data[key] = value
|
|
continue
|
|
}
|
|
if (!Array.isArray(data[key])) {
|
|
data[key] = [data[key]]
|
|
}
|
|
data[key].push(value)
|
|
}
|
|
const foreignTerm = Object.keys(data).filter(
|
|
k => k.startsWith('foreign') && k.endsWith('[term]')
|
|
)
|
|
const foreignDef = Object.keys(data).filter(
|
|
k => k.startsWith('foreign') && k.endsWith('[definition]')
|
|
)
|
|
const foreignSyn = Object.keys(data).filter(
|
|
k => k.startsWith('foreign') && k.endsWith('[synonym]')
|
|
)
|
|
if (data.links) linkedTerms.innerHTML = ''
|
|
removeOldMedia(selectedImages, selectedAudio, selectedVideo)
|
|
if (data.status) {
|
|
if (data.status === 'in_edit') {
|
|
selectedStatus.value = 'in-editing'
|
|
}
|
|
if (data.status === 'complete') {
|
|
selectedStatus.value = 'edited'
|
|
}
|
|
}
|
|
if (data.isPublishedEl === 'true') publishedOverview.checked = true
|
|
if (data.isPublishedEl === 'false') publishedOverview.checked = false
|
|
if (data.isTerminologyReviewed) terminologyOverview.checked = true
|
|
if (!data.isTerminologyReviewed) terminologyOverview.checked = false
|
|
if (data.isLanguageReviewed) languageOverview.checked = true
|
|
if (!data.isLanguageReviewed) languageOverview.checked = false
|
|
if (data.term.length > 0) selectedTerm.innerHTML = data.term
|
|
else selectedTerm.innerHTML = ''
|
|
if (data.homonymSort) {
|
|
previewHomonym.value = `${data.homonymSort}`
|
|
} else {
|
|
previewHomonym.value = ''
|
|
}
|
|
if (previewLabel)
|
|
if (data.label.length) {
|
|
changeClasses(previewLabel, 'show')
|
|
// selectedLabel.textContent = data.label
|
|
selectedLabel.innerHTML = data.label
|
|
} else changeClasses(previewLabel, 'hide')
|
|
if (previewOther)
|
|
if (data.other) {
|
|
if (data.other.length) {
|
|
changeClasses(previewOther, 'show')
|
|
// selectedLabel.textContent = data.label
|
|
selectedOther.innerHTML = data.other
|
|
}
|
|
} else changeClasses(previewOther, 'hide')
|
|
if (previewDefinition)
|
|
if (data.definition) {
|
|
changeClasses(previewDefinition, 'show')
|
|
// selectedDef.textContent = data.definition
|
|
selectedDef.innerHTML = data.definition
|
|
} else changeClasses(previewDefinition, 'hide')
|
|
if (previewDomainSec)
|
|
if (data.domainLabels) {
|
|
changeClasses(previewDomainSec, 'show')
|
|
let items
|
|
if (!Array.isArray(data.domainLabels)) items = [data.domainLabels]
|
|
else items = data.domainLabels
|
|
selectedDomainSec.textContent = `${items.join(', ')}`
|
|
} else changeClasses(previewDomainSec, 'hide')
|
|
if (previewSynonym)
|
|
if (data.synonyms) {
|
|
changeClasses(previewSynonym, 'show')
|
|
let items
|
|
if (!Array.isArray(data.synonyms)) items = [data.synonyms]
|
|
else items = data.synonyms
|
|
selectedSynonyms.innerHTML = `${items.join(', ')}`
|
|
} else changeClasses(previewSynonym, 'hide')
|
|
if (previewImages)
|
|
if (data.image) {
|
|
if (typeof data.image === 'object') {
|
|
data.image.forEach((el, index) => {
|
|
if (index === data.image.length - 1) {
|
|
renderLinks(selectedImages, el, 'last')
|
|
} else renderLinks(selectedImages, el)
|
|
})
|
|
} else renderLinks(selectedImages, data.image, 'last')
|
|
changeClasses(previewImages, 'show')
|
|
} else changeClasses(previewImages, 'hide')
|
|
if (previewAudio)
|
|
if (data.audio) {
|
|
if (typeof data.audio === 'object') {
|
|
data.audio.forEach((el, index) => {
|
|
if (index === data.audio.length - 1) {
|
|
renderLinks(selectedAudio, el, 'last')
|
|
} else renderLinks(selectedAudio, el)
|
|
})
|
|
} else renderLinks(selectedAudio, data.audio, 'last')
|
|
changeClasses(previewAudio, 'show')
|
|
} else changeClasses(previewAudio, 'hide')
|
|
if (previewVideos)
|
|
if (data.video) {
|
|
if (typeof data.video === 'object') {
|
|
data.video.forEach((el, index) => {
|
|
if (index === data.video.length - 1) {
|
|
renderLinks(selectedVideo, el, 'last')
|
|
} else renderLinks(selectedVideo, el)
|
|
})
|
|
} else renderLinks(selectedVideo, data.video, 'last')
|
|
changeClasses(previewVideos, 'show')
|
|
} else changeClasses(previewVideos, 'hide')
|
|
if (previewLinkedTerms)
|
|
if (data.links) {
|
|
changeClasses(previewLinkedTerms, 'show')
|
|
const linksArr = createLinksObj(data.type, data.links)
|
|
for (const i in linksArr) {
|
|
for (const key in linksArr[i]) {
|
|
const keyTxt =
|
|
linksArr[i][key] === 'narrow'
|
|
? 'NT:'
|
|
: linksArr[i][key] === 'broader'
|
|
? 'BT:'
|
|
: ''
|
|
|
|
linkedTerms.innerHTML += keyTxt + ' ' + key + ' '
|
|
}
|
|
}
|
|
} else changeClasses(previewLinkedTerms, 'hide')
|
|
|
|
if (foreignTerm) {
|
|
listForeignTerm.forEach(el => (el.textContent = ''))
|
|
foreignTerm.forEach(el => {
|
|
if (listForeignTerm.length) {
|
|
listForeignTerm.forEach((element, index) => {
|
|
if (el === element.id) {
|
|
let items
|
|
if (!Array.isArray(data[el])) items = [data[el]]
|
|
else items = data[el]
|
|
element.innerHTML = `${items.join(', ')}`
|
|
}
|
|
})
|
|
}
|
|
})
|
|
listForeignTerm.forEach(el => {
|
|
if (el.textContent.length)
|
|
changeClasses(el.parentElement.parentElement, 'show')
|
|
else changeClasses(el.parentElement.parentElement, 'hide')
|
|
})
|
|
}
|
|
if (foreignDef) {
|
|
listForeignDefinitions.forEach(el => (el.textContent = ''))
|
|
foreignDef.forEach(el => {
|
|
if (listForeignDefinitions.length) {
|
|
listForeignDefinitions.forEach((element, index) => {
|
|
if (el === element.id) {
|
|
element.innerHTML = data[el]
|
|
}
|
|
})
|
|
}
|
|
})
|
|
listForeignDefinitions.forEach(el => {
|
|
if (el.textContent.length)
|
|
changeClasses(el.parentElement.parentElement, 'show')
|
|
else changeClasses(el.parentElement.parentElement, 'hide')
|
|
})
|
|
}
|
|
|
|
if (foreignSyn) {
|
|
listForeignSynonyms.forEach(el => (el.textContent = ''))
|
|
foreignSyn.forEach(el => {
|
|
if (listForeignSynonyms.length) {
|
|
listForeignSynonyms.forEach((element, index) => {
|
|
if (el === element.id) {
|
|
let items
|
|
if (!Array.isArray(data[el])) items = [data[el]]
|
|
else items = data[el]
|
|
element.innerHTML = `${items.join(', ')}`
|
|
}
|
|
})
|
|
}
|
|
})
|
|
listForeignSynonyms.forEach(el => {
|
|
if (el.textContent.length)
|
|
changeClasses(el.parentElement.parentElement, 'show')
|
|
else changeClasses(el.parentElement.parentElement, 'hide')
|
|
})
|
|
}
|
|
|
|
const languageContainers = document.querySelectorAll('.preview-one-language')
|
|
const langLine = document.querySelector('.language-line')
|
|
if (languageContainers) {
|
|
const arrLang = Array.from(languageContainers)
|
|
arrLang.forEach(el => {
|
|
const arrChildren = Array.from(el.children)
|
|
if (arrChildren.filter(e => e.classList.contains('d-none')).length > 2) {
|
|
el.classList.add('d-none')
|
|
langLine.classList.add('d-none')
|
|
} else {
|
|
el.classList.remove('d-none')
|
|
langLine.classList.remove('d-none')
|
|
}
|
|
})
|
|
}
|
|
changeCollapsedContent()
|
|
}
|
|
|
|
function createLinksObj(type, links) {
|
|
let dataTypeArr = []
|
|
let linkArr = []
|
|
if (Array.isArray(type)) dataTypeArr = type
|
|
else dataTypeArr.push(type)
|
|
if (Array.isArray(links)) linkArr = links
|
|
else linkArr.push(links)
|
|
|
|
const linksArr = dataTypeArr.map(function (obj, index) {
|
|
const myobj = {}
|
|
myobj[linkArr[index]] = obj
|
|
return myobj
|
|
})
|
|
return linksArr
|
|
}
|
|
|
|
function changeVersionList(versions) {
|
|
const allDatesEl = document.querySelector('.btn-dates-group')
|
|
const allDatesArr = Array.from(allDatesEl.children)
|
|
allDatesArr.forEach(el => {
|
|
if (!el.classList.contains('latest-version-el')) {
|
|
el.remove()
|
|
}
|
|
})
|
|
const localeOptions = {
|
|
day: '2-digit',
|
|
month: '2-digit',
|
|
year: 'numeric'
|
|
}
|
|
if (versions.length) {
|
|
versions
|
|
.slice()
|
|
.reverse()
|
|
.forEach(el => {
|
|
const dateRadio = document.createElement('input')
|
|
const dateLabel = document.createElement('label')
|
|
dateRadio.className = 'btn-check date-element'
|
|
dateRadio.type = 'radio'
|
|
dateRadio.name = 'date'
|
|
dateLabel.className = 'btn-outline-dates btn ms-0 date-element'
|
|
dateLabel.dataset.bsCustomClass = 'dark-gray-tooltip'
|
|
dateLabel.dataset.bsPlacement = 'bottom'
|
|
dateLabel.dataset.bsToggle = 'tooltip'
|
|
const date = new Date(el.version_time).toLocaleDateString(
|
|
'sl-SL',
|
|
localeOptions
|
|
)
|
|
dateLabel.textContent = date
|
|
dateRadio.id = `date${el.version}`
|
|
dateRadio.value = `${el.version}`
|
|
dateLabel.htmlFor = `date${el.version}`
|
|
// eslint-disable-next-line
|
|
new bootstrap.Tooltip(dateLabel, {
|
|
title: `Verzija ${el.version}`
|
|
})
|
|
allDatesEl.append(dateRadio)
|
|
allDatesEl.appendChild(dateLabel)
|
|
})
|
|
}
|
|
}
|
|
|
|
function removeOldMedia(images, audio, video) {
|
|
if (images !== null || audio !== null || video !== null) {
|
|
const media = [images, audio, video]
|
|
media.forEach(el => {
|
|
const arrChildren = Array.from(el.childNodes)
|
|
arrChildren.forEach(el => {
|
|
el.remove()
|
|
})
|
|
})
|
|
}
|
|
}
|
|
|
|
function changeClasses(el, elClass) {
|
|
if (elClass === 'show') {
|
|
if (el.classList.contains('d-none')) el.classList.remove('d-none')
|
|
if (!el.classList.contains('d-flex')) el.classList.add('d-flex')
|
|
}
|
|
|
|
if (elClass === 'hide') {
|
|
if (el.classList.contains('d-flex')) el.classList.remove('d-flex')
|
|
if (!el.classList.contains('d-none')) el.classList.add('d-none')
|
|
}
|
|
}
|
|
|
|
function renderLinks(targetEl, link, isLast) {
|
|
const aElement = document.createElement('a')
|
|
aElement.href = link
|
|
aElement.textContent = link
|
|
aElement.target = '_blank'
|
|
targetEl.append(aElement)
|
|
if (!isLast) {
|
|
const commaEl = document.createElement('span')
|
|
commaEl.classList.add('me-2')
|
|
commaEl.textContent = ','
|
|
targetEl.append(commaEl)
|
|
}
|
|
}
|
|
|
|
function letsScroll(btn) {
|
|
const { goRightBtn, goLeftBtn, dateListContainer } = window.dictionaryElements
|
|
switch (btn) {
|
|
case goRightBtn:
|
|
dateListContainer.scrollLeft += 80
|
|
break
|
|
case goLeftBtn:
|
|
dateListContainer.scrollLeft -= 80
|
|
break
|
|
}
|
|
}
|
|
|
|
function showSelectedDateData(date) {
|
|
const { btnSaveIcon } = window.dictionaryElements
|
|
|
|
// classicOverview.classList.add('d-none')
|
|
// selectedOverview.classList.remove('d-none')
|
|
btnSaveIcon.firstChild.src = '/images/u_redo.svg'
|
|
btnSaveIcon.children[1].textContent = 'Obnovi'
|
|
btnSaveIcon.id = 'redo-action'
|
|
}
|
|
|
|
function indeterminateTheBox(checkbox) {
|
|
if (checkbox.readOnly) checkbox.checked = checkbox.readOnly = false
|
|
else if (!checkbox.checked) checkbox.readOnly = checkbox.indeterminate = true
|
|
}
|
|
|
|
function changeCollapsedContent() {
|
|
const statusCollapsed = document.querySelectorAll('.status-collapsed')
|
|
const publishCollapsed = document.querySelectorAll('.published-collapsed')
|
|
const terminoCollapsed = document.querySelectorAll('.terminology-collapsed')
|
|
const langCollapsed = document.querySelectorAll('.lang-collapsed')
|
|
const homonimCollapsed = document.querySelectorAll('.homonim-collapsed')
|
|
const homonymDiv = document.querySelectorAll('.homonim-collapse-div')
|
|
const statusEl = document.getElementById('status-edit')
|
|
const publishedCbox = document.getElementById('published-cbox')
|
|
const terminologyCbox = document.getElementById('terminology-cbox')
|
|
const languageCbox = document.getElementById('language-cbox')
|
|
const homonymSort = document.getElementById('homonym-sort')
|
|
const selectedOptTxt = statusEl.options[statusEl.selectedIndex].text
|
|
statusCollapsed.forEach(el => (el.textContent = selectedOptTxt))
|
|
if (publishedCbox.checked) {
|
|
publishCollapsed.forEach(el => el.classList.remove('d-none'))
|
|
} else publishCollapsed.forEach(el => el.classList.add('d-none'))
|
|
if (terminologyCbox.checked) {
|
|
terminoCollapsed.forEach(el => el.classList.remove('d-none'))
|
|
} else terminoCollapsed.forEach(el => el.classList.add('d-none'))
|
|
if (languageCbox.checked) {
|
|
langCollapsed.forEach(el => el.classList.remove('d-none'))
|
|
} else langCollapsed.forEach(el => el.classList.add('d-none'))
|
|
if (homonymSort.value !== '') {
|
|
homonymDiv.forEach(el => el.classList.remove('d-none'))
|
|
homonimCollapsed.forEach(el => (el.textContent = homonymSort.value))
|
|
} else homonymDiv.forEach(el => el.classList.add('d-none'))
|
|
}
|
|
|
|
function createHeadword() {
|
|
const { termInputField, headerwordTable } = window.dictionaryElements
|
|
if (!termInputField.value.length) alert('Vnesti morate termin')
|
|
else {
|
|
const createHeadwordGroup = document.getElementById('create-headword-group')
|
|
const createdHeadwordGroup = document.getElementById(
|
|
'created-headword-group'
|
|
)
|
|
const termKeyEl = document.getElementById('term-key')
|
|
termKeyEl.textContent = termInputField.value
|
|
let termKeys = termInputField.value.split(' ')
|
|
termKeys = termKeys.reverse()
|
|
termKeys.forEach(el => {
|
|
const row = headerwordTable.insertRow(1)
|
|
const cell = row.insertCell(0)
|
|
row.insertCell(1)
|
|
row.insertCell(2)
|
|
row.insertCell(3)
|
|
cell.innerHTML = el
|
|
})
|
|
createHeadwordGroup.classList.add('d-none')
|
|
createdHeadwordGroup.classList.remove('d-none')
|
|
}
|
|
}
|
|
|
|
function changePreview() {
|
|
const switchDomainLabel = document.getElementById('domain-labels')
|
|
const switchLabel = document.getElementById('label-checkbox')
|
|
const switchDefinition = document.getElementById('definition-check-box')
|
|
const switchSynonym = document.getElementById('synonyms')
|
|
const switchLink = document.getElementById('links')
|
|
const switchForeignLang = document.getElementById('language-group')
|
|
const switchForeignTerm = document.getElementById('termin-language-subgroup')
|
|
const switchForeignDef = document.getElementById(
|
|
'definition-language-subgroup'
|
|
)
|
|
const switchForeignSyn = document.getElementById('synonym-language-subgroup')
|
|
const switchImage = document.getElementById('images')
|
|
const switchAudio = document.getElementById('audio')
|
|
const switchVideo = document.getElementById('video')
|
|
const switchOther = document.getElementById('other')
|
|
const previewDomainSecondary = document.querySelector(
|
|
'.preview-domain-secondary'
|
|
)
|
|
const selectedLabel = document.querySelector('.preview-label')
|
|
const selectedDef = document.querySelector('.preview-definition')
|
|
const selectedSynonyms = document.querySelector('.preview-synonym')
|
|
const linkedTerms = document.querySelector('.preview-linked-terms')
|
|
const foreignLanguages = document.querySelector(
|
|
'.preview-languages-container'
|
|
)
|
|
const listForeignTerm = document.querySelector('.preview-f-term')
|
|
const listForeignDefinitions = document.querySelector(
|
|
'.preview-foreign-definition'
|
|
)
|
|
const foreignSynonyms = document.querySelector('.preview-foreign-synonyms')
|
|
const selectedImages = document.querySelector('.preview-images')
|
|
const selectedAudio = document.querySelector('.preview-audio')
|
|
const selectedVideo = document.querySelector('.preview-video')
|
|
const selectedOther = document.querySelector('.preview-other-field')
|
|
|
|
if (!switchDomainLabel.checked) {
|
|
previewDomainSecondary.classList.add('hide-preview')
|
|
} else previewDomainSecondary.classList.remove('hide-preview')
|
|
if (!switchLabel.checked) selectedLabel.classList.add('hide-preview')
|
|
else selectedLabel.classList.remove('hide-preview')
|
|
if (!switchDefinition.checked) selectedDef.classList.add('hide-preview')
|
|
else selectedDef.classList.remove('hide-preview')
|
|
if (!switchSynonym.checked) selectedSynonyms.classList.add('hide-preview')
|
|
else selectedSynonyms.classList.remove('hide-preview')
|
|
if (!switchLink.checked) linkedTerms.classList.add('hide-preview')
|
|
else linkedTerms.classList.remove('hide-preview')
|
|
if (!switchForeignLang.checked) foreignLanguages.classList.add('hide-preview')
|
|
else foreignLanguages.classList.remove('hide-preview')
|
|
if (!switchForeignSyn.checked) foreignSynonyms.classList.add('hide-preview')
|
|
else foreignSynonyms.classList.remove('hide-preview')
|
|
if (!switchForeignTerm.checked) listForeignTerm.classList.add('hide-preview')
|
|
else listForeignTerm.classList.remove('hide-preview')
|
|
if (!switchForeignDef.checked)
|
|
listForeignDefinitions.classList.add('hide-preview')
|
|
else listForeignDefinitions.classList.remove('hide-preview')
|
|
if (!switchOther.checked) selectedOther.classList.add('hide-preview')
|
|
else selectedOther.classList.remove('hide-preview')
|
|
if (!switchImage.checked) selectedImages.classList.add('hide-preview')
|
|
else selectedImages.classList.remove('hide-preview')
|
|
if (!switchAudio.checked) selectedAudio.classList.add('hide-preview')
|
|
else selectedAudio.classList.remove('hide-preview')
|
|
if (!switchVideo.checked) selectedVideo.classList.add('hide-preview')
|
|
else selectedVideo.classList.remove('hide-preview')
|
|
}
|
|
|
|
function autoResize(el) {
|
|
if (el.style) {
|
|
el.style.height = 42 + 'px'
|
|
el.style.height = `${el.scrollHeight}px`
|
|
}
|
|
}
|
|
|
|
function addField(form, element, content) {
|
|
const { formEditContent, newImageBtn, newAudioBtn, newVideoBtn } =
|
|
window.dictionaryElements
|
|
const divMarginTop = document.createElement('div')
|
|
const divSubjectName = document.createElement('div')
|
|
const spanName = document.createElement('label')
|
|
const divRow = document.createElement('div')
|
|
const divColSm6 = document.createElement('div')
|
|
const inputGroup = document.createElement('div')
|
|
const inputField = document.createElement('input')
|
|
const spanInputGroup = document.createElement('span')
|
|
const imgTrashIcon = document.createElement('img')
|
|
const divColSm = document.createElement('div')
|
|
const spanNameInfoTxt = document.createElement('span')
|
|
const multimediaSection = document.querySelector('.multimedia-section')
|
|
|
|
divMarginTop.appendChild(divSubjectName)
|
|
divSubjectName.appendChild(spanName)
|
|
divMarginTop.appendChild(divRow)
|
|
divRow.appendChild(divColSm6)
|
|
divColSm6.appendChild(inputGroup)
|
|
inputGroup.appendChild(inputField)
|
|
inputGroup.appendChild(spanInputGroup)
|
|
spanInputGroup.appendChild(imgTrashIcon)
|
|
divRow.appendChild(divColSm)
|
|
divColSm.appendChild(spanNameInfoTxt)
|
|
|
|
divMarginTop.className = 'mt-4 added-field'
|
|
divSubjectName.className = 'subject-name'
|
|
spanName.className = 'input-name-txt'
|
|
divRow.className = 'row align-items-center'
|
|
inputGroup.className = 'input-group'
|
|
inputField.className = 'name-input d-inline form-control icon-trash'
|
|
divColSm6.className = 'col-sm-6'
|
|
spanInputGroup.className = 'input-group-text delete-author-btn'
|
|
spanInputGroup.id = 'trash-icon-btn'
|
|
spanInputGroup.addEventListener('click', deleteField)
|
|
imgTrashIcon.className = 'delete-author p-0'
|
|
imgTrashIcon.src = '/images/red-trash-icon.svg'
|
|
imgTrashIcon.alt = 'Delete'
|
|
divColSm.className = 'col-sm'
|
|
spanNameInfoTxt.className =
|
|
'd-md-inline d-block name-info-txt ms-xxl-3 ms-md-3 mt-3 mt-sm-0'
|
|
|
|
if (formEditContent) {
|
|
switch (element) {
|
|
case newImageBtn:
|
|
spanName.textContent = 'SLIKA'
|
|
inputField.name = 'image'
|
|
spanNameInfoTxt.textContent = 'Nova slika.'
|
|
if (content) inputField.value = content
|
|
break
|
|
case newAudioBtn:
|
|
spanName.textContent = 'ZVOK'
|
|
inputField.name = 'audio'
|
|
spanNameInfoTxt.textContent = 'Nov zvok.'
|
|
if (content) inputField.value = content
|
|
break
|
|
case newVideoBtn:
|
|
spanName.textContent = 'VIDEO'
|
|
inputField.name = 'video'
|
|
spanNameInfoTxt.textContent = 'Nov video.'
|
|
if (content) inputField.value = content
|
|
break
|
|
}
|
|
multimediaSection.insertBefore(
|
|
divMarginTop,
|
|
element.parentElement.parentElement.parentElement
|
|
)
|
|
} else {
|
|
spanName.textContent = 'AVTOR'
|
|
inputField.name = 'author'
|
|
spanNameInfoTxt.textContent =
|
|
'Dodajte ime in priimek naslednjega avtorja slovarja..'
|
|
form.insertBefore(
|
|
divMarginTop,
|
|
element.parentElement.parentElement.parentElement
|
|
)
|
|
}
|
|
inputField.select()
|
|
}
|
|
|
|
function addConnectionField(form, element, data) {
|
|
const { formEditContent } = window.dictionaryElements
|
|
const divMarginTop = document.createElement('div')
|
|
const divSubjectName = document.createElement('div')
|
|
const spanName = document.createElement('label')
|
|
const divRow = document.createElement('div')
|
|
const divColLg2 = document.createElement('div')
|
|
const divColLg4 = document.createElement('div')
|
|
const divColLg = document.createElement('div')
|
|
const colLg2Input = document.createElement('select')
|
|
const inputGroup = document.createElement('div')
|
|
const inputField = document.createElement('input')
|
|
const spanInputGroup = document.createElement('span')
|
|
const imgTrashIcon = document.createElement('img')
|
|
const divColSm = document.createElement('div')
|
|
const spanNameInfoTxt = document.createElement('span')
|
|
const opt = document.createElement('option')
|
|
const opt2 = document.createElement('option')
|
|
const opt3 = document.createElement('option')
|
|
|
|
divMarginTop.appendChild(divSubjectName)
|
|
divSubjectName.appendChild(spanName)
|
|
divMarginTop.appendChild(divRow)
|
|
divRow.appendChild(divColLg2)
|
|
divColLg2.appendChild(colLg2Input)
|
|
colLg2Input.appendChild(opt)
|
|
divRow.appendChild(divColLg4)
|
|
divRow.appendChild(divColLg)
|
|
divColLg4.appendChild(inputGroup)
|
|
inputGroup.appendChild(inputField)
|
|
inputGroup.appendChild(spanInputGroup)
|
|
spanInputGroup.appendChild(imgTrashIcon)
|
|
divRow.appendChild(divColSm)
|
|
divColSm.appendChild(spanNameInfoTxt)
|
|
|
|
divMarginTop.className = 'mt-4 added-field'
|
|
divSubjectName.className = 'subject-name'
|
|
spanName.className = 'input-name-txt'
|
|
divRow.className = 'row align-items-center'
|
|
divColLg2.className = 'col-lg-2 col-6'
|
|
divColLg4.className = 'col-lg-4 mt-2 mt-lg-0'
|
|
divColLg.className = 'col-lg align-items-center'
|
|
colLg2Input.className = 'name-input form-select d-inline'
|
|
colLg2Input.name = 'type'
|
|
inputGroup.className = 'input-group'
|
|
inputField.className = 'name-input d-inline form-control icon-trash mc-field'
|
|
spanInputGroup.className = 'input-group-text delete-author-btn'
|
|
spanInputGroup.id = 'trash-icon-btn'
|
|
spanInputGroup.addEventListener('click', deleteField)
|
|
imgTrashIcon.className = 'delete-author p-0'
|
|
imgTrashIcon.src = '/images/red-trash-icon.svg'
|
|
imgTrashIcon.alt = 'Delete'
|
|
divColSm.className = 'col-sm'
|
|
spanNameInfoTxt.className = 'name-info-txt mt-3'
|
|
spanName.textContent = 'POVEZAVA'
|
|
inputField.name = 'links'
|
|
opt.value = 'broader'
|
|
opt.text = 'Širši'
|
|
opt2.value = 'related'
|
|
opt3.value = 'narrow'
|
|
opt2.text = 'Sorodni'
|
|
opt3.text = 'Ožji'
|
|
colLg2Input.add(opt2)
|
|
colLg2Input.add(opt)
|
|
colLg2Input.add(opt3)
|
|
colLg2Input.value = 'related'
|
|
formEditContent.insertBefore(
|
|
divMarginTop,
|
|
element.parentElement.parentElement.parentElement
|
|
)
|
|
if (data) {
|
|
inputField.value = data.link
|
|
colLg2Input.value = data.type
|
|
}
|
|
}
|
|
|
|
function handleAreasClick({ target }) {
|
|
const editRow = target.closest('.edit-row-btn')
|
|
const deleteRow = target.closest('.delete-row-btn')
|
|
const tableButtons = target.closest('.table-buttons')
|
|
const addAreaBtn = target.closest('#add-area')
|
|
if (deleteRow) {
|
|
const getRow = deleteRow.parentElement.parentElement.parentElement
|
|
const modalUseBtn = document.getElementById('modal-use-btn')
|
|
modalUseBtn.addEventListener('click', () => {
|
|
getRow.remove()
|
|
})
|
|
const rowId = getRow.firstChild.value
|
|
const tempId = getRow.dataset.tempId
|
|
if (tempId) {
|
|
let arr = domainLabelsForChange()
|
|
arr = arr.filter(el => el.tempId !== parseInt(tempId))
|
|
domainLabelsForChange(arr)
|
|
} else {
|
|
const data = { id: rowId, type: 'removeArea' }
|
|
domainLabelsForChange(data)
|
|
}
|
|
}
|
|
if (editRow) {
|
|
const getRow = editRow.parentElement.parentElement.parentElement
|
|
const visibilityEl = getRow.querySelector('.form-check')
|
|
visibilityEl.disabled = false
|
|
getRow.className = 'selected-row'
|
|
tableButtons.style.display = 'none'
|
|
const tDataArea = getRow.querySelector('.tdata-area')
|
|
const tDataButtons = getRow.querySelector('.buttons-group')
|
|
const tDataAreaText = tDataArea.textContent
|
|
const tdArea = document.createElement('td')
|
|
const inputArea = document.createElement('input')
|
|
inputArea.className = 'form-control w-100'
|
|
inputArea.value = tDataAreaText
|
|
tdArea.appendChild(inputArea)
|
|
tDataArea.style.display = 'none'
|
|
getRow.insertBefore(tdArea, tDataButtons)
|
|
const buttonsGroup = getRow.querySelector('.buttons-group')
|
|
const newButtonGroup = document.createElement('div')
|
|
const cancelButton = document.createElement('button')
|
|
const saveButton = document.createElement('button')
|
|
saveButton.type = 'button'
|
|
cancelButton.type = 'button'
|
|
cancelButton.textContent = 'Prekliči'
|
|
cancelButton.className = 'btn btn-secondary me-2'
|
|
cancelButton.style.height = '33px'
|
|
cancelButton.style.width = '105px'
|
|
cancelButton.addEventListener('click', () =>
|
|
abortEditing(newButtonGroup, tableButtons, tDataArea)
|
|
)
|
|
saveButton.textContent = 'POTRDI'
|
|
saveButton.type = 'button'
|
|
saveButton.className = 'btn btn-primary'
|
|
saveButton.style.height = '33px'
|
|
saveButton.style.width = '105px'
|
|
saveButton.addEventListener('click', () =>
|
|
saveChanges(newButtonGroup, inputArea, tableButtons, tDataArea)
|
|
)
|
|
newButtonGroup.className = 'd-flex justify-content-end me-3'
|
|
newButtonGroup.appendChild(cancelButton)
|
|
newButtonGroup.appendChild(saveButton)
|
|
buttonsGroup.insertBefore(newButtonGroup, tableButtons)
|
|
}
|
|
if (addAreaBtn) {
|
|
const areaInput = document.getElementById('subarea-input')
|
|
const areaInputValue = areaInput.value
|
|
if (areaInputValue.length) {
|
|
const allAreasTable = document.getElementById('all-areas-table')
|
|
const row = allAreasTable.insertRow(-1)
|
|
row.dataset.tempId = tempCounter(true)
|
|
const cell1 = row.insertCell(0)
|
|
const cell2 = row.insertCell(1)
|
|
const cell3 = row.insertCell(2)
|
|
cell1.innerHTML =
|
|
'<input class="form-check checkbox-table" type="checkbox" name="isVisible" checked disabled>'
|
|
cell2.textContent = areaInputValue
|
|
cell2.classList.add('tdata-area')
|
|
cell3.innerHTML =
|
|
'<div class="table-buttons"><button class="p-0 table-button-grp me-3 edit-row-btn" type="button"><img src="/images/u_edit-alt.svg" alt=""></button><button class="p-0 table-button-grp delete-row-btn" data-bs-target="#alert-modal" data-bs-toggle="modal" type="button"><img src="/images/red-trash-icon.svg" alt=""></button></div>'
|
|
cell3.classList.add('buttons-group')
|
|
areaInput.value = ''
|
|
addAreaBtn.disabled = true
|
|
const data = {
|
|
tempId: tempCounter(),
|
|
name: areaInputValue,
|
|
type: 'addArea'
|
|
}
|
|
domainLabelsForChange(data)
|
|
}
|
|
}
|
|
}
|
|
|
|
function onKeyDownNavigation(e) {
|
|
const { scrollEl } = window.dictionaryElements
|
|
const activeElement = document.activeElement
|
|
const parentEl = activeElement.parentElement
|
|
switch (e.key) {
|
|
case 'ArrowDown': {
|
|
e.preventDefault()
|
|
const nextDiv = parentEl.nextElementSibling
|
|
const nextEl = nextDiv?.querySelector('.terms-label')
|
|
nextEl?.focus()
|
|
if (nextEl) {
|
|
const offset = nextEl?.offsetTop
|
|
scrollEl.scrollTop = offset
|
|
}
|
|
break
|
|
}
|
|
case 'ArrowUp': {
|
|
e.preventDefault()
|
|
const previousDiv = parentEl.previousElementSibling
|
|
const previousEl = previousDiv?.querySelector('.terms-label')
|
|
previousEl?.focus()
|
|
if (previousEl) {
|
|
const offset = previousEl?.offsetTop
|
|
scrollEl.scrollTop = offset
|
|
}
|
|
break
|
|
}
|
|
case 'Home': {
|
|
const hopedEl = document.querySelector(`[data-index='0']`)
|
|
hopedEl?.focus()
|
|
if (hopedEl) {
|
|
const offset = hopedEl?.offsetTop
|
|
scrollEl.scrollTop = offset
|
|
}
|
|
break
|
|
}
|
|
case 'End': {
|
|
const dataLength = document.getElementById('data-length').textContent
|
|
const intDataLen = parseInt(dataLength) - 1
|
|
const hopedEl = document.querySelector(`[data-index='${intDataLen}']`)
|
|
hopedEl?.focus()
|
|
if (hopedEl) {
|
|
const offset = hopedEl?.offsetTop
|
|
scrollEl.scrollTop = offset
|
|
}
|
|
break
|
|
}
|
|
}
|
|
}
|
|
|
|
function onPageUpDownNavigation(e) {
|
|
const { scrollEl } = window.dictionaryElements
|
|
const activeElement = document.activeElement
|
|
const calcIndex = 52
|
|
switch (e.key) {
|
|
case 'PageDown': {
|
|
e.preventDefault()
|
|
const activeIndex = activeElement.dataset.index
|
|
const dataLength = document.getElementById('data-length').textContent
|
|
const intDataLen = parseInt(dataLength) - 1
|
|
const calcHops = Math.round(parseInt(scrollEl.clientHeight) / calcIndex)
|
|
const hopToIndex = parseInt(activeIndex) + calcHops
|
|
const hopedEl = document.querySelector(`[data-index='${hopToIndex}']`)
|
|
? document.querySelector(`[data-index='${hopToIndex}']`)
|
|
: document.querySelector(`[data-index='${intDataLen}']`)
|
|
hopedEl?.focus()
|
|
const offset = hopedEl?.offsetTop
|
|
scrollEl.scrollTop = offset
|
|
break
|
|
}
|
|
case 'PageUp': {
|
|
e.preventDefault()
|
|
const activeIndex = activeElement.dataset.index
|
|
const calcHops = Math.round(parseInt(scrollEl.clientHeight) / calcIndex)
|
|
const hopToIndex = parseInt(activeIndex) - calcHops
|
|
const hopedEl = document.querySelector(`[data-index='${hopToIndex}']`)
|
|
? document.querySelector(`[data-index='${hopToIndex}']`)
|
|
: document.querySelector(`[data-index='0']`)
|
|
hopedEl?.focus()
|
|
const offset = hopedEl?.offsetTop
|
|
scrollEl.scrollTop = offset
|
|
break
|
|
}
|
|
}
|
|
}
|
|
|
|
function onKeyUpLoad() {
|
|
const parentEl = document.activeElement
|
|
parentEl.click()
|
|
}
|
|
|
|
function selectNextEntry(elem) {
|
|
const allLabels = document.querySelectorAll('.terms-label')
|
|
const arrAllLabels = Array.from(allLabels)
|
|
let found
|
|
found = arrAllLabels.find(el => el.dataset.index === elem)
|
|
if (!found) {
|
|
found = arrAllLabels.find(
|
|
el => parseInt(el.dataset.index) === parseInt(elem) - 1
|
|
)
|
|
if (!found) {
|
|
changePageContent('new-entry-btn')
|
|
}
|
|
}
|
|
if (found) found.click()
|
|
}
|
|
|
|
function inputFieldsChecker() {
|
|
const { inputAreaEl } = window.dictionaryElements
|
|
const addAreaButton = document.getElementById('add-area')
|
|
if (inputAreaEl.value.length) {
|
|
addAreaButton.disabled = false
|
|
} else {
|
|
addAreaButton.disabled = true
|
|
}
|
|
}
|
|
|
|
function abortEditing(btnGrp, oldButtons, areaEl) {
|
|
btnGrp.className = 'd-none'
|
|
oldButtons.style.display = 'block'
|
|
const getRow = btnGrp.parentElement.parentElement
|
|
getRow.classList.remove('selected-row')
|
|
const getInputs = getRow.querySelectorAll('.w-100')
|
|
getInputs.forEach(el => el.parentElement.remove())
|
|
areaEl.style.display = 'table-cell'
|
|
const visibilityEl = getRow.querySelector('.form-check')
|
|
visibilityEl.disabled = true
|
|
}
|
|
|
|
function saveChanges(btnGrp, inputArea, oldButtons, tDataArea) {
|
|
const inputAreaNewValue = inputArea.value
|
|
btnGrp.className = 'd-none'
|
|
oldButtons.style.display = 'block'
|
|
const getRow = btnGrp.parentElement.parentElement
|
|
const tempId = getRow.dataset.tempId
|
|
getRow.classList.remove('selected-row')
|
|
inputArea.parentElement.remove()
|
|
tDataArea.style.display = 'table-cell'
|
|
tDataArea.textContent = inputAreaNewValue
|
|
const visibilityEl = getRow.querySelector('.form-check')
|
|
const visibility = visibilityEl.checked
|
|
if (tempId) {
|
|
const arr = domainLabelsForChange()
|
|
const found = arr.find(el => el.tempId === parseInt(tempId))
|
|
found.nameSl = inputAreaNewValue
|
|
} else {
|
|
const changed = {
|
|
id: getRow.firstChild.value,
|
|
name: inputAreaNewValue,
|
|
isVisible: visibility,
|
|
type: 'changeArea'
|
|
}
|
|
domainLabelsForChange(changed)
|
|
}
|
|
visibilityEl.disabled = true
|
|
}
|
|
|
|
function initDomainLabelsForChange() {
|
|
let tempArray = []
|
|
return function (element) {
|
|
if (Array.isArray(element)) tempArray = element
|
|
else if (element) tempArray.push(element)
|
|
return tempArray
|
|
}
|
|
}
|
|
|
|
const domainLabelsForChange = initDomainLabelsForChange()
|
|
|
|
function initTempCounter() {
|
|
let counter = 0
|
|
return function (el) {
|
|
if (el) counter += 1
|
|
return counter
|
|
}
|
|
}
|
|
|
|
const tempCounter = initTempCounter()
|
|
|
|
function deleteContentData(
|
|
domainLabels,
|
|
synonym,
|
|
listForeignDefinitions,
|
|
listForeignTerms,
|
|
listForeignSynonyms,
|
|
images,
|
|
audio,
|
|
video,
|
|
linkRow
|
|
) {
|
|
const addedFields = document.querySelectorAll('.added-field')
|
|
if (addedFields.length) addedFields.forEach(el => el.remove())
|
|
if (domainLabels) domainLabels.val(null).trigger('change')
|
|
if (domainLabels) domainLabels.empty().trigger('change')
|
|
if (synonym) synonym.val(null).trigger('change')
|
|
if (synonym) synonym.empty().trigger('change')
|
|
if (listForeignTerms) $('.foreign-term-el').val(null).trigger('change')
|
|
if (listForeignTerms) $('.foreign-term-el').empty().trigger('change')
|
|
if (listForeignSynonyms) $('.foreign-synonym-el').val(null).trigger('change')
|
|
if (listForeignSynonyms) $('.foreign-synonym-el').empty().trigger('change')
|
|
if (images) images.value = ''
|
|
if (audio) audio.value = ''
|
|
if (video) video.value = ''
|
|
if (linkRow) {
|
|
const linkType = linkRow.querySelector('.form-select')
|
|
const linkText = linkRow.querySelector('.mc-field')
|
|
linkType.value = 'related'
|
|
linkText.value = ''
|
|
}
|
|
}
|
|
|
|
function activateMe(term) {
|
|
if (document.querySelector('.selected-term-btn') !== null) {
|
|
document
|
|
.querySelector('.selected-term-btn')
|
|
.classList.remove('selected-term-btn')
|
|
}
|
|
term.classList.add('selected-term-btn')
|
|
}
|
|
|
|
function showTitle(e) {
|
|
const target = e.target
|
|
if (target.tagName === 'LABEL') {
|
|
const title =
|
|
target.title ||
|
|
target.getAttribute('data-bs-original-title') ||
|
|
target.textContent
|
|
const overflowed = target.scrollWidth > target.clientWidth
|
|
target.dataset.bsOriginalTitle = overflowed ? title : ''
|
|
const bsTooltip = new bootstrap.Tooltip(target, {
|
|
placement: 'right',
|
|
trigger: 'hover'
|
|
})
|
|
bsTooltip.show()
|
|
}
|
|
}
|
|
|
|
function hideTitle(e) {
|
|
const target = e.target
|
|
if (target.tagName === 'LABEL') {
|
|
const bsTooltip = new bootstrap.Tooltip(target)
|
|
bsTooltip.dispose()
|
|
}
|
|
}
|
|
|
|
// function checkform() {
|
|
// const selectionInput = $('#cerif')
|
|
// .find('span')
|
|
// .find('.select2-selection.select2-selection--multiple')
|
|
// if ($('#select-cerif').val().length < 1) {
|
|
// selectionInput.addClass('select2-validation')
|
|
// selectionInput.addClass('select2-validation:focus')
|
|
// $('#invalid-section').removeClass('hidden-section')
|
|
// } else {
|
|
// selectionInput.removeClass('select2-validation')
|
|
// selectionInput.removeClass('select2-validation:focus')
|
|
// $('#invalid-section').addClass('hidden-section')
|
|
// }
|
|
// }
|
|
|
|
function checkLanguages() {
|
|
const { checkLanguageGroup } = window.dictionaryElements
|
|
const selectLanguages = $('#select-languages')
|
|
.find('span')
|
|
.find('.select2-selection.select2-selection--multiple')
|
|
if (checkLanguageGroup.checked) {
|
|
if (
|
|
$('#languages-input').val().length < 1 &&
|
|
!$('language-input').prop('disabled')
|
|
) {
|
|
selectLanguages.addClass('select2-validation')
|
|
selectLanguages.addClass('select2-validation:focus')
|
|
$('#invalid-language-section').removeClass('hidden-section')
|
|
} else {
|
|
selectLanguages.removeClass('select2-validation')
|
|
selectLanguages.removeClass('select2-validation:focus')
|
|
$('#invalid-language-section').addClass('hidden-section')
|
|
}
|
|
}
|
|
}
|
|
|
|
$('.summernote').summernote({
|
|
placeholder: 'Na kratko opišite zasnovo in namen slovarja.',
|
|
height: 300,
|
|
minheight: 150,
|
|
toolbar: [
|
|
['style', ['style', 'bold', 'italic', 'underline']],
|
|
['font', ['superscript', 'subscript']],
|
|
['link', ['linkDialogShow']],
|
|
['para', ['ul', 'ol']],
|
|
['table', ['table']],
|
|
['insert', ['picture']]
|
|
],
|
|
styleTags: ['p', 'h3', 'h4']
|
|
})
|
|
|
|
function updateAcceptedFileTypes() {
|
|
const { fileImportForm, fileUploadInput } = window.dictionaryElements
|
|
|
|
const selectedFileFormat = fileImportForm.importFileFormat.value
|
|
fileUploadInput.accept = `.${selectedFileFormat}`
|
|
}
|
|
|
|
// Activate BS5 tooltips
|
|
|
|
const tooltipTriggerList = [].slice.call(
|
|
document.querySelectorAll('[data-bs-toggle="tooltip"]')
|
|
)
|
|
tooltipTriggerList.map(function (tooltipTriggerEl) {
|
|
return new bootstrap.Tooltip(tooltipTriggerEl)
|
|
})
|