175 lines
5.9 KiB
Plaintext
175 lines
5.9 KiB
Plaintext
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
|
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
|
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
|
pageEncoding="UTF-8"%>
|
|
<!DOCTYPE html>
|
|
<html lang="en" class="no-js">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>A Collection of Page Transitions</title>
|
|
<meta name="description" content="A Collection of Page Transitions with CSS Animations" />
|
|
<meta name="keywords" content="page transition, css animation, website, effect, css3, jquery" />
|
|
<meta name="author" content="Codrops" />
|
|
<link rel="stylesheet" type="text/css" href="<c:url value='/vendor/page_transitions/css/default.css' />" />
|
|
<link rel="stylesheet" type="text/css" href="<c:url value='/vendor/page_transitions/css/multilevelmenu.css' />" />
|
|
<link rel="stylesheet" type="text/css" href="<c:url value='/vendor/page_transitions/css/component.css' />" />
|
|
<link rel="stylesheet" type="text/css" href="<c:url value='/vendor/page_transitions/css/animations.css' />" />
|
|
<script src="<c:url value='/vendor/page_transitions/js/modernizr.custom.js' />"></script>
|
|
|
|
</head>
|
|
<body>
|
|
<form name="frm">
|
|
<input type="hidden" id="center_id" name="center_id" value="KW_WELLS,KW_COMMON">
|
|
<input type="hidden" id="clock">
|
|
</form>
|
|
<div id="pt-main" class="pt-perspective">
|
|
<div class="pt-page">
|
|
<iframe id="ifrm_main1" src="http://localhost/background_test2" name="ifrm_main1" style="width:100%; height:100%; border: 0px; overflow:hidden;">
|
|
</iframe>
|
|
</div>
|
|
<div class="pt-page">
|
|
<iframe id="ifrm_main2" src="http://localhost/background_test2_1" name="ifrm_main2" style="width:100%; height:100%; border: 0px; overflow:hidden;">
|
|
</iframe>
|
|
</div>
|
|
<div class="pt-page">
|
|
<iframe id="ifrm_main3" src="http://localhost/background_test2_2" name="ifrm_main3" style="width:100%; height:100%; border: 0px; overflow:hidden;">
|
|
</iframe>
|
|
</div>
|
|
<div class="pt-page">
|
|
<iframe id="ifrm_main4" src="http://localhost/background_test2_3" name="ifrm_main4" style="width:100%; height:100%; border: 0px; overflow:hidden;">
|
|
</iframe>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pt-message">
|
|
<p>Your browser does not support CSS animations.</p>
|
|
</div>
|
|
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
|
<script src="<c:url value='/vendor/page_transitions/js/jquery.dlmenu.js' />"></script>
|
|
<script src="<c:url value='/vendor/page_transitions/js/pagetransitions.js' />"></script>
|
|
<script type="text/javascript">
|
|
var wall_info_index = 0;
|
|
var wall_infos;
|
|
|
|
function getWallData(){
|
|
var queryString = $("form[name=frm]").serialize() ;
|
|
$.ajax({
|
|
url:"<c:url value='/getWallInfo'/>",
|
|
data : queryString,
|
|
type:"post",
|
|
datatype:"json",
|
|
success:function(args){
|
|
wall_infos = args.list;
|
|
},
|
|
error : function(x,o,e){
|
|
var msg = "에러발생 \n" + x.status + " : " + o + " : " + e;
|
|
alert(msg);
|
|
}
|
|
});
|
|
}
|
|
|
|
function show_wall(){
|
|
var center_id;
|
|
var center_name;
|
|
var center_order;
|
|
var font_color;
|
|
var wall_id;
|
|
var view_yn;
|
|
var wall_duration;
|
|
var wall_name;
|
|
var wall_order;
|
|
var wall_url;
|
|
try{
|
|
if(wall_infos == null){
|
|
setTimeout( "show_wall()", 2 * 1000 );
|
|
return;
|
|
}
|
|
center_id = wall_infos[wall_info_index].CENTER_ID;
|
|
center_name = wall_infos[wall_info_index].CENTER_NAME;
|
|
center_order = wall_infos[wall_info_index].CENTER_ORDER;
|
|
font_color = wall_infos[wall_info_index].FONT_COLOR;
|
|
wall_id = wall_infos[wall_info_index].ID;
|
|
view_yn = wall_infos[wall_info_index].VIEW_YN;
|
|
wall_duration = wall_infos[wall_info_index].WALL_DURATION;
|
|
wall_name = wall_infos[wall_info_index].WALL_NAME;
|
|
wall_order = wall_infos[wall_info_index].WALL_ORDER;
|
|
wall_url = wall_infos[wall_info_index].WALL_URL;
|
|
|
|
if(view_yn == "Y" && wall_duration > 0){
|
|
//$("[class^=pt-page-current]").each(function() {
|
|
// alert($(this).attr("class"));
|
|
// });
|
|
//document.getElementsByClassName('test_class')[0].id;
|
|
//document.getElementById('ifrm_main1').src = "<c:url value='"+wall_url+"' />";
|
|
//document.getElementById('ifrm_main2').src = "<c:url value='"+wall_url+"' />";
|
|
PageTransitions.nextPage(1);
|
|
setTimeout( "show_wall()", wall_duration * 1000 );
|
|
}
|
|
wall_info_index++;
|
|
if(wall_infos.length == wall_info_index){
|
|
wall_info_index = 0;
|
|
getWallData();
|
|
}
|
|
}catch(error){
|
|
alert(error);
|
|
}
|
|
}
|
|
|
|
function leadingZeros(n, digits) {
|
|
var zero = '';
|
|
n = n.toString();
|
|
if (n.length < digits) {
|
|
for (i = 0; i < digits - n.length; i++)
|
|
zero += '0';
|
|
}
|
|
return zero + n;
|
|
}
|
|
|
|
function timer(){
|
|
var d = new Date();
|
|
var dayname = "";
|
|
var day = d.getDay();
|
|
switch(day){
|
|
case 0: dayname = "(일)"; break;
|
|
case 1: dayname = "(월)"; break;
|
|
case 2: dayname = "(화)"; break;
|
|
case 3: dayname = "(수)"; break;
|
|
case 4: dayname = "(목)"; break;
|
|
case 5: dayname = "(금)"; break;
|
|
case 6: dayname = "(토)"; break;
|
|
}
|
|
var date = leadingZeros(d.getFullYear(), 4) + '-' +
|
|
leadingZeros(d.getMonth() + 1, 2) + '-' +
|
|
leadingZeros(d.getDate(), 2) + ' ';
|
|
|
|
var time = leadingZeros(d.getHours(), 2) + '시' +
|
|
leadingZeros(d.getMinutes(), 2) + '분' +
|
|
leadingZeros(d.getSeconds(), 2) + '초';
|
|
|
|
var txt_time = date + " " +dayname + "\r\n" + time;
|
|
return txt_time;
|
|
}
|
|
|
|
|
|
function clock(){
|
|
var timetxt = timer();
|
|
if( $('input#clock')){ //페이지가 로드되지 않았을때 객체가 null일경우 에러발생됨
|
|
$('input#clock').val(timetxt);
|
|
}
|
|
|
|
// 1000 밀리초(=1초) 후에, 이 함수를 실행하기 (반복 실행 효과).
|
|
setTimeout( "clock()", 1000 );
|
|
}
|
|
|
|
$( document ).ready(function() {
|
|
//clock();
|
|
getWallData();
|
|
show_wall();
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|