mirror of
https://codeberg.org/forgejo/forgejo.git
synced 2024-08-26 21:05:22 +02:00
fix commit view JS features, reimplement folding (#9968)
* fix commit view JS features, reimplement folding File content folding was not working so I reimplemented it in a saner way. Then I noticed the issue was actually because of missing JS libraries (seen on the console of every commit with error 'SimpleMDE is not defined'). Fixed the libraries. I think the reimplementation is worth to keep. * add .closest polyfill Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
This commit is contained in:
parent
8d51f28ba0
commit
fd094eea95
5 changed files with 36 additions and 13 deletions
|
@ -206,6 +206,8 @@ func FileHistory(ctx *context.Context) {
|
|||
func Diff(ctx *context.Context) {
|
||||
ctx.Data["PageIsDiff"] = true
|
||||
ctx.Data["RequireHighlightJS"] = true
|
||||
ctx.Data["RequireSimpleMDE"] = true
|
||||
ctx.Data["RequireTribute"] = true
|
||||
|
||||
userName := ctx.Repo.Owner.Name
|
||||
repoName := ctx.Repo.Repository.Name
|
||||
|
|
|
@ -80,7 +80,7 @@
|
|||
</div>
|
||||
{{else}}
|
||||
<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}}" id="diff-{{.Index}}">
|
||||
<h4 class="ui top attached normal header">
|
||||
<h4 class="diff-file-header ui top attached normal header">
|
||||
{{$isImage := false}}
|
||||
{{if $file.IsDeleted}}
|
||||
{{$isImage = (call $.IsImageFileInBase $file.Name)}}
|
||||
|
@ -111,7 +111,7 @@
|
|||
{{end}}
|
||||
{{end}}
|
||||
</h4>
|
||||
<div class="ui attached unstackable table segment">
|
||||
<div class="diff-file-body ui attached unstackable table segment">
|
||||
{{if ne $file.Type 4}}
|
||||
<div class="file-body file-code code-view has-context-menu code-diff {{if $.IsSplitStyle}}code-diff-split{{else}}code-diff-unified{{end}}">
|
||||
<table>
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
/* exported toggleDeadlineForm, setDeadline, updateDeadline, deleteDependencyModal, cancelCodeComment, onOAuthLoginClick */
|
||||
|
||||
import './publicPath.js';
|
||||
import './polyfills.js';
|
||||
import './gitGraphLoader.js';
|
||||
import './semanticDropdown.js';
|
||||
import initContextPopups from './features/contextPopup';
|
||||
|
@ -2109,17 +2110,12 @@ function initCodeView() {
|
|||
}
|
||||
}).trigger('hashchange');
|
||||
}
|
||||
$('.ui.fold-code').on('click', (e) => {
|
||||
const $foldButton = $(e.target);
|
||||
if ($foldButton.hasClass('fa-chevron-down')) {
|
||||
$(e.target).parent().next().slideUp('fast', () => {
|
||||
$foldButton.removeClass('fa-chevron-down').addClass('fa-chevron-right');
|
||||
});
|
||||
} else {
|
||||
$(e.target).parent().next().slideDown('fast', () => {
|
||||
$foldButton.removeClass('fa-chevron-right').addClass('fa-chevron-down');
|
||||
});
|
||||
}
|
||||
$('.fold-code').on('click', ({ target }) => {
|
||||
const box = target.closest('.file-content');
|
||||
const folded = box.dataset.folded !== 'true';
|
||||
target.classList.add(`fa-chevron-${folded ? 'right' : 'down'}`);
|
||||
target.classList.remove(`fa-chevron-${folded ? 'down' : 'right'}`);
|
||||
box.dataset.folded = String(folded);
|
||||
});
|
||||
function insertBlobExcerpt(e) {
|
||||
const $blob = $(e.target);
|
||||
|
|
17
web_src/js/polyfills.js
Normal file
17
web_src/js/polyfills.js
Normal file
|
@ -0,0 +1,17 @@
|
|||
// compat: IE11
|
||||
if (!Element.prototype.matches) {
|
||||
Element.prototype.matches = Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector;
|
||||
}
|
||||
|
||||
// compat: IE11
|
||||
if (!Element.prototype.closest) {
|
||||
Element.prototype.closest = function (s) {
|
||||
let el = this;
|
||||
|
||||
do {
|
||||
if (el.matches(s)) return el;
|
||||
el = el.parentElement || el.parentNode;
|
||||
} while (el !== null && el.nodeType === 1);
|
||||
return null;
|
||||
};
|
||||
}
|
|
@ -2524,3 +2524,11 @@ td.blob-excerpt {
|
|||
.title_wip_desc {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.diff-file-box[data-folded="true"] .diff-file-body {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.diff-file-box[data-folded="true"] .diff-file-header {
|
||||
border-radius: 0.28571429rem !important;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue