Monthly Archives: January 2009

Alchemy를 이용한 Flash Equalizer 구현

Alchemy를 이용해서 Flash 10에서 사용 가능한 Equalizer를 구현했습니다. Flash에서 자체 Equalizer를 제공하지 않아서 여러가지로 고민했었는데… 일단 동작은 정상적으로 하네요. 처음에 PixelBender를 이용해서 구현을 할려고 했었는데 여러가지로 PixelBender는 오디오 처리하기에는 문제가 있는거 같더군요. 회사에서 C로 구현된 Equalizer소스가 있어서 Alchemy를 이용해서 Flash에서 돌릴수 있게 구현했습니다. Flash 10에서만 동작합니다.

 

위에 플래시가 안보이시면 이 페이지로 가시면 보실수 있습니다.

소스는 공개하기 힘들듯 하지만, 요청이 있다면 C Equalizer소스를 제외한 부분만 공개하겠습니다. Alchemy 개발은 그리 어렵지는 않았는데 문서화가 좀 부족해서 여러가지 자료 참고해서 구현했습니다. 막상 개발하고 나니 인터페이스하는 소스는 얼마 안되네요 🙂

사용자 삽입 이미지eq.c 소스는 250줄 정도 되고, 이중 100줄 정도가 Alchemy 인터페이스 소스이지만, 많은 부분 재사용할수 있는 부분입니다. 이걸 컴파일하면 플래시 컴포넌트 파일인 swc 파일이 나옵니다. 용량이 82KB 소스에 비하면 많이 커졌네요. 더욱 놀라운건 마지막 as파일의 크기입니다. 파일 열어보면 거의 바이트 코드가 풀어서 적혀 있습니다.

Equalizer소스가 길지않으니 한번 AS3로 직접 짜보고 비교를 해보는것도 재미있을듯하네요. 그리고 인터페이스 소스가 메모리카피가 있어서 좀 비효율적인데 copy 줄일수 있는지도 고민해봐야할듯합니다.

구현하면서 여러가지 좋은 정보들도 많이 얻었습니다. PixelBender에 대해서도 알게 됐고, 플래시 10에서 오디오 처리의 가능성과 한계를 어느정도 알게되었네요.

음악은 아직 제목이 없는 제 음악입니다.^^ (20080208.mp3) 즐감하세요~

MS Authenticode 인증서를 Adobe AIR 서명용으로 변환하기

exe 코드서명할때 쓰이는 pvk(PKCS #7) 파일은 AIR에서는 바로 사용못합니다. PKCS #12 포맷인 pfx나 p12 확장자로 바꿔야하는데 openssl에서는 잘 안되나봅니다(??).

MS에서 배포하는 pvkimprt 와 mmc(Microsoft Management Console)을 통해서 pfx 파일로 변환할수 있고, firefox를 이용하면 다시 p12로 바꿀수 있습니다. 과정이 약간 복잡합니다.

먼저 pvkimprt를 받아서 설치합니다. 설치후에 커맨드 창에서 pvkimprt를 실행하여 인증서를 시스템 개인인증서 영역에 저장할수 있습니다. 중간에 암호 물어보고, 저장위치 지정해서 “개인”으로 선택하면 됩니다.

사용자 삽입 이미지
이제 시작 실행에서 “mmc”를 입력하고 엔터를 치면 Microsoft Management Console를 띄울수 있습니다. 파일 메뉴에서 “스냅인 추가/삭제” 선택후 “인증서”를 추가하세요. 대상을 물어보는데 “내 사용자 계정”을 선택하면 됩니다.

사용자 삽입 이미지

콘솔 루트-인증서-개인-인증서를 선택하면 pvkimprt에서 가져온 인증서를 확인할수 있습니다. 인증서에서 오른쪽 눌러서 속성을
선택하면 인증서 이름을 설정할수 있습니다. (꼭 필요한 과정인지는 모르겠고, 이 과정에서 이름이 바로 적용이 안되거나 오류가
나오면, 스냅인을 삭제했다가 다시 추가하면 정상적으로 보이더군요. 인증서 오른쪽 클릭하여 모든 작업-내보내기 선택하면 드디어
pfx로 저장할수 있습니다. 여기서 몇가지 옵션을 선택해야합니다. “개인키 내보내기”와 “가능하면 인증 경로에 있는 인증서 모두
포함”을 선택하세요. 아래 그림 참조.

사용자 삽입 이미지
이렇게하고 암호 설정을 하면 pfx 파일이 만들어집니다. 이 인증서를 이용해서 AIR 어플에 서명해도 되고, firefox를 이용하면 pfx 파일을 p12 파일로 변경할수 있습니다.

firefox 도구 메뉴-설정-고급-암호화-인증서 보기 클릭하시고, 가져오기 버튼을 눌러서 pfx 인증서를 추가하세요. 인증서 선택하고 백업 누르면 p12 파일로 저장할수 있습니다.

사용자 삽입 이미지
이 문서는 http://www.petefreitag.com/item/117.cfm 를  참고해서 정리했습니다.

Komodo Edit: 웹프로그래머를 위한 에디터

오랜만에 회사에서 웹기반 프로젝트를 시작했습니다. 회사 내부에서 쓰는 거라 그동안 관심있게 지켜본 기술들을 여러가지 적용해보았습니다. PHP, MySQL은 그대로 쓰고, 자바스크립트 라이브러리로 jQuery를 썼는데 PHP와 자바스크립트를 혼용해서 쓰다보니 vi에서는 syntax highlighting도 깨지고 좀 불편하더군요.. 그래서 Aptana와 Komodo Edit을 구해서 설치해봤는데 에디터로서는 Komodo Edit이 상당히 쓸만하네요. 회사 웹팀 사람들도 전향을 고려하고 있습니다.

Komodo IDE가 유료인 반면 Komodo Edit은 무료로 사용할수 있으며, 에디터의 대부분의 기능은 제약이 없습니다.

제가 제일 마음에 드는 기능은 인텔리센스입니다. PHP 내장 함수들은 물론 제가 짠 함수들도 인자가 무엇인지 쉽게 확인할수 있습니다. 그리고 Javascript와 CSS도 아주 잘 지원해줍니다. CSS할때 항상 어딘가를 참조했어야했는데, 각 property별로 어떤 값이 올수 있는지 확인할수 있으니 너무 편하네요. 자바스크립트는 내장 함수뿐 아니라 jQuery, Prototype, Dojo등의 외장 라이브러리의 인텔리센스도 지원합니다. 외장 자바스크립트 라이브러리는 옵션에서 사용할 라이브러리를 선택해주어야 합니다.

두번째로 마음에 드는 부분은, VI와 Emacs 에뮬레이션 기능입니다 🙂 제 주력 에디터가 vim이다보니 다른 에디터에 적응하기 힘듭니다. 제가 많이 사용하는 기능들은 모두 정상 동작하네요. Emacs는 LISP 프로그래밍할때 SLIME과 연동하여 쓰기 때문에 Komodo Edit에서 LISP를 쓸일은 없을거 같네요.

세번째, 가벼운 편입니다. 아주 날아다니는 정도는 아니지만 기능에 비하면, 무겁다는 생각이 안듭니다. 설치하고 처음 시작할때 약간 시간이 걸리고 그 다음부터는 쓸만하네요.

네번째, SFTP를 지원합니다. 원격 파일 에디팅할때 다른 사람이 고쳤으면 diff도 보여주고, putty pageant와도 잘 연동되네요. 아직까지 여러사람이 원격으로 같은 프로젝트 작업하기에는 무리가 있어보입니다. (merge 기능 지원 없음)

다섯번째, snippet과 key binding을 잘 쓰면 아주 편리한 환경을 만들수 있습니다. snippet 기능은 단순히 텍스트만 붙이는것이 아니라 텍스트를 붙이고 tab으로 이동하는 경로를 설정할수 있습니다. 함수 snippet을 만들때 함수이름을 치면 함수명과 주석에 있는 함수명이 같이 변경되게 설정할수 있습니다. 예제로 많은 snippet이 포함되어 있어서 snippet 소스를 보면 금방 배울수 있습니다. snippet을 많이 사용할 경우 key binding을 만들어 두는게 편합니다. 저 같은 경우, Ctrl-l(엘)로 시작해서 여러 문자를 사용해서 key binding을 만들었습니다.

여섯번째, 멀티플랫폼입니다. 저는 리눅스와 윈도우즈에서 쓰고 있습니다. 맥도 지원한다고 하네요.

물론 단점도 있긴합니다. 아직 EUC-KR 문서를 편집하신다면, 설치후 추가적인 작업이 필요합니다. 여기를 참고해서 소스를 변경하시고 다시 시작하면 설정의 인코딩에서 EUC-KR를 선택할수 있습니다.

제가 만든 snippet을 패키지로 만들었습니다. key binding은 Ctrl-l(엘)로 모두 시작하며, 이름에서 대문자로 표시된 부분을 입력하면 됩니다. html 태그는 Ctrl-l, h 이렇게하면 입력됩니다.
1112504034.kpz
komodoedit snippet
snippet 패키지(kpz)를 import할때 폴더가 생성되는데 폴더는 삭제해도 됩니다. kpz가 프로젝트 내볼때도 공통으로 쓰는 포맷이라 import하면 프로젝트 폴더가 생성되는거 같습니다.

테터툴즈 1.0에서 텍스트큐브 1.7로 업그레이드

갑자기 첨부파일 업로드가 안되서 테터툴즈 1.1버전을 거쳐 1.7로 업그레이드했습니다. Flash 10으로 오면서 자바스크립트와 플래시(업로드컴포넌트)의 SetVariable을 통한 통신이 안되서 동작안하는거 같네요. (firebug로 확인) 새버전에 포함된 swf와 통신부분만 바꿀까하다가 일이 커질지도 모르겠다는 생각에 그냥 업그레이드를 했습니다. ^^

혹시 첨부파일 업로드 안되시면 플래시9 깔고 첨부업로드하거나, 업그레이드 하세요 –;

플래시 10에서 제공하던 기능을 제거한건 큰 실수인거 같네요…

jQuery, Jaxer, HTML Parsing

jQuery를 본격적(?)으로 쓰기 시작했는데 쓸수록 마음에 드네요. 자바스크립트 답지 않은 문법, selector를 통한 자유로운 element 선택, 한번에 여러 element에 작업할수 있는 특징. 어떻게 이런 문법으로 라이브러리를 만들 생각을 했는지, 그리고 이렇게 잘 구현했는지 여러가지 생각을 하게끔하는 라이브러리입니다.

웹프로그래밍을 하면 MVC 분리가 잘 안됐었는데 jQuery를 이용하면 이게 어느정도 가능한거 같네요. 일주일동안 사용하는데 너무 마음에 들어서 서버쪽에서도 이런 작업을 하면 편할거 같은 생각이 들어서 좀 찾아봤습니다.

먼저 자바로 짠 자바스크립트 엔진인 Rhino 위에서 여러가지 자바스크립트 라이브러리(jquery, prototype, mochkit)를 돌린 시도가 있어서 저도 따라해봤지만 뭐가 문제인지 정상동작하지 않더군요. 예제에 보면 자바스크립트로 서버쪽 스크립팅을 하는데, 일단 화면에 출력하는거부터 익숙하지가 않으니, 뭐가 잘못됐는지 찾아보기도 힘들더군요. 글 올라온지 1년이 넘어서 버전 차이때문에 그런건지… 자바의 버전때문에 그런건지… 하여간 중간에 포기!

문제 해결을 위해서 웹서핑하다가 Aptana Jaxer에 대해서 알게되었습니다. 전에 이름만 들어봤었는데, 자바스크립트로 서버단에서도 프로그래밍할수 있게 하는 프로젝트입니다. 단순히 HTML에서 script에 runat=”server”로 달아주면, 해당 부분이 서버단에서 처리한 다음에 결과가 클라이언트에 전달됩니다. 클라이언트 단에서 잘 돌아가는 자바스크립트를 서버단에서 수정없이 바로 돌릴수 있습니다. jQuery등의 라이브러리도 서버단에서 잘 돌아갑니다:) 여기서 더 나아가 서버와 클라이언트 자바스크립트간 통신을 할수 있는 방법을 만든거 같네요. 서버단 자바스크립트에서는 디비접속, 파일접근 등 서버단 언어에서 할수 있는 기능들을 라이브러리로 제공합니다. 간단히 클라이언트 단에서 하던 일 정도는 간편하게 서버단에서 처리할수 있지만, 웹서버도 따로 띄워야하고, 다른 서버단 언어와의 연동을 생각하니, 서버단에서 jQuery를 돌린 결과값만 HTML로 받아서 저장하는게 더 편할것 같다는 생각이 들어서 Jaxer 도입은 보류했습니다.

jQuery처럼 편하게 HTML 데이타에 접근해서 데이타를 추출하고, 변경할수 있는 방법을 찾아봤습니다. jQuery의 selector나 XPath등으로 HTML을 파싱할수 있으면 좋을거라 생각하고 검색해보니 libxml2에서 HTML 파싱을 지원하더군요:) python binding이 있고, 그전에 XML에서는 XPath를 이용한 경험도 있으니 금방 될듯하더군요. jQuery로 짠 라인들을 복사하고, 그대로 XPath와 libxml2 라이브러리 함수들로 옮겼습니다. 라인수는 많이 길어졌지만 그래도 소스는 볼만하고, selector로는 불가능한 부분들도 쉽게 구현할수 있다는 생각이 들더군요.

[code type=javascript]
   $(‘a[href^=/]’).each(function(i) {$(this).replaceWith($(this).text()); } );
   $(‘a[href^=#cite]’).remove();
   $(‘span[class=editsection]’).remove();
   $(‘table[class^=navbox ]’).remove();
   $(‘div[class=주석]’).remove();
   $(‘table[id=toc]’).remove();
   $(‘h2 > span’).each(function(i) { if ($(this).text() == “주석”) $(this).remove(); } );
[/code]
[code type=python]
   try:
       parse_options = libxml2.HTML_PARSE_RECOVER + libxml2.HTML_PARSE_NOERROR + libxml2.HTML_PARSE_NOWARNING
       hdoc = libxml2.htmlReadFile(filename, None, parse_options)
   except Exception, e:
       print e
       return

   #$(‘a[href^=/]’).each(function(i) {$(this).replaceWith($(this).text()); } );
   #$(‘a[href^=#cite]’).remove();
   for e in hdoc.xpathEval(‘//a’):
       href = e.prop(“href”)
       if not href: continue
       if href.find(“/”)==0:
           node = libxml2.newText(e.content)
           e.replaceNode(node)
       elif href.find(“#cite”)==0:
           e.unlinkNode()

   #$(‘span[class=editsection]’).remove();
   for e in hdoc.xpathEval(‘//span[@class=”editsection”]’): e.unlinkNode()

   #$(‘table[class^=navbox ]’).remove();
   for e in hdoc.xpathEval(‘//table’):
       cl = e.prop(“class”)
       if not cl: continue
       if cl.split(” “).count(“navbox”)>0:
           e.unlinkNode()

   #$(‘div[class=주석]’).remove();
   for e in hdoc.xpathEval(‘//div[@class=”주석”]’): e.unlinkNode()

   #$(‘table[id=toc]’).remove();
   for e in hdoc.xpathEval(‘//table[@id=”toc”]’): e.unlinkNode()

   #$(‘h2 > span’).each(function(i) { if ($(this).text() == “주석”) $(this).remove(); } );
   for e in hdoc.xpathEval(‘//h2/span’):
       if e.content == “주석”:
           e.unlinkNode()
[/code]

libxml2 python binding의 문제인지 모르겠지만, htmlParseDoc()을 사용하면 xpath가 동작하지 않고, htmlParseFile을 사용하면 html 파싱 관련 경고가 출력되는데 출력안되게 할 방법이 없는듯하네요.

위 소스는 위키피디아에서 글을 읽어서 필요없는 부분을 제거하는 소스이고, 이후로 여러가지 요구사항들이 생겨서 많이 확장됐습니다.

Adobe Alchemy

Alchemy는 어도비에서 개발중(?)인 C/C++ to ActionScript3 컴파일러(AVM2) 입니다. 이런 프로젝트가 회사 차원에서 진행됐다는거 자체가 놀랍네요. 그냥 프로그래머의 호기심으로  시작했을만한 프로젝트 같네요.  아직 회사차원의 공식적인 지원은 하지 않고 있지만, 꽤 유용할 것 같네요. 이미 둠(doom)을 포팅했네요. 원래버전 거의 그대로네요. 속도도 차이 없는듯하고… 다만 alt키로 strife가 안되서 플레이가 어렵고, 음악은 안나오네요.

요즘 주로 개발을 C++과 ActionScript3로 하고, 둘을 ExternalInterface로 연결하고 있는데… C++이 있기 때문에 사용자가 반드시 파일을 받아서 설치하는 과정이 필요합니다. C++로 되어 있는 부분을 Alchemy를 이용해서 AVM2(ActionScript3 Virtual Machine)에서 돌아갈수 있게하면, 사용자들을 더 쉽게 끌어들일수 있을듯하네요. 당연하지만, VM의 SandBox의 제한은 그대로 있다고 하네요. SandBox의 제한내에서 얼마나 플래시에서 제공하지 못하는 새로운 기능을 넣을수 있을지 의문이 들긴하네요. 속도는 C/C++에 비해서 2~10배 정도 느리다고 하네요.

윈도우즈에서는 cygwin에 flex sdk와 alchemy sdk 설치후 alchemy에서 제공하는 gcc로 컴파일 합니다.

PSP용 강좌 인코딩

요즘 PSP가 게임기에서 PMP로 거의 바뀌어가고 있는데.. 여태까지는 대부분 디빅을 변환하는데 Umile 인코더를 썼었습니다. 요즘 강좌 보면서 공부좀 하려고 하는데, QuickTIme 컨버팅은 Umile에서 지원이 안되더군요. 곰인코더는 유료라 시도 안해봤고, 다음팟인코더가 인터페이스도 깔끔하고 잘 만들었더군요. 근데 이상하게 QuickTime으로 된 파일을 컨버팅하면 간혹가다가 파일 재생 중간에 재생할수 없습니다라는 오류가 나옵니다. 파일 인코딩할때 뭔가 문제가 있는듯 하네요. 그리고 외국에서 제작한 PSP 인코딩 프로그램들도 설치해봤는데 인터페이스도 무지 불편하고, 완성도도 많이 떨어지더군요.

예전에 PMP 사용할때는 바닥을 많이 사용했었는데 최신 버전에서는 PSP를 지원하더군요 🙂 여기서 인코딩하면 MP4 파일이 재생이 끝까지 잘되네요.

예전에 PMP 사용할때는 인터페이스가 좀 버벅였었는데, PSP가 해상도는 떨어지고, 용량은 딸리지만, 필요한 기능 다 있고 인터페이스 반응 속도도 빨라서 오히려 더 편한거 같네요. 예전에는 S43을 썼었는데 하드웨어는 괜찮았던거 같은데… 소프트웨어는 좀 불안하고 반응이 느렸었습니다. 그리고, WinCE이지만 MIPS 계열이라 OS적인 측면에서 큰 장점은 없더군요. 해상도는 800×480으로 PSP의 480×272에 비하면 많이 좋지만… 대부분의 강좌는 낮은 해상도에서 봐도 큰 문제는 없더군요. (얼마전에 소개한 LISP 강좌는 낮은 해상도에서 못봅니다)

볼만한 LISP 강좌

LISP 초보인 사람들에게는 좀 어려울수도 있지만… LISP로 Linear Algebra(선형대수) 패키지와 Ray Tracing을 작성하는 비디오가 있어서 소개합니다. 당연히(!) 영어로 되어 있고, 어느정도 LISP에 대한 기본적인 지식이 있어야합니다. 강좌보면서 느끼는거지만,,, LISP 매크로는 대부분의 사람들에게는 어렵고 헷갈리나 봅니다. 저는 가끔씩 LISP을 하다보니 볼때마다 헷갈리는군요.

http://home.in.tum.de/~lehmanna/lisp-tutorial.html

Emacs와 SLIME 사용해서 개발하니, 남들이 어떻게 사용하는지 보면 도움이 되리라 생각되네요.

XP 원격 데스크탑에서 ClearType 폰트 보기

원격데스크탑 서비스를 제공하는 XP쪽의 버전이 SP3이상에서만 동작하는 방법입니다. 원격서비스 제공하는 쪽의 레지스트리 항목을 하나 만들어주고, 재부팅을 해야 합니다.

Windows Registry Editor Version 5.00

[HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\Terminal Server\WinStations]
"AllowFontAntiAlias"=dword:00000001

레지스트리 항목은 시작메뉴-실행에서 regedit을 실행해서 위 항목대로 폴더로 쫓아가서, 오르쪽 빈 공간에서 마우스 오른쪽 눌러서 DWORD로 만들고 데이터를 1로 입력하면 됩니다.

아니면 아래 cleartype.reg 를 받으셔서 더블클릭하셔도 됩니다. 파일의 내용은 위와 같습니다. 재부팅하셔야 적용됩니다.

1377633686.reg

클라이언트측에서는 특별한 세팅을 할 필요없는 듯하며, 리눅스의 rdesktop에서도 깨끗하게 폰트가 보이네요. rdesktop 실행할때 -x l 또는 -x 0x80 옵션을 주라는 글도 있는데 안해줘도 되더군요. 저는 내부 네트워크에서는 -x l (lan) 옵션을 사용하고 있습니다.