회원 사진 기능 만들기 (리사이징+크롭 기능 추가)

이미 fm25님이 같은 기능을 하는 소스를 올리셨는데, DB와 원본소스를 건드리지 않는 방향으로 해서 리사이징/크롭 기능도 추가해서 올립니다. 그누보드 썸네일 함수를 이용해도 되지만 그냥 만들어 버렸네요.

가로세로 제한 없이 jpg,gif,png 파일만 올리면 알아서 60*60 픽셀로 리사이징하는 소스입니다. 비율이 1:1이 아니라면 유저의 선택에 따라 어느 쪽을 자를지 선택할 수 있습니다. 자르기 싫으면 레터박스로 채울 수도 있습니다.

이 소스는 GD 라이브러리 2.0이 꼭 필요합니다.

1.
그누보드 5가 설치된 폴더에서 data/member 폴더를 찾아서, 거기에 profile_img 폴더를 추가하신 뒤 퍼미션을 707로 주세요. 회원 사진은 유저 아이디를 파일명으로 하여 여기에 저장됩니다.

2.
member 스킨의 register_form.skin.php에 다음 사항을 추가합니다. <form>~</form> 태그 사이에 적당한 곳에 끼워넣으세요. 아래 코드에는 핵심 태그만 기술했으니 자신이 사용하는 스킨에 맞게 가공하셔야 됩니다.
[code]
<input type="file" name="mb_profile_img" id="reg_mb_profile_img">
<?php
$file_check = file_exists(G5_DATA_PATH."/member/profile_img/".$member['mb_id'].".jpg");
if (!$file_check) { ?>
<div class="file-exists">
이미 프로필 이미지가 등록되어 있습니다. 새 이미지를 등록하면 이전 이미지를 덮어씁니다.<br>이전 이미지를 삭제만 하려면 아래 <strong>프로필 이미지 삭제</strong>에 체크하세요.<br>
<label class="image_del"><input type="checkbox" name="mb_profile_img_del" id="mb_profile_img_del" value="1"> 프로필 이미지 삭제</label>
</div>
<?php } ?>
<span class="help-block">프로필 이미지의 비율은 가로세로 1:1이고, 비율이 맞지 않을 경우에는 조정합니다.<br>
아래 메뉴에서 이미지를 어떻게 조정할 지 선택하세요.</span>
<label><input type="radio" name="mb_profile_img_crop" id="reg_mb_profile_img_crop1" value="1" checked>왼쪽이나 위쪽 기준으로 이미지 자름</label>
<label><input type="radio" name="mb_profile_img_crop" id="reg_mb_profile_img_crop2" value="2" checked>오른쪽이나 아래쪽 기준으로 이미지 자름</label>
<label><input type="radio" name="mb_profile_img_crop" id="reg_mb_profile_img_crop3" value="3" checked>중앙 기준으로 이미지 자름</label>
<label><input type="radio" name="mb_profile_img_crop" id="reg_mb_profile_img_crop4" value="4" checked>빈 부분에 레터박스 채워넣음</label>
[/code]

