Skip to content

Commit 3ba4217

Browse files
committed
Initial implementation of Git Graph
0 parents  commit 3ba4217

21 files changed

+1398
-0
lines changed

.gitignore

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
media/main.js
2+
node_modules
3+
out
4+
*.vsix

.vscode/extensions.json

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
// See http://go.microsoft.com/fwlink/?LinkId=827846
3+
// for the documentation about the extensions.json format
4+
"recommendations": [
5+
"ms-vscode.vscode-typescript-tslint-plugin"
6+
]
7+
}

.vscode/launch.json

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"version": "0.2.0",
3+
"configurations": [{
4+
"name": "Run Extension",
5+
"type": "extensionHost",
6+
"request": "launch",
7+
"runtimeExecutable": "${execPath}",
8+
"args": [
9+
"--extensionDevelopmentPath=${workspaceFolder}"
10+
],
11+
"outFiles": [
12+
"${workspaceFolder}/out/**/*.js"
13+
]
14+
}
15+
]
16+
}

.vscode/settings.json

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"files.exclude": {
3+
"out": false
4+
},
5+
"search.exclude": {
6+
"out": true
7+
}
8+
}

CHANGELOG.md

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
# Change Log
2+
3+
## 1.0.0 - 2019-02-10
4+
* Initial release
5+
* Git Graph Visualisation
6+
* Select from Local & Remote Branches
7+
* Display Heads, Tags & Remotes
8+
* Configuration Settings:
9+
* git-graph.graphColours - Specifies the colours used on the graph.
10+
* git-graph.graphStyle - Specifies the style of the graph.
11+
* git-graph.dateFormat - Specifies the number of commits to initially load.
12+
* git-graph.initialLoadCommits - Specifies the number of commits to initially load.
13+
* git-graph.loadMoreCommits - Specifies the number of commits to load when the "Load More Commits" button is pressed (only shown when more commits are available).
14+
* git-graph.showStatusBarItem - Show a Status Bar item which opens Git Graph when clicked.
15+
* git-graph.showUncommittedChanges - Show uncommitted changes (set to false to decrease load time on large repositories).
16+
* Shortcut Button in the Status Bar

LICENSE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2019-present, mhutchie
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

