발진!! 아스라다

• www.img-daum.net 같은 하이픈(-)이 들어간  도메인은 추출을 못합니다.
• 언더바(_)가 들어가도 마찬가지죠...
• 한글도메인도 같은 신세입니다~

이러한 가운데 새로이 발표된 것이 Mozilla Lab의 Prism이다.(많은 사람들은 - 구글이 Mozilla의 중요한 sponsor라는 점이 아니더라도 - 정서적으로 구글과 Mozilla를 한 묶음으로 보는 경향이 강하다. 해서 Prism이 구글에 차용될 것이라는 의견도 많다.) 현재 Prism은 스스로 표방하는 많은 기능 중에서 일부만이 구현되어 그리 감동적인 것은 되지 못하나 웹 어플리케이션을 데스크탑처럼 보이게(!) 하는데에는 성공 하였다.

여기서 몇 가지 프리즘 관련 정보들

XUL((XML User-interface Language)

XUL 은 Mozilla browser를 쉽고 빠르게 만들기 위한 목적으로 만들어진 XML기반의 마크업 언어로서 실제로 Firefox와 Thunderbird의 UI를 만드는데 사용되었습니다. 통상 zool(줄)이라고 발음하며 XUL이라는 이름에서 알 수 있 듯 XML로 할 수 있는 모든 것을 제공하고 인터넷과 연결되거나 또는 연결되지 않은 채로 동작하는 풍부한 기능을 제공하는 크로스 플랫폼 응용프로그램을 만들 수 있게 해줍니다.

XUL로 만들 수 있는 어플리케이션의 유형을 몇가지 살펴보면 다음과 같습니다.

• Firefox extention
• Standalone XULRunner application
• XUL package
• Remote XUL application

XUL은 XML의 문법을 그대로 사용하고 있기 때문에 DHTML에 친숙한 웹 개발자들은 XUL을 금방 배워서 바로 응용프로그램을 만들어 볼 수 있습니다. 또 namespace 를 사용하여 HTML엘리먼트를 XUL문서에 삽입 할 수도 있습니다.(예, <html:textarea value="hello"></html:textarea>)

II. Firefox extention 만들기

Firefox의 extention은 두 개 이상의 각각 독립적인 XUL어플리케이션을 묶어 하나의 어플리케이션처럼 사용 할 수 있게 해주는 XUL의 <overlay>엘리먼트를 사용하여 만들 수 있습니다.

예 제의 extention은 Firefox의 메뉴바에 "다음" 이라는 메뉴항목을 추가 하고 해당 메뉴에 Firefox의 새 탭 혹은 현재 탭에서 다음 서비스 페이지로 이동시키는 몇 개의 메뉴아이템을 추가하는 기능을 같습니다. 이 extention 개발에 필요한 도구는 단지 간단한 텍스트 에디터와 Firefox뿐입니다.

개발순서는 다음과 같습니다.

1.      디렉토리 생성 및 설정파일 작성

2.      extention 의 개발 정보를 담고 있는 about.xul 파일 작성

3.      firefox의 메뉴바에 추가할 메뉴와 항목들에 대한 내용을 담고 있는 xul 파일 작성

4.      사용자 행동을 처리할 함수를 갖고 있는 javascript 파일 작성

5.      chrome 시스템에 extention 등록

1.개발환경 구성하기

* 한글 표현을 위해서는 소스 파일을 UTF-8로 인코딩 해야 합니다.

l        디렉토리 구조

daummenu(*)/
  + chrome/
     + content
         + main.xul(*)
        + script.js(*)
     + locale/
     + skin/
  + defaults/
     + preferences
        + prefs.js
  +components/
  + install.rdf
   + chrome.manifest

l        install.rdf
XUL어플리케이션의 기본 정보를 설정하는 파일입니다. 제작자 정보, 프로그램 버전, 실행가능한 어플리케이션의 범위등을 설정 할 수 있으며, 특히 <em:id>엘리먼트의 값은 어플리케이션의 고유 번호와 같은 역할을 하며 어플리케이션을 chrome시스템에 등록 할 때 등록 파일의 이름으로 사용되어집니다.

<?xml version="1.0" encoding="utf-8"?>
<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
    xmlns:em="http://www.mozilla.org/2004/em-rdf#">
  <Description about="urn:mozilla:install-manifest">
<em:aboutURL>chrome://daummenu/content/about.xul</em:aboutURL>
   <em:id>daummenu@asrada.net</em:id>
   <em:version>1.0</em:version>
   <em:type>2</em:type>

   <!-- Target Application this extension can install into, with minimum and maximum supported versions. -->
   <em:targetApplication>
     <Description>
      <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
      <em:minVersion>1.5+</em:minVersion>
      <em:maxVersion>2.0.0.*</em:maxVersion>
     </Description>
   </em:targetApplication>

   <!-- Front End MetaData -->
   <em:name>Daum Menu</em:name>
   <em:description>extention example</em:description>
   <em:creator>Asrada</em:creator>
   <em:homepageURL>http://asrada2001.tistory.com/</em:homepageURL>
  </Description>
</RDF>

l        chrome.manifest
어플리케이션의 환경 설정 역할을 담당하는 파일입니다. 다른 어플리케이션과의 overlay 를 설정하거나 skin,locale 파일들의 위치 정보를 설정 할 수 있습니다.

content daumment chrome/content/
overlay chrome://browser/content/browser.xul chrome://daummenu/content/main.xul

공백으로 구분 되는 각 컬럼의 의미는 아래와 같습니다.
1.chrome 패키지 안에 material 형
2.chrome 패키지 이름(overlay의 경우 overlay될 어플리케이션의 경로)
3.chrome 패키지 파일의 위치(overlay의 경우 overlay할 어플리케이션의 경로)

(복잡한 chrome.manifest 파일의 예)

content       necko                   jar:comm.jar!/content/necko/ xpcnativewrappers=yes
locale               necko       en-US       jar:en-US.jar!/locale/en-US/necko/
content       xbl-marquee             jar:comm.jar!/content/xbl-marquee/

content       pipnss                  jar:pipnss.jar!/content/pipnss/

locale        pipnss      en-US       jar:en-US.jar!/locale/en-US/pipnss/

# Firefox-only
overlay chrome://browser/content/pageInfo.xul          chrome://pippki/content/PageInfoOverlay.xul application={ec8030f7-c20a-464f-9b0e-13a3a9e97384}

overlay chrome://communicator/content/pref/preftree.xul chrome://pippki/content/PrefOverlay.xul

overlay chrome://navigator/content/pageInfo.xul        chrome://pippki/content/PageInfoOverlay.xul application=seamonkey@applications.mozilla.org

content       pippki                  jar:pippki.jar!/content/pippki/ xpcnativewrappers=yes
locale        pippki      en-US       jar:en-US.jar!/locale/en-US/pippki/

content       global-platform        jar:toolkit.jar!/content/global-platform/ platform

skin          global      classic/1.0 jar:classic.jar!/skin/classic/global/

override chrome://global/content/netError.xhtml jar:embedder.jar!/global/content/netError.토싀

content       inspector              jar:inspector.jar!/content/inspector/ xpcnativewrappers=no

* What is Chrome?
Chrome is the user interface parts of the application window that are outside of a window's content area.
Toolbars, menu bars, progress bars, and window title bars are all examples of elements that are typically part of the chrome.

·        chrome - the browser UI around the web page

·        chrome URLs - the chrome protocol which is the only way to get privileges(ex.chrome://browser/content/browser.xul)

·        chrome directory - the directory where the apps put their UI files

·        chrome command line argument - start and open a file in a top level window

·        chrome argument to window.open - opens a new window top level

·        chrome.rdf - the chrome registry, in install directory and in profile

2.about.xul

<?xml version="1.0" encoding="utf-8"?>

<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<dialog xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"title="About favdaum" orient="vertical" buttons="accept" width="320" height="240">

<groupbox align="center" flex="1">

<vbox align="center">

<description id="title" value="Daum Menu" />

<description id="version" value="version: 0.1.0" />

<description id="created" value="created by" />

<description id="author" value="Asrada" />

</vbox>

</groupbox>

<description id="made" value="Made with EditPlus" />

</dialog>

3.main.xul

<?xml version="1.0" encoding="utf-8"?>

<overlay id="daummenu" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<script src="script.js" />

<menubar id="main-menubar">

<menu id="daumMenu" label="다음" insertbefore="helpMenu" accesskey="D">

<menupopup id="daumMenuPop">

<menu id="entertainment" label="엔터테인먼트" accesskey="E">

<menupopup id="ent_pop">

<menuitem id="cartoon" label="만화·소설" oncommand="openURL('http://comic.daum.net/?nil_profile=g&amp;nil_site=comic',event)" />

<menuitem id="music" label="뮤직" oncommand="openURL('http://52street.daum.net/?nil_profile=g&amp;nil_site=music',event)" />

<menuitem id="movie" label="영화" oncommand="openURL('http://movie.daum.net/?nil_profile=g&amp;nil_site=movie',event)" />

</menupopup>

</menu>

<menuseparator/>

<menuitem id="daumHome" label="Home" oncommand="gBrowser.addTab('http://www.daum.net')" />

<menuitem id="daumYV" label="YouthVoice" oncommand="gBrowser.addTab('http://youthvoice.daum.net')" />

<menuitem id="daumMS" label="MediaSchool" oncommand="gBrowser.addTab('http://mediaschool.daum.net')" />

</menupopup>

</menu>

</menubar>

</overlay>

4.script.js

function openOnCurrentTab(url){

gBrowser.selectedBrowser.setAttribute("src",url);

}

function openURL(url){

if(arguments.length == 2 && arguments[1] instanceof Event && arguments[1].shiftKey == true){

var newTab = gBrowser.addTab(url);

gBrowser.selectedTab = newTab;

}else{

openOnCurrentTab(url);
}

}

5.Chrome 시스템에 등록

만들어진 extention은 chrome 시스템에 등록을 해야 사용이 가능합니다. firefox의 경우 profile 디렉토리에 등록 파일을 만드는 것으로 간단히 extention을 추가 할 수 있습니다.

* 윈도우 사용자의 경우 실행(윈도우키 + R)메뉴에서 %APPDATA% 를 입력하면 사용자 어플리케이션 데이터 폴더가 열립니다.그 안에서 Mozilla>Firefox>Profiles>bz94kxr2.default(사용자마다 다름)>extensions 폴더가 Firefox 의 chrome시스템 디렉토리입니다

등록 파일의 이름은 install.rdf 파일에서 만든 extention의 ID와 동일하게 설정하고 내용은 extention의 루트 디렉토리 - 엄밀히 말하면 chrome 디렉토리의 부모 디렉토리 - 입니다.

예) 등록파일: daummenu@asrada.net

내 용: E:\workspace\xul\daumment

등 록 과정을 마친 후 Firefox를 실행시켜보면 메뉴바의 help 메뉴 왼쪽에 "다음" 이라는 메뉴가 추가되었음을 확인할 수 있습니다. 그리고 Firefox의 도구 > 부가기능을 보면 우리가 만든 daummenu 라는 확장기능이 표시가 되고 daummenu에서 오른쪽 버튼을 눌러 "daummenu 정보"를 클릭하면 about.xul의 내용이 다이얼로그로 나타납니다.

III.with XPCOM

XPCOM 은 Microsoft COM과 비슷한 Cross Platform Component Object Model로서 Java,Javascript,Python,perl,Ruby 등 다양한 언어로 컴포넌트를 사용하거나 인터페이스를 구현 할 수 있으며 파일과 메모리 관리,쓰레드 제어 등 XUL과 Javascript로는 불가능한 부분을 구현 할 수 있도록 해줍니다. XPCOM 컴포넌트는 C++ 뿐만 아니라 Javascript로도 구현 할 수 있기 때문에 C++을 다룰줄 몰라도 원하는 컴포넌트를 손 쉽게 만들어 사용할 수 있습니다.

* 작업표시줄 위로 메세지 다이얼로그를 보여주는 예제

var alertsService = Components.classes["@mozilla.org/alerts-service;1"].getService(Components.interfaces.nsIAlertsService);
alertsService.showAlertNotification("chrome://mozapps/skin/downloads/downloadIcon.png", "업데이트가 있습니다", "확인", false, "", null);

* 파일 복사를 구현한 예제

function copyFile(sourcefile,destdir)

{

// get a component for the file to copy

var aFile = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);

if (!aFile) return false;

// get a component for the directory to copy to

var aDir = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);

