Skip to content

Commit 2284a9e

Browse files
marocchinomarocchino
committed
Add tag filters(resolve #17)
1 parent 7b04870 commit 2284a9e

4 files changed

Lines changed: 131 additions & 49 deletions

File tree

‎_layouts/default.html‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,17 @@
1717
<a id="forkme_banner" href="https://github.com/ruby-korea/ruby-korea.github.io/blob/master/index.md">Edit on GitHub</a>
1818

1919
<h1 id="project_title">{{ page.title }}</h1>
20-
<h2 id="project_tagline"></h2>
20+
<h2 id="project_tagline">
21+
필터링 :
22+
<span id='tags'>
23+
<a href="#ruby" class="tag tag-ruby" data-name="ruby" >ruby</a>
24+
<a href="#rails" class="tag tag-rails" data-name="rails">rails</a>
25+
<a href="#gem" class="tag tag-gem" data-name="gem" >gem</a>
26+
<a href="#test" class="tag tag-test" data-name="test" >test</a>
27+
<a href="#ci" class="tag tag-ci" data-name="ci" >ci</a>
28+
</span>
29+
<a href="#" class="tag tag-clear">clear</a>
30+
</h2>
2131

2232
</header>
2333
</div>

‎index.md‎

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ title: 루비 프로그래밍 언어 한글 문서
1212

1313
- [빨리 알았으면 좋았을 뻔한 레일즈 기술](https://dayone.me/1ajvzWC){: .article data-tags="translated rails" data-author="marocchino" data-date="2014.12.31"}
1414
- [Hashie는 위험해요 - 해쉬와 OpenStruct를 위한 송시](https://dayone.me/18pYzZD){: .article data-tags="translated gem" data-author="marocchino" data-date="2014.12.19"}
15-
- [capistrano, fig 배포하기](https://dayone.me/1767zVi){: .article data-tags="gem" data-author="marocchino" data-date="2014.12.18"}
15+
- [capistrano, fig 배포하기](https://dayone.me/1767zVi){: .article data-tags="ci" data-author="marocchino" data-date="2014.12.18"}
1616
- [루비의 꽃, 열거자 Enumerable 모듈](http://blog.nacyot.com/articles/2014-04-19-ruby-enumerable/){: .article data-tags="ruby" data-author="nacyot" data-date="2014.04.19"}
1717
- [쿡패드(Cookpad) 루비 스타일 가이드](http://blog.nacyot.com/articles/2014-03-23-cookpad-ruby-styleguide/){: .article data-tags="translated ruby" data-author="nacyot" data-date="2014.03.23"}
1818
- [‘루비’의 아빠, 마츠모토 유키히로](http://www.bloter.net/archives/184564){: .article data-tags="ruby" data-author="블로터" data-date="2014.03.12"}
@@ -33,7 +33,7 @@ title: 루비 프로그래밍 언어 한글 문서
3333
## [동영상](#movies)
3434
{: #movies}
3535

36-
- [Zero to Pinterest UI(Dev.Study.Archive)](http://dev-study.github.io/presentations/zero_to_pinterent_ui.html){: .article data-tags="rails movie" data-author="김성준" data-date="2013.08.18"}
36+
- [Zero to Pinterest UI(Dev.Study.Archive)](http://dev-study.github.io/presentations/zero_to_pinterent_ui.html){: .article data-tags="rails" data-author="김성준" data-date="2013.08.18"}
3737
- [루비 기본 100분](http://www.youtube.com/watch?v=vjyL6fLzJjA){: .article data-tags="ruby" data-author="서동주" data-date="2013.01.19"}
3838
- [Instant Prototyping with Ruby on Rails(H3 2012)](http://www.youtube.com/watch?v=AlNLavCg3yg){: .article data-tags="rails" data-author="최명진" data-date="2012.11.13"}
3939
- [Open API 와 Ruby on Rails 에 대한 이야기(H3 2012)](http://www.youtube.com/watch?v=fAi0PC0v5OQ){: .article data-tags="rails" data-author="조범석" data-date="2012.11.13"}
@@ -64,7 +64,7 @@ title: 루비 프로그래밍 언어 한글 문서
6464
- [지킬(jekyll)](http://svperstarz.github.io/jekyll-docs-ko/){: .article data-tags="translated gem"}
6565
- [시나트라(sinatra)](http://www.sinatrarb.com/intro-ko.html){: .article data-tags="translated gem"}
6666
- [번들러(Bundler)](http://ruby-korea.github.io/bundler-site/){: .article data-tags="translated gem"}
67-
- <span class='tag'>번역</span> RubyMotion 공식 문서
67+
- RubyMotion 공식 문서 [ ](#){: .article data-tags="translated rubymotion"}
6868
- Articles
6969
- [Use CocoaPods Dependencies in RubyMotion Apps](http://ruby-korea.github.io/RubyMotionDocumentation/articles/cocoapods/)
7070
- [Submit RubyMotion Apps to TestFlight](http://ruby-korea.github.io/RubyMotionDocumentation/articles/testflight/)
@@ -81,30 +81,30 @@ title: 루비 프로그래밍 언어 한글 문서
8181
버전, 레일즈는 3.0 이후 버전을 다루고 있는 책을 읽으시길 권해 드립니다.
8282

8383
- 루비로 배우는 객체지향 디자인
84-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=896626123X){: .article data-tags="translated" data-date="2014.11"}
84+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=896626123X){: .article data-tags="translated ruby oop" data-date="2014.11"}
8585
[yes24](http://www.yes24.com/24/Goods/15254976?Acode=101)
8686
[ebook](http://ebook.insightbook.co.kr/ebooks/5490f4d9bf6e107fd3000008)
8787
- 루비를 깨우치다
88-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8994774769){: .article data-tags="translated" data-date="2014.08"}
88+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8994774769){: .article data-tags="translated ruby-core" data-date="2014.08"}
8989
[yes24](http://www.yes24.com/24/goods/14163047?scode=032&OzSrank=1)
9090
- Devise 젬 파헤치기
91-
[ebook](https://www.gitbook.io/book/luciuschoi/exploring_devise){: .article data-date="2014.06"}
91+
[ebook](https://www.gitbook.io/book/luciuschoi/exploring_devise){: .article data-tags="translated gem" data-date="2014.06"}
9292
- FoundBlog 따라하기
93-
[ebook](https://www.gitbook.io/book/luciuschoi/foundblog){: .article data-date="2014.06"}
93+
[ebook](https://www.gitbook.io/book/luciuschoi/foundblog){: .article data-tags="translated rails" data-date="2014.06"}
9494
- 초보자를 위한 레일스 가이드북
95-
[ebook](https://www.gitbook.io/book/rorlab/railsguidebook){: .article data-date="2014.04"}
95+
[ebook](https://www.gitbook.io/book/rorlab/railsguidebook){: .article data-tags="translated rails ci" data-date="2014.04"}
9696
- R과 Ruby를 활용한 데이터 해석 입문
97-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8965400546){: .article data-tags="translated" data-date="2014.01"}
97+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8965400546){: .article data-tags="translated ruby data-science" data-date="2014.01"}
9898
[yes24](http://www.yes24.com/24/goods/11796950?scode=032&OzSrank=1)
9999
- 루비 프로그래밍 언어
100-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8970507531){: .article data-tags="translated" data-date="2012.11"}
100+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8970507531){: .article data-tags="translated ruby" data-date="2012.11"}
101101
[yes24](http://www.yes24.com/24/goods/7980382?scode=032&amp;OzSrank=5)
102102
- 레일스와 함께하는 애자일 웹 개발 - 4/E
103-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8966260349){: .article data-tags="translated" data-date="2012.05"}
103+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8966260349){: .article data-tags="translated rails" data-date="2012.05"}
104104
[yes24](http://www.yes24.com/24/goods/7097680?scode=032&amp;OzSrank=4)
105105
[ebook](http://ebook.insightbook.co.kr/ebooks/4fbad65fbf6e100370000002)
106106
- 리팩토링 : 루비 에디션
107-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8994506063){: .article data-tags="translated" data-date="2011.09"}
107+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8994506063){: .article data-tags="translated ruby refactoring" data-date="2011.09"}
108108
[yes24](http://www.yes24.com/24/goods/5714409?scode=032&amp;OzSrank=6)
109109

110110
### [오래된 책들](#book-old)
@@ -116,31 +116,31 @@ title: 루비 프로그래밍 언어 한글 문서
116116
가능하면 새로운 책을 읽으시는 걸 추천해 드립니다.
117117

118118
- 루비 프로그래밍 언어
119-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8979147384){: .article data-tags="translated" data-date="2010.04"}
119+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8979147384){: .article data-tags="translated ruby" data-date="2010.04"}
120120
[yes24](http://www.yes24.com/24/goods/3787559?scode=032&amp;OzSrank=8)
121121
- Ruby가 보이는 그림책
122-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8931550685){: .article data-tags="translated" data-date="2010.02"}
122+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8931550685){: .article data-tags="translated ruby" data-date="2010.02"}
123123
[yes24](http://www.yes24.com/24/goods/3689449?scode=032&amp;OzSrank=3)
124124
- 입문자를 위한 루비
125-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8990758424){: .article data-tags="translated" data-date="2009.02"}
125+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8990758424){: .article data-tags="translated ruby" data-date="2009.02"}
126126
[yes24](http://www.yes24.com/24/goods/3279711?scode=032&amp;OzSrank=9)
127127
- Beginning Ruby on Rails
128-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8956744181){: .article data-tags="translated" data-date="2008.02"}
128+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8956744181){: .article data-tags="translated rails" data-date="2008.02"}
129129
[yes24](http://www.yes24.com/24/goods/2825095?scode=032&amp;OzSrank=12)
130130
- 쉽게 배우는 JRuby on rails
131-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8995856459){: .article data-tags="translated" data-date="2007.07"}
131+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8995856459){: .article data-tags="translated rails" data-date="2007.07"}
132132
- 레일스를 위한 루비
133-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8990758688){: .article data-tags="translated" data-date="2007.05"}
133+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8990758688){: .article data-tags="translated ruby" data-date="2007.05"}
134134
[yes24](http://www.yes24.com/24/goods/2539575?scode=032&amp;OzSrank=10)
135135
- 웹 개발 2.0 루비 온 레일스
136-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8960770000){: .article data-tags="translated" data-date="2007.03"}
136+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8960770000){: .article data-tags="translated rails" data-date="2007.03"}
137137
[yes24](http://www.yes24.com/24/goods/2495263?scode=032&amp;OzSrank=11)
138138
- Programming Ruby 프로그래밍 루비 - 전2권
139-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8991268250){: .article data-tags="translated" data-date="2007.02"}
139+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8991268250){: .article data-tags="translated rails" data-date="2007.02"}
140140
[yes24](http://www.yes24.com/24/goods/2314079?scode=032&amp;OzSrank=15)
141141
[ebook](http://ebook.insightbook.co.kr/ebooks/4fbad6dcbf6e1002ed000007)
142142
- Ruby on Rails- 초고속 웹 개발의 시작
143-
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8979144539){: .article data-tags="translated" data-date="2006.11"}
143+
[알라딘](http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8979144539){: .article data-tags="translated rails" data-date="2006.11"}
144144
[yes24](http://www.yes24.com/24/goods/2296786?scode=032&amp;OzSrank=14)
145145

146146
## 기여하기

‎javascripts/main.js‎

Lines changed: 81 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,28 @@
11
(function() {
2-
var printDate = function(date) {
3-
if (!date) {
4-
return '';
5-
} else {
6-
return '<span class="date">' + date + '</span>';
7-
}
8-
};
9-
10-
var printTags = function(tags) {
11-
if (!tags) {
12-
return '';
13-
} else {
14-
return tags.split(" ").map(function(tag) {
15-
var trans = { translated: "번역", movie: "동영상" };
16-
return '<span class="tag">' + (trans[tag] || tag) + '</span>';
17-
}).join(" ");
18-
}
19-
};
20-
21-
var printAuthor = function(author) {
22-
if (!author) {
23-
return '';
24-
} else {
25-
return '<span class="author">by ' + author + '</span>';
2+
var print = {
3+
date: function(date) {
4+
if (!date) {
5+
return '';
6+
} else {
7+
return '<span class="date">' + date + '</span>';
8+
}
9+
},
10+
tags: function(tags) {
11+
if (!tags) {
12+
return '';
13+
} else {
14+
return tags.split(" ").map(function(tag) {
15+
var trans = { translated: "번역", movie: "동영상" };
16+
return '<a href="#' + tag + '" class="tag tag-' + tag + '">' + (trans[tag] || tag) + '</a>';
17+
}).join(" ");
18+
}
19+
},
20+
author: function(author) {
21+
if (!author) {
22+
return '';
23+
} else {
24+
return '<span class="author">by ' + author + '</span>';
25+
}
2626
}
2727
};
2828

@@ -31,13 +31,67 @@
3131
var link = links[i];
3232
var li = link.parentElement;
3333
li.innerHTML = [
34-
printDate(link.dataset.date),
35-
printTags(link.dataset.tags),
34+
print.date(link.dataset.date),
35+
print.tags(link.dataset.tags),
3636
li.innerHTML,
37-
printAuthor(link.dataset.author)
37+
print.author(link.dataset.author)
3838
].join(" ");
3939
}
4040
};
41+
4142
var articles = document.getElementsByClassName("article");
4243
renderData(articles);
44+
45+
var tagFilter = function(tagName) {
46+
var tagLinks = document.getElementById("tags").children;
47+
var tags = [];
48+
for (var i = 0, l = tagLinks.length; i < l; i ++) {
49+
var tagLink = tagLinks[i];
50+
tags.push(tagLink.dataset.name);
51+
}
52+
tagName = tagName.slice(1);
53+
if (tags.indexOf(tagName) > -1) {
54+
console.log("eisxt");
55+
for (var i = 0, l = tagLinks.length; i < l; i ++) {
56+
var tagLink = tagLinks[i];
57+
if (tagName == tagLink.dataset.name) {
58+
tagLink.className = "tag tag-" + tagLink.dataset.name;
59+
} else {
60+
tagLink.className = "tag tag-disable";
61+
}
62+
}
63+
for (var i = 0, l = articles.length; i < l; i ++) {
64+
var article = articles[i];
65+
var li = article.parentElement;
66+
var articleTags = article.dataset.tags;
67+
li.hidden = !(articleTags && articleTags.split(" ").indexOf(tagName) > -1);
68+
}
69+
} else {
70+
console.log("no");
71+
for (var i = 0, l = tagLinks.length; i < l; i ++) {
72+
var tagLink = tagLinks[i];
73+
tagLink.className = "tag tag-" + tagLink.dataset.name;
74+
}
75+
for (var i = 0, l = articles.length; i < l; i ++) {
76+
var article = articles[i];
77+
var li = article.parentElement;
78+
li.hidden = false;
79+
}
80+
}
81+
};
82+
83+
if ("onhashchange" in window) { // event supported?
84+
window.onhashchange = function () {
85+
tagFilter(window.location.hash);
86+
}
87+
} else { // event not supported:
88+
var storedHash = window.location.hash;
89+
window.setInterval(function () {
90+
if (window.location.hash != storedHash) {
91+
storedHash = window.location.hash;
92+
tagFilter(storedHash);
93+
}
94+
}, 100);
95+
}
96+
tagFilter(window.location.hash);
4397
})();

‎stylesheets/stylesheet.css‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,24 @@ table {
7777
text-decoration: none;
7878
white-space: nowrap;
7979
}
80+
.tag-ruby {
81+
background-color: #DF0005;
82+
}
83+
.tag-rails {
84+
background-color: #A70008;
85+
}
86+
.tag-gem {
87+
background-color: #FD4024;
88+
}
89+
.tag-ci {
90+
background-color: #1F173A;
91+
}
92+
.tag-test {
93+
background-color: #3D921F;
94+
}
95+
.tag-disable {
96+
background-color: #aaa;
97+
}
8098

8199
/*******************************************************************************
82100
Theme Styles

0 commit comments

Comments
 (0)