Use 'owned commit' instead of 'sub commit' whenever refers to a commit owned by anoth...
[WebKit.git] / Websites / perf.webkit.org / public / v3 / components / commit-log-viewer.js
1
2 class CommitLogViewer extends ComponentBase {
3
4     constructor()
5     {
6         super('commit-log-viewer');
7         this._lazilyFetchCommitLogs = new LazilyEvaluatedFunction(this._fetchCommitLogs.bind(this));
8         this._repository = null;
9         this._fetchingPromise = null;
10         this._commits = null;
11         this._renderCommitListLazily = new LazilyEvaluatedFunction(this._renderCommitList.bind(this));
12         this._showRepositoryName = true;
13     }
14
15     setShowRepositoryName(shouldShow)
16     {
17         this._showRepositoryName = shouldShow;
18         this.enqueueToRender();
19     }
20
21     view(repository, precedingRevision, lastRevision)
22     {
23         this._lazilyFetchCommitLogs.evaluate(repository, precedingRevision, lastRevision);
24     }
25
26     _fetchCommitLogs(repository, precedingRevision, lastRevision)
27     {
28         this._fetchingPromise = null;
29         this._commits = null;
30
31         if (!repository || !lastRevision) {
32             this._repository = null;
33             this.enqueueToRender();
34             return;
35         }
36
37         let promise;
38         if (!precedingRevision || precedingRevision == lastRevision)
39             promise = CommitLog.fetchForSingleRevision(repository, lastRevision);
40         else
41             promise = CommitLog.fetchBetweenRevisions(repository, precedingRevision, lastRevision);
42
43         this._repository = repository;
44         this._fetchingPromise = promise;
45
46         this._fetchingPromise.then((commits) => {
47             if (this._fetchingPromise != promise)
48                 return;
49             this._fetchingPromise = null;
50             this._commits = commits;
51             this.enqueueToRender();
52         }, (error) => {
53             if (this._fetchingPromise != promise)
54                 return;
55             this._fetchingPromise = null;
56             this._commits = null;
57             this.enqueueToRender();
58         });
59
60         this.enqueueToRender();
61     }
62
63     render()
64     {
65         const shouldShowRepositoryName = this._repository && (this._commits || this._fetchingPromise) && this._showRepositoryName;
66         this.content('repository-name').textContent = shouldShowRepositoryName ? this._repository.name() : '';
67         this.content('spinner-container').style.display = this._fetchingPromise ? null : 'none';
68         this._renderCommitListLazily.evaluate(this._commits);
69     }
70
71     _renderCommitList(commits)
72     {
73         const element = ComponentBase.createElement;
74         const link = ComponentBase.createLink;
75         let previousCommit = null;
76
77         this.renderReplace(this.content('commits-list'), (commits || []).map((commit) => {
78             const label = commit.label();
79             const url = commit.url();
80             const ownsCommits = previousCommit && previousCommit.ownsCommits() && commit.ownsCommits();
81             const ownedCommitDifferenceRow = ownsCommits ? element('tr', element('td', {colspan: 2}, new OwnedCommitViewer(previousCommit, commit))) : [];
82             previousCommit = commit;
83             return [ownedCommitDifferenceRow,
84                 element('tr', [
85                     element('th', [element('h4', {class: 'revision'}, url ? link(label, commit.title(), url) : label), commit.author() || '']),
86                     element('td', commit.message() ? commit.message().substring(0, 80) : '')])];
87         }));
88     }
89
90     static htmlTemplate()
91     {
92         return `
93             <div class="commits-viewer-container">
94                 <div id="spinner-container"><spinner-icon id="spinner"></spinner-icon></div>
95                 <table id="commits-viewer-table">
96                     <caption id="repository-name"></caption>
97                     <tbody id="commits-list"></tbody>
98                 </table>
99             </div>
100 `;
101     }
102
103     static cssTemplate()
104     {
105         return `
106             .commits-viewer-container {
107                 width: 100%;
108                 height: calc(100% - 2px);
109                 overflow-y: scroll;
110             }
111
112             #commits-viewer-table {
113                 width: 100%;
114                 border-collapse: collapse;
115                 border-bottom: solid 1px #ccc;
116             }
117
118             caption {
119                 font-weight: inherit;
120                 font-size: 1rem;
121                 text-align: center;
122                 padding: 0.2rem;
123             }
124
125             .revision {
126                 white-space: nowrap;
127                 font-weight: normal;
128                 margin: 0;
129                 padding: 0;
130             }
131
132             td, th {
133                 word-break: break-word;
134                 border-top: solid 1px #ccc;
135                 padding: 0.2rem;
136                 margin: 0;
137                 font-size: 0.8rem;
138                 font-weight: normal;
139             }
140
141             #spinner-container {
142                 margin-top: 2rem;
143                 text-align: center;
144             }
145 `;
146     }
147
148 }
149
150 ComponentBase.defineElement('commit-log-viewer', CommitLogViewer);