mirror of
https://github.com/go-gitea/gitea
synced 2025-07-22 18:28:37 +00:00
Fix dynamic content loading init problem (#33748)
1. Rewrite `dirauto.ts` to `observer.ts`. * We have been using MutationObserver for long time, it's proven that it is quite performant. * Now we extend its ability to handle more "init" works. 2. Use `observeAddedElement` to init all non-custom "dropdown". 3. Use `data-global-click` to handle click events from dynamically loaded elements. * By this new approach, the old fragile selector-based (`.comment-reaction-button`) mechanism is removed. 4. By the way, remove unused `.diff-box` selector, it was abused and never really used. A lot of FIXMEs in "repo-diff.ts" are completely fixed, newly loaded contents could work as expected.
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
{{$showFileTree := (and (not .DiffNotAvailable) (gt .Diff.NumFiles 1))}}
|
||||
<div>
|
||||
<div class="diff-detail-box diff-box">
|
||||
<div class="diff-detail-box">
|
||||
<div class="tw-flex tw-items-center tw-flex-wrap tw-gap-2 tw-ml-0.5">
|
||||
{{if $showFileTree}}
|
||||
<button class="diff-toggle-file-tree-button not-mobile btn interact-fg" data-show-text="{{ctx.Locale.Tr "repo.diff.show_file_tree"}}" data-hide-text="{{ctx.Locale.Tr "repo.diff.hide_file_tree"}}">
|
||||
@@ -80,7 +80,7 @@
|
||||
{{$showFileViewToggle := or $isImage (and (not $file.IsIncomplete) $isCsv)}}
|
||||
{{$isExpandable := or (gt $file.Addition 0) (gt $file.Deletion 0) $file.IsBin}}
|
||||
{{$isReviewFile := and $.IsSigned $.PageIsPullFiles (not $.Repository.IsArchived) $.IsShowingAllCommits}}
|
||||
<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}} tw-mt-0" id="diff-{{$file.NameHash}}" data-old-filename="{{$file.OldName}}" data-new-filename="{{$file.Name}}" {{if or ($file.ShouldBeHidden) (not $isExpandable)}}data-folded="true"{{end}}>
|
||||
<div class="diff-file-box file-content {{TabSizeClass $.Editorconfig $file.Name}} tw-mt-0" id="diff-{{$file.NameHash}}" data-old-filename="{{$file.OldName}}" data-new-filename="{{$file.Name}}" {{if or ($file.ShouldBeHidden) (not $isExpandable)}}data-folded="true"{{end}}>
|
||||
<h4 class="diff-file-header sticky-2nd-row ui top attached header">
|
||||
<div class="diff-file-name tw-flex tw-flex-1 tw-items-center tw-gap-1 tw-flex-wrap">
|
||||
<button class="fold-file btn interact-bg tw-p-1{{if not $isExpandable}} tw-invisible{{end}}">
|
||||
@@ -209,7 +209,7 @@
|
||||
{{end}}
|
||||
|
||||
{{if .Diff.IsIncomplete}}
|
||||
<div class="diff-file-box diff-box file-content tw-mt-2" id="diff-incomplete">
|
||||
<div class="diff-file-box file-content tw-mt-2" id="diff-incomplete">
|
||||
<h4 class="ui top attached header tw-font-normal tw-flex tw-items-center tw-justify-between">
|
||||
{{ctx.Locale.Tr "repo.diff.too_many_files"}}
|
||||
<a class="ui basic tiny button" id="diff-show-more-files" data-href="?skip-to={{.Diff.End}}&file-only=true">{{ctx.Locale.Tr "repo.diff.show_more"}}</a>
|
||||
|
@@ -3,7 +3,7 @@
|
||||
<a class="muted">{{svg "octicon-smiley"}}</a>
|
||||
<div class="menu">
|
||||
{{range $value := AllowedReactions}}
|
||||
<a class="item emoji comment-reaction-button" data-tooltip-content="{{$value}}" aria-label="{{$value}}" data-reaction-content="{{$value}}">{{ReactionToEmoji $value}}</a>
|
||||
<a class="item emoji" data-tooltip-content="{{$value}}" aria-label="{{$value}}" data-reaction-content="{{$value}}" data-global-click="onCommentReactionButtonClick">{{ReactionToEmoji $value}}</a>
|
||||
{{end}}
|
||||
</div>
|
||||
</div>
|
||||
|
@@ -40,7 +40,7 @@
|
||||
{{if $diff}}
|
||||
{{$file := (index $diff.Files 0)}}
|
||||
<div id="code-preview-{{$comment.ID}}" class="ui table segment{{if $resolved}} tw-hidden{{end}}">
|
||||
<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}}">
|
||||
<div class="diff-file-box file-content {{TabSizeClass $.Editorconfig $file.Name}}">
|
||||
<div class="file-body file-code code-view code-diff code-diff-unified unicode-escaped">
|
||||
<table>
|
||||
<tbody>
|
||||
|
@@ -1,9 +1,9 @@
|
||||
<div class="bottom-reactions" data-action-url="{{$.ActionURL}}">
|
||||
{{range $key, $value := .Reactions}}
|
||||
{{$hasReacted := $value.HasUser ctx.RootData.SignedUserID}}
|
||||
<a role="button" class="ui label basic{{if $hasReacted}} primary{{end}}{{if not ctx.RootData.IsSigned}} disabled{{end}} comment-reaction-button"
|
||||
data-tooltip-content
|
||||
title="{{$value.GetFirstUsers}}{{if gt ($value.GetMoreUserCount) 0}} {{ctx.Locale.Tr "repo.reactions_more" $value.GetMoreUserCount}}{{end}}"
|
||||
<a role="button" class="ui label basic{{if $hasReacted}} primary{{end}}{{if not ctx.RootData.IsSigned}} disabled{{end}}"
|
||||
data-global-click="onCommentReactionButtonClick"
|
||||
data-tooltip-content title="{{$value.GetFirstUsers}}{{if gt ($value.GetMoreUserCount) 0}} {{ctx.Locale.Tr "repo.reactions_more" $value.GetMoreUserCount}}{{end}}"
|
||||
aria-label="{{$value.GetFirstUsers}}{{if gt ($value.GetMoreUserCount) 0}} {{ctx.Locale.Tr "repo.reactions_more" $value.GetMoreUserCount}}{{end}}"
|
||||
data-tooltip-placement="bottom-start"
|
||||
data-reaction-content="{{$key}}" data-has-reacted="{{$hasReacted}}">
|
||||
|
@@ -11,7 +11,7 @@
|
||||
<div class="repository search">
|
||||
{{range $result := .SearchResults}}
|
||||
{{$repo := or $.Repo (index $.RepoMaps .RepoID)}}
|
||||
<div class="diff-file-box diff-box file-content non-diff-file-content repo-search-result">
|
||||
<div class="diff-file-box file-content non-diff-file-content repo-search-result">
|
||||
<h4 class="ui top attached header tw-font-normal tw-flex tw-flex-wrap">
|
||||
{{if not $.Repo}}
|
||||
<span class="file tw-flex-1">
|
||||
|
Reference in New Issue
Block a user