if (!aDir) return false;

// next, assign URLs to the file components

aFile.initWithPath(sourcefile);

aDir.initWithPath(destdir);

// finally, copy the file, without renaming it

aFile.copyTo(aDir,null);

}

copyFile("/mozilla/testfile.txt","/etc");

참고문헌

• chrome - http://en.wikipedia.org/wiki/Chrome_Mozilla
  - http://developer.mozilla.org/en/docs/Talk:Chrome
  - http://developer.mozilla.org/en/docs/Chrome_Registration
• directory organization - http://www.xulplanet.com/tutorials/xultu/xulfile.html
• XUL APIs - http://developer.mozilla.org/en/docs/XUL_Reference
• XPCOM - http://developer.mozilla.org/en/docs/XPCOM
  - http://developer.mozilla.org/en/docs/How_to_Build_an_XPCOM_Component_in_Javascript
• tutorial - http://developer.mozilla.org/en/docs/XUL_Tutorial

이클립스에서 swing 예제를 만들다가 시스템이 느려지는 듯 하여 윈도우의 작업관리자를 띄워보니 javaw.exe 프로세스가 무려 100개가 넘게 떠있었다..-_-;
작업관리자에서 일일이 하나하나 프로세스를 클릭하여 죽여나가다 보니 슬슬 짜증이 밀려왔다.
100개가 넘는 프로세스를 언제 다 죽이남...리눅스처럼 한방에 죽이는 명령어 없나...
한참 고민하다가 웬지 kill 과 같은 명령어가 있을것 같아서 무작정 CMD를 열었다.

역시 안되는구나 -_-;;
근데 분명 다른 이름으로 존재하리란 믿음이 무럭무럭 솟아났다.
그러다 작업관리자의 프로세스 목록을 유심히 살펴보는데 작업관리자의 프로세스 이름이 taskmgr.exe 였다.
작업관리자가 taskmgr이라면 작업은 task라는 말이된다.
그렇다면 tasklist 라는 명령어가 있지는 않을까?

크~ 있다있어~
tasklist 가 있으니 taskkill 도 있겠지~

드디어 원하는걸 찾았다!
프로세스이름이 javaw.exe 인 모든 프로세스[/IM javaw.exe]를 강제종료[/F] 시켰다~

역시 윈도우도 제대로 쓰려면 공부를 해야 하나보다.
우리가 리눅스 공부를 밤을 세워 하는 것처럼...



 

클로저(closure)는 자유로운(구속되지 않은) 변수들을 포함하고 있는 코드 블록이다. 이러한 변수들은 코드 블록이나 글로벌 콘텍스트에서 정의되지 않고, 코드 블록이 정의된 환경에서 정의된다. "클로저"라는 명칭은 실행할 코드 블록(자유 변수의 관점에서, 변수 레퍼런스와 관련하여 폐쇄적이지 않은)과 자유 변수들에 대한 바인딩을 제공하는 평가 환경(범위)의 결합에서 탄생한 것이다. 클로저 지원의 다양함은 Scheme, Common Lisp, Smalltalk, Groovy, JavaScript, Ruby, Python에서 찾아볼 수 있다.

클로저의 가치는 함수 객체(function objects) 또는 익명 함수(anonymous functions)로서 작용하고, 유형 시스템(type system)이 데이터뿐만 아니라 코드도 나타낼 수 있어야 한다는 점에서 유형 시스템에 대한 결과도 갖고 있다. 클로저가 있는 대부분의 언어들은 함수들을 퍼스트-클래스 객체들로서 지원하는데, 함수들은 변수에 저장될 수 있고, 매개변수로서 다른 함수들에 저장되며, 동적으로 생성되고, 함수들에서 리턴된다.

- IBM developer works 인용 -

클로저란 생성시 환경의 레퍼런스를 그대로 가지고 있는 것이다.

다음 javascript 코드를 보며 설명하겠다.

'click' 버튼을 클릭하면 계속 숫자가 증가하게 된다.
분명 i 라는 변수는 함수에서 선언된 지역 변수이다.
this.i 라고 객체 변수로 선언 했다면 쉽게 이해가 되겠지만 분명 지역변수로 선언되었다.
때문에 버튼을 클릭할때마다 i의 값은 매번 1이 되어야 한다.
하지만 계속 i는 증가한다.

그 이유가 바로 클로저에있다.

javascript 는 클로저를 지원하는 언어이기 때문에 return function(){} 이 선언되는 시점의 환경, 즉 지역변수 i의 레퍼런스를 가지고 있기 때문에 계속해서 i를 증가 시킬 수 있다.

어떻게 보면 상당히 난해한 개념이기도 하다.
하지만 간단한 원리-생성시의 환경 정보를 그대로 가지고 있다-만 파악한다면 쉽게 클로저를 사용 할 수 있을 것이다.


참고자료

• IBM developer works
• 클로저:wikipedia

오늘 JavaOne2007 Wrap-up 세미나 에 다녀왔다.
JavaFX 가 너무 궁굼해서 갔던 세미나였다.
첫번째 세션은 2007 JavaOne에 다녀오신 분이 그 때의 이슈를 소개하는 시간이었는데 듣는 것만으로도 JavaOne이란 행사가 얼마나 재밌고 유익한지 알 수 있었다.
2008 JavaOne에는 참석 할 수 있는 기회가 생길런지...

두번째 세션은 JavaFX에 대한 소개였다.
사실 이 세션 때문에 간것이나 다름 없었는데 뭐랄까...
기대가 너무 컸던것일까?
"JavaFX란 이런것이다" 라는 설명을 듣고 난 후 별 감흥이 없었다.
좀더 화려한 예제를 보길 기대했는데 웹사이트 두 개 보는 것으로 끝나버렸다.

하지만 이 번 세션에서 알아낸것이 있었으니, 바로 JavaFX가 Product Name 이 아니라 Brand Name 이라는것이다.
이 사실을 알기 전에는 Flex=Silverlight=JavaFX 이렇게 생각을 하고 있었다...
JavaFX는 "모든 기기의 통합"을 지향한다.
PC,TV,DVD 플레이어,PDA,핸드폰 등등, 모든 IT기기에서 사용자가 동일한 느낌을 받을 수 있도록 하는것이 목적이라고한다.
PC에서 fiickr에 접속해 사진을 보는것과 핸드폰에서 같은 화면을 볼때 상이한 느낌을 전달해서는 안된다는 것이다.
another device,same experience...(아닌가 ㅡㅡ?)

JavaFX는 브렌드명이고 그 아래에 JavaFX Mobile과 JavaFX Script 가 출시가 되었다.
이 두가지 Product 외에도 계획중인 Product가 네다섯개 더 있는데 시장 규모와 파급 효과가 큰 이 두개를 먼저 출시했다고 한다.

JavaFX Script 에 대해선 자세한 설명이 있었고 샘플 코드도 볼 수 있었다.
발표자는 "easy"를 강조하셨는데 내 생각은 "글쎄..."다.
자바 로고 하나를 만들기 위해 만들어진 수백라인의 코드를 보면서 노가다성 툴이라는 생각이 들었다.
디자이너와의 협업도 문제가 될 것 같고...
머...Sun이니 머지않아 드로잉 툴을 지원해주겠지..하고 위안을 해본다.

세번째 세션은 JMaki에 대한 소개였다.
JMaki가 뭔지 오늘 처음 알았다 ㅡㅡ;
여러가지 javascript toolkit들과의 차이점을 별로 못 느꼈다.
다만 IDE의 지원으로 인해 마우스질로 스크립팅이 가능하다는것...

마지막 세션은 JSF,Hibernate,Spring을 이용한 어플리케이션 개발 소개였다.
발표자가 세미나 발표 경험이 적은지 발표가 매끄럽지 않았다...
Hibernate,Spring 둘 다 관심이 많았는데 세미나 참석자들이 모두 저것들을 다룰줄 안다고 가정한 발표였는지 도통 무슨 말인지 알아 들을 수가 없었다.
아무리 자바관련 세미나라지만 참석하는 사람들이 모두 자바를 사용하는 것은 아닐텐데...

신청할 때 부터 기대가 매우 컸던 세미나였다.
그래서 그만큼 실망도 큰가보다.
그렇다고 시간낭비는 아니었다.
빈약하지만 JavaFX의 샘플 사이트도 봤고, JMaki라는 것도 알게됐고, JavaOne에 꼭 가고 싶게 만든 자료들도 봤으니까...
다음 세미나를 기대해본다...