Expand/Collapse Files and Blob Excerpt while Reviewing/Comparing code (#8924)

* update #8659 fold/unfold code diffs

* add fold button style

* update #8659 implement expand up/down codes (blob excerpt)

* fix golint errors

* fix expand direction

* remove debug message

* update css style for blob exceprt

* fix typo in comment

* update style sheet with less

* update expect diff (add SectionInfo)

* update #8942 accept suggested change (fix typo)

* close reader and check file type before get tail section

* adjust button position and check file type before insert fold button

* move index js to web_src

* merge index.js with master

* generate index.js

* update js coding style

Author: blueworrybear

modules/git/blob.go

@@ -6,6 +6,7 @@
 package git
 
 import (
+	"bytes"
 	"encoding/base64"
 	"io"
 	"io/ioutil"
@@ -50,6 +51,28 @@ func (b *Blob) GetBlobContent() (string, error) {
 	return string(buf), nil
 }
 
+// GetBlobLineCount gets line count of lob as raw text
+func (b *Blob) GetBlobLineCount() (int, error) {
+	reader, err := b.DataAsync()
+	if err != nil {
+		return 0, err
+	}
+	defer reader.Close()
+	buf := make([]byte, 32*1024)
+	count := 0
+	lineSep := []byte{'\n'}
+	for {
+		c, err := reader.Read(buf)
+		count += bytes.Count(buf[:c], lineSep)
+		switch {
+		case err == io.EOF:
+			return count, nil
+		case err != nil:
+			return count, err
+		}
+	}
+}
+
 // GetBlobContentBase64 Reads the content of the blob with a base64 encode and returns the encoded string
 func (b *Blob) GetBlobContentBase64() (string, error) {
 	dataRc, err := b.DataAsync()

modules/repofiles/diff_test.go

@@ -55,6 +55,15 @@ func TestGetDiffPreview(t *testing.T) {
 								Type:     4,
 								Content:  "@@ -1,3 +1,4 @@",
 								Comments: nil,
+								SectionInfo: &gitdiff.DiffLineSectionInfo{
+									Path:          "README.md",
+									LastLeftIdx:   0,
+									LastRightIdx:  0,
+									LeftIdx:       1,
+									RightIdx:      1,
+									LeftHunkSize:  3,
+									RightHunkSize: 4,
+								},
 							},
 							{
 								LeftIdx:  1,

public/css/index.css

@@ -898,6 +898,7 @@ tbody.commit-list{vertical-align:baseline}
 .repo-buttons .disabled-repo-button a.button:hover{background:0 0!important;color:rgba(0,0,0,.6)!important;box-shadow:0 0 0 1px rgba(34,36,38,.15) inset!important}
 .repo-buttons .ui.labeled.button>.label{border-left:0!important;margin:0!important}
 .tag-code,.tag-code td{background-color:#f0f0f0!important;border-color:#d3cfcf!important;padding-top:8px;padding-bottom:8px}
+td.blob-excerpt{background-color:#fafafa}
 .issue-keyword{border-bottom:1px dotted #959da5;display:inline-block}
 .file-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px!important}
 .file-info{display:flex;align-items:center}
@@ -1068,4 +1069,8 @@ tbody.commit-list{vertical-align:baseline}
 .comment-code-cloud .footer:after{clear:both;content:"";display:block}
 .comment-code-cloud button.comment-form-reply{margin:.5em .5em .5em 4.5em}
 .comment-code-cloud form.comment-form-reply{margin:0 0 0 4em}
-.file-comment{font:12px 'SF Mono',Consolas,Menlo,'Liberation Mono',Monaco,'Lucida Console',monospace;color:rgba(0,0,0,.87)}
+.file-comment{font:12px 'SF Mono',Consolas,Menlo,'Liberation Mono',Monaco,'Lucida Console',monospace;color:rgba(0,0,0,.87)}
+.ui.fold-code{margin-right:1em;padding-left:5px;cursor:pointer;width:22px;font-size:12px}
+.ui.fold-code:hover{color:#428bca}
+.ui.blob-excerpt{display:block;line-height:20px;font-size:16px;cursor:pointer}
+.ui.blob-excerpt:hover{color:#428bca}

public/js/index.js

@@ -245,6 +245,7 @@ func Diff(ctx *context.Context) {
 	}
 
 	ctx.Data["CommitID"] = commitID
+	ctx.Data["AfterCommitID"] = commitID
 	ctx.Data["Username"] = userName
 	ctx.Data["Reponame"] = repoName
 

public/js/index.js.map

@@ -5,21 +5,26 @@
 package repo
 
 import (
+	"bufio"
 	"fmt"
+	"html"
 	"path"
+	"path/filepath"
 	"strings"
 
 	"code.gitea.io/gitea/models"
 	"code.gitea.io/gitea/modules/base"
 	"code.gitea.io/gitea/modules/context"
 	"code.gitea.io/gitea/modules/git"
+	"code.gitea.io/gitea/modules/highlight"
 	"code.gitea.io/gitea/modules/log"
 	"code.gitea.io/gitea/modules/setting"
 	"code.gitea.io/gitea/services/gitdiff"
 )
 
 const (
-	tplCompare base.TplName = "repo/diff/compare"
+	tplCompare     base.TplName = "repo/diff/compare"
+	tplBlobExcerpt base.TplName = "repo/diff/blob_excerpt"
 )
 
 // setPathsCompareContext sets context data for source and raw paths
@@ -434,3 +439,109 @@ func CompareDiff(ctx *context.Context) {
 
 	ctx.HTML(200, tplCompare)
 }
+
+// ExcerptBlob render blob excerpt contents
+func ExcerptBlob(ctx *context.Context) {
+	commitID := ctx.Params("sha")
+	lastLeft := ctx.QueryInt("last_left")
+	lastRight := ctx.QueryInt("last_right")
+	idxLeft := ctx.QueryInt("left")
+	idxRight := ctx.QueryInt("right")
+	leftHunkSize := ctx.QueryInt("left_hunk_size")
+	rightHunkSize := ctx.QueryInt("right_hunk_size")
+	anchor := ctx.Query("anchor")
+	direction := ctx.Query("direction")
+	filePath := ctx.Query("path")
+	gitRepo := ctx.Repo.GitRepo
+	chunkSize := gitdiff.BlobExceprtChunkSize
+	commit, err := gitRepo.GetCommit(commitID)
+	if err != nil {
+		ctx.Error(500, "GetCommit")
+		return
+	}
+	section := &gitdiff.DiffSection{
+		Name: filePath,
+	}
+	if direction == "up" && (idxLeft-lastLeft) > chunkSize {
+		idxLeft -= chunkSize
+		idxRight -= chunkSize
+		leftHunkSize += chunkSize
+		rightHunkSize += chunkSize
+		section.Lines, err = getExcerptLines(commit, filePath, idxLeft-1, idxRight-1, chunkSize)
+	} else if direction == "down" && (idxLeft-lastLeft) > chunkSize {
+		section.Lines, err = getExcerptLines(commit, filePath, lastLeft, lastRight, chunkSize)
+		lastLeft += chunkSize
+		lastRight += chunkSize
+	} else {
+		section.Lines, err = getExcerptLines(commit, filePath, lastLeft, lastRight, idxRight-lastRight-1)
+		leftHunkSize = 0
+		rightHunkSize = 0
+		idxLeft = lastLeft
+		idxRight = lastRight
+	}
+	if err != nil {
+		ctx.Error(500, "getExcerptLines")
+		return
+	}
+	if idxRight > lastRight {
+		lineText := " "
+		if rightHunkSize > 0 || leftHunkSize > 0 {
+			lineText = fmt.Sprintf("@@ -%d,%d +%d,%d @@\n", idxLeft, leftHunkSize, idxRight, rightHunkSize)
+		}
+		lineText = html.EscapeString(lineText)
+		lineSection := &gitdiff.DiffLine{
+			Type:    gitdiff.DiffLineSection,
+			Content: lineText,
+			SectionInfo: &gitdiff.DiffLineSectionInfo{
+				Path:          filePath,
+				LastLeftIdx:   lastLeft,
+				LastRightIdx:  lastRight,
+				LeftIdx:       idxLeft,
+				RightIdx:      idxRight,
+				LeftHunkSize:  leftHunkSize,
+				RightHunkSize: rightHunkSize,
+			}}
+		if direction == "up" {
+			section.Lines = append([]*gitdiff.DiffLine{lineSection}, section.Lines...)
+		} else if direction == "down" {
+			section.Lines = append(section.Lines, lineSection)
+		}
+	}
+	ctx.Data["section"] = section
+	ctx.Data["fileName"] = filePath
+	ctx.Data["highlightClass"] = highlight.FileNameToHighlightClass(filepath.Base(filePath))
+	ctx.Data["AfterCommitID"] = commitID
+	ctx.Data["Anchor"] = anchor
+	ctx.HTML(200, tplBlobExcerpt)
+}
+
+func getExcerptLines(commit *git.Commit, filePath string, idxLeft int, idxRight int, chunkSize int) ([]*gitdiff.DiffLine, error) {
+	blob, err := commit.Tree.GetBlobByPath(filePath)
+	if err != nil {
+		return nil, err
+	}
+	reader, err := blob.DataAsync()
+	if err != nil {
+		return nil, err
+	}
+	defer reader.Close()
+	scanner := bufio.NewScanner(reader)
+	var diffLines []*gitdiff.DiffLine
+	for line := 0; line < idxRight+chunkSize; line++ {
+		if ok := scanner.Scan(); !ok {
+			break
+		}
+		if line < idxRight {
+			continue
+		}
+		lineText := scanner.Text()
+		diffLine := &gitdiff.DiffLine{
+			LeftIdx:  idxLeft + (line - idxRight) + 1,
+			RightIdx: line + 1,
+			Type:     gitdiff.DiffLinePlain,
+			Content:  " " + lineText,
+		}
+		diffLines = append(diffLines, diffLine)
+	}
+	return diffLines, nil
+}

routers/repo/commit.go

@@ -552,6 +552,7 @@ func ViewPullFiles(ctx *context.Context) {
 		ctx.Data["Username"] = pull.MustHeadUserName()
 		ctx.Data["Reponame"] = pull.HeadRepo.Name
 	}
+	ctx.Data["AfterCommitID"] = endCommitID
 
 	diff, err := gitdiff.GetDiffRangeWithWhitespaceBehavior(diffRepoPath,
 		startCommitID, endCommitID, setting.Git.MaxGitDiffLines,

routers/repo/compare.go

@@ -864,6 +864,10 @@ func RegisterRoutes(m *macaron.Macaron) {
 			m.Get("", repo.Branches)
 		}, repo.MustBeNotEmpty, context.RepoRef(), reqRepoCodeReader)
 
+		m.Group("/blob_excerpt", func() {
+			m.Get("/:sha", repo.SetEditorconfigIfExists, repo.SetDiffViewStyle, repo.ExcerptBlob)
+		}, repo.MustBeNotEmpty, context.RepoRef(), reqRepoCodeReader)
+
 		m.Group("/pulls/:index", func() {
 			m.Get(".diff", repo.DownloadPullDiff)
 			m.Get(".patch", repo.DownloadPullPatch)