mirror of
https://github.com/go-gitea/gitea.git
synced 2025-07-10 14:44:41 +00:00
parent
41678e1a57
commit
70685a9489
@ -166,10 +166,13 @@ func Graph(ctx *context.Context) {
|
|||||||
ctx.Data["Username"] = ctx.Repo.Owner.Name
|
ctx.Data["Username"] = ctx.Repo.Owner.Name
|
||||||
ctx.Data["Reponame"] = ctx.Repo.Repository.Name
|
ctx.Data["Reponame"] = ctx.Repo.Repository.Name
|
||||||
|
|
||||||
|
divOnly := ctx.FormBool("div-only")
|
||||||
|
queryParams := ctx.Req.URL.Query()
|
||||||
|
queryParams.Del("div-only")
|
||||||
paginator := context.NewPagination(int(graphCommitsCount), setting.UI.GraphMaxCommitNum, page, 5)
|
paginator := context.NewPagination(int(graphCommitsCount), setting.UI.GraphMaxCommitNum, page, 5)
|
||||||
paginator.AddParamFromRequest(ctx.Req)
|
paginator.AddParamFromQuery(queryParams)
|
||||||
ctx.Data["Page"] = paginator
|
ctx.Data["Page"] = paginator
|
||||||
if ctx.FormBool("div-only") {
|
if divOnly {
|
||||||
ctx.HTML(http.StatusOK, tplGraphDiv)
|
ctx.HTML(http.StatusOK, tplGraphDiv)
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
@ -33,8 +33,8 @@ func (p *Pagination) WithCurRows(n int) *Pagination {
|
|||||||
return p
|
return p
|
||||||
}
|
}
|
||||||
|
|
||||||
func (p *Pagination) AddParamFromRequest(req *http.Request) {
|
func (p *Pagination) AddParamFromQuery(q url.Values) {
|
||||||
for key, values := range req.URL.Query() {
|
for key, values := range q {
|
||||||
if key == "page" || len(values) == 0 || (len(values) == 1 && values[0] == "") {
|
if key == "page" || len(values) == 0 || (len(values) == 1 && values[0] == "") {
|
||||||
continue
|
continue
|
||||||
}
|
}
|
||||||
@ -45,6 +45,10 @@ func (p *Pagination) AddParamFromRequest(req *http.Request) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func (p *Pagination) AddParamFromRequest(req *http.Request) {
|
||||||
|
p.AddParamFromQuery(req.URL.Query())
|
||||||
|
}
|
||||||
|
|
||||||
// GetParams returns the configured URL params
|
// GetParams returns the configured URL params
|
||||||
func (p *Pagination) GetParams() template.URL {
|
func (p *Pagination) GetParams() template.URL {
|
||||||
return template.URL(strings.Join(p.urlParams, "&"))
|
return template.URL(strings.Join(p.urlParams, "&"))
|
||||||
|
@ -56,7 +56,7 @@
|
|||||||
{{end}}
|
{{end}}
|
||||||
{{if $.CommitsTagsMap}}
|
{{if $.CommitsTagsMap}}
|
||||||
{{range (index $.CommitsTagsMap .ID.String)}}
|
{{range (index $.CommitsTagsMap .ID.String)}}
|
||||||
{{- template "repo/tag/name" dict "RepoLink" $.Repository.Link "TagName" .TagName "IsRelease" (not .IsTag) -}}
|
{{- template "repo/tag/name" dict "AdditionalClasses" "tw-py-0" "RepoLink" $.Repository.Link "TagName" .TagName "IsRelease" (not .IsTag) -}}
|
||||||
{{end}}
|
{{end}}
|
||||||
{{end}}
|
{{end}}
|
||||||
</td>
|
</td>
|
||||||
|
@ -11,35 +11,30 @@
|
|||||||
<div class="default text">{{ctx.Locale.Tr "repo.commit_graph.select"}}</div>
|
<div class="default text">{{ctx.Locale.Tr "repo.commit_graph.select"}}</div>
|
||||||
<div class="menu">
|
<div class="menu">
|
||||||
<div class="item" data-value="...flow-hide-pr-refs">
|
<div class="item" data-value="...flow-hide-pr-refs">
|
||||||
<span class="truncate">
|
{{svg "octicon-eye-closed"}}
|
||||||
{{svg "octicon-eye-closed" 16 "tw-mr-1"}}<span title="{{ctx.Locale.Tr "repo.commit_graph.hide_pr_refs"}}">{{ctx.Locale.Tr "repo.commit_graph.hide_pr_refs"}}</span>
|
<span class="gt-ellipsis" title="{{ctx.Locale.Tr "repo.commit_graph.hide_pr_refs"}}">{{ctx.Locale.Tr "repo.commit_graph.hide_pr_refs"}}</span>
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
{{range .AllRefs}}
|
{{range .AllRefs}}
|
||||||
{{$refGroup := .RefGroup}}
|
{{$refGroup := .RefGroup}}
|
||||||
{{if eq $refGroup "pull"}}
|
{{if eq $refGroup "pull"}}
|
||||||
<div class="item" data-value="{{.Name}}">
|
<div class="item" data-value="{{.Name}}">
|
||||||
<span class="truncate">
|
{{svg "octicon-git-pull-request"}}
|
||||||
{{svg "octicon-git-pull-request" 16 "tw-mr-1"}}<span title="{{.ShortName}}">#{{.ShortName}}</span>
|
<span class="gt-ellipsis" title="{{.ShortName}}">#{{.ShortName}}</span>
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
{{else if eq $refGroup "tags"}}
|
{{else if eq $refGroup "tags"}}
|
||||||
<div class="item" data-value="{{.Name}}">
|
<div class="item" data-value="{{.Name}}">
|
||||||
<span class="truncate">
|
{{svg "octicon-tag"}}
|
||||||
{{svg "octicon-tag" 16 "tw-mr-1"}}<span title="{{.ShortName}}">{{.ShortName}}</span>
|
<span class="gt-ellipsis" title="{{.ShortName}}">{{.ShortName}}</span>
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
{{else if eq $refGroup "remotes"}}
|
{{else if eq $refGroup "remotes"}}
|
||||||
<div class="item" data-value="{{.Name}}">
|
<div class="item" data-value="{{.Name}}">
|
||||||
<span class="truncate">
|
{{svg "octicon-cross-reference"}}
|
||||||
{{svg "octicon-cross-reference" 16 "tw-mr-1"}}<span title="{{.ShortName}}">{{.ShortName}}</span>
|
<span class="gt-ellipsis" title="{{.ShortName}}">{{.ShortName}}</span>
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
{{else if eq $refGroup "heads"}}
|
{{else if eq $refGroup "heads"}}
|
||||||
<div class="item" data-value="{{.Name}}">
|
<div class="item" data-value="{{.Name}}">
|
||||||
<span class="truncate">
|
{{svg "octicon-git-branch"}}
|
||||||
{{svg "octicon-git-branch" 16 "tw-mr-1"}}<span title="{{.ShortName}}">{{.ShortName}}</span>
|
<span class="gt-ellipsis" title="{{.ShortName}}">{{.ShortName}}</span>
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
{{end}}
|
{{end}}
|
||||||
{{end}}
|
{{end}}
|
||||||
@ -49,14 +44,12 @@
|
|||||||
<button id="flow-color-colored" class="ui icon button{{if ne .Mode "monochrome"}} active{{end}}" title="{{ctx.Locale.Tr "repo.commit_graph.color"}}">{{svg "material-palette" 16 "tw-mr-1"}}{{ctx.Locale.Tr "repo.commit_graph.color"}}</button>
|
<button id="flow-color-colored" class="ui icon button{{if ne .Mode "monochrome"}} active{{end}}" title="{{ctx.Locale.Tr "repo.commit_graph.color"}}">{{svg "material-palette" 16 "tw-mr-1"}}{{ctx.Locale.Tr "repo.commit_graph.color"}}</button>
|
||||||
</div>
|
</div>
|
||||||
</h2>
|
</h2>
|
||||||
<div class="ui dividing"></div>
|
<div id="git-graph-body">
|
||||||
<div class="is-loading tw-py-32 tw-hidden" id="loading-indicator"></div>
|
|
||||||
{{template "repo/graph/svgcontainer" .}}
|
{{template "repo/graph/svgcontainer" .}}
|
||||||
{{template "repo/graph/commits" .}}
|
{{template "repo/graph/commits" .}}
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="pagination">
|
|
||||||
{{template "base/paginate" .}}
|
{{template "base/paginate" .}}
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{{template "base/footer" .}}
|
{{template "base/footer" .}}
|
||||||
|
@ -5,10 +5,13 @@
|
|||||||
{{if $commit.OnlyRelation}}
|
{{if $commit.OnlyRelation}}
|
||||||
<span></span>
|
<span></span>
|
||||||
{{else}}
|
{{else}}
|
||||||
|
{{/* every field must be in a span to get correctly styled */}}
|
||||||
|
<span>
|
||||||
{{template "repo/commit_sign_badge" dict "Commit" $commit.Commit "CommitBaseLink" (print $.RepoLink "/commit") "CommitSignVerification" $commit.Verification}}
|
{{template "repo/commit_sign_badge" dict "Commit" $commit.Commit "CommitBaseLink" (print $.RepoLink "/commit") "CommitSignVerification" $commit.Verification}}
|
||||||
|
</span>
|
||||||
|
|
||||||
<span class="message tw-inline-block gt-ellipsis">
|
<span class="message tw-inline-block gt-ellipsis">
|
||||||
<span>{{ctx.RenderUtils.RenderCommitMessage $commit.Subject $.Repository}}</span>
|
{{ctx.RenderUtils.RenderCommitMessage $commit.Subject $.Repository}}
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span class="commit-refs flex-text-inline">
|
<span class="commit-refs flex-text-inline">
|
||||||
@ -22,7 +25,7 @@
|
|||||||
</a>
|
</a>
|
||||||
{{end}}
|
{{end}}
|
||||||
{{else if eq $refGroup "tags"}}
|
{{else if eq $refGroup "tags"}}
|
||||||
{{- template "repo/tag/name" dict "RepoLink" $.Repository.Link "TagName" .ShortName -}}
|
{{- template "repo/tag/name" dict "AdditionalClasses" "tag-label" "RepoLink" $.Repository.Link "TagName" .ShortName -}}
|
||||||
{{else if eq $refGroup "remotes"}}
|
{{else if eq $refGroup "remotes"}}
|
||||||
<a class="ui basic tiny button" href="{{$.RepoLink}}/src/commit/{{$commit.Rev|PathEscape}}">
|
<a class="ui basic tiny button" href="{{$.RepoLink}}/src/commit/{{$commit.Rev|PathEscape}}">
|
||||||
{{svg "octicon-cross-reference"}} {{.ShortName}}
|
{{svg "octicon-cross-reference"}} {{.ShortName}}
|
||||||
|
@ -1,7 +1,3 @@
|
|||||||
<div>
|
|
||||||
{{template "repo/graph/svgcontainer" .}}
|
{{template "repo/graph/svgcontainer" .}}
|
||||||
{{template "repo/graph/commits" .}}
|
{{template "repo/graph/commits" .}}
|
||||||
<div id="pagination">
|
|
||||||
{{template "base/paginate" .}}
|
{{template "base/paginate" .}}
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
@ -1,3 +1,3 @@
|
|||||||
<a class="ui basic label tw-p-1 {{if .IsRelease}}primary{{end}}" href="{{.RepoLink}}/src/tag/{{.TagName|PathEscape}}">
|
<a class="ui basic label {{if .IsRelease}}primary{{end}} {{.AdditionalClasses}}" href="{{.RepoLink}}/src/tag/{{.TagName|PathEscape}}">
|
||||||
{{svg "octicon-tag"}} {{.TagName}}
|
{{svg "octicon-tag"}} {{.TagName}}
|
||||||
</a>
|
</a>
|
||||||
|
@ -10,14 +10,6 @@
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
#git-graph-container .color-buttons {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container .ui.header.dividing {
|
|
||||||
padding-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container #flow-select-refs-dropdown {
|
#git-graph-container #flow-select-refs-dropdown {
|
||||||
border-top-right-radius: 0;
|
border-top-right-radius: 0;
|
||||||
border-bottom-right-radius: 0;
|
border-bottom-right-radius: 0;
|
||||||
@ -31,25 +23,6 @@
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
#git-graph-container #flow-select-refs-dropdown .ui.label .truncate {
|
|
||||||
display: inline-block;
|
|
||||||
max-width: 140px;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
vertical-align: top;
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container #flow-select-refs-dropdown .default.text {
|
|
||||||
padding-top: 4px;
|
|
||||||
padding-bottom: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container #flow-select-refs-dropdown input.search {
|
|
||||||
position: relative;
|
|
||||||
top: 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container li {
|
#git-graph-container li {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
height: 24px;
|
height: 24px;
|
||||||
@ -57,16 +30,20 @@
|
|||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 0.25em;
|
gap: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#git-graph-container li > span {
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#git-graph-container li > span.message {
|
||||||
|
flex-shrink: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
#git-graph-container li .ui.label.commit-id-short {
|
#git-graph-container li .ui.label.commit-id-short {
|
||||||
padding-top: 2px;
|
padding: 2px 4px;
|
||||||
padding-bottom: 2px;
|
height: 20px;
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container li .node-relation {
|
|
||||||
font-family: var(--fonts-monospace);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#git-graph-container li .author {
|
#git-graph-container li .author {
|
||||||
@ -78,17 +55,6 @@
|
|||||||
font-size: 80%;
|
font-size: 80%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#git-graph-container li a:not(.ui):hover {
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container li a em {
|
|
||||||
color: var(--color-red);
|
|
||||||
border-bottom: 1px dotted var(--color-secondary);
|
|
||||||
text-decoration: none;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container #rel-container {
|
#git-graph-container #rel-container {
|
||||||
max-width: 30%;
|
max-width: 30%;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
@ -105,34 +71,23 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#git-graph-container #rev-list li.highlight.hover {
|
#git-graph-container li .commit-refs .ui.button,
|
||||||
background-color: var(--color-secondary-alpha-30);
|
#git-graph-container li .commit-refs .ui.label.tag-label {
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container #rev-list .commit-refs .button {
|
|
||||||
padding: 2px 4px;
|
padding: 2px 4px;
|
||||||
margin-right: 0.25em;
|
margin-right: 0.25em;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
max-width: 200px;
|
max-width: 200px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
|
line-height: var(--line-height-default);
|
||||||
min-height: 0;
|
min-height: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#git-graph-container #graph-raw-list {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container.monochrome #rel-container .flow-group {
|
#git-graph-container.monochrome #rel-container .flow-group {
|
||||||
stroke: var(--color-secondary-dark-5);
|
stroke: var(--color-secondary-dark-5);
|
||||||
fill: var(--color-secondary-dark-5);
|
fill: var(--color-secondary-dark-5);
|
||||||
}
|
}
|
||||||
|
|
||||||
#git-graph-container.monochrome #rel-container .flow-group.highlight {
|
|
||||||
stroke: var(--color-secondary-dark-12);
|
|
||||||
fill: var(--color-secondary-dark-12);
|
|
||||||
}
|
|
||||||
|
|
||||||
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-1 {
|
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-1 {
|
||||||
stroke: #499a37;
|
stroke: #499a37;
|
||||||
fill: #499a37;
|
fill: #499a37;
|
||||||
|
@ -4,6 +4,7 @@
|
|||||||
.ui.label {
|
.ui.label {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
vertical-align: middle;
|
||||||
gap: var(--gap-inline);
|
gap: var(--gap-inline);
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
@ -88,10 +89,6 @@ a.ui.label:hover {
|
|||||||
color: var(--color-label-text);
|
color: var(--color-label-text);
|
||||||
}
|
}
|
||||||
|
|
||||||
.ui.label.visible:not(.dropdown) {
|
|
||||||
display: inline-block !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ui.basic.label {
|
.ui.basic.label {
|
||||||
background: var(--color-button);
|
background: var(--color-button);
|
||||||
border: 1px solid var(--color-light-border);
|
border: 1px solid var(--color-light-border);
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import {hideElem, showElem, type DOMEvent} from '../utils/dom.ts';
|
import {toggleClass} from '../utils/dom.ts';
|
||||||
import {GET} from '../modules/fetch.ts';
|
import {GET} from '../modules/fetch.ts';
|
||||||
import {fomanticQuery} from '../modules/fomantic/base.ts';
|
import {fomanticQuery} from '../modules/fomantic/base.ts';
|
||||||
|
|
||||||
@ -6,87 +6,59 @@ export function initRepoGraphGit() {
|
|||||||
const graphContainer = document.querySelector<HTMLElement>('#git-graph-container');
|
const graphContainer = document.querySelector<HTMLElement>('#git-graph-container');
|
||||||
if (!graphContainer) return;
|
if (!graphContainer) return;
|
||||||
|
|
||||||
document.querySelector('#flow-color-monochrome')?.addEventListener('click', () => {
|
const elColorMonochrome = document.querySelector<HTMLElement>('#flow-color-monochrome');
|
||||||
document.querySelector('#flow-color-monochrome').classList.add('active');
|
const elColorColored = document.querySelector<HTMLElement>('#flow-color-colored');
|
||||||
document.querySelector('#flow-color-colored')?.classList.remove('active');
|
const toggleColorMode = (mode: 'monochrome' | 'colored') => {
|
||||||
graphContainer.classList.remove('colored');
|
toggleClass(graphContainer, 'monochrome', mode === 'monochrome');
|
||||||
graphContainer.classList.add('monochrome');
|
toggleClass(graphContainer, 'colored', mode === 'colored');
|
||||||
const params = new URLSearchParams(window.location.search);
|
|
||||||
params.set('mode', 'monochrome');
|
|
||||||
const queryString = params.toString();
|
|
||||||
if (queryString) {
|
|
||||||
window.history.replaceState({}, '', `?${queryString}`);
|
|
||||||
} else {
|
|
||||||
window.history.replaceState({}, '', window.location.pathname);
|
|
||||||
}
|
|
||||||
for (const link of document.querySelectorAll('.pagination a')) {
|
|
||||||
const href = link.getAttribute('href');
|
|
||||||
if (!href) continue;
|
|
||||||
const url = new URL(href, window.location.href);
|
|
||||||
const params = url.searchParams;
|
|
||||||
params.set('mode', 'monochrome');
|
|
||||||
url.search = `?${params.toString()}`;
|
|
||||||
link.setAttribute('href', url.href);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
document.querySelector('#flow-color-colored')?.addEventListener('click', () => {
|
toggleClass(elColorMonochrome, 'active', mode === 'monochrome');
|
||||||
document.querySelector('#flow-color-colored').classList.add('active');
|
toggleClass(elColorColored, 'active', mode === 'colored');
|
||||||
document.querySelector('#flow-color-monochrome')?.classList.remove('active');
|
|
||||||
graphContainer.classList.add('colored');
|
const params = new URLSearchParams(window.location.search);
|
||||||
graphContainer.classList.remove('monochrome');
|
params.set('mode', mode);
|
||||||
for (const link of document.querySelectorAll('.pagination a')) {
|
window.history.replaceState(null, '', `?${params.toString()}`);
|
||||||
|
for (const link of document.querySelectorAll('#pagination .pagination a')) {
|
||||||
const href = link.getAttribute('href');
|
const href = link.getAttribute('href');
|
||||||
if (!href) continue;
|
if (!href) continue;
|
||||||
const url = new URL(href, window.location.href);
|
const url = new URL(href, window.location.href);
|
||||||
const params = url.searchParams;
|
const params = url.searchParams;
|
||||||
params.delete('mode');
|
params.set('mode', mode);
|
||||||
url.search = `?${params.toString()}`;
|
url.search = `?${params.toString()}`;
|
||||||
link.setAttribute('href', url.href);
|
link.setAttribute('href', url.href);
|
||||||
}
|
}
|
||||||
const params = new URLSearchParams(window.location.search);
|
};
|
||||||
params.delete('mode');
|
elColorMonochrome.addEventListener('click', () => toggleColorMode('monochrome'));
|
||||||
const queryString = params.toString();
|
elColorColored.addEventListener('click', () => toggleColorMode('colored'));
|
||||||
if (queryString) {
|
|
||||||
window.history.replaceState({}, '', `?${queryString}`);
|
const elGraphBody = document.querySelector<HTMLElement>('#git-graph-body');
|
||||||
} else {
|
|
||||||
window.history.replaceState({}, '', window.location.pathname);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
const url = new URL(window.location.href);
|
const url = new URL(window.location.href);
|
||||||
const params = url.searchParams;
|
const params = url.searchParams;
|
||||||
const updateGraph = () => {
|
const loadGitGraph = async () => {
|
||||||
const queryString = params.toString();
|
const queryString = params.toString();
|
||||||
const ajaxUrl = new URL(url);
|
const ajaxUrl = new URL(url);
|
||||||
ajaxUrl.searchParams.set('div-only', 'true');
|
ajaxUrl.searchParams.set('div-only', 'true');
|
||||||
window.history.replaceState({}, '', queryString ? `?${queryString}` : window.location.pathname);
|
window.history.replaceState(null, '', queryString ? `?${queryString}` : window.location.pathname);
|
||||||
document.querySelector('#pagination').innerHTML = '';
|
|
||||||
hideElem('#rel-container');
|
elGraphBody.classList.add('is-loading');
|
||||||
hideElem('#rev-container');
|
try {
|
||||||
showElem('#loading-indicator');
|
const resp = await GET(ajaxUrl.toString());
|
||||||
(async () => {
|
elGraphBody.innerHTML = await resp.text();
|
||||||
const response = await GET(String(ajaxUrl));
|
} finally {
|
||||||
const html = await response.text();
|
elGraphBody.classList.remove('is-loading');
|
||||||
const div = document.createElement('div');
|
}
|
||||||
div.innerHTML = html;
|
|
||||||
document.querySelector('#pagination').innerHTML = div.querySelector('#pagination').innerHTML;
|
|
||||||
document.querySelector('#rel-container').innerHTML = div.querySelector('#rel-container').innerHTML;
|
|
||||||
document.querySelector('#rev-container').innerHTML = div.querySelector('#rev-container').innerHTML;
|
|
||||||
hideElem('#loading-indicator');
|
|
||||||
showElem('#rel-container');
|
|
||||||
showElem('#rev-container');
|
|
||||||
})();
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const dropdownSelected = params.getAll('branch');
|
const dropdownSelected = params.getAll('branch');
|
||||||
if (params.has('hide-pr-refs') && params.get('hide-pr-refs') === 'true') {
|
if (params.has('hide-pr-refs') && params.get('hide-pr-refs') === 'true') {
|
||||||
dropdownSelected.splice(0, 0, '...flow-hide-pr-refs');
|
dropdownSelected.splice(0, 0, '...flow-hide-pr-refs');
|
||||||
}
|
}
|
||||||
|
|
||||||
const flowSelectRefsDropdown = document.querySelector('#flow-select-refs-dropdown');
|
const $dropdown = fomanticQuery('#flow-select-refs-dropdown');
|
||||||
const $dropdown = fomanticQuery(flowSelectRefsDropdown);
|
$dropdown.dropdown({clearable: true});
|
||||||
$dropdown.dropdown({
|
$dropdown.dropdown('set selected', dropdownSelected);
|
||||||
clearable: true,
|
// must add the callback after setting the selected items, otherwise each "selected" item will trigger the callback
|
||||||
fullTextSeach: 'exact',
|
$dropdown.dropdown('setting', {
|
||||||
onRemove(toRemove: string) {
|
onRemove(toRemove: string) {
|
||||||
if (toRemove === '...flow-hide-pr-refs') {
|
if (toRemove === '...flow-hide-pr-refs') {
|
||||||
params.delete('hide-pr-refs');
|
params.delete('hide-pr-refs');
|
||||||
@ -99,7 +71,7 @@ export function initRepoGraphGit() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
updateGraph();
|
loadGitGraph();
|
||||||
},
|
},
|
||||||
onAdd(toAdd: string) {
|
onAdd(toAdd: string) {
|
||||||
if (toAdd === '...flow-hide-pr-refs') {
|
if (toAdd === '...flow-hide-pr-refs') {
|
||||||
@ -107,50 +79,7 @@ export function initRepoGraphGit() {
|
|||||||
} else {
|
} else {
|
||||||
params.append('branch', toAdd);
|
params.append('branch', toAdd);
|
||||||
}
|
}
|
||||||
updateGraph();
|
loadGitGraph();
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
$dropdown.dropdown('set selected', dropdownSelected);
|
|
||||||
|
|
||||||
graphContainer.addEventListener('mouseenter', (e: DOMEvent<MouseEvent>) => {
|
|
||||||
if (e.target.matches('#rev-list li')) {
|
|
||||||
const flow = e.target.getAttribute('data-flow');
|
|
||||||
if (flow === '0') return;
|
|
||||||
document.querySelector(`#flow-${flow}`)?.classList.add('highlight');
|
|
||||||
e.target.classList.add('hover');
|
|
||||||
for (const item of document.querySelectorAll(`#rev-list li[data-flow='${flow}']`)) {
|
|
||||||
item.classList.add('highlight');
|
|
||||||
}
|
|
||||||
} else if (e.target.matches('#rel-container .flow-group')) {
|
|
||||||
e.target.classList.add('highlight');
|
|
||||||
const flow = e.target.getAttribute('data-flow');
|
|
||||||
for (const item of document.querySelectorAll(`#rev-list li[data-flow='${flow}']`)) {
|
|
||||||
item.classList.add('highlight');
|
|
||||||
}
|
|
||||||
} else if (e.target.matches('#rel-container .flow-commit')) {
|
|
||||||
const rev = e.target.getAttribute('data-rev');
|
|
||||||
document.querySelector(`#rev-list li#commit-${rev}`)?.classList.add('hover');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
graphContainer.addEventListener('mouseleave', (e: DOMEvent<MouseEvent>) => {
|
|
||||||
if (e.target.matches('#rev-list li')) {
|
|
||||||
const flow = e.target.getAttribute('data-flow');
|
|
||||||
if (flow === '0') return;
|
|
||||||
document.querySelector(`#flow-${flow}`)?.classList.remove('highlight');
|
|
||||||
e.target.classList.remove('hover');
|
|
||||||
for (const item of document.querySelectorAll(`#rev-list li[data-flow='${flow}']`)) {
|
|
||||||
item.classList.remove('highlight');
|
|
||||||
}
|
|
||||||
} else if (e.target.matches('#rel-container .flow-group')) {
|
|
||||||
e.target.classList.remove('highlight');
|
|
||||||
const flow = e.target.getAttribute('data-flow');
|
|
||||||
for (const item of document.querySelectorAll(`#rev-list li[data-flow='${flow}']`)) {
|
|
||||||
item.classList.remove('highlight');
|
|
||||||
}
|
|
||||||
} else if (e.target.matches('#rel-container .flow-commit')) {
|
|
||||||
const rev = e.target.getAttribute('data-rev');
|
|
||||||
document.querySelector(`#rev-list li#commit-${rev}`)?.classList.remove('hover');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user