diff options
| author | silverwind <me@silverwind.io> | 2020-11-16 00:50:06 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2020-11-15 23:50:06 +0000 |
| commit | efcba9b011b328a425d8b2c8d9f2273bfbaa7340 (patch) | |
| tree | 92f7812aa0f184b6b76b957eee56d19b14f31ef6 | |
| parent | 0de546009e466486cd88dfa98d07d8775bd3087d (diff) | |
| download | gitea-efcba9b011b328a425d8b2c8d9f2273bfbaa7340.tar.gz gitea-efcba9b011b328a425d8b2c8d9f2273bfbaa7340.zip | |
Render diff stats server-side (#13579)
Eliminates a flash on page load on the diff stat bars.
| -rw-r--r-- | modules/templates/helper.go | 3 | ||||
| -rw-r--r-- | templates/repo/diff/box.tmpl | 21 | ||||
| -rw-r--r-- | templates/repo/diff/stats.tmpl | 6 | ||||
| -rw-r--r-- | web_src/js/index.js | 11 |
4 files changed, 12 insertions, 29 deletions
diff --git a/modules/templates/helper.go b/modules/templates/helper.go index e4107dfa9a..e1c5d5d86b 100644 --- a/modules/templates/helper.go +++ b/modules/templates/helper.go @@ -208,6 +208,9 @@ func NewFuncMap() []template.FuncMap { } return path }, + "DiffStatsWidth": func(adds int, dels int) string { + return fmt.Sprintf("%f", float64(adds)/(float64(adds)+float64(dels))*100) + }, "Json": func(in interface{}) string { out, err := json.Marshal(in) if err != nil { diff --git a/templates/repo/diff/box.tmpl b/templates/repo/diff/box.tmpl index 05f056feb8..d34d9b8fd9 100644 --- a/templates/repo/diff/box.tmpl +++ b/templates/repo/diff/box.tmpl @@ -38,12 +38,7 @@ <li> <div class="diff-counter count pull-right"> {{if not .IsBin}} - <span class="add" data-line="{{.Addition}}">+{{.Addition}}</span> - <span class="bar"> - <div class="pull-left add"></div> - <div class="pull-left del"></div> - </span> - <span class="del" data-line="{{.Deletion}}">-{{.Deletion}}</span> + {{template "repo/diff/stats" .}} {{else}} <span>{{$.i18n.Tr "repo.diff.bin"}}</span> {{end}} @@ -60,12 +55,7 @@ <h4 class="ui top attached normal header rounded"> <div class="diff-counter count ui left"> {{if not $file.IsRenamed}} - <span class="add" data-line="{{.Addition}}">+ {{.Addition}}</span> - <span class="bar"> - <div class="pull-left add"></div> - <div class="pull-left del"></div> - </span> - <span class="del" data-line="{{.Deletion}}">- {{.Deletion}}</span> + {{template "repo/diff/stats" .}} {{end}} </div> <span class="file">{{$file.Name}}</span> @@ -101,12 +91,7 @@ {{if $file.IsBin}} {{$.i18n.Tr "repo.diff.bin"}} {{else if not $file.IsRenamed}} - <span class="add" data-line="{{.Addition}}">+ {{.Addition}}</span> - <span class="bar"> - <div class="pull-left add"></div> - <div class="pull-left del"></div> - </span> - <span class="del" data-line="{{.Deletion}}">- {{.Deletion}}</span> + {{template "repo/diff/stats" .}} {{end}} </div> <span class="file">{{if $file.IsRenamed}}{{$file.OldName}} → {{end}}{{$file.Name}}{{if .IsLFSFile}} ({{$.i18n.Tr "repo.stored_lfs"}}){{end}}</span> diff --git a/templates/repo/diff/stats.tmpl b/templates/repo/diff/stats.tmpl new file mode 100644 index 0000000000..7e5d34c3dd --- /dev/null +++ b/templates/repo/diff/stats.tmpl @@ -0,0 +1,6 @@ +<span class="add" data-line="{{.Addition}}">+ {{.Addition}}</span> +<span class="bar"> + <div class="pull-left add" style="width: {{DiffStatsWidth .Addition .Deletion}}%"></div> + <div class="pull-left del"></div> +</span> +<span class="del" data-line="{{.Deletion}}">- {{.Deletion}}</span> diff --git a/web_src/js/index.js b/web_src/js/index.js index 1d36dcf6b2..1f4c9a509a 100644 --- a/web_src/js/index.js +++ b/web_src/js/index.js @@ -1134,17 +1134,6 @@ async function initRepository() { initReactionSelector(); } - // Diff - if ($('.repository.diff').length > 0) { - $('.diff-counter').each(function () { - const $item = $(this); - const addLine = $item.find('span[data-line].add').data('line'); - const delLine = $item.find('span[data-line].del').data('line'); - const addPercent = parseFloat(addLine) / (parseFloat(addLine) + parseFloat(delLine)) * 100; - $item.find('.bar .add').css('width', `${addPercent}%`); - }); - } - // Quick start and repository home $('#repo-clone-ssh').on('click', function () { $('.clone-url').text($(this).data('link')); |