June 2010
4 posts
jquery.doctest.visualize.js
예전에 강규영 님이 만드신 JSSpec을 보고 크게 감동한 적이 있었습니다. JSSpec은 JavaScript BDD 프레임워크로 MooTools에서 자체 테스트 툴로 채용하기도 했습니다. 저 또한 MooTools 팬 시절 minto(망한 3D 라이브러리)나 VLAAH 등을 개발하면서 유용하게 사용해왔습니다.
그러다보니 jquery.doctest.js를 만들면서도 JSSpec 스러운 시각화를 꼭 해보고 싶었습니다. 마침내 어제와 오늘, 짬짬이 시간 내어 시각화 기능을 구현했습니다. 원래 jquery.doctest.js는 구조적으로 시각화하기 어려운 면이 있었는데, 작업을 진행하면서 jquery.doctest.js 자체의 품질도 상당 부분 개선할 수 있었습니다.
이곳에서 실제 구동을 확인하실...
multiline.js
JavaScript에서 여러 줄 또는 큰 문자열을 다루는 방법은 다음과 같습니다.
var a = "<dl>" +
" <dt>Name</dt>" +
" <dd>Heungsub Lee</dd>" +
" <dt>Job</dt>" +
" <dd>Programmer</dd>" +
" <dt>Homepage</dt>" +
" <dd>" +
' <a href="http://heungsub.net/">http://heungsub.net/</a>' +
...
jquery.holdevent.js
프론트엔드를 개발하다보면 JavaScript 이벤트를 쓸 일이 많습니다. 이때 HTML 엘리멘트에 JavaScript 함수를 이벤트핸들러로 지정하는 방법은 여러가지가 있죠. 그 중 대표적인 두 가지는 다음과 같습니다.
함수를 먼저 정의하고, onclick 같은 이벤트 속성으로 스크립트를 지정합니다.
<script>
function fn( elem ) {
alert( $( "p" ).text() );
return false;
}
</script>
<a href="http://example.net/" onclick="return fn( this );">example</a>
<p>Hello,...
May 2010
2 posts
jquery.doctest.js
바로 어제까지 야근 및 특근 릴레이를 끝나치고 짬 내어 jquery.doctest.js를 만들었습니다.
jquery.doctest.js는 Python의 doctest 모듈을 흉내낸 jQuery용 테스트 라이브러리입니다.
바로가기: 프로젝트 페이지, 저장소
사용법
우선 js 파일을 작성합니다. 파일명은 example.js로 할까요?
/**
This is the "example" module.
The example module supplies one function, factorial(). For example,
> factorial( 5 );
120
*/
function factorial( n ) {
/**
> factorial( 1 );
1
>...
April 2010
2 posts
4 tags
March 2010
12 posts
[독후감] 미학적 인간 - 호모 에스테티쿠스 →
기침으로 웃음 무마하기 스킬
xym: 기침으로 웃음 무마하기 스킬 발동
sub: ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ
sub: 아
sub: 그런거였어?
sub: 왜 기침하나 했네
사무실용 잠꼬대
xym: 흠
xym: 또 졸다가 클날뻔했네
sub: ㅋㅋㅋㅋㅋㅋㅋ 형 소리냈어
xym: ㅇㅇ
xym: 흐응하고
sub: 다행히 유레카! 하는것처럼 들렸음
xym: ㅋㅋㅋㅋㅋㅋㅋㅋ
xym: 나도
xym: 깨면서
sub: 완전 훼이크 ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ
xym: "아 젠장 하지만 이건 오, 하는 것과 비슷하다"
sub: 비즈니스스킬
sub: ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ
xym: ㅋㅋㅋㅋㅋㅋㅋㅋㅋ
xym: 사무실용 잠꼬대
Pastedown: the pastebin service for Markdown... →
hongminhee:
최근에 짬짬이 시간을 내서 만들었다. 전부터 스스로 필요하다고 생각했던 서비스다. Markdown 문서 전용 붙여넣기(pastebin) 서비스다. 붙여넣기 서비스가 무엇이냐면, 여러줄로 된 긴 글을 쓰기는 곤란한 IRC 같은 채팅이나 Twitter 같은 마이크로블로그 등에서 인용을 위해 따로 본문 URL을 만들어 링크하는 서비스다.
로그인을 할 경우 자신의 글을 수정할 수 있게 된다. 그리고 모든 수정 사항은 위키처럼 이력 관리가 된다. 다만 아직 차이점을 보기 위한 diff는 구현하지 않았다. 로그인은 VLAAH 계정으로 하면 된다.
홍민희 선배가 Pastedown을 공개했다. 다른 서식자들 보다 Markdown을 더 능숙하게 다루는 나에겐 활용도가 높을 것 같다.
me2Vote 공개
미투데이에서의 설문조사를 위한 애플리케이션, me2Vote를 만들었습니다.
미투데이의 콜백페이지를 이용한 애플리케이션이고 Google Chart API를 사용합니다. 사람들의 투표내역은 해당 포스팅의 코멘트에서 추출합니다. 한 사람이 의견을 바꿀 경우 마지막 의견만 반영됩니다.
신경 쓴 부분은 인터렉션입니다. 해당 투표항목을 클릭하면 댓글입력창을 자동으로 채워주고 사용자가 투표한 항목에는 체크표시를 해줍니다. 댓글을 작성할 경우엔 자동으로 갱신됩니다.
Chrome, Firefox, Opera에서 무리 없이 작동하고 InternetExplorer 6에선 자바스크립트 에러가 나지만 차트를 표시하는 데는 문제 없습니다. 상위 Internet Explorer에서는 테스트해보지 못했습니다.
...
Vector Social Media Icons →
February 2010
10 posts
2 tags
VLAAH Embed 공개
지난주에 VLAAH Embed를 공개했습니다. VLAAH Embed는 HTML문서에 VLAAH 캔디바를 간단하게 추가할 수 있도록 도와주는 스크립트입니다. 여러분은 VLAAH Embed를 이용해 자신의 글, 어떤 주제, 어떤 사진이 얼마나 인기 있는지 손쉽게 알 수 있습니다.
VLAAH Embed는 당 블로그에서도 사용하고 있는 코멘트 시스템 Disqus에 아이디어를 얻어 만들게 되었습니다. 사용법도 매우 유사합니다.
VLAAH Embed의 주소를 서비스와는 독립적으로 유지하기 위해 VLAAH 본서버가 아닌 Google에서 제공하는 AppSpot에 프로젝트를 올려두었습니다. 주소를 바꾸지 않고 유지할 생각이니 안심하고 사용하세요.
VLAAH Embed는 현재 제 블로그와 홍민희 선배...
2 tags
2 tags
3 tags
블로그 이전
주블로그를 WordPress에서 Tumblr로 바꿨습니다. 예전 블로그도 당분간 지우지는 않겠으나 더 이상 관리하지 않으며 언젠가는 없앨 겁니다. 예전 블로그에서 보존하고 싶은 포스팅들은 이곳에도 옮겨왔습니다. 모쪼록 이쪽을 주목해주세요~
October 2009
1 post
1 tag
August 2009
1 post
June 2009
3 posts
me2Virus 시각화
숙주주소를 입력하면 해당 숙주의 전염/확산 경로를 JSON 데이터로 만들어 캐시하고 그 다음부터는 캐시된 데이터를 이용합니다. 따라서 첫 실행 시 시간이 더 걸립니다. 만약 해당 숙주에 새로운 하위숙주가 생긴다면 다음번 요청 때 다시 캐시합니다.
전 JIT의 HyperTree를 이용해 시각화했지만 더 재밌는 시각화 결과들이 나타났으면 좋겠습니다. 따라서 아무나 다룰 수 있도록 JSON 데이터를 공개합니다. 누군가 나서서 만들어주시면 감사하겠습니다. 특정 숙주의 JSON 데이터는 다음 URL로부터 얻을 수 있습니다.
http://heungsub.net/apps/me2virus/json.php?post=<post_url>
데이터 구조는 다음과 같습니다.
{
url:...
me2Virus 제작기
최근에 me2PHP를 포크한 me2PHeungP[미투피흥피] 프로젝트를 개설했습니다. me2PHP가 최신 me2API 스펙을 반영하지 않은 것이 포크 사유였기에 요 며칠간 me2PHeungP에 이런저런 최신 스펙들을 추가하고 있었습니다. 그 중 하나가 콜백기능입니다. 이것을 사용할 경우 포스팅 작성 시 포스팅아이콘을 원하는 이미지로 바꾸고 아이콘을 클릭하면 삽입될 웹 문서나 이미지, 동영상, 음원의 URL을 지정할 수 있습니다.
콜백기능을 지원하자마자 우선 일전에 만들었던 me2Nick에 적용해보았습니다. 잘 작동하는걸 보고 흡족해하다가 문득 궁금증이 생겼습니다. 이 안에 스크립트를 넣으면 실행될까? 간단히 다음 코드를 추가해봤습니다.
<script...
May 2009
10 posts
April 2009
2 posts
March 2009
6 posts
