※ CCL에 따라서 사용한 플래시 mp3 플레이어의 원작자 주소를 남깁니다.
Flash Single MP3 Player (c) 2006 Jeroen Wijering, some rights reserved.

노래/가사 페이지의 재생기를 플래시를 쓴 MP3 재생기로 바꿨습니다 ㄱ-
샘플 페이지는 여기..

하지 말라는 짓은 꼭 해보고 싶은게 인간의 심정이므로 기록을 남깁니다.


다시 한번 말하지만, 자바스크립트에 관심이 있는 사람 아니면 못할 짓이고, 꼭 인생에서 쓰잘데기 없는 것에 불타는 아름다운 정신이 없으면 절대 못하는 짓임을 알리면서..

본문에 object 태그를 쓰는건 사실 큰 문제가 아닙니다. 문제는 클릭하기 전에는 플래시마저 부르지 않게 하고 싶다인거죠. 그전에도 버튼을 클릭하면 미디어 플레이어가 뜨고 재생되지 않았습니까. 어쨌든 플래시가 되었건 뭐가 되었건 곡을 재생하려면 음악을 다운로드 받아야 하니까 무겁다고요.

그렇다면 object 태그고 뭐고 스킨에 못쓰게 하는 이글루스에서 그럼 어떻게 집어넣느냐!

textarea 태그에다가 스크립트를 넣어놓고, 그걸 eval 명령으로 실행하면 됩니다.
(사실 이거 문제가 될 소지가 무진장 많지만.. 아무튼 넘어갑시다 ㄱ-)

원리는 이렇습니다.

1. textarea 태그 안에 스크립트를 써 넣는다.
   (이 때 보이지 않게 style="display:none" 으로 숨기는건 기본)
   
2. 어느 div 태그를 정하고 onload 이벤트에서 스크립트를 부른다.
   
3. 스크립트가 "그" 태그 안에다가 플래시 플레이어를 부르는 코드를 써 넣는다.
   
4. 노래가 재생되고 모두가 해피.
   

그런데 문제가 생겼습니다. 익스플로러에서는 잘 되는데 파폭에서는 죽어도 안되더란 겁니다. textarea 안에 이상한걸 잔뜩 집어넣었으니 해석을 거부하면서 값이 제대로 안읽어지더란 거죠. 이걸 어떻게 회피하는가 ㄱ- 그게 문제가 되더군요. 한 1시간 반쯤 헤맨 것 같습니다.

그래서 내놓은 해결책.

아놔 해석이 문제라면 문제없는 글자로 바꿔넣으면 될 거 아냐

자바스크립트에는 escape / unescape 내장함수가 있지요. 그 왜 자바스크립트를 이용한 보안 허점 공격 코드에 보면 자주 보이는 그 내장함수를 쓰기로 했습니다 (..)

그리하여 현재 이 블로그 스킨의 맨 끝에는 이런게 생겼습니다요.

<textarea id="flash_mp" style="display:none;">
%3Cobject%20width%3D%27300%27%20height%3D%2720%27%20
.... (문제없도록 escape된 object 태그) ....
%3C/embed%3E%0D%0A%3C/object%3E</textarea>
<textarea id="startMP" style="display:none;">
try {
　rg=/!!/g;url=obj.getAttribute("music");
　obj=document.getElementById("flash_mp");
　tag=unescape(obj.value).replace (rg, url);
　st=obj.style;st.border="none";st.width="300px";st.height="20px";
　obj.innerHTML = tag;
　if (obj.nextSibling.style.display=='none')
　　obj.nextSibling.style.display='block';
} catch (e) {
　alert ("ScriptError: " + e.description);
}
</textarea>

코드 설명:

1. object 태그 블럭을 표준에 맞게 인코딩해서 박아놓는다
   
해석 블럭에서는 태그 블럭을 읽어들여서
1) 문자열 !!를 재생할 음악 주소로 바꾸고
2) 기타 재생기가 보여질 div 태그를 좀 이쁘게 고쳐주고
3) div 태그 안에 object 태그를 갖다 박는
코드를 가지고 있다. (지금은 기능이 조금 더 있음)

2. 클릭하면 음악을 재생하는 버튼은 이렇게 만듭니다.
   
   <div class="MUSICBOX" music="http://...주소!...mp3"
   onclick="obj=this;eval(document.getElementById('startMP').value)">
   들어봅시쟈 </div>
   
   요약하면, 클릭하면 위의 코드를 가져다가 실행해라 ㄱ-
   

아무튼 이렇게 해서 플래시 음악 재생기도 비밀글 어딘가에 숨겨놓고, 음악이야 원래 음악 올라오는 글에 파일 업로드를 해서 붙여놨으니까 ㄱ-.. 이글루스 내에서 모든 것을 다 해결하고도 플래시 mp3 재생기를 사용합니다. 다만 표준에 없는 속성(music)을 사용했으므로 빽빽대겠지만, 원래 상관 안합니다 그런거..

ps. 근데 이거 공개했더니 바로 다음날부터 막히거나 하면 안습인데 이거..