<?php
$html = '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<HEAD>
$headinclude
<link href="css/bootstrap-datetimepicker.min.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
	function ajaxsearch(keywords,fields,sortfield,sortdetail,page){
		$.get("contactmessage.php", {getlist: "ajax", \'keyword[]\': keywords, \'field[]\': fields, sortf: sortfield, sortd: sortdetail, p: page}, function(data){
			$("#loadingprogress").css("visibility","hidden");
			$("#ajaxlist").html(data);
			
			$.get("contactmessage.php", {getlist: "pagenav", \'keyword[]\': keywords, \'field[]\': fields, p: page}, function(data){
				var arrdata = data.split("|^|");
				generatepagenav(arrdata);
			});
		});
	}
	
	function ajaxfromcookie(page){
		var pagestuff = getCookie("pagestuff");
		if (page == ""){
			if (pagestuff == ""){
				page = 1;
			}
			else{
				page = pagestuff;
			}
		}
		setCookie("pagestuff",page);
		
		$("#loadingprogress").css("visibility","visible");
		
		var fieldstext = getCookie("fieldstuff");
		
		if (fieldstext != ""){
			var keywordstext = getCookie("keywordstuff");
			
			var keywords = keywordstext.split(",");
			var fields = fieldstext.split(",");
			
			var lf = fields.length;
			for (var i = 0; i < lf; i++){
				$("#"+fields[i]).val(keywords[i]);
			}
		}
		
		var sortstuff = getCookie("sortstuff");
		var sortstuffdetail = getCookie("sortstuffdetail");
		if (sortstuff != ""){
			if (sortstuffdetail == "ASC"){
				$("#"+sortstuff).attr("src","plugins/datatables/images/sort_asc.png");
			}
			else{
				$("#"+sortstuff).attr("src","plugins/datatables/images/sort_desc.png");
			}
		}
		
		ajaxsearch(keywords,fields,sortstuff,sortstuffdetail,page);
	}
	
	function searchnow(){
		$("#loadingprogress").css("visibility","visible");
				
		var keywords = new Array();
		var fields = new Array();
		
		var startdate = $("#startdate").val();
		if (startdate  != ""){
			keywords.push(startdate);
			fields.push("startdate");
		}
		var enddate = $("#enddate").val();
		if (enddate  != ""){
			keywords.push(enddate);
			fields.push("enddate");
		}
		var message_id = $("#message_id :selected").val();
		if (message_id != ""){
			keywords.push(message_id);
			fields.push("message_id");
		}
		var name = $("#name").val();
		if (name  != ""){
			keywords.push(name);
			fields.push("name");
		}
		
		var email = $("#email").val();
		if (email  != ""){
			keywords.push(email);
			fields.push("email");
		}
		var telp = $("#telp").val();
		if (telp  != ""){
			keywords.push(telp);
			fields.push("telp");
		}
		var message = $("#message").val();
		if (message != ""){
			keywords.push(message);
			fields.push("message");
		}
				
		setCookie("keywordstuff",keywords);
		setCookie("fieldstuff",fields);
		setCookie("pagestuff","1");
		
		var sortfield = getCookie("sortstuff");
		var sortdetail = getCookie("sortstuffdetail");
		
		ajaxsearch(keywords,fields,sortfield,sortdetail,1);
	}
	
	function sorts(id,field){
		var sortfield = "";
		var sortdetail = "";
		var sortstuff = getCookie("sortstuff");
		if (sortstuff == id){
			var sortstuffdetail = getCookie("sortstuffdetail");
			
			if (sortstuffdetail == "ASC"){
				$("#"+id).attr("src","plugins/datatables/images/sort_desc.png");
				setCookie("sortstuffdetail","DESC");
				sortdetail = "DESC";
			}
			else{
				$("#"+id).attr("src","plugins/datatables/images/sort_asc.png");
				setCookie("sortstuffdetail","ASC");
				sortdetail = "ASC";
			}
		}
		else{
			if (sortstuff != ""){
				$("#"+sortstuff).attr("src","plugins/datatables/images/sort_both.png");
			}
			
			$("#"+id).attr("src","plugins/datatables/images/sort_asc.png");
			setCookie("sortstuff",id);
			setCookie("sortstuffdetail","ASC");
			sortdetail = "ASC";
		}
			
		sortfield = id;
		searchnow();
	}
	
	function loadajax(event){
		/*if (!detectspecialkeys(event)){
			var kn = getKeyEvent(event);
			if (kn == 13){*/
				searchnow();
			/*}
		}*/
	}
</script>
</HEAD>

