Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit27f2e6c

Browse files
committed
Load latest issues on request
Switch between repos and issues tables via tabsOrganize coder html/vue markup in several templates to be better maintainable
1 parent1eb6573 commit27f2e6c

File tree

10 files changed

+192
-123
lines changed

10 files changed

+192
-123
lines changed

‎src/js/coder.js‎

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,16 +20,20 @@ document.getElementsByClassName('brand')[0].textContent = short_title;
2020

2121
leturl_user=`https://api.github.com/users/${github_user}`,
2222
url_repos=`${url_user}/repos?sort=pushed&per_page=100`,
23+
url_issues=`https://api.github.com/search/issues?q=user:${github_user}&sort=updated&order=desc`,
2324
months_short='Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec'.split(' ');
2425

2526
if(DEV){
2627
url_user='/data/user.json';
2728
url_repos='/data/repos.json';
29+
url_issues='/data/issues.json';
2830
}
2931

3032
letcoder=newVue({
3133
el:'#coder',
3234
data:{
35+
activetab:'repos',
36+
latest_issues:null,
3337
repos:[],
3438
response:{},
3539
sort_orders:{},
@@ -135,6 +139,12 @@ let coder = new Vue({
135139
series:this.repo_types.values});
136140
},
137141
methods:{
142+
fetchIssues:function(){
143+
this.$http.get(url_issues).then(response=>{
144+
this.response.issues=response;
145+
this.latest_issues=response.body.items;
146+
});
147+
},
138148
fetchRepos:function(){
139149
this.$http.get(url_repos).then(response=>{
140150
this.response.repos=response;
@@ -164,11 +174,17 @@ let coder = new Vue({
164174
returnthis.repos_pushed.filter(d=>d[property])
165175
.sort((a,b)=>b[property]-a[property]);
166176
},
167-
sortBy:function(key,type='number'){
177+
showTab:function(name){
178+
this.activetab=name;
179+
if(!this.latest_issues){
180+
this.fetchIssues();
181+
}
182+
},
183+
sortBy:function(key,type='number',property='repos'){
168184
letdefault_value=type==='string' ?'' :0;
169185
this.sort_key=key;
170186
this.sort_orders[key]=(this.sort_orders[key]||1)*-1;
171-
this.repos.sort((a,b)=>{
187+
this[property].sort((a,b)=>{
172188
letx=a[key]||default_value,
173189
y=b[key]||default_value;
174190
if(type==='string'){

‎src/scss/coder.scss‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,4 +58,13 @@
5858

5959
.meta {
6060
background-color:$color4;
61+
}
62+
63+
// tabs
64+
.button.active {
65+
background-color:$color3;
66+
}
67+
68+
.content {
69+
border-top:1pxsolid$color5;
6170
}

‎src/scss/table.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,11 +25,11 @@ th.active .arrow {
2525
.arrow.asc {
2626
border-left:4pxsolidtransparent;
2727
border-right:4pxsolidtransparent;
28-
border-bottom:4pxsolid$color4;
28+
border-bottom:4pxsolid$color1;
2929
}
3030

3131
.arrow.dsc {
3232
border-left:4pxsolidtransparent;
3333
border-right:4pxsolidtransparent;
34-
border-top:4pxsolid$color4;
34+
border-top:4pxsolid$color1;
3535
}

‎templates/coder.html‎

Lines changed: 17 additions & 119 deletions
Original file line numberDiff line numberDiff line change
@@ -19,139 +19,37 @@
1919
</div>
2020
</nav></div>
2121

22-
{% raw %}
2322
<divid="coder">
2423
<divv-if="user"class="row">
2524
<divclass="col-12 col-2-xl col-3-l col-4-m meta">
26-
<divclass="padh">
27-
<header>
28-
<h3>{{ user.name }}</h3>
29-
</header>
30-
<img:src="user.avatar_url":alt="user.name"class="img-fluid">
31-
<p>Joined GitHub {{ user.created_at|formatDate }}</p>
32-
<a:href="'https://github.com/' + user.login"class="block"><iclass="fa fa-github"aria-hidden="true"></i> {{ user.login }}</a>
33-
<av-if="user.blog":href="user.blog | fixURL"class="block"><iclass="fa fa-home"aria-hidden="true"></i> {{ user.blog | formatURL }}</a>
34-
<spanv-if="user.location"class="block"><iclass="fa fa-globe"aria-hidden="true"></i> {{ user.location }}</span>
35-
<spanv-if="user.company"class="block"><iclass="fa fa-money"aria-hidden="true"></i> {{ user.company }}</span>
36-
<blockquotev-if="user.bio"><p>{{ user.bio }}</p></blockquote>
37-
38-
<divv-if="repo_types"class="padv">
39-
<h3>Repo types</h3>
40-
<divid="repo-types-chart"></div>
41-
</div>
42-
</div>
25+
{% include 'coder/meta.html' %}
4326
</div>
4427
<divv-if="repos_pushed.length < 2"class="col-12 error">
45-
{{ user.name }} has not pushed changes to enough public repositories to show any interesting data here.
28+
{% raw %}{{ user.name }} has not pushed changes to enough public repositories to show any interesting data here.{% endraw %}
4629
</div>
4730
<divv-elseclass="col-12 col-10-xl col-9-l col-8-m no-padding main">
48-
<divclass="flex flex-wrap boxes">
49-
<divclass="box-stat"title="The number of loaded repositories this user has pushed to.">
50-
<iclass="fa fa-code"aria-hidden="true"></i> Pushed to repos
51-
<h4>{{ repos_pushed.length }}</h4>
52-
</div>
53-
<divclass="box-stat"title="The number of different main languages in repositories this user has pushed to.">
54-
<iclass="fa fa-language"aria-hidden="true"></i> Main languages
55-
<h4>{{ languages.length }}</h4>
56-
</div>
57-
<divclass="box-stat"title="The sum of issues across repositories this user has pushed to.">
58-
<iclass="fa fa-bug"aria-hidden="true"></i> Total issues
59-
<h4>{{ total_issues }}</h4>
60-
</div>
61-
<divclass="box-stat"title="The sum of forks across repositories this user has pushed to.">
62-
<iclass="fa fa-code-fork"aria-hidden="true"></i> Total forks
63-
<h4>{{ total_forks }}</h4>
64-
</div>
65-
<divclass="box-stat"title="The sum of stars across repositories this user has pushed to.">
66-
<iclass="fa fa-star"aria-hidden="true"></i> Total stars
67-
<h4>{{ total_stars }}</h4>
68-
</div>
69-
<divclass="box-stat"title="The number of users who follow this user on GitHub">
70-
<iclass="fa fa-user"aria-hidden="true"></i> Followers
71-
<h4>{{ user.followers }}</h4>
72-
</div>
73-
<divclass="box-stat"title="The number of users this user follows on GitHub">
74-
<iclass="fa fa-user"aria-hidden="true"></i> Following
75-
<h4>{{ user.following }}</h4>
76-
</div>
77-
</div>
78-
79-
<divclass="padh">
80-
<h2id="summary">Summary</h2>
81-
<pv-if="repos_pushed.length > 1">{{ user.name }} has {{ user.public_repos }} repositories on GitHub, the latest {{ repos.length }} with user activity were loaded from GitHub's web service for this evaluation. {{ user.name }} has pushed to<strong>{{ repos_pushed.length }}</strong> of these repositories.
82-
<spanv-if="repos_pushed_ratio > .8">This is a high ratio congratulations!</span>
83-
<spanv-else-if="repos_pushed_ratio < .4">This is a low ratio.</span>
84-
</p>
85-
<pv-if="languages.length > 1"><strong>{{ languages.length }}</strong> different main languages were identified across all repos pushed to. The main language is the one with the largest amount of code in a given repository, as identified by GitHub's<ahref="https://github.com/github/linguist">linguist</a>.
86-
<spanv-if="languages.length > 5">Assuming a basic level of proficiency in all these languages {{ user.name }} can be considered hyperpolyglot in the world of computer languages.</span>
87-
<strong>{{ languages[0].key }}</strong> occurs most frequently ‒ {{ languages[0].value }} times ‒ as the main repo language.
88-
</p>
89-
<pv-if="total_forks / repos_pushed.length > 20">The total number of forks across all pushed to repositories indicates that the GitHub projects {{ user.name }} contributes to are actually used by other people as well.</p>
90-
</div>
91-
92-
<divclass="padh">
93-
<h2id="rankings">Rankings</h2>
94-
<divclass="row">
95-
<divv-if="languages.length > 1"class="col-12 col-3-xl col-6-l col-6-m">
96-
<h3>Languages</h3>
97-
<graphid="language-ranking"class="ct-major-third"></graph>
98-
</div>
99-
<divv-if="issues.length > 1"class="col-12 col-3-xl col-6-l col-6-m">
100-
<h3>Issues</h3>
101-
<graphid="issues-ranking"class="ct-major-third"></graph>
102-
</div>
103-
<divv-if="forks.length > 1"class="col-12 col-3-xl col-6-l col-6-m">
104-
<h3>Forks</h3>
105-
<graphid="forks-ranking"class="ct-major-third"></graph>
106-
</div>
107-
<divv-if="stars.length > 1"class="col-12 col-3-xl col-6-l col-6-m">
108-
<h3>Stars</h3>
109-
<graphid="stars-ranking"class="ct-major-third"></graph>
110-
</div>
111-
</div>
112-
</div>
31+
{% include 'coder/boxes.html' %}
32+
{% include 'coder/summary.html' %}
33+
{% include 'coder/rankings.html' %}
11334
</div>
11435
</div>
11536

11637
<divv-if="repos_pushed.length"class="padh padv">
117-
<h2id="repos">Repositories</h2>
118-
<table>
119-
<thead>
120-
<tr>
121-
<th>#</th>
122-
<th@click="sortBy('name', 'string')":class="{ active: sort_key == 'name' }">Name<spanclass="arrow":class="order('name')"></span></th>
123-
<th@click="sortBy('language', 'string')":class="{ active: sort_key == 'language' }">Language<spanclass="arrow":class="order('language')"></span></th>
124-
<thclass="text-right"@click="sortBy('created_at')":class="{ active: sort_key == 'created_at' }">Created at<spanclass="arrow":class="order('created_at')"></span></th>
125-
<thclass="text-right"@click="sortBy('pushed_at')":class="{ active: sort_key == 'pushed_at' }">Pushed at<spanclass="arrow":class="order('pushed_at')"></span></th>
126-
<thclass="text-right"@click="sortBy('open_issues_count')":class="{ active: sort_key == 'open_issues_count' }">Issues<spanclass="arrow":class="order('open_issues_count')"></span></th>
127-
<thclass="text-right"@click="sortBy('forks_count')":class="{ active: sort_key == 'forks_count' }">Forks<spanclass="arrow":class="order('forks_count')"></span></th>
128-
<thclass="text-right"@click="sortBy('watchers_count')":class="{ active: sort_key == 'watchers_count' }">Stars<spanclass="arrow":class="order('watchers_count')"></span></th>
129-
<thclass="text-right"@click="sortBy('size')":class="{ active: sort_key == 'size' }">Size<spanclass="arrow":class="order('size')"></span></th>
130-
</tr>
131-
</thead>
132-
<tbody>
133-
<trv-for="(repo, idx) in repos_pushed":title="repo.description">
134-
<td>{{ idx + 1}}</td>
135-
<td>
136-
<strong><av-bind:href="repo.html_url">{{ repo.name }}</a></strong>
137-
<iv-if="repo.fork"class="fa fa-code-fork"aria-hidden="true"title="Forked Repository"></i>
138-
<iv-if="repo.archived"class="fa fa-archive"aria-hidden="true"title="Archived Repository"></i>
139-
</td>
140-
<td>{{ repo.language }}</td>
141-
<tdclass="text-right">{{ repo.created_at | formatDate }}</td>
142-
<tdclass="text-right">{{ repo.pushed_at | formatDate }}</td>
143-
<tdclass="text-right">{{ repo.open_issues_count }}</td>
144-
<tdclass="text-right">{{ repo.forks_count }}</td>
145-
<tdclass="text-right">{{ repo.watchers_count }}</td>
146-
<tdclass="text-right">{{ repo.size }}</td>
147-
</tr>
148-
</tbody>
149-
</table>
38+
<divclass="tabs padv">
39+
<av-on:click="showTab('repos')"v-bind:class="[ activetab === 'repos' ? 'active' : '' ]"class="button inline">Repositories</a>
40+
<av-on:click="showTab('issues')"v-bind:class="[ activetab === 'issues' ? 'active' : '' ]"class="button inline">Latest Issues</a>
41+
</div>
42+
<divclass="content">
43+
<divv-if="activetab === 'repos'"class="tabcontent">
44+
{% include 'coder/repos.html' %}
45+
</div>
46+
<divv-if="activetab === 'issues'"class="tabcontent">
47+
{% include 'coder/issues.html' %}
48+
</div>
49+
</div>
15050
<ahref="#">↑</a>
15151
</div>
152-
15352
</div>
154-
{% endraw %}
15553
{% endblock %}
15654

15755
{% block scripts %}

‎templates/coder/boxes.html‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{% raw %}
2+
<divclass="flex flex-wrap boxes">
3+
<divclass="box-stat"title="The number of loaded repositories this user has pushed to.">
4+
<iclass="fa fa-code"aria-hidden="true"></i> Pushed to repos
5+
<h4>{{ repos_pushed.length }}</h4>
6+
</div>
7+
<divclass="box-stat"title="The number of different main languages in repositories this user has pushed to.">
8+
<iclass="fa fa-language"aria-hidden="true"></i> Main languages
9+
<h4>{{ languages.length }}</h4>
10+
</div>
11+
<divclass="box-stat"title="The sum of issues across repositories this user has pushed to.">
12+
<iclass="fa fa-bug"aria-hidden="true"></i> Total issues
13+
<h4>{{ total_issues }}</h4>
14+
</div>
15+
<divclass="box-stat"title="The sum of forks across repositories this user has pushed to.">
16+
<iclass="fa fa-code-fork"aria-hidden="true"></i> Total forks
17+
<h4>{{ total_forks }}</h4>
18+
</div>
19+
<divclass="box-stat"title="The sum of stars across repositories this user has pushed to.">
20+
<iclass="fa fa-star"aria-hidden="true"></i> Total stars
21+
<h4>{{ total_stars }}</h4>
22+
</div>
23+
<divclass="box-stat"title="The number of users who follow this user on GitHub">
24+
<iclass="fa fa-user"aria-hidden="true"></i> Followers
25+
<h4>{{ user.followers }}</h4>
26+
</div>
27+
<divclass="box-stat"title="The number of users this user follows on GitHub">
28+
<iclass="fa fa-user"aria-hidden="true"></i> Following
29+
<h4>{{ user.following }}</h4>
30+
</div>
31+
</div>
32+
{% endraw %}

‎templates/coder/issues.html‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{% raw %}
2+
<table>
3+
<thead>
4+
<tr>
5+
<th@click="sortBy('repository_url', 'string', 'latest_issues')":class="{ active: sort_key == 'repository_url' }">Repo<spanclass="arrow":class="order('repository_url')"></span></th>
6+
<th>Title</th>
7+
<th@click="sortBy('state', 'string', 'latest_issues')":class="{ active: sort_key == 'state' }">State<spanclass="arrow":class="order('state')"></span></th>
8+
<th>Created by</th>
9+
<thclass="text-right"@click="sortBy('created_at', 'string', 'latest_issues')":class="{ active: sort_key == 'created_at' }">Created at<spanclass="arrow":class="order('created_at')"></span></th>
10+
<thclass="text-right"@click="sortBy('updated_at', 'string', 'latest_issues')":class="{ active: sort_key == 'updated_at' }">Latest update<spanclass="arrow":class="order('updated_at')"></span></th>
11+
</tr>
12+
</thead>
13+
<tbody>
14+
<trv-for="issue in latest_issues">
15+
<td><a:href="issue.repository_url">{{ issue.repository_url.split('/').slice(-2).join('/') }}</a></td>
16+
<td><a:href="issue.html_url">{{ issue.title }}</a></td>
17+
<td>{{ issue.state }}</td>
18+
<td><a:href="issue.user.url">{{ issue.user.login }}</a></td>
19+
<tdclass="text-right">{{ issue.created_at | formatDate }}</td>
20+
<tdclass="text-right">{{ issue.updated_at | formatDate }}</td>
21+
</tr>
22+
</tbody>
23+
</table>
24+
{% endraw %}

‎templates/coder/meta.html‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
{% raw %}
2+
<divclass="padh">
3+
<header>
4+
<h3>{{ user.name }}</h3>
5+
</header>
6+
<img:src="user.avatar_url":alt="user.name"class="img-fluid">
7+
<p>Joined GitHub {{ user.created_at|formatDate }}</p>
8+
<a:href="'https://github.com/' + user.login"class="block"><iclass="fa fa-github"aria-hidden="true"></i> {{ user.login }}</a>
9+
<av-if="user.blog":href="user.blog | fixURL"class="block"><iclass="fa fa-home"aria-hidden="true"></i> {{ user.blog | formatURL }}</a>
10+
<spanv-if="user.location"class="block"><iclass="fa fa-globe"aria-hidden="true"></i> {{ user.location }}</span>
11+
<spanv-if="user.company"class="block"><iclass="fa fa-money"aria-hidden="true"></i> {{ user.company }}</span>
12+
<blockquotev-if="user.bio"><p>{{ user.bio }}</p></blockquote>
13+
14+
<divv-if="repo_types"class="padv">
15+
<h3>Repo types</h3>
16+
<divid="repo-types-chart"></div>
17+
</div>
18+
</div>
19+
{% endraw %}

‎templates/coder/rankings.html‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{% raw %}
2+
<divclass="padh">
3+
<h2id="rankings">Rankings</h2>
4+
<divclass="row">
5+
<divv-if="languages.length > 1"class="col-12 col-3-xl col-6-l col-6-m">
6+
<h3>Languages</h3>
7+
<graphid="language-ranking"class="ct-major-third"></graph>
8+
</div>
9+
<divv-if="issues.length > 1"class="col-12 col-3-xl col-6-l col-6-m">
10+
<h3>Issues</h3>
11+
<graphid="issues-ranking"class="ct-major-third"></graph>
12+
</div>
13+
<divv-if="forks.length > 1"class="col-12 col-3-xl col-6-l col-6-m">
14+
<h3>Forks</h3>
15+
<graphid="forks-ranking"class="ct-major-third"></graph>
16+
</div>
17+
<divv-if="stars.length > 1"class="col-12 col-3-xl col-6-l col-6-m">
18+
<h3>Stars</h3>
19+
<graphid="stars-ranking"class="ct-major-third"></graph>
20+
</div>
21+
</div>
22+
</div>
23+
{% endraw %}

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp