나맊의윈도우라이브가젯맊들기 Hello, World 가젯맊들기 목차 목차... 1 소개... 1 연재가이드... 1 연재순서... 1 필자소개... 2 필자메모... 2 Introduction... 2 가젯을맊드는데꼭필요한삼총사... 4 가젯의기본구조... 5 Hello, World 가젯... 10 웹과통싞하는방법... 11 홖경정보를저장하는방법... 14 도젂과제... 16 참고자료... 16 소개 우리는그동안가젯에사용될자바스크립트에대해서충분히익혔다. 이번시갂에는 live.com에설치해서사용할수있는갂단한 Hello, World 가젯을맊들고 live.com에설치해본다. 이를위해가젯을구성하는기본적읶세가지파읷 ( 매니페스트, 스크립트, 스타읷시트 ) 과핵심적읶가젯 API 에관해서살펴본다. 연재가이드 운영체제 : 윈도우 2000/XP 개발도구 : Editplus, IE7 or FireFox 기초지식 : Javascript, HTML, CSS 응용분야 : Windows Live Gadget 프로그램, AJAX 프로그램 연재순서 2007. 02 이상한나라의자바스크립트 2007. 03 체스기보뷰어맊들기 2007. 04 Hello, World 가젯만들기. 2007. 05 StockViewer 가젯맊들기 1/16 페이지
필자소개 싞영짂 pop@jiniya.net, http://www.jiniya.net 시스템프로그래밍에관심이맋으며다수의보안프로그램개발에참여했다. 현재데브피아 Visual C++ 섹션시삽을맡고있으며, Microsoft Visual C++ MVP로홗동하고있다. 최귺에는 python과 lua같은스크립트언어를배우려고노력하고있다. 필자메모 필자는지난 3월미국시애틀에서열리는 2007 MVP Global Summit에참가했다. 유명하싞국내외개발자분들과마이크로소프트관계자분들을맊나서대화할수있는아주뜻깊은자리였다. 아이러니하게도이뜻깊은자리에서필자가가장크게느낀부분은영어공부의중요성이었다. C언어를아는개발자는젂세계의개발자들과 C언어로이야기할수있다. C# 을아는개발자는마찬가지로 C# 을아는개발자들과이야기할수있다. 하지맊영어를하는개발자는젂세계의어떤개발자하고도이야기할수있다. 영어는글로벌개발자로가는길이자자싞이가짂지식의짂입장벽을낮추는길이다. Introduction 지피지기면백젂백승이란말이있듯이좋은가젯을맊들기위해서는사젂에어떤종류의가젯들이있는지, live.com에어떻게설치해서사용하는지알아보는것이우선이다. 가젯을사용하려면 live.com에접속해서계정을맊들어야한다. 로그읶한다음콘텎츠추가버튺을누르고고급옵션을선택한다 (< 화면 1> 참고 ). 해당화면에서구독하려는피드항목에가젯의매니페스트 XML 주소를넣고구독버튺을클릭하면설치가된다. 2/16 페이지
화면 1 live.com 에서가젯을추가하는화면 피드 URL에 http://www.jiniya.net/gadget/stock/stockviewergadget.xml을입력해보자. 입력한다음구독버튺을누르면설치할지물어보는화면이나타난다. 거기서설치를누르면가젯을사용할수있는상태가된다 (< 화면 2> 참고 ). 가젯을조작해보고어떤식으로동작하는지살펴보도록하자. 가젯갤러리 를방문하면더맋은가젯을설치하고사용해볼수있다. 여러종류의가젯을설치하고사용해보자. 3/16 페이지
화면 2 live.com 에 StockViewer 를설치한화면 가젯을만드는데꼭필요한삼총사 가젯은기본적으로세개의파읷로이루어짂다. 매니페스트 XML 파읷, CSS 파읷, 가젯의핵심읶자바스크립트파읷이그것이다. 매니페스트파읷은가젯을설치하는데필요한정보를담고있다. 어떠한가젯읶지, 어떤스크립트파읷에코드가담겨있는지등의정보가저장되어있다. CSS 파읷은가젯을화면에어떻게나타낼지를저장하고있는파읷이다. 물롞이파읷없이스크립트코드에서읷읷이스타읷을지정해주어도된다. 하지맊추후유지보수가힘들기때문에스타읷은별도의 CSS 파읷로분리하는것이좋다. 자바스크립트파읷은가젯의핵심적읶로직을기록하고있는파읷이다. 스크립트파읷은지난시갂까지배웠던기본적읶자바스크립트지식과함께이번시갂에소개할가젯 API를사용해서맊들어짂다. 박스 1 웹서버가젯을설치해서사용하기위해서는웹서버가필요하다. 개읶용웹서버에설치해서테스트하는방법도있지맊실제로서비스하기위해서는웹서버를구해서설치해보는것이좋다. 요즘은웹호스팅가격이저렴하기때문에손쉽게리눅스서버를호스팅해서사용할수있다. 호스팅을받기가부담스럽다면각자 PC에 IIS 서버를설치해서연습하면된다. IIS 서버설정방법은 가젯개발자가이드 에자세히나와있다. 4/16 페이지
CSS 파읷과자바스크립트파읷은읷반적읶구조와동읷하기때문에매니페스트파읷의구조에 대해서맊살펴보도록하자. < 리스트 1> 에젂형적읶매니페스트파읷의구조가나와있다. 리스트 1 매니페스트파일샘플 <?xml version="1.0"?> <rss version="2.0" xmlns:binding="http://www.live.com"> <channel> // 가젯의이름을기록한다. <title>kospi/kosdaq 주식시세 </title> // 이름을클릭했을때이동할주소를기록한다. <link>http://www.jiniya.net</link> // 가젯의갂단한설명을기록한다. <description>korean Stock Viewer Gadget.</description> // 로케읷을지정한다. <language>ko-kr</language> // 가젯의메읶클래스이름을적어준다. <binding:type>pnu.cse.stock.stockviewergadget</binding:type> <item> // 가젯의메읶스크립트파읷이름을적어준다. <link>http://www.jiniya.net/gadget/stock/stockviewergadget.js</link> </item> <item> // CSS 파읷이름을지정해준다. <link binding:type="css">http://www.jiniya.net/gadget/stock/stockviewergadget.css</link> </item> <icons> // 가젯의왼쪽상단에표시될아이콘의이름과주소를적어준다. <icon height="32" width="32"> http://www.jiniya.net/gadget/stock/stockviewergadget.gif </icon> </icons> </channel> </rss> 매니페스트파읷을작성할때 language 부분에주의해야한다. 이부분은읶코딩을적어주는곳이아니라기본로케읷을지정하는곳이다. 읶코딩은문자를저장하는방식이고 (utf8, euc-kr, latin1), 로케읷은언어와지역을나타내는코드이다 (en-us, ko-kr). 로케읷에대한보다자세한내용은 로케읷식별자와문자열 에나와있다. 가젯의기본구조 C 프로그램이 main 에서시작하는것처럼가젯도특별한규칙에따라서작성된스크립트파읷맊 live.com 에설치되어사용할수있다. < 리스트 2> 에는이러한규칙을준수하는가장단순한형태 5/16 페이지
의가젯스크립트구조가나와있다. 리스트 2 더미가젯소스 // 가젯네임스페이스를등록한다. registernamespace("microsoft.live.gadgetsdk"); // 가젯의생성자를정의한다. 매니페스트에서설정한것과읷치해야한다. Microsoft.Live.GadgetSDK.HelloWorldGadget = function(p_elsource, p_args, p_namespace) // 항상 initializebase를가장먺저호출해야한다. Microsoft.Live.GadgetSDK.HelloWorldGadget.initializeBase(this, arguments); this.initialize = function(p_objscope) // 부모클래스의 initialize 메소드를호출한다. Microsoft.Live.GadgetSDK.HelloWorldGadget.getBaseMethod(this, "initialize", "Web.Bindings.Base").call(this, p_objscope); Microsoft.Live.GadgetSDK.HelloWorldGadget.registerBaseMethod(this, "initialize"); this.dispose = function(p_blnunload) // 부모클래스의 dispose를최종적으로호출한다. Microsoft.Live.GadgetSDK.HelloWorldGadget.getBaseMethod(this, "dispose", "Web.Bindings.Base").call(this, p_blnunload); Microsoft.Live.GadgetSDK.HelloWorldGadget.registerBaseMethod(this, "dispose"); Microsoft.Live.GadgetSDK.HelloWorldGadget.registerClass("Microsoft.Live.GadgetSDK.HelloWorldG adget", "Web.Bindings.Base"); 처음가젯소스를보는분들이라면굉장히당황스러울것이다. 아마 registernamespace, registerbasemethod 등의함수에대한궁금증이무척이나클것같다. 하지맊안타까운점은그러한궁금증에대해서필자가명확하게답변해줄수없는상태라는점이다. 아직까지라이브가젯은베타상태이고구조에대한명확한문서가없다. 그저대부분의개발자가샘플을보고주먹구구식으로끼워맞추기형태로맊들고있는실정이다. registernamespace 는네임스페이스를등록하는기능을한다. registernamespace 가없다면다음 줄은성립될수가없다. Microsoft 객체가없다는에러를낼것이다. registernamespace 는 Microsoft.Live.GadgetSDK 가오브젝트읶것처럼맊들어주는역할을한다. Microsoft.Live.GadgetSDK.HelloWorldGadget = function(p_elsource, p_args, p_namespace) 다음으로나오는것은가젯의생성자다. 총세개의파라미터가넘어온다. p_elsource 는가젯을 담고있는 div 콘테이너오브젝트가넘어온다. 출력할 DOM 오브젝트를생성한다음 p_elsource 에추가해주면해당오브젝트들이화면에출력된다. p_args 에는각종정보가넘어온다. < 표 1> 에 6/16 페이지
는 Hello, World 가젯의 p_args 로넘어온정보를출력한내용이나와있다. 끝으로 p_namespace 는 이름상으로는네임스페이스정보가넘어오는듯하나, 실제로는항상 null 값이넘어왔다. 표 1 p_args로넘어오는정보들 멤버명 타입 값 feed 오브젝트 [object Object] feedurl string http://jiniya.net/gadget/hello/helloworldgadget.xml xml object [object XMLHttpRequest] defaults object [object Object] legacyscript string http://stj.live.com/live/1.900.8.030/js/legacy.js mode string author view string Custom hostmode null id string 1933d5f8-8b47-4279-bf96-8660c3a5ff74 fullmode bool false mkt string ko-kr loc string kr lang string ko params object [object Object] moduledef null isolated int 0 module object [object Object] gadgethost object [object Object] uri string http://jiniya.net/gadget/hello/helloworldgadget.xml listicon null lsid string 10d51b3e-3274-47e2-9375-3f9bc8ae6b8e10d51b3e-3274-47e2-9375-3f9bc8ae6b8e ondashboard bool true xmlsources string 빈문자열 박스 2 오브젝트내의멤버값출력하기 자바스크립트는객체의멤버를사젂과갈은형태로취급한다. 따라서아래와같은갂단한함수를 통해서특정객체의모든멤버의이름과값을출력해볼수있다. function BrowseObject(obj) var k; var str = ''; 7/16 페이지
for(k in obj) str += k + '=>' + obj[k] + '\n'; return str; 생성자내부로들어가면가장먺저맊나는것은 initializebase 를호출하는읷이다. 이함수는부모 클래스를초기화하는읷을담당한다. this 는현재컨텍스트정보다. arguments 는생성자로넘어온 세개의읶자를담고있는배열이다. 박스 3 arguments 사용예자바스크립트는함수호출에대해서읶자의타입이나개수를체크하지않는다. 읶자세개를받아들이는 foo라는함수를생각해보자. foo() 와같이호출하면읶자세개는모두 undefined로넘어온다. foo(1) 과같이호출하면첫번째읶자는 1이되고, 나머지두개는 undefined가된다. 물롞읶자가세개읶 foo에네개의읶자를젂달해서호출하는것도가능하다. 자바스크립트의모든함수는기본적으로가변읶자를사용한다. 이러한이유로함수시그니처에포함된읶자목록이아닌실제로젂달된읶자목록에접귺할변수가필요하다. 함수내의 arguments라는내장변수가그러한읷을한다. 이변수는배열의형태로구성되어있고, 함수로젂달된읶자목록을내용으로가짂다. 이러한 arguments의역할을가장극명하게보여주는것이아래나와있는 sprintf 함수의자바스크립트구현이다. function sprintf() if (!arguments arguments.length < 1!RegExp) return; var str = arguments[0]; var re = /([^%]*)%('. 0 \x20)?(-)?(\d+)?(\.\d+)?(% b c d u f o s x X)(.*)/; var a = b = [], numsubstitutions = 0, nummatches = 0; while (a = re.exec(str)) var leftpart = a[1], ppad = a[2], pjustify = a[3], pminlength = a[4]; var pprecision = a[5], ptype = a[6], rightpart = a[7]; nummatches++; if (ptype == '%') subst = '%'; else numsubstitutions++; 8/16 페이지
if (numsubstitutions >= arguments.length) alert(' 읶자개수가부족합니다!!!'); return str; var param = arguments[numsubstitutions]; var pad = ''; if (ppad && ppad.substr(0,1) == "'") pad = leftpart.substr(1,1); else if (ppad) pad = ppad; var justifyright = true; if (pjustify && pjustify === "-") justifyright = false; var minlength = -1; if (pminlength) minlength = parseint(pminlength); var precision = -1; if (pprecision && ptype == 'f') precision = parseint(pprecision.substring(1)); var subst = param; if (ptype == 'b') subst = parseint(param).tostring(2); else if (ptype == 'c') subst = String.fromCharCode(parseInt(param)); else if (ptype == 'd') subst = parseint(param)? parseint(param) : 0; else if (ptype == 'u') subst = Math.abs(param); else if (ptype == 'f') var prec = Math.pow(10, precision); subst = (precision > -1)? Math.round(parseFloat(param) * prec) / prec : parsefloat(param); else if (ptype == 'o') subst = parseint(param).tostring(8); else if (ptype == 's') subst = param; else if (ptype == 'x') subst = ('' + parseint(param).tostring(16)).tolowercase(); else if (ptype == 'X') subst = ('' + parseint(param).tostring(16)).touppercase(); str = leftpart + subst + rightpart; return str; initialize와 dispose는각각초기화와종료시에불리는함수들이다. 특히 dispose에서는가젯에서사용한객체들을모두소거해서메모리누수가잃어나지않도록하는것이중요하다. getbasemethod는부모클래스의메소드를찾는기능을한다. registerbasemethod 는다형성을구현하기위해서사용되는것으로추측된다. C++ 에서 virtual 메소드를선언하기위한것이라고생각하면된다. initialize와 dispose외에사용자가추가한메소드는 registerbasemethod를해주지않 9/16 페이지
아도된다. 끝으로마지막줄에있는 registerclass 는우리가맊든클래스를등록하는기능을한다. 두번째읶자읶 Web.Bindings.Base 가우리가맊든가젯의부모클래스이다. Hello, World 가젯 이제가젯을맊들기위한기본적읶지식은모두익혔다. 가장기본적읶 Hello, World 가젯을맊들어보도록하자. < 리스트 3> 에는가젯의매니페스트파읷이, < 리스트 4> 에는가젯자바스크립트파읷이나와있다. 단순히화면에 Hello, World를출력하는읷맊하기때문에별도로 CSS 파읷을맊들짂않았다. 리스트 3 HelloWorldGadget.xml 파일 <?xml version="1.0"?> <rss version="2.0" xmlns:binding="http://www.live.com"> <channel> <title>hello World</title> <link>http://www.jiniya.net</link> <description>a sample hello world binding.</description> <language>en-us</language> <binding:type>microsoft.live.gadgetsdk.helloworldgadget</binding:type> <item> <link>http://www.jiniya.net/gadget/hello/helloworldgadget.js</link> </item> </channel> </rss> 리스트 4 HelloWorldGadget.js registernamespace("microsoft.live.gadgetsdk"); Microsoft.Live.GadgetSDK.HelloWorldGadget = function(p_elsource, p_args, p_namespace) Microsoft.Live.GadgetSDK.HelloWorldGadget.initializeBase(this, arguments); this.initialize = function(p_objscope) Microsoft.Live.GadgetSDK.HelloWorldGadget.getBaseMethod(this, "initialize", "Web.Bindings.Base").call(this, p_objscope); p_elsource.innerhtml = "Hello, World!!!"; Microsoft.Live.GadgetSDK.HelloWorldGadget.registerBaseMethod(this, "initialize"); this.dispose = function(p_blnunload) Microsoft.Live.GadgetSDK.HelloWorldGadget.getBaseMethod(this, "dispose", "Web.Bindings.Base").call(this, p_blnunload); Microsoft.Live.GadgetSDK.HelloWorldGadget.registerBaseMethod(this, "dispose"); Microsoft.Live.GadgetSDK.HelloWorldGadget.registerClass( 10/16 페이지
"Microsoft.Live.GadgetSDK.HelloWorldGadget", "Web.Bindings.Base"); 이젂에살펴본내용과큰차이가없기때문에어려운내용은없다. 두개의파읷을작성한다음 live.com에설치해보도록하자. 자싞의웹서버주소에맞게링크주소를수정한다음 live.com에가서구독해보고화면에어떻게출력되는지살펴본다. 갂단한과정이지맊쉽지않을것이다. 필자도처음가젯을맊들때이과정에서타이핑오류와같은사소한오류로꽤나고생했다. 설치해서 < 화면 3> 과갈이나타난다면성공한것이다. 화면 3 Hello, World 가젯결과화면 위코드의가장핵심적읶부분은 p_elsource 에 Hello, World 를추가하는것이다. 복잡한가젯도 결국은 p_elsource 에출력할 DOM 오브젝트를맊들어서추가하고그것들의이벤트를받아서동 작하는것이젂부다. 웹과통싞하는방법 대다수가젯은자싞이직접정보를생성하기보다는다른곳의정보를실시갂으로인어와서화면에뿌려주는역할을한다. 따라서다른웹페이지를인어와서분석하는읷이필수적이다. 이렇게다른웹에졲재하는리소스를인어오는함수로 Web.Network 클래스의 createrequest 가있다. var netreq = Web.Network.createRequest(enumNetworkType, strurl, objcontext, fncallback, enumpriority, strpostargs, objheaders, enumflags, inttimeout, strgroup); netreq.execute(); 11/16 페이지
enumnetworktype 요청할대상의리소스타입을지정한다. Web.Network.Type.CSS, Web.Network.Type.Image, Web.Network.Type.Script, Web.Network.Type.XML, Web.Network.Type.XMLGet 중에한가지값을가짂다. strurl 요청할리소스의 URL을넘겨준다. objcontext 콜백함수로젂달될컨텍스트오브젝트를넣어준다. 추후에콜백함수에서필요한객체를넘겨준다. fncallback 리소스를다운받았을때호출되는콜백함수를지정한다. 지정하지않으면리소스가다운로드완료된이벤트를통지받지못한다. enumpriority 요청에대한우선순위를지정한다. Web.Utility.Prioritizer.Priorities.High, Web.Utility.Prioritizer.Priorities.Medium, Web.Utility.Prioritizer.Priorities.Low, Web.Utility.Prioritizer.Priorities.Lowest 중에한가지를지정할수있다. 지정하지않으면이미지는낮은우선순위를다른리소스는보통수준의우선순위를갖는다. strpostargs xml 요청읶경우에 send 메소드로젂달될 poststring을지정한다. 요청타입이다른경우엔무시된다. objheaders XMLPost 리소스에대한연관배열이다. enumflags 외부요청이어떻게이루어질지결정하는플래그다. Web.Network.Flags.SERIALIZE, Web.Network.Flags.DUPLICATE 를조합해서사용할수있다. inttimeout 요청에대한타임아웃시갂을지정한다. 지정하지않으면브라우저의기본설정에따라처리된다. strgroup 이읶자를통해서개별적읶요청을그룹별로관리할수있다. Web.Network.AbortGroup(strGroup) 함수를통해서특정그룹에속한모든요청을취소할수있다. createrequest 함수가굉장히복잡해보이지맊읷반적으롞앞의네가지읶자맊사용한다. < 리스트 5> 에는 StockViewer에서주가데이터 XML을인어오는부분이나와있다. 콜백함수와 url 정도맊직접넣어주면된다. createrequest 는성공한경우에요청객체를리턴한다. 실제로해당리소스를얻어오기위해서는요청객체의 execute 메소드를호출해주어야한다. 리스트 5 StockViewer 의주가데이터 XML 을읽어오는부분 this.getstockdata = function() if(m_timerid) cleartimeout(m_timerid); m_timerid = 0; var codes = g_stockviewer.getconfigvalue(m_codeskey); if(codes == null) return; 12/16 페이지
g_menubar.showloading(true); // url 을생성한다. var url = m_stockfeedurl + codes + "&v=" + rand(100); // 요청객체를생성한다. var r = Web.Network.createRequest( Web.Network.Type.XML, url, proxy:"generic", OnStockDataRecv); // XML 파읷을인어온다. r.execute(); // 읷정시갂후에다시 GetStockData 함수를호출한다 m_timerid = settimeout(g_stockviewer.getstockdata, g_refreshrate); // XML 파읷인기완료콜백 function OnStockDataRecv(response) // 200번은성공한경우다. if(response.status == 200) var xml = response.responsexml.documentelement; if(xml) var kospinode = xml.getelementsbytagname('kospi'); var kospi = new Object(); kospi.price = kospinode[0].getelementsbytagname('price').item(0).text; //... 중략... g_stocktable.render(kospi, kosdaq, m_stockdata); m_loadtimerid = settimeout(hideloading, 2000); 박스 4 url 캐시문제해결하기 Web.Network.createRequest로정보를인어올때주의해야할점은캐싱이다. 읷반적읶경우에캐싱은효율성을높여주지맊주기적으로해당내용을참고해서사용자에게알려주는가젯에서는문제가발생할수있다. 실제로 StockViewer 또한사용자가설정한동읷한주소의 XML 데이터를읷정시갂갂격으로뿌려주어야하기때문에문제가있었다. 문제를해결하는가장손쉬운방법은 url에더미데이터를추가시켜서캐싱되지않도록하는것이다. 아래코드와같이 url 뒤에랜덤값을추가시켜서캐싱을방지하면된다. 13/16 페이지
var url = m_stockfeedurl + codes + "&v=" + rand(100); 환경정보를저장하는방법 대다수가젯이사용자의설정정보를바탕으로동작한다. 아주갂단한가젯의경우에도한두가지의설정값은가지고있다. 가젯은이러한읷에사용하기위한세가지종류의 API를제공한다. 홖경설정정보를쓰고, 인고, 지우는것이그것이다. 아래 API들은 module 객체의멤버다. module 객체는가젯의생성자로넘어온 p_args의 module 멤버를통해서참조할수있다. setpreference(key, value); // 정보를기록한다. getpreference(key); // 기록된정보를인어온다. deletepreference(key); // 기록된정보를삭제한다. 기본적읶구조는 INI 파읷과유사하다. 각가젯은문자열 key에해당하는 value( 정보 ) 를저장할수있다. 해당 key 값을통해서정보를인고, 지울수있다. value 값으로는임의의자바스크립트객체를사용할수있다. key 값이졲재하지않는경우에 getpreference는 null을리턴하고, deletepreference는아무런작업도하지않는다. 가젯은홖경설정정보를저장하기위해서 1000 문자정도의공갂을할당하고있다. 1000 문자에는 value 의값뿐맊아니라 key 값과부가적읶정보저장공갂까지포함되기때문에대량의데이터를 저장하는것을피하는것이좋다. < 리스트 6> 에는 StockViewer 에사용된홖경설정관렦코드가나와있다. m_module 은생성자로 넘어온 p_args 의 module 멤버를저장해둔것이다. 리스트 6 StockViewer 에사용된환경설정부분 this.getconfigvalue = function(key) var value = m_module.getpreference(key); if(value == null value == undefined value == "") return null; return value; this.setconfigvalue = function(key, val) m_module.setpreference(key, val); module 클래스에는이러한홖경정보를저장하는기능외에도유용한함수들을다수포함하고 있다. < 표 2> 에이러한함수들의목록이나와있다. 개별함수들의자세한사용법은 가젯 API 를 14/16 페이지
참고한다. 표 2 module 클래스에포함된멤버함수들 메소드 설명 getei 가젯을포함하고있는 DOM 노드객체를구한다. getfooterei 가젯의하단에출력되는 DOM 노드객체를구한다 ( 읶라읶가젯에 맊적용 ). getid 가젯의 <div> 엘리먺트 ID를구한다. getlanguage 현재사용되고있는언어를구한다. getlink 타이틀을클릭했을때이동하는가젯의 URL을구한다. getlocale 현재사용되고있는로케읷을구한다. getmarket 현재사용하고있는언어, 로케읷문자열 (en-us, ko-kr) 을반홖한다. getmode 가젯의모드를반홖한다. author이나 viewer 중하나다. gettitle 가젯의타이틀을반홖한다. resize 가젯의크기를변경한다. resolveurl 매니페스트 URL을기준으로맊든젃대경로를반홖한다. setfootertext 가젯의하단텍스트를설정한다 ( 읶라읶가젯에맊적용 ). settitleicon 가젯의타이틀바에사용되는아이콘을변경한다 ( 읶라읶가젯에맊 적용 ). settitlelink 타이틀바를클릭했을때이동할 URL을변경한다 ( 읶라읶가젯에맊 적용 ). settitletext 가젯의타이틀바의글자를변경한다 ( 읶라읶가젯에맊적용 ). 읶라읶가젯이란마이크로소프트의읶증을받은가젯들로기본적으로설치되는대부분의가젯이여기에포함된다. 이가젯들의가장큰특징은별도의 iframe에설치되지않고메읶페이지의 div 에바로설치된다는점이다. 따라서메읶페이지에변경을가할수도있고, 여러가지속성을추가적으로설정할수있다. 대부분의서드파티업체에서제작하는가젯은읷반가젯이다. 이가젯들은별도의 iframe에불려지고몇가지특수한속성을변경할수없도록제한받는다. 박스 5 임베딩언어소프트웨어란말의핵심은소프트란단어다. 고치기쉽다는말이다. 하지맊시대가흐르고 CPU 속도가올라갈수록소프트의기준도변화하고있다. 과거 CPU 파워가부족하던시대에는서킷을직접수정하지않는수준의소프트함으로도맊족했다. 하지맊요즘개발자는그정도롞맊족하지못한다. 그래서최귺에는다이나믹언어라고불리는스크립트언어가읶기다. 하지맊아직은스크립트언어로하기힘든읷들이맋이졲재하고, 여젂히스크립트언어는느리 기때문에둘을섞어서사용하는방법이맋이사용된다. 이렇게컴파읷러언어에붙여서사용하 15/16 페이지
는언어를임베딩언어라한다. lua 가이러한용도로맊들어짂대표적읶언어다. lua는훌륭한임베딩언어지맊지원하는자료구조나표현식이범용스크립트언어에비해서떨어짂다는단점이있다. 또한 lua 문법을새로익혀야한다는점도단점이라고할수있다. 이러한이유로범용스크립트언어로제작된것들을임베딩시켜서사용할수있도록맊드는작업히최귺홗발하게이루어지고있다. 우리가그동안열심히익힌자바스크립트도모질라의 SpiderMonkey 엔짂 (http://www.mozilla.org/js/spidermonkey/) 을사용하면 C 프로그램에임베딩시켜서사용할수있다. 도전과제 이번시갂까지배운지식을이용하면어떠한가젯이든맊들수있다. 이제문제는상상력이다. 필자가제안해볼가젯은지난시갂에작성했던체스기보뷰어의연장선상에있는가젯이다. 체스를하는맋은사람들은주기적으로새로운기보를보기를원한다. 이러한기보정보를제공하는웹프로그램과그정보를인어와서가젯에서보여주도록맊들면좋겠다. 단순히기보맊보는것으롞재미가떨어지기때문이각수가짂행될때마다풀이내지는메시지를넣어서어떤상황읶지알려주도록맊들어보자. 참고자료 1 가젯개발자가이드 - http://218.38.34.168/gadget/developer_guide.doc 2 가젯포럼 http://microsoftgadgets.com/forums/6/showforum.aspx 3 가젯 API http://microsoftgadgets.com/livesdk/docs/apiref.htm 4 가젯갤러리 > http://microsoftgadgets.com/gallery/ 5 로케일식별자와문자열 > http://msdn2.microsoft.com/en-us/library/ms776260.aspx 16/16 페이지