From 79399b94cc6625d015fad838666d3ba86c396cb6 Mon Sep 17 00:00:00 2001 From: Michael Hutchison Date: Mon, 15 Apr 2019 10:54:44 +1000 Subject: [PATCH] Release 1.4.5 package & documentation changes --- CHANGELOG.md | 9 +++++++++ README.md | 2 ++ package.json | 2 +- web/main.ts | 34 ++++++++++++++++++++-------------- 4 files changed, 32 insertions(+), 15 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index f4905cdf..45d06c87 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,14 @@ # Change Log +## 1.4.5 - 2019-04-15 +* #26 Fetch and show commit author / committer avatars from GitHub, GitLab & Gravatar. If you'd like to use this feature, you must enable the setting `git-graph.fetchAvatars`. Thanks @meierw for helping with the development of this! +* #37 Columns can be resized by dragging the dividers in the table header. +* #43 Add more emphasis to the head commit. +* #44 Improved the documentation and descriptions of extension settings. +* #45 Include commits from heads that are only referenced by tags. +* #46 Fixed graph node misalignment when Visual Studio Code is zoomed. +* #51 Observe Visual Studio Code theme changes while Git Graph is open, now required due to a change in Visual Studio Code 1.33.0. + ## 1.4.4 - 2019-04-01 * #27 Add lightweight or annotated tags. Add message (optional) to annotated tags. * #35 Merge a specific commit from the commit context menu. diff --git a/README.md b/README.md index 1b82cbf2..8a7c881e 100644 --- a/README.md +++ b/README.md @@ -30,6 +30,7 @@ This extension contributes the following settings: * `git-graph.autoCenterCommitDetailsView`: Automatically center the commit details view when it is opened. * `git-graph.dateFormat`: Specifies the date format to be used in the date column of the graph. * `git-graph.dateType`: Specifies the date type to be displayed throughout Git Graph, either the author or commit date. +* `git-graph.fetchAvatars`: Fetch avatars of commit authors and committers. Default: false (disabled) * `git-graph.graphColours`: Specifies the colours used on the graph. * `git-graph.graphStyle`: Specifies the style of the graph. * `git-graph.initialLoadCommits`: Specifies the number of commits to initially load. @@ -50,6 +51,7 @@ More information on each setting, including detailed descriptions, default value This extension contributes the following commands: * `git-graph.view`: Git Graph: View Git Graph +* `git-graph.clearAvatarCache`: Git Graph: Clear Avatar Cache ## Release Notes diff --git a/package.json b/package.json index 9445ac6b..7f146ed9 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "git-graph", "displayName": "Git Graph", - "version": "1.4.4", + "version": "1.4.5", "publisher": "mhutchie", "author": { "name": "Michael Hutchison", diff --git a/web/main.ts b/web/main.ts index 1500f3af..47428b3a 100644 --- a/web/main.ts +++ b/web/main.ts @@ -39,7 +39,6 @@ private showRemoteBranches: boolean = true; private expandedCommit: ExpandedCommit | null = null; private maxCommits: number; - private windowSize: { width: number, height: number }; private tableElem: HTMLElement; private footerElem: HTMLElement; @@ -82,14 +81,7 @@ document.getElementById('refreshBtn')!.addEventListener('click', () => { this.refresh(true); }); - this.windowSize = { width: window.outerWidth, height: window.outerHeight }; - window.addEventListener('resize', () => { - if (this.windowSize.width === window.outerWidth && this.windowSize.height === window.outerHeight) { - this.renderGraph(); - } else { - this.windowSize = { width: window.outerWidth, height: window.outerHeight }; - } - }); + this.observeWindowSizeChanges(); this.observeWebviewStyleChanges(); this.renderShowLoading(); @@ -214,9 +206,9 @@ public loadAvatar(email: string, image: string) { this.avatars[email] = image; this.saveState(); - let avatarsElems = >document.getElementsByClassName('avatar'); + let avatarsElems = >document.getElementsByClassName('avatar'), escapedEmail = escapeHtml(email); for (let i = 0; i < avatarsElems.length; i++) { - if (avatarsElems[i].dataset.email === email) { + if (avatarsElems[i].dataset.email === escapedEmail) { avatarsElems[i].innerHTML = ''; } } @@ -292,8 +284,10 @@ this.renderGraph(); } private renderGraph() { - let headerHeight = document.getElementById('tableHeaderGraphCol')!.parentElement!.clientHeight + 1; - this.config.grid.expandY = this.expandedCommit !== null ? document.getElementById('commitDetails')!.getBoundingClientRect().height : this.config.grid.expandY; + let colHeadersElem = document.getElementById('tableColHeaders'); + if (colHeadersElem === null) return; + let headerHeight = colHeadersElem.clientHeight + 1, expandedCommitElem = this.expandedCommit !== null ? document.getElementById('commitDetails') : null; + this.config.grid.expandY = expandedCommitElem !== null ? expandedCommitElem.getBoundingClientRect().height : this.config.grid.expandY; this.config.grid.y = this.commits.length > 0 ? (this.tableElem.children[0].clientHeight - headerHeight - (this.expandedCommit !== null ? this.config.grid.expandY : 0)) / this.commits.length : this.config.grid.y; this.config.grid.offsetY = headerHeight + this.config.grid.y / 2; this.graph.render(this.expandedCommit); @@ -308,7 +302,7 @@ refHtml = '' + (this.commits[i].refs[j].type === 'tag' ? svgIcons.tag : svgIcons.branch) + refName + ''; refs = refActive ? refHtml + refs : refs + refHtml; } - html += '' + (this.commits[i].hash === this.commitHead ? '' : '') + refs + (this.commits[i].hash === currentHash ? '' + message + '' : message) + '' + date.value + '' + (this.config.fetchAvatars ? '' + (typeof this.avatars[this.commits[i].email] === 'string' ? '' : '') + '' : '') + escapeHtml(this.commits[i].author) + '' + abbrevCommit(this.commits[i].hash) + ''; + html += '' + (this.commits[i].hash === this.commitHead ? '' : '') + refs + (this.commits[i].hash === currentHash ? '' + message + '' : message) + '' + date.value + '' + (this.config.fetchAvatars ? '' + (typeof this.avatars[this.commits[i].email] === 'string' ? '' : '') + '' : '') + escapeHtml(this.commits[i].author) + '' + abbrevCommit(this.commits[i].hash) + ''; } this.tableElem.innerHTML = '' + html + '
'; this.footerElem.innerHTML = this.moreCommitsAvailable ? '
Load More Commits
' : ''; @@ -620,6 +614,18 @@ } } + /* Observers */ + private observeWindowSizeChanges() { + let windowWidth = window.outerWidth, windowHeight = window.outerHeight; + window.addEventListener('resize', () => { + if (windowWidth === window.outerWidth && windowHeight === window.outerHeight) { + this.renderGraph(); + } else { + windowWidth = window.outerWidth; + windowHeight = window.outerHeight; + } + }); + } private observeWebviewStyleChanges() { let fontFamily = getVSCodeStyle('--vscode-editor-font-family'); (new MutationObserver(() => {