JW Player 도우미 2.1 업뎃: PDF/PPT 임베딩 기능 추가!

1. JW Player 도우미

JW Player 도우미 플러그인은 JW Player라는 걸출한 웹 임베디드 미디어플레이어를 간편하게 사용할 수 있게 도와준다.
그런데, 사소한(이라고 쓰고 거대한이라 읽는...) 버그가 하나 있었다. 바로 IE6/7에서 동작하지 않는다는 것이다.
(사실 워낙에 IE 보기를 개처럼 하는지라 아예 테스트해보지도 않았음. Win7+IE8에서 되는 거 보고 걍 패스)

2. PDF 파일의 블로그 임베드

이와는 별도로 그동안 PDF 파일을 블로그에 임베드시키는 방식을 놓고 여러모로 고민을 했었는데, 결국 방향을 정했다.
당연히 Adobe Reader를 설치한 뒤에 이를 브라우저에서 부르는 것이 정석이지만, 이 정석께서는 크롬에서 동작을 안 하신다.

크롬 살려!

원래 이 정석 자체가 약간의 꼼수가 포함된 방식인데다(IE와 FF의 태그 해석 방식이 달라 두 브라우저를 모두 사용할 수 있도록 이상하게 만들어져 있음) 그마저도 HTML 태그에 익숙하지 않은 대부분의 블로거들에게는 결코 쉽지 않은 방식이다.
더군다나 Foxit Reader만 달랑 깔고 사용하는 사용자들에게 Adobe Reader를 깔아달라고 부탁할 수도 없는 노릇이다.
(여전히 Adobe Reader는 느려터졌다. 많이 빨라졌다곤 하지만 그건 지들 생각일 뿐이다)

Scribd에서 PDF 파일을 멋진 뷰어와 함께 게시하는 서비스를 제공하는데, (티스토리 서버가 아닌) 제 3의 서버에 올리는 것이 부담스러워 사용을 꺼리고 있었다.
(인터페이스 및 출력 품질은 이 쪽이 최강임. 사용법은 PDF를 블로그에 삽입할 수 있는 해주는 사이트 참조)

그런데, 구글 도큐먼트 뷰어를 이용하면, 간단하게 임베드시킬 수 있다는 것을 알았다. 얏호!

그래서 이 방식을 이용하는 플러그인을 만들었다.

3. 플러그인 업데이트 및 통합

처음 코딩을 할 때는 두 플러그인이 (당연히) 분리되어 있었다.
그런데, 동작방식이 완전히 동일한 플러그인을 별도로 동작시킬 필요가 없다는 생각이 들었다.
더군다나 서버 쪽이 아니라 클라이언트(자바스크립트) 쪽에서 돌아가는 코드이기 때문에 IE6같은 쓰레기 브라우저에선 미친듯이 버벅댈 가능성이 농후하다.

그래서 아예 둘을 통합시켜버렸다.

이 플러그인을 설치하면 다음과 같은 기능들을 사용할 수 있다.

1. 첨부 비디오(flv) 및 오디오(mp4) 재생 (사용법은 JW Player 도우미 플러그인 1.2 업데이트 참조)
2. 외부 비디오(flv) 및 오디오(mp4) 재생 (사용법은 JW Player 도우미 플러그인 1.5 업데이트 참조)
3. 첨부 PDF 및 PPT 파일 임베드

사용법은 구버전 링크를 참조하면 되며, 설치 방법은 다음과 같다.


a. 관련 파일 업로드

언제나 여기는 동일하다. 아래 파일을 다운받아 압축 풀고, 스킨 직접 올리기를 통해 올리면 된다.

FLVPDFHelper_v2_1.zip

b. 스킨 헤더 수정

스킨 헤더에 아래와 같은 코드를 스킨의 헤더 영역에 삽입하면 된다.
단, 구버전을 사용하는 블로거의 경우 기존 삽입된 코드는 삭제해야 한다.

<script type="text/javascript" src="./images/FLVPDF.js"></script>
<script type="text/javascript">
//<![CDATA[
  FLVPDFHelper.all(
    1,
    1,
    680, 500,
    "./images/player.swf",
    "./images/zockrflv.png",
    27,
    "./images/modieus.swf");
//]]>
</script>

기존의 구성에 비해 추가된 것이 5, 6, 7행이다.

- 5행(1) : PDF/PPT 임베딩 기능 사용여부 지정. 0이면 사용하지 않음. 0이 아니면 사용함
- 6행(1) : 미디어 플레이어 임베딩 기능 사용여부 지정. 0이면 사용하지 않음. 0이 아니면 사용함
- 7행(680, 500) : PDF/PPT 임베딩시 폭과 높이 지정. 지정하지 않으면 각각 600, 500으로 자동지정
- 8행~11행은 각각 JW Player 주소, 인각, 스킨 컨트롤 영역 높이, 스킨파일로 플러그인 1.2의 인자들과 동일

이 중 앞의 두 인자 즉, PDF/PPT 임베딩 여부 및 미플 임베딩 여부는 생략할 수 없으며, 나머지 인자들은 생략시 내부 기본값들로 자동 지정된다.

4. 샘플

아래 보는 것과 같다. 역시 구글 킹왕짱인 것이다!

파워포인트 프리젠테이션 샘플.ppt