=========================================================================
▒ ExoBUD™ MP(II) v4.5 스크립트 사용설명서 ▒
=========================================================================
Version : ExoBUD™ MP(II) v4.5 plus
Compatibility : Internet Explorer(이하 IE) v5.5 이상 (Netscape 비호환)
MicroSoft Windows Media Player(이하 wmp) v 7.1 이상
Windows98 이상 (ME,NT,2000,XP 계열사용가능)
Full Size : 폭(Width) 640 이상 / 높이(height) 25 (자막사용시: 80 이상)
(C)Copyright ExoBUD™ 2001-2005, Design by Jinwoong, Eu.
=========================================================================
▒ ExoBUD™ MP(II) v4.5 사용상의 주의 사항 ▒
=========================================================================
주의1 : wmp7.1/v9 개체로 제작된 관계로 v6.4개체 버전과 로직상의 호환성이 없습니다.
주의2 : Internet Explorer 이외의 다른 웹브라우저에서는 스크립트가 실행되지않습니다.
주의3 : Javascript로 제작된 만큼 플레이어 수정시 대.소 문자 구별에 특히 유의하세요.
※ 본 스크립트의 저작권은 ExoBUD™에 있으며 저작권과 관련된 글을 삭제할 수 없습니다.
※ 본 스크립트를 응용 또는 수정한 2차 저작물에 대하여 저작권을 인정받을 수 없습니다.
※ 본 소스를 저작권자의 동의없이 파일의 일부 또는 전체를 배포할 수 없습니다.
※ 본 소스를 영리목적으로 이용시에는 반드시 저작권자와 협의하시기 바랍니다.
※ 본 소스의 배포는 저작권자의 허가를 받은 사람에게 국한됩니다.
(배포 및 상업적 이용 문의는 이메일 exobud@hanmail.net 로 연락주십시요.)
※ 본 소스는 불건전 사이트 및 불법 사이트, 성인사이트에서 사용할 수 없습니다.
=========================================================================
▒ ExoBUD™ MP(II) v4.5 plus 특징 ▒ (참고사항이 많으므로 끝까지 읽으세요) ▒
=========================================================================
[1] 본 스크립트는 윈도우즈 미디어 플레이어(이하 wmp) OLE 개체를사용한 스크립트로서,
wmp에서 재생이 가능한 모든 미디어 형식에 대하여 연속재생(선택재생)을 할수 있습니다.
(인테넷 상에서 서비스를 할 경우 wma,asf 등의 스트림파일 형식을 사용하세요)
[2] wmp 메타파일(asx,wax,wvx)에 등록된 다수의 미디어요소를 완벽하게 재생할 수 있습니다.
[3] 미디어의 URL등록만으로도 "타이틀 추척기능"에 의한 미디어 정보 출력및 자막출력이 가능합니다.
("타이틀 자동복구기능"은 한번이상 재생을 시도한 미디어에 대하여 Author및 Title이 복원됩니다.)
[4] 캡션(자막)기능을 설정하여 가사출력및 자막을 표시할 수 있습니다. (SMI 파일사용)
(캡션관련 옵션 설정에 따라 캡션 출력 영역을 설정.해지할수 있습니다.)
[5] 플레이리스트에서 재생할 미디어 목록을 체크한 후에 선택된 미디어만 재생할 수 있습니다.
(플레이리스트 구성 : 선택을 위한 '체크박스' 및 '링크', 페이지분할,전체선택및해제, 선곡재생)
※ 재생도중 플레이리스트에서 선택 변경이 발생하면 동적으로 재생로직에 반영되어 자동재생됩니다.
※ 플레이리스트에서 링크를 클릭하여 재생한 경우 해당 미디어 재생후 대기모드로 전환합니다
[6] 완벽한 Random mode 재생 및 Sequential mode 재생을 동적으로 지원합니다.
(방문자가 언제든지 [S]또는 [R]버튼을 눌러서 모드를 변경할 수 있습니다)
[7] 재생 진행 시간(Elapse, Lapse 형식)을 동적으로 표시할 수 있도록 지원합니다.
(방문자가 재생시간 표시부를 눌러서 Elapse, Lapse 형식을 동적으로 전환할 수 있습니다)
(인테넷 익스플로러(이하 IE) 상태바에 재생중인 미디어의 타이틀및 재생 진행 시간 표시도 가능합니다)
※ 시간출력은 (시:분:초)형식이며 1시간 미만인 경우 (분:초)형식으로 출력됩니다
※ 시간출력 부분은 플레이어 상태가 변경될 때마다 팁(Tip)을 표시하는 기능도 포함되어 있습니다.
[8] 재생관련 오류 처리기및 오류 표시기능이 포함되어 있습니다.
(재생오류가 발생하면 3회의 재접속을 시도하며, 접속 실패시 다음 미디어의 재생을 시도합니다)
[9] 관리자를 위하여 등록한 미디어 파일에 대한 실제 정보를 획득할 수 있는 Alert 기능을 지원합니다.
(Alert 기능은 음악 등록후 정상적으로 해당 미디어에 접근할 수 있는지 확인하는데도 유용합니다)
[10] 볼륨조절이 가능하며 볼륨량을 표시할 수 있습니다 (Mute, Volume Up, Volume Down)
(Mute[M] 버튼은 토클버튼입니다. 따라서 Mute 상태의 해지는 [M] 버튼을 누르거나,
Volume Up, Volume Down 을 누르면 Mute 상태는 해지됩니다. )
[11] 재생에 꼭 필요한 Optimized Logics 를 제공합니다.
※ 등록한 트랙 전체를 1회만 재생하거나, 또는 연속 재생을 하도록 설정할 수 있습니다.
※ 재생이 진행중인 경우 재생버튼을 눌러도 처음부터 재생되지 않도록 키락이 설정되어 있습니다.
※ [L]버튼은 Repeat 기능을 갖는 토글키이며 랜덤모드에서도 현재 재생중인 곡을 다시 재생합니다.
※ [Ⅱ] 버튼은 Pause 및 Play 가 가능한 토글버튼입니다.
※ 플레이어 상태 변화에 따른 메시지 팁을 출력합니다.
[12] 재생가능한 미디어 파일은 wmp에서 지원하는 모든 미디어 형식 및 메타파일(asx,wax,wvx)입니다.
(인터넷상에서 미디어 서비스를 할 경우 반드시 스트림파일형식(asf,wma 등)을 사용하세요)
[13] 뮤직비디오 (wmv와 같은 VOD) 플레이어로도 사용이 가능합니다.
VOD로 사용할 경우 WMP 개체 파라미터및 그 개체에 적용된 스타일의 width,height를 변경하세요
(exobud.js 파일에서 뮤직비디오 사용을 위한 변수 설정 부분이 있으므로 참고하시기 바랍니다)
======================================================================
▒ ExoBUD™ MP(II) v4.5 plus 를 홈페이지에 넣는 첫걸음 ▒
======================================================================
(1단계 : 압축풀기)
배포되는 플레이어 파일은 모두 zip 파일로 압축된 것입니다.
(alz 파일 형태로 받으신 분은 반드시 알집(ALZip)으로 풀으셔야 합니다.)
exe 파일로 받으신 분은 실행후 압축을 풀 드라이브 위치만 지정하시면 됩니다.
압축을 푼 폴더는 *.html,*.js 파일 및 img 폴더(이미지파일)들로 구성되어 있습니다
(2단계 : 미디어 준비)
인터넷에 음악이나 비디오를 서비스 하기 위해서는 스트림형식(asf,wma 등)의 미디어를 준비해야 합니다
※ wmtools 4.x 를 이용하여 비스트림파일(예:avi,mp3,wav등)을 asf 형식으로 바꾸거나,
※ 윈도우즈 미디어 인코더 v7.x 이상으로 wma 등의 스트림 파일 형식으로 바꾸세요
(http://exobud.freeto.net 로 오면 간단히 asf형식으로 변환하는 방법이 기술되어 있습니다)
asf,wma등으로 인코딩된 미디어를 사용자 웹사이트에 업로드하기 바랍니다.
(주의: 미디어의 이름은 영문소문자,숫자로만 구성되도록 하세요(공백,특수문자 사용금지))
일부 웹서버의 경우 스트림 파일을 지원하지 못하는 경우가 있으므로, 이 경우 다른 웹서버를 선택하세요
(mms서버가 아니면 일반 HTTP 프로토콜을 사용하는 웹서버에서는 완벽한 스트리밍 처리는 못합니다)
======================================================================
▒ 옵션(Option) 설정 및 재생 미디어 등록 ▒
======================================================================
(주의) 옵션설정 및 미디어 등록을 위한 사용자 편집 작업은 "메모장" 에서 이루어 집니다.
다수의 스크립트로 구성된 관계로 특정 웹에디터로 편집하는 경우 오류가 발생할 수 있습니다.
어렵지않은 작업이므로 반드시 아래 절차에 따라 수정하시기 바랍니다.
(1단계 : 플레이어 확인 >> exobud.html )
exobud.html 을 인터넷 익스플로러(이하 IE)로 불러오기(open)를 합니다.
※ 재생 버튼을 눌러 샘플 미디어가 재생이 되는지 확인 합니다.
(아래 옵션 설정 부분의 var blnUseSmi=true 로 설정하면 자막을 볼 수 있습니다)
재생이 되지 않는다면 샘플로 등록된 음악의 경로가 바뀌었거나 없는 경우입니다. (^^;)
※ IE 버전및 윈도우즈 미디어 플레이어(이하 wmp) 버전이 낮은 경우 작동하지 않습니다.
(IE 5.5 이상 / wmp 7.1 이상이 요구되며, Netscape에서는 작동하지 않습니다)
※ IE 설정 언어가 한국어가 아닌 경우 비정상적으로 보일수 있습니다.
(IE 메뉴의 [보기]>[인코딩]에서 자동선택및 한국어로 바꾸세요)
(2단계 : 플레이어 옵션설정 >> config.js)
config.js 파일을 메모장(Notepad)으로 연후에 플레이어 환경을 아래 주석에 따라 설정하세요
Javascript 는 대.소문자를 엄격히 구분하므로 환경 설정시 유의하여 작성하세요
// 플레이어가 로드된 후에 바로 재생을 시작할 것인지 결정하세요: 자동재생(true) | 대기모드(false)
// 기본값은 false이지만 웹상에서는 일반적으로 true로 설정하여 자동재생을 하는 경우가 많습니다.
// 자동재생은 트래픽 측면과 사용자 동의없는 캐스팅이라는 점에서 false 로 설정할 것을 권합니다.
var blnAutoStart = false;
// 재생을 목록순으로 할 것인지, 무작위로 할 것인지 결정하세요: 순차재생(false) | 랜덤재생(true)
// 초기의 기본 설정일뿐, 사용자가 언제든 재생 모드를 플레이어상의 버튼으로 변경할 수 있습니다.
var blnRndPlay = false;
// 최초에 등록된 미디어(1번트랙)를 절대트랙(Supreme Track)으로 지정할 것인지 결정하세요
// 무작위 재생(Random mode)에서도 절대트랙을 최우선으로 재생되도록하려면 true로 설정하세요
var blnAbs1stTrack = false;
// 웹브라우저의 상태바에 타이틀명을 출력할 것인지 결정하세요 : StatusBar출력(true) : 출력안함(false)
// IE의 상태바에 어떠한 정보도 표시하지 않으려면 false로 설정하세요
var blnStatusBar = true;
// 볼륨 컨트롤러를 보여줄 것인지 결정하세요 : 볼륨조절기(true) | 볼륨조절생략(false)
var blnShowVolCtrl = true;
// 플레이리스트 버튼을 감출것인지 결정하세요 : 플레이리스트 버튼(true) | 버튼감춤(false)
// false 설정하면 플레이리스트에서 사용자가 미디어 선택을 할 수 없게 되므로 유의하세요.
var blnShowPlist = true;
// 자막(SMI 캡션파일)을 사용할 것인지 결정하세요 : 자막사용(true) | 자막없음(false)
// true로 설정하면 자막영역이 표시되며, 샘플미디어의 자막도 확인이 가능합니다.
var blnUseSmi = false;
// 전체 트랙을 재생할 회수를 결정하세요 : 전체 트랙 반복 재생(true) | 한번만 재생(false)
// 배경음악 플레이어로 사용할 경우 true로 설정하는 것이 좋을 듯 합니다.
var blnLoopTrk = false;
// 재생중인 미디어 자체가 갖는 실제 정보를 얻고자 한다면 아래 값을 true 로 설정하세요
// Alert형식으로 정보가 제공되며, 음악등록에 오류가 있는 경우 정보 출력은 되지 않습니다.
// 음악등록이 정상적인지 확인하기 위한 관리팁이므로 실제 웹사이트에 업로드할땐 false로 설정하세요
var blnShowMmInfo =true;
(3단계 : 미디어 등록 하기 >> addlist.js)
addlist.js 파일을 메모장(Notepad)으로 연후에 아래 형식으로 미디어를 등록하세요
addlist.js 파일에 등록 예제형식이 있으므로 참고하면 미디어 등록시 도움이 될 것입니다.
미디어 등록형식은 아래와 같습니다. 초보자는 일반음악등록 형식을 취하면 편리합니다.
(주의) Javascrpt 는 대.소문자구별 및 오류에 민감하므로 주의해서 작성하세요
(주의) Javascript 에서 특수한 의미를 갖는 특수문자 (, " , ' )등은 사용하지마세요.
----------------------------------------------------------------------------------
음악 등록 전체 형식 : mkList("미디어URL","타이틀명","자막파일명", "선택제외플래그(f)");
※ 일반 음악 등록 형식 : mkList("미디어URL","타이틀명");
등록 후 선택은 제외 : mkList("미디어URL","타이틀명","", "f");
자동 제목 추적 형식 : mkList("미디어URL");
----------------------------------------------------------------------------------
eg) mkList("http://myhome/asf/cool.asf","Cool-Ooops");
주의(1) : 자막파일은 해당 미디어(xyz.wma)와 '같은 폴더'에 '동일한 이름(xyz.smi)'으로 존재하도록 하세요.
주의(1)처럼 하면 자막경로를 등록하지 않아도 자동으로 자막이 인식되어 추가됩니다.
주의(2) : 자막파일명을 등록해야 할 경우 해당미디어의 URL을 기준으로하므로 자막파일명만 기입하면 됩니다.
주의(3) : 사용자 PC에 존재하는 미디어의 기본 경로는 "file:///드라이브:경로미디어.asf" 입니다.
로컬경로 구분자는 입니다. ex) mkList("file:///c:musicpoppop1.asf"."팝송1");
주의(4) : 자동 제목 추적형식을 취하는 경우, 플레이리스트에는 정보추적문구가 표시됩니다.
(재생이 시도된 이후에는 자동으로 타이틀이 복원되며, 저장되어 정보를 잃지 않습니다.)
주의(5) : 미디어 경로입력시 " "사이에 (특히 앞.뒤에)공백을 넣으면 경로가 바르게 인식되지 않습니다.
[필수] 대다수 사용도중 발생하는 스크립트의 오류는 미디어 등록과정에서의 사용자 실수입니다.
한곡한곡 등록과 테스트를 겸하면 한꺼번에 등록한 후에 오류를 찾는 것보다 용이합니다.
미디어 등록이 완료된 후에는 반드시 "저장"을 한후에 플레이어를 다시 IE에서 불러오세요.
정상적으로 미디어가 등록되었는지, 오류는 없는지 등을 반드시 확인하시기 바랍니다.
======================================================================
▒ 홈페이지에 플레이어 넣기 ▒
======================================================================
옵션설정및 재생할 미디어 등록이 완료되었다면 웹사이트에 플레이어 파일 전체를 업로드해야 합니다.
(플레이어에 포함된 sample 폴더를 제외한 모든 html,js 파일및 img 폴더를 업로드하세요)
FRAME 테그를 이용하여 위에 업로드된 exobud.html 을 원하는 html의 프레임에 넣으면 됩니다.
(플레이어 사이즈가 폭(width)이 대략 640, 높이(height)가 25(자막사용시 80)정도 입니다)
(프레임 영역의 크기는 플레이어가 다 볼일 수 있도록 적절히 조절하세요)
FRAME및 IFRAME의 사용법은 HTML 테그이므로 관련 서적이나 인터넷을 참고하세요
IFRAME을 사용할 경우 아래 부분을 참고하세요(홈페이지 제작 초보자는 IFRAME 사용에 유의)
<iframe name="exobudmp"
SRC="업로드한 exobud.html의 URL"
height="25" width="640"
leftmargin="0" topmargin="0" marginheight="0" marginwidth="0"
frameborder="0"
scrolling="no" ></iframe>
IFRAME 테그는 일종의 레이어(Layer) 처럼 어떤 html 에서든 쉽게 사용될 수 있지만,
방문자 네비게이션에 의한 플레이어의 실종이 발생하지 않도록 유의하셔야 합니다.
가능한 기본페이지(보통 index.html)에 FRAME을 구성하여 플레이어를 고정적으로 배치하세요.
======================================================================
▒ 고급사용자 : 플레이어 배경색 및 이미지 관련 ▒
======================================================================
각 html 의 스타일정의는 해당 파일명의 스타일시트 파일에 정의되어 있습니다.
※ exobud.css 는 exobud.html (플레이어)의 스타일시트 정의 파일입니다.
※ exobudpl.css 는 exobudpl.html (플레이리스트)의 스타일시트 정의 파일입니다.
(a) 플레이어 색상 바꾸기 (exobud.css)
BODY { margin: 0px 0px 0px 0px; background:white; cursor:crosshair;}
.title{ FONT-FAMILY: 돋움,굴림; FONT-SIZE: 11px; color:#222222; }
.time{ FONT-FAMILY: 돋움,굴림; FONT-SIZE: 11px; color:#505050; }
.title 는 타이틀 출력부에 표시될 글꼴및 색상 크기를 지정합니다. (글꼴크기 최대 12px 까지가능)
.time 는 재생진행시간 출력버튼에 사용되는 글꼴및 색상 크기를 지정합니다. (글꼴크기 최대 12px 까지가능)
exobud.html의 전체배경색및 이미지는 BODY 부분에 정의하면 됩니다.
(b) 자막 영역 세부설정 (caption.js)
캡션을 사용하지 않더라도 exobud.html에 아래코드를 제거하면 안됩니다.
<script Language="JavaScript" src="caption.js"></script>
캡션을 사용하지 않을 경우 옵션설정(config.js)에서 var blnUseSmi = false;로 설정하세요.
자막의 위치를 바꾸고자 한다면 exobud.html에서 아래 코드부분을 원하는 위치에 옮기면됩니다.
<script Language="JavaScript" src="caption.js"></script>
자막영역에 관한 스타일및 기타 설정은 caption.js 파일을 수정하면 됩니다.
아래 코드는 captipn.js 파일의 일부 내용입니다.
width및 height 값을 적절히 바꾸어서 사용하면 원하는 사이즈로 자막영역을 설정할 수 있습니다.
smi 파일의 텍스트는 주로 "흰색"을 사용하므로 자막영역의 배경색은 진회색계열의 #555555 입니다.
smi 파일의 텍스트를 검정계열로 할경우 background-color 를 밝은색으로 바꾸어 주세요.
font-size는 smi 파일의 캡션과 무관하므로 수정할 필요가 없습니다.
캡션에 출력되는 자막의 글꼴 색상및 크기 등등은 smi 파일에서 정의해 주어야합니다.
(c) 플레이리스트에서 배경변경 (exobudpl.css)
스타일 정의부분에서 body 부분을 정의한 곳을 보시기 바랍니다.
BODY { scrollbar-face-color: #eaeaff; scrollbar-shadow-color: #44a0f0;
scrollbar-highlight-color: #666666; scrollbar-3dlight-color: #44a0f0;
scrollbar-darkshadow-color:#44a0f0; scrollbar-track-color:#55b0ff;
scrollbar-arrow-color: #666666; font-size:12px;
background:url(lhouse_l.jpg) white no-repeat fixed right 94%;}
scrollbar 란 접두어가 붙는 것은 스크롤바에대한 색상정의 부분입니다.
페이지 나눔기능이 있으므로 사실상 스크롤바에 대한 정의는 굳이 필요치 않습니다.
플레이리스트의 배경과련부분은 위의 background 부분을 변경하면 돱니다.
( background:url(배경이미지URL) 배경색 배경이미지위치 및 기타 옵션; )
이 부분에 대한 자세한 설정은 스타일시트 서적을 참고하세요
(d) 플레이리스트에서 각 음악 리스트의 색상 (exobudpl.css)
스타일 정의부분에서 아래의 anchor 정의 부분을 보시기 바랍니다.
A:visited { color: #444444; text-decoration: none }
A:active { color: #444444; text-decoration: none }
A:hover {color:darkblue; text-decoration: none ; cursor:w-resize;}
A:link { color: #444444; text-decoration: none }
각 음악의 색상은 일반적인 링크색상 변경과 같습니다.
A:visited :는 한번이상 클릭한 적이있는 경우의 색깔...
A:active : 현재 활성화된 링크색깔...
A:hover : 마우스가 해당 목록에 놓여질때의 색상
A:link : 원래 링크색깔...
color 값을 원하는 색상으로 바꿀수 있습니다.
(f) 플레이리스트에서 트랙번호 색상 (exobudpl.css)
스타일 정의부분에서 아래의 TD 정의 부분을 보시기 바랍니다.
TD {font-family:굴림;font-size:12px; color:silver;}
플레이어에서 바꾸듯이 이곳을 바꾸어 주면
플레이리스트의 트랙번호 글자색 크기 글꼴을 바꿀수 있습니다.
======================================================================
▒ 기타 참고 사항 ▒
======================================================================
ExoBUD 홈페이지에 오시면 최신 업데이트된 소스를 받으실수 있습니다.
문제점이 있거나 궁금한 점이 있다면 아래 URL로 찾아오시면 감사하겠습니다.
홈페이지 : http://my.netian.com/~exobud 또는 http://exobud.freeto.net
e-mail : exobud@hanmail.net
icq : 96138429 (authorization mode 이므로 사유를 밝혀주셔야 Add 됩니다.)