오픈소스 플래시 mp3 플레이어
관련 주소 : http://flash-mp3-player.net
처음에는 flash mp3 player라는 것을 사용하려고 했는데, mp3 파일의 한글 파일명과 한글 태그가 적용되지 않아 포기했습니다. 사실 flash mp3 player의 경우 페이지가 바뀌어도 캐쉬에서 mp3를 호출하는지 재생한 곳부터 다시 시작하는 기능이 있어서 좋은데, 한글 활용에 문제가 있어서 포기했습니다.
관련 주소 : http://www.flashmp3player.org/
1. 설치
설치는 쉽습니다. 다운로드 받은 후에 압축을 풀고, FTP에 업로드하면 됩니다. 그런 후에 플레이어를 호출할 코드를 붙여 넣고자 하는 곳에 넣으면 됩니다.
코드의 종류는 (1) 직접 mp3 파일을 넣는 방법, (2) txt로 된 설정을 사용하는 경우, (3) xml로 된 설정을 사용하는 경우가 있습니다.
저는 (3)번을 사용했습니다. (3)번을 사용하려면 아래와 같은 코드를 플레이어를 붙여 넣고자 하는 곳에 삽입합니다.
<object type="application/x-shockwave-flash" data="player_mp3_multi.swf" width="250" height="150">
<param name="movie" value="player_mp3_multi.swf" />
<param name="wmode" value="transparent" />
<param name="FlashVars" value="configxml=configxml_multi.xml" />
<p>Texte alternatif</p>
</object>
그런데 제가 붙여 넣으려고 하는 곳이 XE로 된 것이고, 레이아웃에서 object 태그를 직접 넣으니 인식을 못하는 것입니다. 제가 못해서 그런 것일 수도 있지만, 어쩐지 않되더군요.
그래서 꼼수를 사용했습니다.
2. 설치 꼼수
일단 mp3player.html 등과 같은 html 파일을 하나 만들어서 그 속에 위의 소스를 붙여 넣고, XE 레이아웃에서는 iframe으로 불러 오는 방식으로 설치를 했습니다.
mp3player.html이라는 파일은 player_mp3_multi.swf 라는 파일과 같은 폴더에 있어야 합니다. 경로가 바뀌면 위의 소스에서 경로 지정을 다시 해 줘야 합니다. 이렇게 하니 IE, 크롬, 파폭에서 정상적으로 보입니다.
3. 노래추가
xml을 사용하는 (3)번으로 했기 때문에 xml 코드를 변경하여 노래를 추가할 수 있습니다. 노래를 추가하는 방법은 configxml_multi.xml이라는 파일을 엽니다.
그럼 뭔가 복잡한 소스들이 있는데요.
그 중에 param name="mp3" value="****"이런 항목이 있습니다. ****표 한 곳에 mp3 파일 이름을 적어주면 됩니다. 001.mp3와 002.mp3 등과 같은 2개의 파일이 있다면 001.mp3|002.mp3 와 같이 적어줍니다. 파일과 파일을 구분하는 구분자가 | 입니다.
음악 파일은 player_mp3_multi.swf 라는 파일과 같은 폴더에 업로드 해 주면 됩니다. 업로드된 파일명과 xml에 입력한 파일명은 당연히 같아야 합니다.
param name="title" value="####" 라는 곳은 제목을 입력하는 곳입니다. 파일명과 같은 순서로 입력해 주면 됩니다. 구분자는 역시 | 입니다.
이렇게 하면 여기에 적힌 파일이름을 플레이어가 인식을 하여 리스트에 뿌리고 선택하면 음악을 들을 수 있습니다.
4. 기타 옵션 설정
xml로 된 설정 파일에 다양한 파라미터(param) 값을 입력해 주면 여러가지 설정으로 활용할 수 있습니다.
플레이어의 가로(width), 세로(height) 크기도 지정할 수 있고, 음악을 랜덤하게 들여주도록 셔플(shuffle)할 수도 있습니다. 소리조정 메뉴의 크기(volumewidth, volumeheight)와 진행바의 길이(sliderwidth) 그리고 버튼의 크기(buttonwidth)까지도 지정할 수 있습니다. 플레이어의 배경, 버튼 등의 색상도 변경할 수 있습니다.
위의 주소에 보면 기본값이 얼마이고, 어떻게 지정한다라고 적혀 있으니, 이것에 맞게 찾아 변경해 주면 됩니다.
<적용 가능한 파라미터 값과 설명>