firstgarden/firstgarden-web-gnu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

모바일 갤러리 리스트 정렬 스크립트 추가 및 view 이미지 리사이즈 스크립트 변경

Browse Source
This commit is contained in:
chicpro
2013-10-02 11:24:27 +09:00
parent 8969f499be
commit a6051aa758
12 changed files with 136 additions and 174 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
adm/board_copy_update.php
View File

@ -84,7 +84,6 @@ $sql = " insert into {$g5['board_table']}
bo_gallery_cols = '{$board[bo_gallery_cols]}',
bo_gallery_width = '{$board[bo_gallery_width]}',
bo_gallery_height = '{$board[bo_gallery_height]}',
bo_mobile_gallery_cols = '{$board[bo_mobile_gallery_cols]}',
bo_mobile_gallery_width = '{$board[bo_mobile_gallery_width]}',
bo_mobile_gallery_height = '{$board[bo_mobile_gallery_height]}',
bo_upload_size = '{$board[bo_upload_size]}',

16
adm/board_form.php
View File

@ -30,7 +30,7 @@ if (!isset($board['bo_mobile_skin'])) {
}
if (!isset($board['bo_gallery_width'])) {
sql_query(" ALTER TABLE `{$g5['board_table']}` ADD `bo_gallery_width` INT NOT NULL AFTER `bo_gallery_cols`, ADD `bo_gallery_height` INT NOT NULL DEFAULT '0' AFTER `bo_gallery_width`, ADD `bo_mobile_gallery_cols` INT NOT NULL DEFAULT '0' AFTER `bo_gallery_height`, ADD `bo_mobile_gallery_width` INT NOT NULL DEFAULT '0' AFTER `bo_mobile_gallery_cols`, ADD `bo_mobile_gallery_height` INT NOT NULL DEFAULT '0' AFTER `bo_mobile_gallery_width` ", false);
sql_query(" ALTER TABLE `{$g5['board_table']}` ADD `bo_gallery_width` INT NOT NULL AFTER `bo_gallery_cols`, ADD `bo_gallery_height` INT NOT NULL DEFAULT '0' AFTER `bo_gallery_width`, ADD `bo_mobile_gallery_width` INT NOT NULL DEFAULT '0' AFTER `bo_gallery_height`, ADD `bo_mobile_gallery_height` INT NOT NULL DEFAULT '0' AFTER `bo_mobile_gallery_width` ", false);
}
if (!isset($board['bo_mobile_subject_len'])) {
@ -101,7 +101,6 @@ if ($w == '') {
$board['bo_gallery_cols'] = 4;
$board['bo_gallery_width'] = 174;
$board['bo_gallery_height'] = 124;
$board['bo_mobile_gallery_cols'] = 3;
$board['bo_mobile_gallery_width'] = 125;
$board['bo_mobile_gallery_height'] = 100;
$board['bo_table_width'] = 100;
@ -988,19 +987,6 @@ $pg_anchor = '<ul class="anchor">
<label for="chk_all_gallery_height">전체적용</label>
</td>
</tr>
<tr>
<th scope="row"><label for="bo_mobile_gallery_cols">모바일<br>갤러리 이미지 수<strong class="sound_only">필수</strong></label></th>
<td>
<?php echo help('모바일로 접속시 갤러리 형식의 게시판 목록에서 이미지를 한줄에 몇장씩 보여 줄 것인지를 설정하는 값') ?>
<input type="text" name="bo_mobile_gallery_cols" value="<?php echo $board['bo_mobile_gallery_cols'] ?>" id="bo_mobile_gallery_cols" required class="required numeric frm_input" size="4">
</td>
<td class="group_setting">
<input type="checkbox" name="mobile_chk_grp_gallery_cols" id="mobile_chk_grp_gallery_cols" value="1">
<label for="mobile_chk_grp_gallery_cols">그룹적용</label>
<input type="checkbox" name="mobile_chk_all_gallery_cols" id="mobile_chk_all_gallery_cols" value="1">
<label for="mobile_chk_all_gallery_cols">전체적용</label>
</td>
</tr>
<tr>
<th scope="row"><label for="bo_mobile_gallery_width">모바일<br>갤러리 이미지 폭<strong class="sound_only">필수</strong></label></th>
<td>

3
adm/board_form_update.php
View File

@ -100,7 +100,6 @@ $sql_common = " gr_id = '{$_POST['gr_id']}',
bo_gallery_cols = '{$_POST['bo_gallery_cols']}',
bo_gallery_width = '{$_POST['bo_gallery_width']}',
bo_gallery_height = '{$_POST['bo_gallery_height']}',
bo_mobile_gallery_cols = '{$_POST['bo_mobile_gallery_cols']}',
bo_mobile_gallery_width = '{$_POST['bo_mobile_gallery_width']}',
bo_mobile_gallery_height= '{$_POST['bo_mobile_gallery_height']}',
bo_upload_count = '{$_POST['bo_upload_count']}',
@ -264,7 +263,6 @@ if (is_checked('chk_grp_mobile_skin')) $grp_fields .= " , bo_mobile_ski
if (is_checked('chk_grp_gallery_cols')) $grp_fields .= " , bo_gallery_cols = '{$bo_gallery_cols}' ";
if (is_checked('chk_grp_gallery_width')) $grp_fields .= " , bo_gallery_width = '{$bo_gallery_width}' ";
if (is_checked('chk_grp_gallery_height')) $grp_fields .= " , bo_gallery_height = '{$bo_gallery_height}' ";
if (is_checked('chk_grp_mobile_gallery_cols')) $grp_fields .= " , bo_mobile_gallery_cols = '{$bo_mobile_gallery_cols}' ";
if (is_checked('chk_grp_mobile_gallery_width')) $grp_fields .= " , bo_mobile_gallery_width = '{$bo_mobile_gallery_width}' ";
if (is_checked('chk_grp_mobile_gallery_height'))$grp_fields .= " , bo_mobile_gallery_height = '{$bo_mobile_gallery_height}' ";
if (is_checked('chk_grp_table_width')) $grp_fields .= " , bo_table_width = '{$bo_table_width}' ";
@ -349,7 +347,6 @@ if (is_checked('chk_all_mobile_skin')) $all_fields .= " , bo_mobile_ski
if (is_checked('chk_all_gallery_cols')) $all_fields .= " , bo_gallery_cols = '{$bo_gallery_cols}' ";
if (is_checked('chk_all_gallery_width')) $all_fields .= " , bo_gallery_width = '{$bo_gallery_width}' ";
if (is_checked('chk_all_gallery_height')) $all_fields .= " , bo_gallery_height = '{$bo_gallery_height}' ";
if (is_checked('chk_all_mobile_gallery_cols')) $all_fields .= " , bo_mobile_gallery_cols = '{$bo_mobile_gallery_cols}' ";
if (is_checked('chk_all_mobile_gallery_width')) $all_fields .= " , bo_mobile_gallery_width = '{$bo_mobile_gallery_width}' ";
if (is_checked('chk_all_mobile_gallery_height'))$all_fields .= " , bo_mobile_gallery_height = '{$bo_mobile_gallery_height}' ";
if (is_checked('chk_all_table_width')) $all_fields .= " , bo_table_width = '{$bo_table_width}' ";

1
install/gnuboard5.sql
View File

@ -81,7 +81,6 @@ CREATE TABLE IF NOT EXISTS `g5_board` (
`bo_gallery_cols` int(11) NOT NULL DEFAULT '0',
`bo_gallery_width` int(11) NOT NULL DEFAULT '0',
`bo_gallery_height` int(11) NOT NULL DEFAULT '0',
`bo_mobile_gallery_cols` int(11) NOT NULL DEFAULT '0',
`bo_mobile_gallery_width` int(11) NOT NULL DEFAULT '0',
`bo_mobile_gallery_height` int(11) NOT NULL DEFAULT '0',
`bo_upload_size` int(11) NOT NULL DEFAULT '0',

62
js/jquery.fancylist.js Normal file
View File

@ -0,0 +1,62 @@
(function($) {
$.fn.fancyList = function(element, clear)
{
var cfg = {
element: "li",
clear: "clear"
};
if(typeof element == "object")
cfg = $.extend( cfg, element );
else {
if(element)
cfg = $.extend( cfg, { element: element } );
if(clear)
cfg = $.extend( cfg, { clear: clear } );
}
var $element = this.find(cfg.element);
var $this = this;
function item_arrange()
{
var $el = $element.filter(":first");
var padding = 0;
if($el.data("padding-right") == undefined) {
padding = parseInt($el.css("padding-right"));
$el.data("padding-right", padding);
}
else
padding = $el.data("padding-right");
$element.css("padding-left", 0).css("padding-right", padding);
$element.filter("."+cfg.clear).removeClass(cfg.clear);
var wrap_width = parseInt($this.width());
var item_width = parseInt($el.outerWidth());
var line_count = parseInt((wrap_width + padding) / item_width);
if(line_count == 0)
return;
var space = parseInt(wrap_width % item_width);
if((space + padding) < item_width) {
space = wrap_width - ((item_width - padding) * line_count);
var new_padding = parseInt(space / (line_count * 2));
if(new_padding > padding)
$element.css("padding-left", new_padding+"px").css("padding-right", new_padding);
}
$element.filter(":nth-child("+line_count+"n)").css("padding-right", 0);
$element.filter(":nth-child("+line_count+"n+1)").addClass(cfg.clear);
}
item_arrange();
$(window).resize(function() {
item_arrange();
});
}
}(jQuery));

43
js/viewimageresize.js Normal file
View File

@ -0,0 +1,43 @@
(function($) {
$.fn.viewimageresize = function(selector)
{
var cfg = {
selector: "img"
};
if(typeof selector == "object") {
cfg = $.extend(cfg, selector);
} else {
if(selector) {
cfg = $.extend({ selector: selector });
}
}
var $img = this.find(cfg.selector);
var width = this.width();
function image_resize()
{
$img.each(function() {
$(this).removeAttr("width")
.removeAttr("height")
.css("width","");
if($(this).data("width") == undefined)
$(this).data("width", $(this).width());
if($(this).data("width") > width) {
$(this).css("width", "100%");
}
});
}
$(window).on("load", function() {
image_resize();
});
$(window).on("resize", function() {
image_resize();
});
}
}(jQuery));

4
mobile/skin/board/basic/view.skin.php
View File

@ -4,6 +4,7 @@ include_once(G5_LIB_PATH.'/thumbnail.lib.php');
?>
<link rel="stylesheet" href="<?php echo $board_skin_url ?>/style.css">
<script src="<?php echo G5_JS_URL; ?>/viewimageresize.js"></script>
<div id="bo_v_table"><?php echo $board['bo_subject']; ?></div>
@ -226,6 +227,9 @@ $(function() {
excute_good(this.href, $(this), $tx);
return false;
});
// 이미지 리사이즈
$("#bo_v_atc").viewimageresize();
});
function excute_good(href, $el, $tx)

14
mobile/skin/board/gallery/list.skin.php
View File

@ -4,6 +4,7 @@ include_once(G5_LIB_PATH.'/thumbnail.lib.php');
?>
<link rel="stylesheet" href="<?php echo $board_skin_url ?>/style.css">
<script src="<?php echo G5_JS_URL; ?>/jquery.fancylist.js"></script>
<?php if (!$wr_id) { ?><h1 id="bo_list_title"><?php echo $g5['title'] ?></h1><?php } ?>
@ -48,13 +49,6 @@ include_once(G5_LIB_PATH.'/thumbnail.lib.php');
<ul id="gall_ul">
<?php for ($i=0; $i<count($list); $i++) {
if($i>0 && ($i % $board['bo_mobile_gallery_cols'] == 0))
$style = 'clear:both;';
else
$style = '';
if ($i == 0) $k = 0;
$k += 1;
if ($k % $board['bo_mobile_gallery_cols'] == 0) $style .= "margin:0 !important;";
?>
<li class="gall_li <?php if ($wr_id == $list[$i]['wr_id']) { ?>gall_now<?php } ?>">
<?php if ($is_checkbox) { ?>
@ -145,6 +139,12 @@ include_once(G5_LIB_PATH.'/thumbnail.lib.php');
</form>
</div>
<script>
$(window).on("load", function() {
$("#gall_ul").fancyList(".gall_li", "gall_clear");
});
</script>
<?php if($is_checkbox) { ?>
<noscript>
<p>자바스크립트를 사용하지 않는 경우<br>별도의 확인 절차 없이 바로 선택삭제 처리하므로 주의하시기 바랍니다.</p>

2
mobile/skin/board/gallery/style.css
View File

@ -71,7 +71,7 @@
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active {text-decoration:none}
#bo_cate #bo_cate_on {z-index:2;border:1px solid #565e60;background:#fff;color:#565e60;font-weight:bold}
#bo_gall .gall_li {float:left;padding:0 1em 2em 0}
#bo_gall .gall_li {float:left;padding:0 10px 20px 0}
#bo_gall .gall_clear {clear:both}
#bo_gall .gall_con {margin:0;padding:0;list-style:none}

4
mobile/skin/board/gallery/view.skin.php
View File

@ -4,6 +4,7 @@ include_once(G5_LIB_PATH.'/thumbnail.lib.php');
?>
<link rel="stylesheet" href="<?php echo $board_skin_url ?>/style.css">
<script src="<?php echo G5_JS_URL; ?>/viewimageresize.js"></script>
<div id="bo_v_table"><?php echo $board['bo_subject']; ?></div>
@ -226,6 +227,9 @@ $(function() {
excute_good(this.href, $(this), $tx);
return false;
});
// 이미지 리사이즈
$("#bo_v_atc").viewimageresize();
});
function excute_good(href, $el, $tx)

80
skin/board/basic/view.skin.php
View File

@ -4,6 +4,7 @@ include_once(G5_LIB_PATH.'/thumbnail.lib.php');
?>
<link rel="stylesheet" href="<?php echo $board_skin_url ?>/style.css">
<script src="<?php echo G5_JS_URL; ?>/viewimageresize.js"></script>
<!-- 게시물 읽기 시작 { -->
<div id="bo_v_table"><?php echo $board['bo_subject']; ?></div>
@ -178,8 +179,8 @@ include_once(G5_LIB_PATH.'/thumbnail.lib.php');
<!-- } 스크랩 추천 비추천 끝 -->
</section>
<?php
include_once(G5_SNS_PATH."/view.sns.skin.php");
<?php
include_once(G5_SNS_PATH."/view.sns.skin.php");
?>
<?php
@ -221,40 +222,6 @@ function board_move(href)
</script>
<script>
// 이미지 등비율 리사이징
$(window).load(function() {
view_image_resize();
});
var now = new Date();
var timeout = false;
var millisec = 200;
var tid;
$(window).resize(function() {
now = new Date();
if (timeout === false) {
timeout = true;
if(tid != null)
clearTimeout(tid);
tid = setTimeout(resize_check, millisec);
}
});
function resize_check() {
if (new Date() - now < millisec) {
if(tid != null)
clearTimeout(tid);
tid = setTimeout(resize_check, millisec);
} else {
timeout = false;
view_image_resize();
}
}
$(function() {
$("a.view_image").click(function() {
window.open(this.href, "large_image", "location=yes,links=no,toolbar=no,top=10,left=10,width=10,height=10,resizable=yes,scrollbars=no,status=no");
@ -272,44 +239,11 @@ $(function() {
excute_good(this.href, $(this), $tx);
return false;
});
// 이미지 리사이즈
$("#bo_v_atc").viewimageresize();
});
function view_image_resize()
{
var $img = $("#bo_v_atc img");
var img_wrap = $("#bo_v_atc").width();
var win_width = $(window).width() - 35;
var res_width = 0;
if(img_wrap < win_width)
res_width = img_wrap;
else
res_width = win_width;
$img.each(function() {
var img_width = $(this).width();
var img_height = $(this).height();
var this_width = $(this).data("width");
var this_height = $(this).data("height");
if(this_width == undefined) {
$(this).data("width", img_width); // 원래 이미지 사이즈
$(this).data("height", img_height);
this_width = img_width;
this_height = img_height;
}
if(this_width > res_width) {
$(this).width(res_width);
var res_height = Math.round(res_width * $(this).data("height") / $(this).data("width"));
$(this).height(res_height);
} else {
$(this).width(this_width);
$(this).height(this_height);
}
});
}
function excute_good(href, $el, $tx)
{
$.post(
@ -333,4 +267,4 @@ function excute_good(href, $el, $tx)
);
}
</script>
<!-- } 게시글 읽기 끝 -->
<!-- } 게시글 읽기 끝 -->

80
skin/board/gallery/view.skin.php
View File

@ -4,6 +4,7 @@ include_once(G5_LIB_PATH.'/thumbnail.lib.php');
?>
<link rel="stylesheet" href="<?php echo $board_skin_url ?>/style.css">
<script src="<?php echo G5_JS_URL; ?>/viewimageresize.js"></script>
<!-- 게시물 읽기 시작 { -->
<div id="bo_v_table"><?php echo $board['bo_subject']; ?></div>
@ -178,8 +179,8 @@ include_once(G5_LIB_PATH.'/thumbnail.lib.php');
<!-- } 스크랩 추천 비추천 끝 -->
</section>
<?php
include_once(G5_SNS_PATH."/view.sns.skin.php");
<?php
include_once(G5_SNS_PATH."/view.sns.skin.php");
?>
<?php
@ -221,40 +222,6 @@ function board_move(href)
</script>
<script>
// 이미지 등비율 리사이징
$(window).load(function() {
view_image_resize();
});
var now = new Date();
var timeout = false;
var millisec = 200;
var tid;
$(window).resize(function() {
now = new Date();
if (timeout === false) {
timeout = true;
if(tid != null)
clearTimeout(tid);
tid = setTimeout(resize_check, millisec);
}
});
function resize_check() {
if (new Date() - now < millisec) {
if(tid != null)
clearTimeout(tid);
tid = setTimeout(resize_check, millisec);
} else {
timeout = false;
view_image_resize();
}
}
$(function() {
$("a.view_image").click(function() {
window.open(this.href, "large_image", "location=yes,links=no,toolbar=no,top=10,left=10,width=10,height=10,resizable=yes,scrollbars=no,status=no");
@ -272,44 +239,11 @@ $(function() {
excute_good(this.href, $(this), $tx);
return false;
});
// 이미지 리사이즈
$("#bo_v_atc").viewimageresize();
});
function view_image_resize()
{
var $img = $("#bo_v_atc img");
var img_wrap = $("#bo_v_atc").width();
var win_width = $(window).width() - 35;
var res_width = 0;
if(img_wrap < win_width)
res_width = img_wrap;
else
res_width = win_width;
$img.each(function() {
var img_width = $(this).width();
var img_height = $(this).height();
var this_width = $(this).data("width");
var this_height = $(this).data("height");
if(this_width == undefined) {
$(this).data("width", img_width); // 원래 이미지 사이즈
$(this).data("height", img_height);
this_width = img_width;
this_height = img_height;
}
if(this_width > res_width) {
$(this).width(res_width);
var res_height = Math.round(res_width * $(this).data("height") / $(this).data("width"));
$(this).height(res_height);
} else {
$(this).width(this_width);
$(this).height(this_height);
}
});
}
function excute_good(href, $el, $tx)
{
$.post(
@ -333,4 +267,4 @@ function excute_good(href, $el, $tx)
);
}
</script>
<!-- } 게시글 읽기 끝 -->
<!-- } 게시글 읽기 끝 -->