Rev. 2.73

protomenu.jpg

쿨한 컨텍스트 메뉴 Proto.Menu가 출현했다. Prototype 기반으로 제작되어 크로스-브라우저를 지원한다. 크기가 작고(2kb), 랜더링이 빠르며, 사용자 입맛대로 커스토마이즈 할 수 있다. 재미있는 것은 브라우저의 컨텍스트 메뉴에 기본으로 포함된 항목인 '뒤로가기/앞으로가기', '새로 고침/자동으로 다시 읽기/중지'를 포함하고 있어 자바스크립트가 생성하는 컨텍스트 메뉴로 대체했을 경우의 답답함을 일부분 해소하려 노력한 흔적을 엿볼 수 있다.

var myLinks = [
	{name: 'Back', callback: function(){alert('back function called')}},
	{name: 'Forward', callback: function(){alert('Forward function called')}},
	{separator: true},
	{name: 'Reload', callback: function(){alert('Reload function called')}},
	{name: 'Disabled option', disabled: true},
	{name: 'Toggle previous option', callback: function(){
		var item = oLinks.find(function(l){return l.name == 'Disabled option'});
		item.disabled = item.disabled == false ? true : false;
	}}
];

new Proto.Menu({
	selector: '.contextmenu',
	className: 'myContextMenu',
	menuItems: myLinks
});

Comments

xray.jpg

John Allsopp씨는 웹페이지가 들고있는 엘리먼트들의 박스모델을 비주얼라이즈 하는 XRAY를 개발했다. 북마크릿(bookmarklet)의 형태로 제공되는 XRAY는 IE6+, Webkit 그리고 Mozilla 계열 브라우저에서 작동한다. 파이어버그에서 제공하는 HTML Inspect의 정보들을 보여주는 것과 같다. 엘리먼트가 들고있는 X,Y 좌표 및 높이, 너비 등의 정보를 대상 엘리먼트의 주변에 표시하여 매우 직관적이고 이해하기 쉽다. 이 도구는 웹 디자이너와 개발자에게 매우 유용하게 사용될 수 있을 것이다.

Comments

solitaire.jpg

Robert Schultz씨는 Ajax와 몇몇 자바스크립트 라이브러리를 사용하여 믿을수 없을 정도로 완성도 높은 Solitaire 게임, World of Solitaire를 제작했다. YUI, MochiKit 그리고 PlotKit이 사용되었다고 한다. 이 Solitaire 게임은 완성도 높은 드래그 드롭과 애니메이션을 구현했으며, 놀랍게도 창크기에 따른 카드의 리스케일 및 리사이즈가 실시간으로 이루어 진다. 덕분에 그래픽 생성과정이 추가되어 로딩이 길어지는 단점이 있지만, 어떠한 화면 크기라도 최적화된 그래픽을 제공하려는 시도는 멋있어 보인다. 사운드 효과만 추가되면 더이상 바랄것이 없겠다.

덧. 인터뷰 링크 : Implementation Focus: World of Solitaire by Robert Schultz

Comments