웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
각 리스트형 위젯에 페이지 기능을 달자.
2008.09.02 14:32
몇몇분이 소스를 공개하라고 해서 페이지 기능을 구현하는 방법을 소개해볼까 합니다.
이번 소스모델이 된 위젯은 newest_image(최근 이미지 위젯) 입니다.
최근 이미지 위젯에 페이지 기능을 위한 추가, 수정 파일
(※ 이미 설명드린 부분(하단참조) 있기 때문에 아래부터는 존칭을 생략 하겠습니다.)
- info.xml -
한 페이지 당 출력할 페이지 번호 갯수와, 페이지 출력 여부 설정 값을 입력 받기 위해
page_count, page_type 항목을 선언
- newest_images.class.php -
newest_images.class.php 파일안에 구석구석 위의 변수가 들어가면 페이지 기능이 완성 된다.
1. 첫번째 페이지 기능을 위한 정보 입력 및 처리
XML로 만들었던 page_count와 page_type을 DB로 보내기 위해 위와 같이 선언 한다.
(※ 다른 위젯과 다르게 $list_count 변수가 없어서 마지막에 $list_count = $obj->list_count;을 추가 선언해준다.)
2. DB로 보낼때 페이지 기능에서 필요로 하는 값중에는 전체 게시물수가 필요함.
전체 게시물 수를 구할 수 있도록 아래와 같이 선언
기 존 $files_output = executeQueryArray("file.getOneFileInDocument", $obj); 를 수정하게 되면 중심 모듈을 건드리게 되기 때문에 아래와 같이 위젯 폴더안에 queries라는 폴더를 하나더 만들어서 새로이 생성해준다.
전체 게시물 수를 구하도록 끝에 Count를 더 달아서 파일을 생성해준다.
3. 결과값의 순서를 수정
다른 위젯과 다르게 임의의 page( limit 0, 5 ) 가 선언되면
$files_output->data[0] ..[1]..[2]..... 가 아니라 $files_output->data[343]... [344]...[345].....
순으로 저장 되기에 이를 0번 부터 사용하도록 수를 수정 한다.
4. 페이지 계산에 필요한 정보를 list.html로 보내기 위해 아래와 같이 정리 한다.
5. list.html에서 호출에 오는 함수 정보.
위와 함수를 이용하여 페이지 계산, 초기화 등의 정보를 구한다.
- getOneFileInDocument.xml -
기존의 기본 XML에서 아래의 내용을 추가한다. (페이지 별로 내용 축출을 위해 필요)
<page_count var="page_count" default="10" />
<page var="page" default="1" />
- getOneFileInDocumentCount.xml -
내용은 그대로 getOneFileInDocument.xml에서 가져오돼 바꿔줘야 할 부분
- list.html -
중요한 선언만 설명
$widget_info로 넘겨받은 페이지 계산을 위한 전체 게시물 수, 전체 페이지 수, 현재 페이지 번호, 한페이지에 출력될 페이지 번호의 수를 WD_getNextPage로 호출하여 $page_view에 결과를 저장한다.
상 하로 중복 선언이 될 경우 기존에 이용되었던 $GLOBALS 변수를 초기화 시킨다.
WD_getNextPage2() 를 호출시마다 반복시켜서 내용이 없을때까지 수행한다.
이번 소스모델이 된 위젯은 newest_image(최근 이미지 위젯) 입니다.
최근 이미지 위젯에 페이지 기능을 위한 추가, 수정 파일
./widgets/newest_image/conf/info.xml <- 입력을 받기 위한 입력창
: 관리자페이지에서 코드 실행하기전에 이곳으로부터 정보를 입력 받습니다.
./widgets/newest_image/newest_images.class.php <- 입력 받은 정보를 처리
: 입력 받은 정보를 적절히 정리해서 DB로 부터 결과값들을 받고 스킨 처리를 하는 파일
./widgets/newest_image/queries/getOneFileInDocument.xml<- DB Query용 XML 파일
: $page 번호 값에 따라서 결과를 출럭하기 위해 <navigation>에 내용을 추가 해야 합니다.
: 또한 기존 files 모듈에 있던 내용을 위젯에 생성이 필요합니다.
./widgets/newest_image/queries/getOneFileInDocumentCount.xml <- DB Query용 XML 파일
: 결과값용 Query와 다르게 페이지 기능을 만들기 위해 하나의 Query를 더 해야합니다.
./widgets/newest_image/skin/default/list.html <- DB로 부터의 결과를 이용하여 표현하는 스킨 파일
: 관리자페이지에서 코드 실행하기전에 이곳으로부터 정보를 입력 받습니다.
./widgets/newest_image/newest_images.class.php <- 입력 받은 정보를 처리
: 입력 받은 정보를 적절히 정리해서 DB로 부터 결과값들을 받고 스킨 처리를 하는 파일
./widgets/newest_image/queries/getOneFileInDocument.xml<- DB Query용 XML 파일
: $page 번호 값에 따라서 결과를 출럭하기 위해 <navigation>에 내용을 추가 해야 합니다.
: 또한 기존 files 모듈에 있던 내용을 위젯에 생성이 필요합니다.
./widgets/newest_image/queries/getOneFileInDocumentCount.xml <- DB Query용 XML 파일
: 결과값용 Query와 다르게 페이지 기능을 만들기 위해 하나의 Query를 더 해야합니다.
./widgets/newest_image/skin/default/list.html <- DB로 부터의 결과를 이용하여 표현하는 스킨 파일
(※ 이미 설명드린 부분(하단참조) 있기 때문에 아래부터는 존칭을 생략 하겠습니다.)
- info.xml -
........ XML 선언 문들...... <options> <name xml:lang="ko">표시하지 않음</name> <name xml:lang="jp">非表示</name> <name xml:lang="zh-CN">不显示</name> <name xml:lang="en">Hide</name> <name xml:lang="es">Ocultar</name> <name xml:lang="ru">Скрывать</name> <value>N</value> </options> </var> <var id="page_count"> <name xml:lang="ko">페이지 목록수</name> <type>text</type> <description xml:lang="ko">출력될 페이지의 수를 정하실 수 있습니다. (기본 5개)</description> </var> <var id="page_type"> <name xml:lang="ko">페이지 출력 여부</name> <type>select</type> <description xml:lang="ko">페이지를 출력할지 선택하세요.</description> <options> <name xml:lang="ko">N</name> <value></value> </options> <options> <name xml:lang="ko">Y</name> <value>Y</value> </options> </var> </extra_vars> </widget>
한 페이지 당 출력할 페이지 번호 갯수와, 페이지 출력 여부 설정 값을 입력 받기 위해
page_count, page_type 항목을 선언
- newest_images.class.php -
/* 페이지 네비게이션 기능 추가 */ // 페이지 목록 수 (1,2,3,4....) $page_count = $args->page_count; if(!$page_count) $page_count = 5; $obj->page_count = $page_count; // 페이지 출력 여부 $page_type = $args->page_type; // 페이지 번호 구하기 if($page_type=='Y') $obj->page = (Context::get('+ '+ 'page'))? Context::get('page'): 1; // 기존 변수 추가로 저장 $list_count = $obj->list_count; /* 페이지 네비게이션 기능 추가 끝 */ // 정해진 모듈에서 문서별 파일 목록을 구함 $files_output = executeQueryArray("widgets.newest_images.getOneFileInDocument", $obj); $output_count = executeQueryArray('widgets.newest_images.getOneFileInDocumentCount', $obj); ...중략... $z=0; foreach($files_output->data as $key => $val) { $files_output->data[$z] = $files_output->data[$key]; unset($files_output->data[$key]); $z++; } ...중략... /* 페이지 네비게이션 기능 추가 */ $widget_info->page_type = $page_type; $widget_info->total_count = $output_count->data[0]->count; // 전체 개시물 수 $widget_info->page = (!Context::get('page'))? 1:Context::get('page'); // 현재 페이지 // 총 페이지 수 $total_count = $widget_info->total_count/$list_count; if($widget_info->total_count%$list_count != 0) $total_count+=1; $widget_info->total_page = floor($total_count); // 총 페이지 수 $widget_info->page_count = $page_count; // 총 페이지 수 /* 페이지 네비게이션 기능 추가 끝 */ ...중략... /** * @brief 다음 페이지 요청 **/ function WD_getNextPage($total_count, $total_page, $cur_page, $page_count = 10) { $first_page = $cur_page - (int)($page_count/2); if($first_page<1) $first_page = 1; $last_page = $total_page; if($last_page>$total_page) $last_page = $total_page; if($total_page < $page_count) $page_count = $total_page; $GLOBALS['wd_total_page'] = $total_page; $GLOBALS['wd_first_page'] = $first_page; $GLOBALS['wd_page_count'] = $page_count; $GLOBALS['wd_last_page'] = $last_page; $page->first_page = $first_page; $page->last_page = $last_page; return $page; } function WD_getNextPage2() { $page = $GLOBALS['wd_first_page']+$GLOBALS['wd_i'+ ']++; if($GLOBALS['wd_i'] > $GLOBALS['wd_page_count'] || $page > $GLOBALS['wd_last_page']) $page = 0; return $page; } function WD_getNextClear() { $GLOBALS['wd_i'] = 0; }
newest_images.class.php 파일안에 구석구석 위의 변수가 들어가면 페이지 기능이 완성 된다.
1. 첫번째 페이지 기능을 위한 정보 입력 및 처리
/* 페이지 네비게이션 기능 추가 */ // 페이지 목록 수 (1,2,3,4....) $page_count = $args->page_count; if(!$page_count) $page_count = 5; $obj->page_count = $page_count; // 페이지 출력 여부 $page_type = $args->page_type; // 페이지 번호 구하기 if($page_type=='Y') $obj->page = (Context::get('page'))? Context::get('page'): 1; // 기존 변수 추가로 저장 $list_count = $obj->list_count; /* 페이지 네비게이션 기능 추가 끝 */
XML로 만들었던 page_count와 page_type을 DB로 보내기 위해 위와 같이 선언 한다.
(※ 다른 위젯과 다르게 $list_count 변수가 없어서 마지막에 $list_count = $obj->list_count;을 추가 선언해준다.)
2. DB로 보낼때 페이지 기능에서 필요로 하는 값중에는 전체 게시물수가 필요함.
전체 게시물 수를 구할 수 있도록 아래와 같이 선언
// 정해진 모듈에서 문서별 파일 목록을 구함 $files_output = executeQueryArray("widgets.newest_images.getOneFileInDocument", $obj); $output_count = executeQueryArray('widgets.newest_images.getOneFileInDocumentCount', $obj);
기 존 $files_output = executeQueryArray("file.getOneFileInDocument", $obj); 를 수정하게 되면 중심 모듈을 건드리게 되기 때문에 아래와 같이 위젯 폴더안에 queries라는 폴더를 하나더 만들어서 새로이 생성해준다.
전체 게시물 수를 구하도록 끝에 Count를 더 달아서 파일을 생성해준다.
3. 결과값의 순서를 수정
$z=0; foreach($files_output->data as $key => $val) { $files_output->data[$z] = $files_output->data[$key]; unset($files_output->data[$key]); $z++; }
다른 위젯과 다르게 임의의 page( limit 0, 5 ) 가 선언되면
$files_output->data[0] ..[1]..[2]..... 가 아니라 $files_output->data[343]... [344]...[345].....
순으로 저장 되기에 이를 0번 부터 사용하도록 수를 수정 한다.
4. 페이지 계산에 필요한 정보를 list.html로 보내기 위해 아래와 같이 정리 한다.
/* 페이지 네비게이션 기능 추가 */ $widget_info->page_type = $page_type; $widget_info->total_count = $output_count->data[0]->count; // 전체 개시물 수 $widget_info->page = (!Context::get('page'))? 1:Context::get('page'); // 현재 페이지 // 총 페이지 수 $total_count = $widget_info->total_count/$list_count; if($widget_info->total_count%$list_count != 0) $total_count+=1; $widget_info->total_page = floor($total_count); // 총 페이지 수 $widget_info->page_count = $page_count; // 총 페이지 수 /* 페이지 네비게이션 기능 추가 끝 */ Context::set('widget_info', $widget_info); ...중략...
5. list.html에서 호출에 오는 함수 정보.
/** * @brief 다음 페이지 요청 **/ function WD_getNextPage($total_count, $total_page, $cur_page, $page_count = 10) { $first_page = $cur_page - (int)($page_count/2); if($first_page<1) $first_page = 1; $last_page = $total_page; if($last_page>$total_page) $last_page = $total_page; if($total_page < $page_count) $page_count = $total_page; $GLOBALS['wd_total_page'] = $total_page; $GLOBALS['wd_first_page'] = $first_page; $GLOBALS['+ 'wd_page_count'] = $page_count; $GLOBALS['wd_last_page'] = $last_page; $page->first_page = $first_page; $page->last_page = $last_page; return $page; } function WD_getNextPage2() { $page = $GLOBALS['+ 'wd_first_page'+ ']+$GLOBALS['wd_i']++; if($GLOBALS['wd_i'] > $GLOBALS['wd_page_count'] || $page > $GLOBALS['wd_last_page'+ ']) $page = 0; return $page; } function WD_getNextClear() { $GLOBALS['wd_i'] = 0; }
위와 함수를 이용하여 페이지 계산, 초기화 등의 정보를 구한다.
- getOneFileInDocument.xml -
<query id="getOneFileInDocument" action="select"> <tables> <table name="files" alias="files"/> <table name="documents" alias="documents"/> </tables> <columns> <column name="files.upload_target_srl" alias="document_srl"/> </columns> <conditions> <condition operation="in" column="files.module_srl" var="module_srls" notnull="notnull" filter="numbers" /> <condition operation="equal" column="files.direct_download" var="direct_download" pipe="and" /> <condition operation="equal" column="files.isvalid" var="isvalid" pipe="and" /> <condition operation="equal" column="files.upload_target_srl" var="documents.document_srl" pipe="and" /> </conditions> <groups> <group column="files.upload_target_srl" /> </groups> <navigation> <index var="list_order" default="documents.list_order" order="asc" /> <list_count var="list_count" default="20" /> <page_count var="page_count" default="10" /> <page var="page" default="1" /> </navigation> </query>
기존의 기본 XML에서 아래의 내용을 추가한다. (페이지 별로 내용 축출을 위해 필요)
<page_count var="page_count" default="10" />
<page var="page" default="1" />
- getOneFileInDocumentCount.xml -
<query id="getOneFileInDocumentCount" action="select"> <tables> <table name="files" alias="files"/> <table name="documents" alias="documents"/> </tables> <columns> <column name="count(files.upload_target_srl)" alias="count"/> </columns> <conditions> <condition operation="in" column="files.module_srl" var="module_srls" notnull="notnull" filter="numbers" /> <condition operation="equal" column="files.direct_download" var="direct_download" pipe="and" /> <condition operation="equal" column="files.isvalid" var="isvalid" pipe="and" /> <condition operation="equal" column="files.upload_target_srl" var="documents.document_srl" pipe="and" /> </conditions> <groups> <group column="files.upload_target_srl" /> </groups> <navigation> <index var="list_order" default="documents.list_order" order="asc" /> </navigation> </query>
내용은 그대로 getOneFileInDocument.xml에서 가져오돼 바꿔줘야 할 부분
<query id="getOneFileInDocumentCount" action="select">id명을 파일명과 일치시킨다.
<column name="count(files.upload_target_srl)" alias="count"/>count()로 감싸고 alias="count" 라는 이름으로 명시.
<list_count var="list_count" default="20" />해당 내용 삭제하여 전체 게시물로써의 게시물수를 구한다.
- list.html -
<!--@if($widget_info->page_type=='Y')--> <!-- 페이지 네비게이션 --> <div class="pageNavigation"> <a href="{getUrl('page','','document_srl','','division',$division,'last_division',$last_division)}" class="goToFirst"> <img src="./images/common/bottomGotoFirst.gif" alt="{$lang->first_page}" width="7" height="5" /></a> <!-- 페이지 정보 구하기 위해 선언 --> {@$page_view = WD_getNextPage($widget_info->total_count,$widget_info->total_page,$widget_info->page,$widget_info->page_count)} <!-- 중복 페이지 정보 출력을 위해 사전 초기화 --> {@WD_getNextClear()} <!--@while($page_no = WD_getNextPage2())--> <!--@if($widget_info->page == $page_no)--> <span class="current">{$page_no}</span> <!--@else--> <span class="pageNavigations"><a href="{getUrl('page',$page_no,'+ 'document_srl','','division',$division,'last_division',$last_division)}" class="pageNavigation2">{$page_no}</a></span> <!--@end--> <!--@end--> <a href="{getUrl('page',$page_view->last_page,'document_srl','','division',$division,'last_division',$last_division)}" class="goToLast"> <img src="./images/common/bottomGotoLast.gif" alt="{$lang->last_page}" width="7" height="5" /></a> </div> <!--@end-->
중요한 선언만 설명
{@$page_view = WD_getNextPage($widget_info->total_count,$widget_info->total_page,$widget_info->page,$widget_info->page_count)}
$widget_info로 넘겨받은 페이지 계산을 위한 전체 게시물 수, 전체 페이지 수, 현재 페이지 번호, 한페이지에 출력될 페이지 번호의 수를 WD_getNextPage로 호출하여 $page_view에 결과를 저장한다.
{@WD_getNextClear()}
상 하로 중복 선언이 될 경우 기존에 이용되었던 $GLOBALS 변수를 초기화 시킨다.
<!--@while($page_no = WD_getNextPage2())--> ...내용... <!--@end-->
WD_getNextPage2() 를 호출시마다 반복시켜서 내용이 없을때까지 수행한다.
위 설명은 왠만한 위젯에서 공통적으로 적용가능합니다. (리스트형)
1~5번의 위치만 제대로 잡아주시고 DB용 xml만 제대로 선언해주신다면 페이지 네비게이션 이용에
문제가 없을 걸로 봅니다.
전체 소스결과를 출력하긴 좀 그래서 newest_images 위젯을 배포하겠습니다.
위 소스를 기반으로 확인해보시고 다른곳에 적용해보시고 하세요.
1~5번의 위치만 제대로 잡아주시고 DB용 xml만 제대로 선언해주신다면 페이지 네비게이션 이용에
문제가 없을 걸로 봅니다.
전체 소스결과를 출력하긴 좀 그래서 newest_images 위젯을 배포하겠습니다.
위 소스를 기반으로 확인해보시고 다른곳에 적용해보시고 하세요.
보다 자세한 원리의 강좌는 제 홈페이지에 설명되어있습니다.
http://www.animeclub.net/zbXE
http://www.animeclub.net/zbXE
태그 연관 글
- [2015/08/01] 포럼 [XE기초강좌 동영상] 휴면계정 정리 모듈 사용방법 *5
- [2015/07/20] 포럼 [아프리카TV 생방송] 충쌤의 XE랑(월,화 밤11시) * 진화쌤의 반응형 레이아웃 제작(수,목 밤10시) *29
- [2014/05/29] 포럼 XE 오픈 세미나 - 5월 31일 xdebug, XE 개발 전반에 대한 Q&A *4
- [2014/05/26] Blog 5월 XE 오픈 세미나 - [3회차] XE 모듈 개발 걸음마부터 날기까지 *1
- [2014/05/19] Blog XE 오픈 세미나 - XE 모듈 개발 1회차 리뷰
댓글 10
제목 | 글쓴이 | 날짜 |
---|---|---|
밑에 페이지 네비게이션 수정 (다음10개, 이전10개등으로) [6] | Clanss | 2008.08.29 |
문서 카테고리를 메뉴에 적용하기 위한 레이아웃 수정 팁과 개념토론 [7] | 제베 | 2008.08.31 |
원하는 위치에 구글 (맞춤)검색창 달기 [2] | 다케루 | 2008.09.02 |
각 리스트형 위젯에 페이지 기능을 달자. [10] | 라르게덴 | 2008.09.02 |
카멜레온 최근글 위젯 클릭시 새창 팁 | 가랑바람 | 2008.09.04 |
회원 포인트 선물 하기 등 포인트 변경시 바로 적용 방법 | 한꼬마 | 2008.09.06 |
등록하시겠습니까? 등록할까요? 안 나오고 바로 글 등록되게 하는 법 [6] | 황건순 | 2008.09.08 |
IP 주소 4자리수 모두 공개하는 방법 [1] | 블루파티 | 2008.09.11 |
에디터 9pt 추가 및 에디터에도 웹폰트 보이게 하기. [13] | 욜리 | 2008.09.11 |
사진 한꺼번에 일괄적으로 올리기 [4] | 안정수650 | 2008.09.12 |
게시판 에디터 폰트 글자(글씨)크기 변경하는 법 | 씨에씨에 | 2008.09.12 |
아이프레임 | 나나나나난 | 2008.09.18 |
글이나 코멘트에서 글자수 제한하기 | 老姜君 | 2008.09.23 |
첨부파일이 다운로드 되지 않을떄.. [2] | 규민 | 2008.09.23 |
● 탈퇴버튼 없애기 - - ; [4] | Eris | 2008.09.23 |
제로보드XE 중복설치방법 있나요? [4] | bsy.myid.net | 2008.09.24 |
XAMPP 프로그램사용시 Error500 이 뜰경우 해결방법 [2] | 지레프 | 2008.09.26 |
VPN 환경에서 제로보드 [4] | superion | 2008.09.26 |
메뉴 모듈 기능 조금 추가 [23] [1] | 반도체맨 | 2008.09.29 |
감점되는 게시판에서 점수 부족한데 글 써지는 문제점 수정 [1] | 반도체맨 | 2008.10.07 |