3.
member 스킨의 register_form_update.tail.skin.php에 다음 사항을 추가합니다.
[code]
<?php
//----------------------------------------------------------
// 프로필 이미지 파일 업로드 시작
//----------------------------------------------------------
$mb_profile_img = '';
if (isset($_FILES['mb_profile_img']) && is_uploaded_file($_FILES['mb_profile_img']['tmp_name'])) {
$mb_profile_img_ext = array_pop(explode(".", strtolower($_FILES['mb_profile_img']['name'])));

if(@ereg($mb_profile_img_ext, "gif|jpg|jpeg|png")) {
// 아이콘 용량이 1 MB 이하만 업로드 가능 (용량을 조정하고 싶으면 아래 수치 조정)
if ($_FILES['mb_profile_img']['size'] <= (1 * 1024 * 1024)) {

$dest_path_raw = G5_DATA_PATH."/member/profile_img/".$mb_id."_raw.".$mb_profile_img_ext;
move_uploaded_file($_FILES['mb_profile_img']['tmp_name'], $dest_path_raw);
$dest_path = G5_DATA_PATH."/member/profile_img/".$mb_id.".jpg";

$size = getimagesize($dest_path_raw);
if ($size[2] == 1 || $size[2] == 2 || $size[2] == 3) { // 이미지 파일이 진짜인지 판별
if($size[0] < 60 || $size[1] < 60) { // 이미지 사이즈가 너무 작을 경우
$msg .= '이미지 크기가 너무 작습니다. 가로세로 60픽셀 이상의 이미지를 올려주세요.';
} else {
if(file_exists($dest_path)) { // 이미 파일이 있을 경우(즉 수정일 경우) 먼저 파일을 삭제
@unlink($dest_path);
}

// 이미지 불러와서 판 깔기(...)
if($size[2] == 2) {
$image_call = imagecreatefromjpeg($dest_path_raw);
} elseif($size[2] == 1) {
$image_call = imagecreatefromgif($dest_path_raw);
} elseif($size[2] == 3) {
$image_call = imagecreatefrompng($dest_path_raw);
}

// 업로드된 이미지 시작점 및 크기 설정 (크롭)
// 기본값들
$basic_img_w = 60;
$basic_img_h = 60;
$src_img_x = 0;
$src_img_y = 0;
$src_img_w = $size[0];
$src_img_h = $size[1];
$des_img_x = 0;
$des_img_y = 0;
$des_img_w = $basic_img_w;
$des_img_h = $basic_img_h;
if($size[0] > $size[1]) { // 가로가 길 경우
$src_img_w = $size[1];
switch($mb_profile_img_crop) {
case 1:
break;
case 2:
$src_img_x = $size[0] - $size[1];
break;
case 3:
$src_img_x = (int)(($size[0] - $size[1]) / 2);
break;
case 4:
$src_img_w = $size[0];
$des_img_h = (int)($basic_img_w * ($size[1] / $size[0]));
$des_img_y = (int)(($basic_img_h - $des_img_h) / 2);
break;
}
} elseif($size[0] < $size[1]) { // 세로가 길 경우
$src_img_h = $size[0];
switch($mb_profile_img_crop) {
case 1:
break;
case 2:
$src_img_y = $size[1] - $size[0];
break;
case 3:
$src_img_x = (int)(($size[1] - $size[0]) / 2);
break;
case 4:
$src_img_h = $size[1];
$des_img_w = (int)($basic_img_h * ($size[0] / $size[1]));
$des_img_x = (int)(($basic_img_w - $des_img_w) / 2);
break;
}
}

// 트루컬러 이미지 캔버스 준비
$image_canvas = imagecreatetruecolor($basic_img_w,$basic_img_h);

// 이미지 리사이즈
imagecopyresampled($image_canvas, $image_call, $des_img_x, $des_img_y, $src_img_x, $src_img_y, $des_img_w, $des_img_h, $src_img_w, $src_img_h);

// 이미지 저장
imagejpeg($image_canvas, $dest_path, 80);

// 메모리에서 작업내용 삭제
imagedestroy($image_call);
imagedestroy($image_canvas);

// 원본 이미지 삭제
@unlink($dest_path_raw);
}

} else { // gif,jpg,png 파일이 아니면 올라간 이미지를 삭제한다.
@unlink($dest_path_raw);
}
} else {
$msg .= '프로필 이미지를 1 MB 이하로 업로드 해주십시오.';
}

} else {
$msg .= $_FILES['$mb_profile_img']['name'].'은(는) 이미지 파일이 아닙니다.';
}
}

if($mb_profile_img_del == 1) { // 파일 삭제에 체크가 들어온 경우
$dest_path = G5_DATA_PATH."/member/profile_img/".$mb_id.".jpg";
@unlink($dest_path);
}
//----------------------------------------------------------
// 프로필 이미지 파일 업로드 끝
//----------------------------------------------------------

[/code]


4.
이러면 업로드 과정은 다 끝났습니다. 이미지를 불러올 때는 적절한 위치에,
[code]
<?php
$mb_profile_img_path = G5_DATA_PATH."/member/profile_img/".$member['mb_id'].".jpg";
if(file_exists($mb_profile_img_path)) {
$mb_profile_img_url = G5_DATA_URL."/member/profile_img/".$member['mb_id'].".jpg";
} else { // 프로필 이미지가 없으면 기본 이미지를 보여준다.
$mb_profile_img_url = G5_IMG_URL."no_profile_image.jpg";
}
?>
<img src="<?php echo $mb_profile_img_url ?>">
[/code]
라고 넣어주면 됩니다. 이미지를 등록 안한 사용자들을 위해서는 그누보드 img 폴더 안에 기본으로 보여질 이미지를 no_profile_image.jpg라는 이름으로 넣어주면 됩니다. (안그러면 이미지를 등록 안한 사용자들에게는 엑박 뜹니다)

게시판 글보기 화면이나 댓글에서 보여줄 때는 $member['mb_id'] 부분만 다음과 같이 변경해 주세요.

게시판 글보기 화면 - $view['mb_id']
게시판 댓글 리스트 화면 - $list[$i]['mb_id']