웹마스터 팁
다수의 업로드 mp3 파일 jwplayer로 재생하기
2011.05.30 22:56
이것도 팁이 될수 있을까요.
mp3 파일을 다수 업로드 하고 본문삽입 버튼을 누르면 플레이어가 줄줄이 뜨고
멀티미디어 링크로 하면 한곡만 되고.....
사용하기가 좀 번거롭기에
modules\editor\tpl\js\uploader.js 파일을 수정해서
jwplayer로 여러곡이 플레이 되도록 하는 방법임.
function insertUploadedFile(editorSequence) {
var settings =
uploaderSettings[editorSequence];
var
fileListAreaID = settings["fileListAreaID"];
var fileListObj = xGetElementById(fileListAreaID);
if(!fileListObj) return;
if(editorMode[editorSequence]=='preview')
return;
var list = new Array(); 대략 390라인 쯤
var text = new Array();
for(var i=0;i<fileListObj.options.length;i++)
{
if(!fileListObj.options[i].selected)
continue;
var file_srl =
fileListObj.options[i].value;
if(!file_srl)
continue;
var file =
uploadedFiles[file_srl];
editorFocus(editorSequence);
// 바로 링크 가능한 파일의 경우 (이미지, 플래쉬, 동영상 등..)
if(file.direct_download == 'Y') {
// 이미지 파일의 경우 image_link 컴포넌트 열결
if(/\.(jpg|jpeg|png|gif)$/i.test(file.download_url)) {
if(loaded_images[file_srl]) {
var obj =
loaded_images[file_srl];
}
else {
var obj = new Image();
obj.src = file.download_url;
}
temp_code = '';
temp_code += "<img
src="\"+file.download_url+"\" alt=\""+file.source_filename+"\"";
if(obj.complete == true) { temp_code
+= " width=\""+obj.width+"\" height=\""+obj.height+"\""; }
temp_code += " />\r\n";
text.push(temp_code);
// 이미지외의 경우는 multimedia_link 컴포넌트 연결
} else {
if(/\.(mp4|mp3|flv|mov)$/i.test(file.download_url)){
lista = '';
listb = '';
lista = '{file:"' + file.download_url + '", title:"';
listb = file.source_filename + '+
'"},';
list = list + lista + listb;
}else{
text.push("<img src="\"common/tpl/images/blank.gif\"
editor_component=\"multimedia_link\" multimedia_src="\"+file.download_url+"\"
width=\"400\" height=\"320\"
style=\"display:block;width:400px;height:320px;border:2px dotted
#4371B9;background:url(./modules/editor/components/multimedia_link/tpl/multimedia_link_component.gif)
no-repeat center;\" auto_start=\"false\" alt=\"\" />");
}
}
// binary파일의 경우 url_link 컴포넌트 연결
} else {
text.push("<a
href="\"+file.download_url+"\">"+file.source_filename+"</a>\n");
}
}
listc ='<div id="cons">Loading the player...</div>
<script type="text/javascript" src="/jw/jwplayer.js"></script>
<script type="text/javascript">jwplayer("cons").setup({flashplayer: "/jw/ehplayer.swf",config: "/jw/config.xml",playlist:[';
if(list.length>1) text.push (listc + list + '] });</script>');
// html 모드
최신버전 다운로드 http://developer.longtailvideo.com/trac/browser/trunk
빨간색 소스가 추가된 부분입니다.
jwplayer 를 다운로드 후 jwplayer.js , jwplayer.swf, config.xml 파일을 자신의 계정에 업로드.
보라색 부분은 jwplayer 주소 본인에 맞게 변경하세요.
재생 가능한 확장자는 mp4|mp3|flv|mov 등등으로 추가 가능하고 세부 설정은 config.xml 에서 설정 하세요
스킨 플러그인 config.xml 작성법등등 자세한 jwplayer사용법은 위 링크를 참고하세요.
참고로 저는 스크립트를 모릅니다.
전문가 분들이 보기에 문제가 되는 부분이 있다고 알려 주시면 삭제하겠습니다.
댓글 3
-
YO-DA
2011.05.31 09:50
감사합니다^^ -
귀여운유니
2012.03.03 04:45
config.xml 에서 막히네요. 설명 좀 부탁드립니다. -
YO-DA
2012.03.07 17:21
귀~유니 처럼 자세한 설명이 아쉬운 대목^^
제목 | 글쓴이 | 날짜 |
---|---|---|
회원 관리자 두기.. | DaKi | 2011.05.09 |
youtube (유튜브) 동영상 block없이 게시판에 embed 하기 [23] | 쏘프티 | 2011.05.10 |
서버이전후 캐시파일 재생성 안되시는분들 [2] | 우냠냠 | 2011.05.11 |
도와 주세요!!! Explorer 6에서는 제대로 보이는데 Explorer 7 이상에서는 사진이 안보여요 [2] | 이영규616 | 2011.05.12 |
th 엘리먼트에 scope 속성 사용 [1] | 엘카 | 2011.05.14 |
XE 공식 버튼2 삽입하기 [32] | 웹엔진 | 2011.05.14 |
따른사이트와 내채팅방 연동하기~!<미니온4편> [7] | 토끼매니아 | 2011.05.15 |
XE core 1.4.5.7 코드 오류,(상자 위젯 배경 안될때) [2] | 홍성빈닌 | 2011.05.17 |
'왕' '왕초보'를 위한 ZB4-->XE버전으로 이전시 가장 간단한 순서 [1] | 쭈영 | 2011.05.17 |
XE 프로젝트 호스팅 SVN 내용을 Google 프로젝트 호스팅으로 이전하기 | 난다날아 | 2011.05.17 |
모바일레이아웃에서의 통합검색 [11] | 카르마 | 2011.05.19 |
[PHP 기초] 연산자1 | 난다날아 | 2011.05.19 |
XE 첨부파일 문제로 게시판이 백지화 될때... [1] | 똑디 | 2011.05.20 |
드림위버로 FTP 파일 바로 수정하기 : FTP다운로드->수정->FTP업로드 번거러운 수정과정 X [3] | Treasurej | 2011.05.21 |
SSH 지원안하는 웹호스팅에서 빠르게 XE설치하기. [5] | DynamicLaser | 2011.05.22 |
유닉스에서 디스크 용량 체크 후 호출 해주는 프로그램 | 길버트전 | 2011.05.24 |
웹폰트의 개념과 사용법 [2] | hika1 | 2011.05.26 |
로그인풀림방지 - 주소 고정하기 [27] | ezi | 2011.05.28 |
XE를 홈페이지 루트에 설치하여 BGM 설치가 불가능할 때... [6] | Firstlove | 2011.05.29 |
다수의 업로드 mp3 파일 jwplayer로 재생하기 [3] | 공수래 | 2011.05.30 |