Skip to content

Commit 5ae314d

Browse files
sebastian-sauersebastian-sauer
committed
Add filelist on left of diff view
not yet a real directory tree but already usable
1 parent c80ca94 commit 5ae314d

File tree

5 files changed

+147
-107
lines changed

5 files changed

+147
-107
lines changed

Diff for: ‎templates/repo/commit_page.tmpl

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{{template "base/head" .}}
22
<div class="page-content repository diff">
33
{{template "repo/header" .}}
4-
<div class="ui container {{if .IsSplitStyle}}fluid padded{{end}}">
4+
<div class="ui container fluid padded">
55
{{$class := ""}}
66
{{if .Commit.Signature}}
77
{{$class = (printf "%s%s" $class " isSigned")}}

Diff for: ‎templates/repo/diff/box.tmpl

+124-104
Original file line numberDiff line numberDiff line change
@@ -56,120 +56,140 @@
5656
</li>
5757
{{end}}
5858
</ol>
59-
<div id="diff-file-boxes">
60-
{{range $i, $file := .Diff.Files}}
61-
{{$blobBase := call $.GetBlobByPathForCommit $.BaseCommit $file.OldName}}
62-
{{$blobHead := call $.GetBlobByPathForCommit $.HeadCommit $file.Name}}
63-
{{$isImage := or (call $.IsBlobAnImage $blobBase) (call $.IsBlobAnImage $blobHead)}}
64-
{{$isCsv := (call $.IsCsvFile $file)}}
65-
{{$showFileViewToggle := or $isImage (and (not $file.IsIncomplete) $isCsv)}}
66-
<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}} mt-3" id="diff-{{$file.NameHash}}" data-old-filename="{{$file.OldName}}" data-new-filename="{{$file.Name}}" {{if $file.ShouldBeHidden}}data-folded="true"{{end}}>
67-
<h4 class="diff-file-header sticky-2nd-row ui top attached normal header df ac sb">
68-
<div class="df ac">
69-
<a role="button" class="fold-file muted mr-2">
70-
{{if $file.ShouldBeHidden}}
71-
{{svg "octicon-chevron-right" 18}}
72-
{{else}}
73-
{{svg "octicon-chevron-down" 18}}
74-
{{end}}
75-
</a>
76-
<div class="bold df ac">
77-
{{if $file.IsBin}}
78-
<span class="ml-1 mr-3">
79-
{{$.locale.Tr "repo.diff.bin"}}
80-
</span>
81-
{{else}}
82-
{{template "repo/diff/stats" dict "file" . "root" $}}
83-
{{end}}
84-
</div>
85-
<span class="file mono"><a class="muted" href="#diff-{{$file.NameHash}}">{{if $file.IsRenamed}}{{$file.OldName}} &rarr; {{end}}{{$file.Name}}</a>{{if .IsLFSFile}} ({{$.locale.Tr "repo.stored_lfs"}}){{end}}</span>
86-
{{if $file.IsGenerated}}
87-
<span class="ui label ml-3">{{$.locale.Tr "repo.diff.generated"}}</span>
88-
{{end}}
89-
{{if $file.IsVendored}}
90-
<span class="ui label ml-3">{{$.locale.Tr "repo.diff.vendored"}}</span>
91-
{{end}}
92-
</div>
93-
<div class="diff-file-header-actions df ac">
94-
{{if $showFileViewToggle}}
95-
<div class="ui compact icon buttons">
96-
<span class="ui tiny basic button tooltip file-view-toggle" data-toggle-selector="#diff-source-{{$i}}" data-content="{{$.locale.Tr "repo.file_view_source"}}" data-position="bottom center">{{svg "octicon-code"}}</span>
97-
<span class="ui tiny basic button tooltip file-view-toggle active" data-toggle-selector="#diff-rendered-{{$i}}" data-content="{{$.locale.Tr "repo.file_view_rendered"}}" data-position="bottom center">{{svg "octicon-file"}}</span>
98-
</div>
99-
{{end}}
100-
{{if $file.IsProtected}}
101-
<span class="ui basic label">{{$.locale.Tr "repo.diff.protected"}}</span>
102-
{{end}}
103-
{{if not (or $file.IsIncomplete $file.IsBin $file.IsSubmodule)}}
104-
<a class="ui basic tiny button unescape-button">{{$.locale.Tr "repo.unescape_control_characters"}}</a>
105-
<a class="ui basic tiny button escape-button" style="display: none;">{{$.locale.Tr "repo.escape_control_characters"}}</a>
106-
{{end}}
107-
{{if and (not $file.IsSubmodule) (not $.PageIsWiki)}}
108-
{{if $file.IsDeleted}}
109-
<a class="ui basic tiny button" rel="nofollow" href="{{$.BeforeSourcePath}}/{{PathEscapeSegments .Name}}">{{$.locale.Tr "repo.diff.view_file"}}</a>
110-
{{else}}
111-
<a class="ui basic tiny button" rel="nofollow" href="{{$.SourcePath}}/{{PathEscapeSegments .Name}}">{{$.locale.Tr "repo.diff.view_file"}}</a>
112-
{{end}}
113-
{{end}}
114-
{{if and $.IsSigned $.PageIsPullFiles (not $.IsArchived)}}
115-
{{if $file.HasChangedSinceLastReview}}
116-
<span class="changed-since-last-review unselectable">{{$.locale.Tr "repo.pulls.has_changed_since_last_review"}}</span>
117-
{{end}}
118-
<div data-link="{{$.Issue.Link}}/viewed-files" data-headcommit="{{$.PullHeadCommitID}}" class="viewed-file-form unselectable{{if $file.IsViewed}} viewed-file-checked-form{{end}}">
119-
<input type="checkbox" name="{{$file.GetDiffFileName}}" id="viewed-file-checkbox-{{$i}}" autocomplete="off" {{if $file.IsViewed}}checked{{end}}></input>
120-
<label for="viewed-file-checkbox-{{$i}}">{{$.locale.Tr "repo.pulls.has_viewed_file"}}</label>
121-
</div>
122-
{{end}}
123-
</div>
124-
</h4>
125-
<div class="diff-file-body ui attached unstackable table segment" {{if $file.IsViewed}}data-folded="true"{{end}}>
126-
<div id="diff-source-{{$i}}" class="file-body file-code unicode-escaped code-diff{{if $.IsSplitStyle}} code-diff-split{{else}} code-diff-unified{{end}}{{if $showFileViewToggle}} hide{{end}}">
127-
{{if or $file.IsIncomplete $file.IsBin}}
128-
<div class="diff-file-body binary" style="padding: 5px 10px;">
129-
{{if $file.IsIncomplete}}
130-
{{if $file.IsIncompleteLineTooLong}}
131-
{{$.locale.Tr "repo.diff.file_suppressed_line_too_long"}}
59+
<div id="diff-container" class="ui grid">
60+
<div class="row">
61+
<div id="div-file-tree" class="five wide column diff-detail-box sticky">
62+
{{range .Diff.Files}}
63+
<li>
64+
<span class="status {{DiffTypeToStr .GetType}} tooltip" data-content="{{DiffTypeToStr .GetType}}" data-position="right center">&nbsp;</span>
65+
<a class="file mono" href="#diff-{{.NameHash}}"
66+
>{{.Name}}</a>
67+
</li>
68+
{{end}}
69+
{{if .Diff.IsIncomplete}}
70+
<li id="diff-too-many-files-stats" class="pt-2">
71+
<span class="file df ac sb">{{$.locale.Tr "repo.diff.too_many_files"}}
72+
<a class="ui basic tiny button" id="diff-show-more-files-stats" data-href="{{$.Link}}?skip-to={{.Diff.End}}&file-only=true">{{.locale.Tr "repo.diff.show_more"}}</a>
73+
</span>
74+
</li>
75+
{{end}}
76+
</div>
77+
<div id="diff-file-boxes" class="eleven wide column">
78+
{{range $i, $file := .Diff.Files}}
79+
{{$blobBase := call $.GetBlobByPathForCommit $.BaseCommit $file.OldName}}
80+
{{$blobHead := call $.GetBlobByPathForCommit $.HeadCommit $file.Name}}
81+
{{$isImage := or (call $.IsBlobAnImage $blobBase) (call $.IsBlobAnImage $blobHead)}}
82+
{{$isCsv := (call $.IsCsvFile $file)}}
83+
{{$showFileViewToggle := or $isImage (and (not $file.IsIncomplete) $isCsv)}}
84+
<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}} mt-3" id="diff-{{$file.NameHash}}" data-old-filename="{{$file.OldName}}" data-new-filename="{{$file.Name}}" {{if $file.ShouldBeHidden}}data-folded="true"{{end}}>
85+
<h4 class="diff-file-header sticky-2nd-row ui top attached normal header df ac sb">
86+
<div class="df ac">
87+
<a role="button" class="fold-file muted mr-2">
88+
{{if $file.ShouldBeHidden}}
89+
{{svg "octicon-chevron-right" 18}}
13290
{{else}}
133-
{{$.locale.Tr "repo.diff.file_suppressed"}}
134-
<a class="ui basic tiny button diff-show-more-button" data-href="{{$.Link}}?file-only=true&files={{$file.Name}}&files={{$file.OldName}}">{{$.locale.Tr "repo.diff.load"}}</a>
91+
{{svg "octicon-chevron-down" 18}}
13592
{{end}}
136-
{{else}}
137-
{{$.locale.Tr "repo.diff.bin_not_shown"}}
93+
</a>
94+
<div class="bold df ac">
95+
{{if $file.IsBin}}
96+
<span class="ml-1 mr-3">
97+
{{$.locale.Tr "repo.diff.bin"}}
98+
</span>
99+
{{else}}
100+
{{template "repo/diff/stats" dict "file" . "root" $}}
101+
{{end}}
102+
</div>
103+
<span class="file mono"><a class="muted" href="#diff-{{$file.NameHash}}">{{if $file.IsRenamed}}{{$file.OldName}} &rarr; {{end}}{{$file.Name}}</a>{{if .IsLFSFile}} ({{$.locale.Tr "repo.stored_lfs"}}){{end}}</span>
104+
{{if $file.IsGenerated}}
105+
<span class="ui label ml-3">{{$.locale.Tr "repo.diff.generated"}}</span>
106+
{{end}}
107+
{{if $file.IsVendored}}
108+
<span class="ui label ml-3">{{$.locale.Tr "repo.diff.vendored"}}</span>
138109
{{end}}
139110
</div>
140-
{{else}}
141-
<table class="chroma" data-new-comment-url="{{$.Issue.HTMLURL}}/files/reviews/new_comment" data-path="{{$file.Name}}">
142-
{{if $.IsSplitStyle}}
143-
{{template "repo/diff/section_split" dict "file" . "root" $}}
144-
{{else}}
145-
{{template "repo/diff/section_unified" dict "file" . "root" $}}
111+
<div class="diff-file-header-actions df ac">
112+
{{if $showFileViewToggle}}
113+
<div class="ui compact icon buttons">
114+
<span class="ui tiny basic button tooltip file-view-toggle" data-toggle-selector="#diff-source-{{$i}}" data-content="{{$.locale.Tr "repo.file_view_source"}}" data-position="bottom center">{{svg "octicon-code"}}</span>
115+
<span class="ui tiny basic button tooltip file-view-toggle active" data-toggle-selector="#diff-rendered-{{$i}}" data-content="{{$.locale.Tr "repo.file_view_rendered"}}" data-position="bottom center">{{svg "octicon-file"}}</span>
116+
</div>
146117
{{end}}
147-
</table>
148-
{{end}}
149-
</div>
150-
{{if $showFileViewToggle}}
151-
<div id="diff-rendered-{{$i}}" class="file-body file-code {{if $.IsSplitStyle}} code-diff-split{{else}} code-diff-unified{{end}}">
152-
<table class="chroma w-100">
153-
{{if $isImage}}
154-
{{template "repo/diff/image_diff" dict "file" . "root" $ "blobBase" $blobBase "blobHead" $blobHead}}
118+
{{if $file.IsProtected}}
119+
<span class="ui basic label">{{$.locale.Tr "repo.diff.protected"}}</span>
120+
{{end}}
121+
{{if not (or $file.IsIncomplete $file.IsBin $file.IsSubmodule)}}
122+
<a class="ui basic tiny button unescape-button">{{$.locale.Tr "repo.unescape_control_characters"}}</a>
123+
<a class="ui basic tiny button escape-button" style="display: none;">{{$.locale.Tr "repo.escape_control_characters"}}</a>
124+
{{end}}
125+
{{if and (not $file.IsSubmodule) (not $.PageIsWiki)}}
126+
{{if $file.IsDeleted}}
127+
<a class="ui basic tiny button" rel="nofollow" href="{{$.BeforeSourcePath}}/{{PathEscapeSegments .Name}}">{{$.locale.Tr "repo.diff.view_file"}}</a>
128+
{{else}}
129+
<a class="ui basic tiny button" rel="nofollow" href="{{$.SourcePath}}/{{PathEscapeSegments .Name}}">{{$.locale.Tr "repo.diff.view_file"}}</a>
130+
{{end}}
131+
{{end}}
132+
{{if and $.IsSigned $.PageIsPullFiles (not $.IsArchived)}}
133+
{{if $file.HasChangedSinceLastReview}}
134+
<span class="changed-since-last-review unselectable">{{$.locale.Tr "repo.pulls.has_changed_since_last_review"}}</span>
135+
{{end}}
136+
<div data-link="{{$.Issue.Link}}/viewed-files" data-headcommit="{{$.PullHeadCommitID}}" class="viewed-file-form unselectable{{if $file.IsViewed}} viewed-file-checked-form{{end}}">
137+
<input type="checkbox" name="{{$file.GetDiffFileName}}" id="viewed-file-checkbox-{{$i}}" autocomplete="off" {{if $file.IsViewed}}checked{{end}}></input>
138+
<label for="viewed-file-checkbox-{{$i}}">{{$.locale.Tr "repo.pulls.has_viewed_file"}}</label>
139+
</div>
140+
{{end}}
141+
</div>
142+
</h4>
143+
<div class="diff-file-body ui attached unstackable table segment" {{if $file.IsViewed}}data-folded="true"{{end}}>
144+
<div id="diff-source-{{$i}}" class="file-body file-code unicode-escaped code-diff{{if $.IsSplitStyle}} code-diff-split{{else}} code-diff-unified{{end}}{{if $showFileViewToggle}} hide{{end}}">
145+
{{if or $file.IsIncomplete $file.IsBin}}
146+
<div class="diff-file-body binary" style="padding: 5px 10px;">
147+
{{if $file.IsIncomplete}}
148+
{{if $file.IsIncompleteLineTooLong}}
149+
{{$.locale.Tr "repo.diff.file_suppressed_line_too_long"}}
150+
{{else}}
151+
{{$.locale.Tr "repo.diff.file_suppressed"}}
152+
<a class="ui basic tiny button diff-show-more-button" data-href="{{$.Link}}?file-only=true&files={{$file.Name}}&files={{$file.OldName}}">{{$.locale.Tr "repo.diff.load"}}</a>
153+
{{end}}
154+
{{else}}
155+
{{$.locale.Tr "repo.diff.bin_not_shown"}}
156+
{{end}}
157+
</div>
155158
{{else}}
156-
{{template "repo/diff/csv_diff" dict "file" . "root" $}}
159+
<table class="chroma" data-new-comment-url="{{$.Issue.HTMLURL}}/files/reviews/new_comment" data-path="{{$file.Name}}">
160+
{{if $.IsSplitStyle}}
161+
{{template "repo/diff/section_split" dict "file" . "root" $}}
162+
{{else}}
163+
{{template "repo/diff/section_unified" dict "file" . "root" $}}
164+
{{end}}
165+
</table>
157166
{{end}}
158-
</table>
167+
</div>
168+
{{if $showFileViewToggle}}
169+
<div id="diff-rendered-{{$i}}" class="file-body file-code {{if $.IsSplitStyle}} code-diff-split{{else}} code-diff-unified{{end}}">
170+
<table class="chroma w-100">
171+
{{if $isImage}}
172+
{{template "repo/diff/image_diff" dict "file" . "root" $ "blobBase" $blobBase "blobHead" $blobHead}}
173+
{{else}}
174+
{{template "repo/diff/csv_diff" dict "file" . "root" $}}
175+
{{end}}
176+
</table>
177+
</div>
178+
{{end}}
159179
</div>
160-
{{end}}
161-
</div>
162-
</div>
163-
{{end}}
180+
</div>
181+
{{end}}
164182

