포토스피어(photosphere) 뷰어를 함수 형태로

http://photo-sphere-viewer.js.org 에서 제공하는 Photo Sphere Viewer master를 그누보드에 적용하여 extend 폴더에 넣어 함수로 사용할 수 있도록 만듦.

사용법 :
1. 첨부파일을 그누보드 루트에 풀어 넣는다.
2. 어디든 필요한 곳에서 photosphere();로 사용하는데,
3. photosphere();를 그냥 사용하지 말고 아래와 같이 내용을 아래와 같이 배열로 작성한 다음 photosphere($배열변수명); 으로 사용

[code]
<!-- =========== photosphere { ============

<?php

$ps['image'] = G5_IMG_URL."/photosphere/demo2.jpg"; // 이미지 파일 URL 또는 경로
$ps['id'] = "photosphere"; // 포토스피어 div id
$ps['width'] = 728; // 넓이
$ps['height'] = 546; // 높이
$ps['caption'] = ""; // 하단 툴바 캡션
$ps['download'] = true; // true = 이미지 다운로드 버튼 보임
$ps['fov'] = 70; // default field of view 30~90
$ps['mousewheel'] = true; // 마우스 휠로 줌인/아웃
$ps['time_anim'] = 2000; // 에니메이션 시작 시간 ms 또는 false

photosphere($ps);

?>

============= photosphere ============-->
[/code]


4. 게시판에 적용시킨 예 : http://sir.kr/g5_skin/11608


photosphere.php

[code]
<?php
/*
by 변태스타킹
사용법
$ps['image'] = G5_IMG_URL."/photosphere/demo2.jpg"; // 이미지 파일 URL 또는 경로
$ps['id'] = "photosphere"; // 포토스피어 div id
$ps['width'] = 728; // 높이
$ps['height'] = 546; // 넓이
$ps['caption'] = ""; // 하단 툴바 캡션
$ps['download'] = true; // true = 이미지 다운로드 버튼 보임
$ps['fov'] = 70; // default field of view 30~90
$ps['mousewheel'] = true; // 마우스 휠로 줌인/아웃
$ps['time_anim'] = 2000; // 에니메이션 시작 시간 ms 또는 false

기타 옵션 설정 방법 : http://photo-sphere-viewer.js.org/#options 참고
*/
function photosphere($ps=array()){

if(!isset($ps['image']) || empty($ps['image'])) $ps['image'] = G5_IMG_URL."/photosphere/demo.jpg";
if(!isset($ps['id']) || empty($ps['id'])) $ps['id'] = "ps".rand(0,1000);
if(!isset($ps['width']) || empty($ps['width'])) $ps['width'] = 728;
if(!isset($ps['height']) || empty($ps['height'])) $ps['height'] = 546;
if(!isset($ps['caption'])) $ps['caption'] = "<strong>DEMO</strong> by 변태스타킹";
if(!isset($ps['download'])) $ps['download'] = true;
if($ps['download'] === "false") $ps['download'] = false;
if(!isset($ps['fov']) || empty($ps['fov'])) $ps['fov'] = 70;
if(!isset($ps['mousewheel'])) $ps['mousewheel'] = true;
if(!isset($ps['time_anim'])) $ps['time_anim'] = 2000;

echo ''.PHP_EOL;

echo '<div id="'.$ps['id'].'"></div>'.PHP_EOL;

add_stylesheet('<link rel="stylesheet" href="'.G5_CSS_URL.'/photosphere/photo-sphere-viewer.min.css">', 1);
add_javascript('<script src="'.G5_JS_URL.'/photosphere/three.min.js"></script>', $order=1);
add_javascript('<script src="'.G5_JS_URL.'/photosphere/D.min.js"></script>', $order=1);
add_javascript('<script src="'.G5_JS_URL.'/photosphere/doT.min.js"></script>', $order=1);
add_javascript('<script src="'.G5_JS_URL.'/photosphere/uevent.min.js"></script>', $order=1);
add_javascript('<script src="'.G5_JS_URL.'/photosphere/CanvasRenderer.js"></script>', $order=1);
add_javascript('<script src="'.G5_JS_URL.'/photosphere/Projector.js"></script>', $order=1);
add_javascript('<script src="'.G5_JS_URL.'/photosphere/photo-sphere-viewer.min.js"></script>', $order=1);

echo "<script>".PHP_EOL;
echo " var PSV = new PhotoSphereViewer({".PHP_EOL;
echo " panorama: '".$ps['image']."',".PHP_EOL;
echo " container: '".$ps['id']."',".PHP_EOL;
echo " caption: '".$ps['caption']."',".PHP_EOL;
echo " loading_img: '".G5_IMG_URL."/photosphere/photosphere-logo.gif',".PHP_EOL;
echo " navbar: 'autorotate zoom".($ps['download']? " download" : "")." caption fullscreen',".PHP_EOL;
echo " default_fov: ".$ps['fov'].",".PHP_EOL;
echo " mousewheel: ".($ps['mousewheel']? $ps['mousewheel'] : "false").",".PHP_EOL;
echo " time_anim: ".($ps['time_anim'] !== false? $ps['time_anim'] : "false").",".PHP_EOL;
echo " size: {".PHP_EOL;
echo " width: ".$ps['width'].",".PHP_EOL;
echo " height: ".$ps['height'].PHP_EOL;
echo " }".PHP_EOL;
echo " });".PHP_EOL;
echo "</script>".PHP_EOL;

}

?>
[/code]