README.md

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
# Git Graph extension for Visual Studio Code
2+
3+
View a Git Graph of your repository in Visual Studio Code. Configurable to look the way you want!
4+
5+
![Recording of Git Graph](https://github.com/mhutchie/vscode-git-graph/raw/master/resources/demo.gif)
6+
7+
## Features
8+
9+
* Git Graph Visualisation
10+
* Display Local & Remote Branches
11+
* Display Refs: Heads, Tags & Remotes
12+
* Display Uncommitted Changes
13+
* Configurable settings (e.g. graph style, branch colours, and more...)
14+
* "Git Graph: View Git Graph" launch command in the Command Palette
15+
* "Git Graph" launch button in the Status Bar
16+
17+
## Extension Settings
18+
19+
This extension contributes the following settings:
20+
21+
* `git-graph.graphColours`: Specifies the colours used on the graph.
22+
* `git-graph.graphStyle`: Specifies the style of the graph.
23+
* `git-graph.dateFormat`: Specifies the number of commits to initially load.
24+
* `git-graph.initialLoadCommits`: Specifies the number of commits to initially load.
25+
* `git-graph.loadMoreCommits`: Specifies the number of commits to load when the "Load More Commits" button is pressed (only shown when more commits are available).
26+
* `git-graph.showStatusBarItem`: Show a Status Bar item which opens Git Graph when clicked.
27+
* `git-graph.showUncommittedChanges`: Show uncommitted changes (set to false to decrease load time on large repositories).
28+
29+
## Extension Commands
30+
31+
This extension contributes the following commands:
32+
33+
* `git-graph.view`: Git Graph: View Git Graph
34+
35+
## Coming Soon
36+
37+
* Interact with commits shown on the Git Graph:
38+
* View Changes in commit
39+
* Create Branch from commit
40+
* Add Tag to commit
41+
* Checkout Branch
42+
43+
## Release Notes
44+
Detailed Release Notes are available [here](CHANGELOG.md).

media/main.css

Lines changed: 176 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,176 @@
1+
body{
2+
margin:0;
3+
padding:0;
4+
}
5+
6+
body.notGitRepository h1, body.notGitRepository p{
7+
text-align:center;
8+
}
9+
10+
#commitGraph{
11+
display:block;
12+
position:absolute;
13+
left:8px;
14+
top:71px;
15+
}
16+
#commitGraph{
17+
display:block;
18+
position:absolute;
19+
left:8px;
20+
top:71px;
21+
}
22+
#commitGraph circle.first{
23+
fill:var(--vscode-editor-background);
24+
stroke-width:2;
25+
}
26+
#commitGraph circle:not(.first){
27+
stroke:var(--vscode-editor-background);
28+
stroke-width:1;
29+
stroke-opacity:0.75;
30+
}
31+
#commitTable{
32+
display:block;
33+
position:absolute;
34+
left:0;
35+
right:0;
36+
top:40px;
37+
}
38+
#commitTable table{
39+
width:100%;
40+
border-collapse:collapse;
41+
}
42+
#commitTable table, #commitTable tbody, #commitTable tr, #commitTable th, #commitTable td{
43+
padding:0;
44+
margin:0;
45+
}
46+
#commitTable th, #commitTable td{
47+
white-space:nowrap;
48+
font-size:14px;
49+
}
50+
#commitTable tr:hover td{
51+
background-color:rgba(128,128,128,0.15);
52+
}
53+
#commitTable tr:hover:last-child td{
54+
background-color:unset;
55+
}
56+
#commitTable td{
57+
line-height:24px;
58+
padding:0 4px;
59+
}
60+
#commitTable th{
61+
border-left:1px solid rgba(128,128,128,0.5);
62+
border-bottom:1px solid rgba(128,128,128,0.5);
63+
background-color:rgba(128,128,128,0.2);
64+
line-height:18px;
65+
padding:6px 12px;
66+
cursor:default;
67+
}
68+
#commitTable th:first-child{
69+
border-left-width:0;
70+
}
71+
72+
#commitTable td:nth-child(2), #commitTable th:nth-child(2){
73+
width:100%;
74+
text-overflow:ellipsis;
75+
overflow:hidden;
76+
max-width:0;
77+
}
78+
#commitTable td:nth-child(4), #commitTable th:nth-child(4){
79+
max-width:120px;
80+
text-overflow:ellipsis;
81+
overflow:hidden;
82+
}
83+
.gitRef{
84+
background-color:rgba(128,128,128,0.2);
85+
border-radius:5px;
86+
border:1px solid rgba(128,128,128,0.5);
87+
padding:0 5px;
88+
margin-right:5px;
89+
height:12px;
90+
}
91+
.gitRef > svg{
92+
display:inline;
93+
fill:rgb(128,128,128);
94+
margin-right:3px;
95+
line-height:20px;
96+
vertical-align:sub;
97+
}
98+
99+
#loadingHeader{
100+
text-align:center;
101+
line-height:32px;
102+
}
103+
#loadingHeader svg{
104+
display:inline;
105+
fill:rgb(128,128,128);
106+
margin-right:10px;
107+
vertical-align:top;
108+
animation:loadingIconAnimation 2s linear infinite;
109+
}
110+
@keyframes loadingIconAnimation{
111+
0%{transform:rotate(0deg);}
112+
100%{transform:rotate(360deg);}
113+
}
114+
115+
/* Controls */
116+
#controls{
117+
display:block;
118+
position:absolute;
119+
left:0;
120+
right:0;
121+
top:0;
122+
height:40px;
123+
padding-right:96px;
124+
border-bottom:2px solid rgba(128,128,128,0.5);
125+
background-color:rgba(128,128,128,0.2);
126+
line-height:38px;
127+
text-align:center;
128+
font-weight:700;
129+
font-size:14px;
130+
}
131+
#branchSelect{
132+
margin-right:20px;
133+
font-size:14px;
134+
}
135+
#showRemoteBranchesCheckbox{
136+
width:14px;
137+
vertical-align:text-top
138+
}
139+
#refreshBtn{
140+
position:absolute;
141+
right:8px;
142+
top:8px;
143+
width:80px;
144+
height:22px;
145+
line-height:22px;
146+
border-radius:11px;
147+
}
148+
#loadMoreCommitsBtn{
149+
width:180px;
150+
height:30px;
151+
margin:10px auto;
152+
border-radius:15px;
153+
line-height:30px;
154+
}
155+
156+
#controls select:focus, #controls input:focus{
157+
outline:none;
158+
}
159+
#controls label{
160+
cursor:pointer;
161+
}
162+
163+
.roundedBtn{
164+
display:block;
165+
background-color:rgba(128,128,128,0.2);
166+
border:1px solid rgba(128,128,128,0.5);
167+
font-size:14px;
168+
text-align:center;
169+
cursor:pointer;
170+
}
171+
.roundedBtn:hover{
172+
background-color:rgba(128,128,128,0.4);
173+
}
174+
#commitTable th, #loadingHeader, .unselectable, .roundedBtn, #controls label{
175+
user-select:none;
176+
}

0 commit comments

Comments
 (0)