<body class="skin-blue sidebar-mini">
    <div class="wrapper">
      
      $header
	  
      $navbar
	  
	  <!-- Content Wrapper. Contains page content -->
      <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
          <h1>
            Message From Guest List
            <small>preview of all message from guest list</small>
          </h1>
          <!--
          <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
            <li><a href="#">Tables</a></li>
            <li class="active">Simple</li>
          </ol>
		-->
        </section>
		
		<!-- Main content -->
        <section class="content">
          <div class="row">
            <div class="col-md-12">
              <div class="box box-primary">
                <div class="box-header">
                  <h3 class="box-title">All Of Message From Guest List</h3>
				  <span style="float: right; visibility: hidden" id="loadingprogress"><img src="img/loading.gif" border="0" width="15" height="15"></span>
                </div><!-- /.box-header -->
                <div class="box-body">
					<form action="contactmessage.php" method="post" onsubmit="return confirm(\'Are you sure?\')">
					  <table class="table table-bordered table-hover">
						<thead>
							<tr>
								<th width="3%" height="25" align="center" style="cursor: pointer"></th>
								<th width="12%" height="25" align="center" style="cursor: pointer" onclick="sorts(\'sortdateline\')">
								Date <img id="sortdateline" src="plugins/datatables/images/sort_both.png" border="0" style="vertical-align: middle"></th>
								<th width="13%" height="25" align="center" style="cursor: pointer" onclick="sorts(\'sortmessagetype\')">
								Message Type <img id="sortmessagetype" src="plugins/datatables/images/sort_both.png" border="0" style="vertical-align: middle"></th>
								<th width="12%" height="25" align="center" style="cursor: pointer" onclick="sorts(\'sortname\')">
								Message Sender <img id="sortname" src="plugins/datatables/images/sort_both.png" border="0" style="vertical-align: middle"></th>
								<th width="16%" height="25" align="center" style="cursor: pointer" onclick="sorts(\'sortemail\')">
								Email Sender <img id="sortemail" src="plugins/datatables/images/sort_both.png" border="0" style="vertical-align: middle"></th>
								<th width="9%" height="25" align="center" style="cursor: pointer" onclick="sorts(\'sorttelp\')">
								Telp <img id="sorttelp" src="plugins/datatables/images/sort_both.png" border="0" style="vertical-align: middle"></th>
								<th width="20%" height="25" align="center" style="cursor: pointer" onclick="sorts(\'sortmessage\')">
								Message Review <img id="sortmessage" src="plugins/datatables/images/sort_both.png" border="0" style="vertical-align: middle"></th>
							</tr>
							<tr bgcolor="#EFEFEF">
								<th width="3%" height="25" align="center">
								<input type="hidden" id="contact_id" style="width: 10%; font-size: 10px" onkeyup="loadajax(event)"></th>							
								<th width="12%" height="25" align="center">
								<input type="text" class="form-control input-xs date_only" id="startdate" style="width: 95%; font-size: 10px;" onkeyup="loadajax(event)">
								<input type="text" class="form-control input-xs date_only" id="enddate" style="width: 95%; font-size: 10px;" onkeyup="loadajax(event)"></th>
								<th width="13%" height="25" align="center">
								$type_message</th>
								<th width="12%" height="25" align="center">
								<input type="text" class="form-control input-xs" id="name" style="width: 98%; font-size: 10px" onkeyup="loadajax(event)"></th>
								<th width="16%" height="25" align="center">
								<input type="text" class="form-control input-xs" id="email" style="width: 98%; font-size: 10px" onkeyup="loadajax(event)"></th>
								<th width="9%" height="25" align="center">
								<input type="text" class="form-control input-xs" id="telp" style="width: 98%; font-size: 10px" onkeyup="loadajax(event)"></th>
								<th width="20%" height="25" align="center">
								<input type="text" class="form-control input-xs" id="message" style="width: 98%; font-size: 10px" onkeyup="loadajax(event)"></th>
							</tr>
							
						</thead>
						<tbody id="ajaxlist"></tbody>
					  </table>
						<div class="col-md-12 padding-0">
							<div class="col-xs-6 padding-0">
							  
							</div>
							<div class="col-xs-6 padding-0">
								$listaction
							</div>
						</div>
					</form>
                </div><!-- /.box-body -->
                <div class="box-footer clearfix">
					
					<div class="col-md-6 padding-0" id="recordsbottom"></div>
					<div class="col-md-6 padding-0 align-right" id="pagebottom"></div>
					
					
                </div>
				
				
              </div><!-- /.box -->
			</div><!-- /.col -->
		  </div><!-- /.row -->
		  
		</section><!-- /.content -->
      </div><!-- /.content-wrapper -->
	  
	  $footer
	 
	</div><!-- ./wrapper -->
	
<script type="text/javascript">
	$(function () {
		$(".date_only").datetimepicker({
			language:  "id",
			format:"yyyy-mm-dd",
			autoclose: 1,
			minView: 2,
			pickerPosition: "bottom-right"
		});
		
		$(".date_only").datetimepicker().on("changeDate", function(ev){
			searchnow();
		});
	});
	
	ajaxfromcookie("");
</script>
</div>
</BODY>
</HTML>';
?>