165-
{{if .Diff.IsIncomplete}}
166-
<div class="diff-file-box diff-box file-content mt-3" id="diff-incomplete">
167-
<h4 class="ui top attached normal header df ac sb">
168-
{{$.locale.Tr "repo.diff.too_many_files"}}
169-
<a class="ui basic tiny button" id="diff-show-more-files" data-href="{{$.Link}}?skip-to={{.Diff.End}}&file-only=true">{{.locale.Tr "repo.diff.show_more"}}</a>
170-
</h4>
183+
{{if .Diff.IsIncomplete}}
184+
<div class="diff-file-box diff-box file-content mt-3" id="diff-incomplete">
185+
<h4 class="ui top attached normal header df ac sb">
186+
{{$.locale.Tr "repo.diff.too_many_files"}}
187+
<a class="ui basic tiny button" id="diff-show-more-files" data-href="{{$.Link}}?skip-to={{.Diff.End}}&file-only=true">{{.locale.Tr "repo.diff.show_more"}}</a>
188+
</h4>
189+
</div>
190+
{{end}}
171191
</div>
172-
{{end}}
192+
</div>
173193
</div>
174194

175195
{{if not $.Repository.IsArchived}}

Diff for: ‎templates/repo/diff/compare.tmpl

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{{template "base/head" .}}
22
<div class="page-content repository diff {{if .PageIsComparePull}}compare pull{{end}}">
33
{{template "repo/header" .}}
4-
<div class="ui container {{if .IsSplitStyle}}fluid padded{{end}}">
4+
<div class="ui container fluid padded">
55

