게시글 보기 이미지 크게 보기 기능 수정

bbs/view_image.php

@@ -0,0 +1,89 @@
+<?php
+include_once('./_common.php');
+
+$g4['title'] = '이미지 크게보기';
+include_once(G4_PATH.'/head.sub.php');
+
+$filename = $_GET['fn'];
+$bo_table = $_GET['bo_table'];
+
+$filepath = G4_DATA_PATH.'/file/'.$bo_table.'/'.$filename;
+
+if(is_file($filepath)) {
+    $size = @getimagesize($filepath);
+    if(empty($size))
+        alert_close('이미지 파일이 아닙니다.');
+
+    $width = $size[0];
+    $height = $size[1];
+
+    $fileurl = G4_DATA_URL.'/file/'.$bo_table.'/'.$filename;
+    $img = '<img src="'.$fileurl.'" width="'.$width.'" height="'.$height.'" class="draggable" />';
+} else {
+    alert_close('파일이 존재하지 않습니다.');
+}
+?>
+
+<style type="text/css">
+.draggable { position: relative; left: 0; top: 0; }
+</style>
+
+<div><?=$img?></div>
+
+<script>
+var win_w = <?=$width?>;
+var win_h = <?=$height?>;
+var win_l = (screen.width - win_w) / 2;
+var win_t = (screen.height - win_h) / 2;
+
+if(win_w > screen.width) {
+    win_l = 0;
+    win_w = screen.width;
+    win_h = parseInt((win_w * screen.height) / screen.width);
+}
+
+if(win_h > screen.height) {
+    win_t = 0;
+    win_h = screen_heigth;
+    win_w = parseInt((win_h * screen.width) / screen.height);
+}
+
+window.moveTo(win_l, win_t);
+window.resizeTo(win_w, win_h);
+
+$(function() {
+    var is_draggable = false;
+    var x = y = 0;
+    var pos_x = pos_y = 0;
+
+    $(".draggable").mousemove(function(e) {
+        if(is_draggable) {
+            x = parseInt($(this).css("left")) - (pos_x - e.pageX);
+            y = parseInt($(this).css("top")) - (pos_y - e.pageY);
+
+            pos_x = e.pageX;
+            pos_y = e.pageY;
+
+            $(this).css({ "left" : x, "top" : y });
+        }
+
+        return false;
+    });
+
+    $(".draggable").mousedown(function(e) {
+        pos_x = e.pageX;
+        pos_y = e.pageY;
+        is_draggable = true;
+        return false;
+    });
+
+    $(".draggable").mouseup(function() {
+        is_draggable = false;
+        return false;
+    });
+});
+</script>
+
+<?php
+include_once(G4_PATH.'/tail.sub.php');
+?>

lib/common.lib.php

@@ -1047,10 +1047,13 @@ function view_file_link($file, $width, $height, $content='')
     else
         $attr = '';
 
-    if (preg_match("/\.({$config['cf_image_extension']})$/i", $file))
-        // 이미지에 속성을 주지 않는 이유는 이미지 클릭시 원본 이미지를 보여주기 위한것임
-        // 게시판설정 이미지보다 크다면 스킨의 자바스크립트에서 이미지를 줄여준다
-        return "<img src='".G4_DATA_URL."/file/{$board['bo_table']}/".urlencode($file)."' onclick='image_window(this);' alt='{$content}'>";
+    if (preg_match("/\.({$config['cf_image_extension']})$/i", $file)) {
+        $img = '<a href="'.G4_BBS_URL.'/view_image.php?bo_table='.$board['bo_table'].'&amp;fn='.urlencode($file).'" target="_blank" class="view_image">';
+        $img .= '<img src="'.G4_DATA_URL.'/file/'.$board['bo_table'].'/'.urlencode($file).'" alt="'.$content.'">';
+        $img .= '</a>';
+
+        return $img;
+    }
 }
 
 

skin/board/basic/view.skin.php

@@ -186,18 +186,25 @@ $(window).load(function() {
     view_image_resize();
 });
 
+$(function() {
+    $("a.view_image").click(function() {
+        window.open(this.href, "large_image", "top=10,left=10,width=10,height=10,resizable=yes,scrollbars=no,status=no");
+        return false;
+    });
+});
+
 function view_image_resize()
 {
-    var $img = $('#bo_v_atc img');
-    var img_wrap = $('#bo_v_atc').width();
+    var $img = $("#bo_v_atc img");
+    var img_wrap = $("#bo_v_atc").width();
 
     $img.each(function() {
         var img_width = $(this).width();
         $(this).data("width", img_width); // 원래 이미지 사이즈
         if (img_width > img_wrap) {
-            $(this).addClass('img_fix');
+            $(this).addClass("img_fix");
         } else if (img_width <= img_wrap && img_width >= $(this).data("width")) {
-            $(this).removeClass('img_fix');
+            $(this).removeClass("img_fix");
         }
     });
 }