godotengine/godot-interactive-changelog
1
0
Fork 0
mirror of https://github.com/godotengine/godot-interactive-changelog.git synced 2026-01-04 02:10:03 +03:00
Code Issues Packages Projects Releases Wiki Activity

Add a changelog header

Browse Source
This commit is contained in:
Yuri Sizov
2023-03-23 17:41:53 +01:00
parent bd58020d5f
commit 2453edcf27
7 changed files with 180 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/paths/index/components/IndexDescription.js
View File

@@ -73,8 +73,6 @@ export default class IndexDescription extends LitElement {
<br>
You can browse changes related to every release by commit, by PR, or
by author.
<br>
You can also copy changelogs as text.
</div>
<div class="header-description-column header-extra-links">
</div>

13
src/paths/index/components/changes/AuthorItem.js
View File

@@ -62,8 +62,19 @@ export default class AuthorItem extends LitElement {
:host {
padding: 14px 0 20px 0;
}
}
@media only screen and (max-width: 640px) {
:host .item-container {
padding: 0 10px;
}
:host .item-meta {
flex-wrap: wrap;
flex-direction: column;
}
:host .item-links {
text-align: left;
}
}
`;

18
src/paths/index/components/changes/ChangesList.js
View File

@@ -52,7 +52,6 @@ export default class ChangesList extends LitElement {
}
@property({ type: Object }) version = {};
@property({ type: Array }) log = [];
@property({ type: Object }) authors = {};
@property({ type: Object }) commits = {};
@property({ type: Object }) pulls = {};
@@ -68,6 +67,10 @@ export default class ChangesList extends LitElement {
this._viewMode = "pulls";
this._active_log = [];
this._version_ref = "";
this._version_from_ref = "";
this._version_article = "";
this._filtered_commits = [];
this._filtered_pulls = [];
this._filtered_authors = [];
@@ -81,12 +84,18 @@ export default class ChangesList extends LitElement {
// Default to the main log of the version.
this._active_log = this.version.commit_log;
this._version_ref = this.version.ref;
this._version_from_ref = this.version.from_ref;
this._version_article = this.version.article;
// But if we're in a specific release, find its log.
if (this.selectedRelease !== "") {
for (let release of this.version.releases) {
if (release.name === this.selectedRelease) {
this._active_log = release.commit_log;
this._version_ref = release.ref;
this._version_from_ref = release.from_ref;
this._version_article = release.article;
break;
}
}
@@ -239,6 +248,13 @@ export default class ChangesList extends LitElement {
.pull_count="${this._filtered_pulls.length}"
.commit_count="${this._filtered_commits.length}"
.author_count="${this._filtered_authors.length}"
.repository="${this.selectedRepository}"
.version_name="${this.selectedVersion}"
.release_name="${this.selectedRelease}"
.version_ref="${this._version_ref}"
.version_from_ref="${this._version_from_ref}"
.version_article="${this._version_article}"
.current_mode="${this._viewMode}"
@modechange="${this._onModeChanged}"

154
src/paths/index/components/changes/ChangesToolbar.js
View File

@@ -22,14 +22,52 @@ export default class ChangesToolbar extends LitElement {
:host {
}
:host a {
color: var(--link-font-color);
text-decoration: none;
}
:host a:hover {
color: var(--link-font-color-hover);
}
:host .version-changes-toolbar {
background: var(--changes-toolbar-color);
border-radius: 4px;
padding: 10px 14px;
margin-bottom: 6px;
display: flex;
flex-direction: column;
gap: 12px;
}
:host .changes-version {
display: flex;
align-items: center;
gap: 12px;
font-size: 13px;
}
:host .changes-title {
color: var(--g-font-color);
display: inline-block;
font-size: 20px;
line-height: 24px;
margin-top: 6px;
margin-bottom: 12px;
word-break: break-word;
flex-grow: 1;
}
:host .changes-title-links {
display: flex;
flex-direction: column;
align-items: flex-end;
}
:host .changes-stats {
display: flex;
flex-direction: row;
gap: 20px;
padding: 10px 14px;
margin-bottom: 6px;
}
:host .changes-count {
@@ -64,22 +102,53 @@ export default class ChangesToolbar extends LitElement {
@media only screen and (max-width: 900px) {
:host .changes-count {
font-size: 17px;
text-align: center;
justify-content: center;
width: 100%;
}
:host .changes-count strong {
font-size: 20px;
}
}
@media only screen and (max-width: 640px) {
:host .changes-version {
flex-direction: column;
align-items: flex-start;
gap: 6px;
margin-bottom: 10px;
}
:host .changes-title-links {
flex-direction: row;
justify-content: space-between;
width: 100%;
}
}
`;
}
@property({ type: Number }) pull_count = 0;
@property({ type: Number }) commit_count = 0;
@property({ type: Number }) author_count = 0;
@property({ type: String }) repository = "";
@property({ type: String }) version_name = "";
@property({ type: String }) release_name = "";
@property({ type: String }) version_ref = "";
@property({ type: String }) version_from_ref = "";
@property({ type: String }) version_article = "";
@property({ type: String }) current_mode = "";
_shortenRef(ref) {
if (ref.indexOf(".") >= 0) {
// This is a qualified version tag, don't shorten.
return ref;
}
return ref.substring(0, 9);
}
_onModeClicked(mode) {
if (mode === this.current_mode) {
return;
@@ -93,32 +162,63 @@ export default class ChangesToolbar extends LitElement {
render() {
return html`
<div class="version-changes-toolbar">
<div
class="changes-count ${(this.current_mode === "commits" ? "changes-count--active" : "")}"
@click="${this._onModeClicked.bind(this, "commits")}"
>
<strong>${this.commit_count}</strong>
<span class="changes-count-label">
${(this.commit_count === 1 ? "commit" : "commits")}
<div class="changes-version">
<span class="changes-title">
Changelog for ${this.version_name}${(this.release_name !== "" ? `-${this.release_name}` : "")}
</span>
<div class="changes-title-links">
<span>
commits:
<a
href="https://github.com/${this.repository}/compare/${this.version_from_ref}...${this.version_ref}"
target="_blank"
title="Open the commit list on GitHub"
>
${this._shortenRef(this.version_from_ref)}...${this._shortenRef(this.version_ref)}
</a>
</span>
${(this.version_article !== "" ? html`
<a
href="${this.version_article}"
target="_blank"
title="Open the release article on the official blog"
>
Read article
</a>
` : null)}
</div>
</div>
<div
class="changes-count ${(this.current_mode === "pulls" ? "changes-count--active" : "")}"
@click="${this._onModeClicked.bind(this, "pulls")}"
>
<strong>${this.pull_count}</strong>
<span class="changes-count-label">
${(this.pull_count === 1 ? "pull-request" : "pull-requests")}
</span>
</div>
<div
class="changes-count ${(this.current_mode === "authors" ? "changes-count--active" : "")}"
@click="${this._onModeClicked.bind(this, "authors")}"
>
<strong>${this.author_count}</strong>
<span class="changes-count-label">
${(this.author_count === 1 ? "contributor" : "contributors")}
</span>
<div class="changes-stats">
<div
class="changes-count ${(this.current_mode === "commits" ? "changes-count--active" : "")}"
@click="${this._onModeClicked.bind(this, "commits")}"
>
<strong>${this.commit_count}</strong>
<span class="changes-count-label">
${(this.commit_count === 1 ? "commit" : "commits")}
</span>
</div>
<div
class="changes-count ${(this.current_mode === "pulls" ? "changes-count--active" : "")}"
@click="${this._onModeClicked.bind(this, "pulls")}"
>
<strong>${this.pull_count}</strong>
<span class="changes-count-label">
${(this.pull_count === 1 ? "pull-request" : "pull-requests")}
</span>
</div>
<div
class="changes-count ${(this.current_mode === "authors" ? "changes-count--active" : "")}"
@click="${this._onModeClicked.bind(this, "authors")}"
>
<strong>${this.author_count}</strong>
<span class="changes-count-label">
${(this.author_count === 1 ? "contributor" : "contributors")}
</span>
</div>
</div>
</div>
`;

13
src/paths/index/components/changes/CommitItem.js
View File

@@ -67,8 +67,19 @@ export default class CommitItem extends LitElement {
:host {
padding: 14px 0 20px 0;
}
}
@media only screen and (max-width: 640px) {
:host .item-container {
padding: 0 10px;
}
:host .item-meta {
flex-wrap: wrap;
flex-direction: column;
}
:host .item-people {
text-align: left;
}
}
`;

13
src/paths/index/components/changes/PullRequestItem.js
View File

@@ -68,8 +68,19 @@ export default class PullRequestItem extends LitElement {
:host {
padding: 14px 0 20px 0;
}
}
@media only screen and (max-width: 640px) {
:host .item-container {
padding: 0 10px;
}
:host .item-meta {
flex-wrap: wrap;
flex-direction: column;
}
:host .item-people {
text-align: left;
}
}
`;

3
src/paths/index/entry.js
View File

@@ -185,7 +185,6 @@ export default class EntryComponent extends LitElement {
const [...loadingVersions] = this._loadingVersions;
let version = {};
let commitLog = [];
let authors = {};
let commits = {};
let pulls = {};
@@ -194,7 +193,6 @@ export default class EntryComponent extends LitElement {
const versionData = this._versionData[this._selectedVersion];
version = versionData.config;
commitLog = versionData.log;
authors = versionData.authors;
commits = versionData.commits;
pulls = versionData.pulls;
@@ -221,7 +219,6 @@ export default class EntryComponent extends LitElement {
${(this._selectedVersion !== "" ? html`
<gr-changes-list
.version=${version}
.log="${commitLog}"
.authors="${authors}"
.commits="${commits}"
.pulls="${pulls}"