66
<h2 class="ui header">
77
{{if and $.PageIsComparePull $.IsSigned (not .Repository.IsArchived)}}

Diff for: ‎templates/repo/pulls/files.tmpl

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55

66
<div class="page-content repository view issue pull files diff">
77
{{template "repo/header" .}}
8-
<div class="ui container {{if .IsSplitStyle}}fluid padded{{end}}">
8+
<div class="ui container fluid padded">
99
<div class="navbar">
1010
{{template "repo/issue/navbar" .}}
1111
<div class="ui right">

Diff for: ‎web_src/less/_repository.less

+20
Original file line numberDiff line numberDiff line change
@@ -3066,6 +3066,26 @@ td.blob-excerpt {
30663066
padding-left: 8px;
30673067
}
30683068

3069+
#div-file-tree {
3070+
position: sticky;
3071+
top: 47px;
3072+
border-top: 1px solid var(--color-secondary);
3073+
max-height: calc(100vh - 47px);
3074+
overflow-y: scroll;
3075+
overflow-x: scroll;
3076+
border-right: 1px solid var(--color-secondary);
3077+
3078+
li {
3079+
list-style: none;
3080+
3081+
.file {
3082+
overflow: hidden;
3083+
text-overflow: ellipsis;
3084+
white-space: nowrap;
3085+
}
3086+
}
3087+
}
3088+
30693089
.ui.message.unicode-escape-prompt {
30703090
margin-bottom: 0;
30713091
border-radius: 0;

0 commit comments

Comments
 (0)