$(function() {
const Cookies = require('js-cookie')
const errorHandler = window.gitlist.ajaxErrorHandler;
const gitHelperAjax = window.gitlist.gitHelperAjax;
const $modalDelete = $('#p3x-gitlist-modal-delete')
const $buttonDelete = $('#p3x-gitlist-file-delete')
const $buttonDeleteSure = $('#p3x-gitlist-modal-delete-confirm')
const $formDeleteForm = $('#p3x-gitlist-modal-delete-form')
const $deleteInputName = $('#p3x-gitlist-modal-delete-name');
const $deleteInputEmail = $('#p3x-gitlist-modal-delete-email');
const $deleteInputComment = $('#p3x-gitlist-modal-delete-comment');
const inputs = {
name: $deleteInputName,
email: $deleteInputEmail,
comment: $deleteInputComment,
}
$buttonDelete.click(() => {
if (!window.gitlist.changeableCommit()) {
return
}
$modalDelete.modal('show')
})
$buttonDeleteSure.click(async() => {
if($formDeleteForm[0].checkValidity() === false) {
window.gitlist.invalidSnackbarCommit()
return;
}
try {
const json = await gitHelperAjax({
modal: $modalDelete,
action: 'delete',
inputs: inputs,
})
if (window.gitlist.gitNewPush(json)) {
return
}
} catch(e) {
errorHandler(e)
}
})
const sourceCode = $('#p3x-gitlist-file-editor');
if (sourceCode.length) {
let originalCode = '';
let disableFull = false;
const cookieName = 'p3x-gitlist-codemirror-size'
const currentSizing = Cookies.get(cookieName)
const codeCodeMirroNormal = $('#p3x-gitlist-file-codemirror');
const codeCodeMirrorBig = $('#p3x-gitlist-file-codemirror-exceeded')
let value = sourceCode.text();
const maxSize = window.gitlist.codemirror_full_limit;
const size = Math.ceil(value.length / 1024);
let cm;
const createCodeMirror = () => {
if (size > maxSize) {
disableFull = true;
codeCodeMirroNormal.hide();
codeCodeMirrorBig.show();
} else {
codeCodeMirroNormal.show();
}
const mode = sourceCode.attr('language');
const pre = sourceCode.get(0);
const codeMirror = $('.CodeMirror');
const buttonScroll = $('#p3x-gitlist-file-button-scroll');
const buttonFull = $('#p3x-gitlist-file-button-full');
const buttonEdit = $('#p3x-gitlist-file-button-edit');
const buttonEditCancel = $('#p3x-gitlist-file-button-edit-cancel');
const buttonEditSave = $('#p3x-gitlist-file-button-edit-save')
const buttonDelete = $('#p3x-gitlist-file-delete')
const codeMirrorHeight = window.gitlist.editorMaxHeight;
buttonEditCancel.hide();
buttonEditSave.hide();
buttonEdit.click(() => {
if (!window.gitlist.changeableCommit()) {
return
}
// buttonEditRow.show();
buttonEdit.hide();
buttonDelete.hide()
buttonEditCancel.show();
buttonEditSave.show();
gitlist.viewer.setOption('readOnly', false)
originalCode = gitlist.viewer.getValue()
gitlist.viewer.focus();
$.snackbar({
content: `Editing`,
})
})
const validateCodeIsSame = (snack = true) => {
value = gitlist.viewer.getValue();
if (originalCode === value) {
if (snack) {
$.snackbar({
content: 'The code has not changed. No saving.',
})
}
return true;
}
return false;
}
const close = () => {
buttonDelete.show()
buttonEdit.show();
buttonEditSave.hide();
buttonEditCancel.hide();
gitlist.viewer.setOption('readOnly', true)
}
buttonEditCancel.click(() => {
if (!validateCodeIsSame(false)) {
gitlist.viewer.setValue(originalCode)
$.snackbar({
htmlAllowed: true,
content: 'The changes are reverted.',
})
}
close();
})
const commitModal = $('#p3x-gitlist-modal-commit');
buttonEditSave.click(async () => {
if (validateCodeIsSame()) {
return;
}
commitModal.modal('show')
})
const commitInputName = $('#p3x-gitlist-modal-commit-name');
const commitInputEmail = $('#p3x-gitlist-modal-commit-email');
const commitInputComment = $('#p3x-gitlist-modal-commit-comment');
const commitForm = $('#p3x-gitlist-modal-commit-form');
const inputs = {
name: commitInputName,
email: commitInputEmail,
comment: commitInputComment,
}
const commitCommitPushButton = $('#p3x-gitlist-modal-commit-push')
commitCommitPushButton.click( async () => {
if (validateCodeIsSame()) {
return;
}
if(commitForm[0].checkValidity() === false) {
window.gitlist.invalidSnackbarCommit()
return;
}
/*
$.snackbar({
htmlAllowed: true,
content: ' <i class="fas fa-cog fa-spin"></i> Saving ...'
})
*/
try {
await gitHelperAjax({
modal: commitModal,
action: 'save',
inputs: inputs,
data: {
value: value
},
})
originalCode = value;
close();
$.snackbar({
htmlAllowed: true,
content: '<i class="fas fa-check"></i> The file is saved.',
})
} catch(e) {
errorHandler(e);
}
})
const setScroll = () => {
buttonFull.removeClass('active')
buttonScroll.addClass('active')
codeMirror.css('height', codeMirrorHeight)
gitlist.viewer.setSize(null, codeMirrorHeight);
if (!disableFull) {
Cookies.set(cookieName, 'scroll', window.gitlist.cookieSettings)
}
}
buttonScroll.click(setScroll)
const setFull = () => {
buttonScroll.removeClass('active')
buttonFull.addClass('active')
codeMirror.css('height', 'auto')
gitlist.viewer.setSize(null, '100%');
Cookies.set(cookieName, 'full', window.gitlist.cookieSettings)
}
buttonFull.click(setFull)
cm = CodeMirror(function(elt) {
pre.parentNode.replaceChild(elt, pre);
}, {
styleActiveLine: true,
styleSelectedText: true,
value: value,
lineNumbers: true,
matchBrackets: true,
lineWrapping: true,
readOnly: true,
mode: mode,
theme: window.gitlist.getActualThemeCodemirror(),
});
gitlist.viewer = cm;
const isReallyFull = currentSizing === 'full' && !disableFull;
if (isReallyFull) {
setFull()
} else {
setScroll()
}
const scrollToEditor = () => {
let line = location.hash.startsWith('#L') ? location.hash.substring(2) : undefined
if (line !== undefined) {
setTimeout(() => {
line = parseInt(line)
cm.setSelection({
line: line - 1 ,
char: 0,
}, {
line: line - 1,
char: Number.MAX_SAFE_INTEGER
})
cm.scrollIntoView({line: line, char:0}, isReallyFull ? window.innerHeight / 2 : 100)
/*
const codes = $('.CodeMirror-linenumber')
for(let codeLinenumber of codes) {
const $codeLinenumber = $(codeLinenumber)
const findLine = $codeLinenumber.text();
if(findLine === line ) {
break;
}
}
*/
}, 250)
}
}
if (location.search.includes('edit=1')) {
setTimeout(() => {
buttonEdit.click();
scrollToEditor();
}, 500)
} else {
scrollToEditor();
}
}
createCodeMirror();
const $showSvgButton = $('#p3x-gitlist-file-svg-show')
if ($showSvgButton.length > 0) {
const $svgElements = $('.p3x-gitlist-file-svg-toggle')
const $cmWrapper = $(cm.getWrapperElement())
const $svgContentWrapper = $('#p3x-gitlist-file-svg-content')
$showSvgButton.click(() => {
if ($showSvgButton.hasClass('active')) {
$svgContentWrapper.empty()
} else {
const image = `<img class="p3x-gitlist-max-width" src="data:image/svg+xml;base64,${btoa(cm.getValue())}"/>`
// console.log(image)
$svgContentWrapper.append(image)
}
$showSvgButton.toggleClass('active')
$svgElements.toggle()
$cmWrapper.toggle()
})
}
}
})
