얼마전 Firejune님의 블로그에서 Mootools에 관한 소식을 접하고 이런 저런 테스트를 해 보다가 결국 prototype.js와 effects.js를 버리고 Mootools로 돌아섰습니다.

실력이 모자라서 자세하게 이해하지는 못했지만, 제가 원하는 기능들이 모두 들어가 있는데다 모든 라이브러리를 합쳐도 prototype.js크기에 못미치는 가벼움에 반해서 기존에 prototype.js, effects.js를 사용하던 모든 자바 스크립트들을 Mootools를 이용하도록 바꿨습니다.

사실 플러그인을 좀 많이 쓰는 편이라 Mootools로 바꿨다고 해서 블로그가 가벼워진건 전혀 아니지만, 깔끔한 라이브러리를 보면서 배우는 즐거움과 ‘언젠가는 블로그가 가벼워지겠지…’ 하는 기대감으로 몇일간 푹 빠져서 삽질해봤습니다.

변경한(할) 플러그인들

• Lightbox2 JS: 한참을 낑낑대며 고민하다가 혹시나 해서 검색해 보니 moo.fx.js를 이용한 litebox 라는 스크립트가 이미 있더군요. 바로 작업중이던 파일 날려버리고 이놈을 가지고 적용했습니다
• ajaxContactForm: Mootools가 워낙에 prototype과 비슷한 사용법을 가지고 있는지라, 큰 어려움 없이 ajax기능만을 변형해서 적용할 수 있었습니다.
• Ajax-Spoiler: 이놈을 Mootools에 맞게 수정하면서 이런 저런 기능들을 많이 알게 되었습니다. 아무래도 기존의 효과들을 비슷하게라도 적용하려고 하려다보니(기존에 작성했던 글들을 모두 수정하는건 생각도 하기 싫은지라…) 가장 많은 시간을 투자해야만 했습니다. 어쨓든 일단 작동은 하게 되어서 현재 블로그에도 적용중입니다.(임시로 “Moo-Spoiler”로 이름 붙였습니다) 더불어서 기본적으로 "display:none;"으로 숨겼던 내용들을 우선 표시되게 한 다음 화면이 모두 로딩 된 다음 효과를 적용해 숨기도록 해 봤는데(자바스크립트 기능이 꺼진(없는) 브라우저에서는 항상 보이겠죠), 한동안 지켜봐야 할 듯 하군요.
• Wp-SlimStat-Ex: 역시 Ajax관련 부분만을 수정하면 되기에 큰 어려움은 없었지만, Mootools의 Ajax.js 라이브러리가 'get' Method에서 쿼리값들을 제대로 전송하지 못하는 문제 때문에 좀 변칙적인? 방법으로 적용했습니다.(request URL 에 쿼리값을 모두 포함시켜 버림…) 어쨓든 일단 작동은 하니까 패스~
• Rolling Archives: 이놈 역시 Ajax에서 'get' Method를 사용하는지라 Wp-SlimStat-Ex와 마찬기지로 변칙적인? 방법을 적용했습니다. 그 외에는 간단한 Opacity효과를 적용하는 정도였죠. 이것 역시 적용중.
• SweetTitles: 이놈은 아직 손대지는 않았지만 Mootools의 Tips.js 라이브러리를 이용해서 적용 할 수 있을 듯 하더군요. 게다가 좀 더 확장해서 이미지용, 링크용, 타이틀용 등등으로도 적용 할 수 있으니 스타일만 잘 적용한다면 유용하겠다는 생각입니다.
• Wp-Scripts: Mootools 사이트의 다운로드 페이지에서 사용중인 JavascriptCompressor가 아주 인상적이어서, 이놈을 Wp-Scripts플러그인에 적용하는 방법을 생각해 보게 되었습니다. 아직은 생각만 하고 있기는 하지만, 아주 불가능 할 것 같지는 않네요.

아직 개발중인 단계라서 인지 아니면 원래 그런지는 확실치 않지만, prototype.js와 함께 사용하는건 불가능해 보이더군요. 예를들어 prototype.js를 이용하는 Lightbox2 JS를 사용중이라면, Mootools라이브러리를 적용한 스크립트에서 에러를 뱉어냅니다. (혹시 저만 그런건가요?)