Publicado em 23 de dez.

Calendário em PHP, MySQL e XAJAX - Parte 1

Salve Salve Galera iMasters,

Bom eu ajustei o novo Calendário e agora adaptei à biblioteca XAJAX que é perfeita para PHP. Codigo Livre encontrada neste endereço: http://www.xajaxproject.org/.

Primeiramente vamos visualizar o calendário funcionando no link abaixo

CALENDÁRIO PHP MySQL & XAJAX

Vamos ao que interessa:

Tabela para o banco

CREATE TABLE IF NOT EXISTS `agenda` (
 `id` int(11) NOT NULL auto_increment,
 `evento` varchar(200) NOT NULL,
 `dtevento` varchar(10) NOT NULL,
 `autor` varchar(200) NOT NULL,
 `data` timestamp NOT NULL default CURRENT_TIMESTAMP,
 `hora` varchar(5) NOT NULL,
 `conteudo` text NOT NULL,
 `local` varchar(200) NOT NULL,
 PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1;

Criar a conexão com o banco de dados

sql.php

<?php
$host = "localhost";//caso esteja usando o xampp ou wamp

$user = "root";
$pass = "";
$db = "db";
$conn = mysql_connect($host, $user, $pass) or die (mysql_error());

@mysql_select_db($db);

?>

Criar a folha de estilos

estilo.css

.tabela{
background:#fff;
width:250px;
padding:0px;
border:1px solid #ccc;
float:left;
margin-right:20px;
}
.td{
background:#f8f8f8;
width:25px;
height:25px;
text-align:center;

}
.hj{
background: #FFFF99;
width:25px;
height:25px;
text-align:center;
}
.dom{
background: #FFCC99;
width:25px;
height:25px;
text-align:center;
}
.evt{
background: #CCFF99;
width:25px;
height:25px;
text-align:center;
cursor:pointer;
}
.mes{
background:#fff;
width:auto;
height:20px;
text-align:center;
}
.show{
background:#202020;
width:300px;
height:30px;
text-align:left;
font-size:12px;
font-weight:bold;
color:#CCFF00;
padding-left:5px;
}
.linha{
background:#404040;
width:300px;
height:20px;
text-align:left;
font-size:11px;
color:#f0f0f0;
padding:1px 1px 1px 10px;
}
.sem{
background: #ECE6D9;
width:auto;
height:20px;
text-align:center;
font-size:12px;
font-weight:bold;
font-family:Verdana;
}

body,td,th {

	font-family: Verdana;
	font-size: 12px;
	color: #000000;
}

a:link {

	color: #000000;
	text-decoration: none;
}

a:visited {

	text-decoration: none;
	color: #000000;
}

a:hover {

	text-decoration: underline;
	color: #FF9900;
}

a:active {

	text-decoration: none;
}
#carregando{
	background: white;
	padding-left: 20px;
	display: none; /* hidden */
	width: 200px;
	/*height: 100px;*/
 /*margin-top: -50;*/
	line-height:20px;
	}

Criar a página principal da agenda

agendaAjax.php

<?php
#################################
#

Calendário PHP MySQL XAJAX 5

Documento: Agenda de eventos dinãmica

Autor: Gaspar Teixeira

E-mail: gaspar.teixeira@gmail.com

Data: 22/12/2008

Direito de uso: livre

Declaração: O autor não se responsabiliza

pelo utilização deste calendário!

#
#################################

require_once("xajax/xajax_core/xajax.inc.php");/busca livraria do XAJAX/
include "funcoes.php";//inclui as funçoes
$xajax = new xajax();//Gera a classe
$xajax->setCharEncoding('ISO-8859-1');//Caracteres especiais

/Registra cada uma das funçoes em PHP/

$xajax->registerFunction("Antes");
$xajax->registerFunction("Proximo");
$xajax->registerFunction("Agenda");
$xajax->registerFunction("Mostrar");
$xajax->configure('decodeUTF8Input',true);

$xajax->processRequest();//Processa a requisiçao AJAX
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="[http://www.w3.org/1999/xhtml">](http://www.w3.org/1999/xhtml)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Agenda de Eventos by Gaspar</title>

<link rel="stylesheet" type="text/css" href="estilo.css">

<?php $xajax->printJavascript("xajax/"); ?>

<script type="text/javascript">
 xajax.callback.global.onRequest = function() {xajax.$('carregando').style.display = 'block';}
 xajax.callback.global.beforeResponseProcessing = function() {xajax.$('carregando').style.display='none';}
</script>

</head>

<body onload="xajax_Agenda()"><!-- Sai bunbando o calendario -->

<?php

include "sql.php";//conexão com o banco de dados

@mysql_select_db($db);//selecione o banco de dados
/Gera as divs onde serão exibidos os dados requisitados /

 print "<div id=\"carregando\"><img src=\"load.gif\"/> carregando...</div>";
 print "<div id=\"conteudo\"></div>";
 print "<div id=\"eventos\"></div>";

?>

</body>
</html>

Criar a pagina com as funções

funcoes.php

<?php
session_start();//inicia a sessão do ano
include "sql.php";//Conexão

########################################

Função para voltar os meses do ano #

########################################

function Antes($antes){
	$resposta = new xajaxResponse();
	//sleep(2); //habilite, caso queira ver ação do loading no localserver
	$dia = date('d');
	$month = $antes;
	$_SESSION['ano'];
	$hoje = date('j');//função importante pego o dia corrente
	if($month == 0){//Caso antes de janeiro
 $month = 12;
 $_SESSION['ano'] = $_SESSION['ano'] - 1;
	}

switch($month.$n){/notem duas variaveis para o switch para identificar dia e limitar numero de dias/

	case 1: $mes = "JANEIRO";
 $n = 31;
	break;
	case 2: $mes = "FEVEREIRO";// todo ano bixesto fev tem 29 dias
 $bi = $_SESSION['ano'] % 4;//anos multiplos de 4 são bixestos
 if($bi == 0){
 $n = 29;
 }else{
 $n = 28;
 }
	break;
	case 3: $mes = "MARÇO";
 $n = 31;
	break;
	case 4: $mes = "ABRIL";
 $n = 30;
	break;
	case 5: $mes = "MAIO";
 $n = 31;
	break;
	case 6: $mes = "JUNHO";
 $n = 30;
	break;
	case 7: $mes = "JULHO";
 $n = 31;
	break;
	case 8: $mes = "AGOSTO";
 $n = 31;
	break;
	case 9: $mes = "SETEMBRO";
 $n = 30;
	break;
	case 10: $mes = "OUTUBRO";
 $n = 31;
	break;
	case 11: $mes = "NOVEMBRO";
 $n = 30;
	break;
	case 12: $mes = "DEZEMBRO";
 $n = 31;
	break;
}

$pdianu = mktime(0,0,0,$month,1,$_SESSION['ano']);//primeiros dias do mes

$dialet = date('D', $pdianu);//escolhe pelo dia da semana
switch($dialet){//verifica que dia cai

	case "Sun": $branco = 0; break;
	case "Mon": $branco = 1; break;
	case "Tue": $branco = 2; break;
	case "Wed": $branco = 3; break;
	case "Thu": $branco = 4; break;
	case "Fri": $branco = 5; break;
	case "Sat": $branco = 6; break;
}

	$res .= '<table class="tabela" >';//construção do calendario
	$res .= '<tr>';
	$antes = $month - 1;// diminui um mes
	$proximo = $month + 1;// aumenta um mes
	$res .= "<td class=\"mes\"><a href=\"java script:void(0);\" onclick=\"xajax_Antes($antes);\" title=\"Mês anterior\"><img src=\"ant.gif\" border=\"0\"></a></td>";/*mês anterior*/
	$res .= '<td class="mes" colspan="5">'.$mes.'/'.$_SESSION['ano'].'</td>';/*mes atual e ano*/
	$res .= "<td class=\"mes\"><a href=\"java script:void(0);\" onclick=\"xajax_Proximo($proximo);\" title=\"Próximo mês\"><img src=\"prox.gif\" border=\"0\"></a></td>";/*Proximo mês*/
	$res .= '</tr><tr>';
	$res .= '<td class="sem">D</td>';
	$res .= '<td class="sem">S</td>';
	$res .= '<td class="sem">T</td>';
	$res .= '<td class="sem">Q</td>';
	$res .= '<td class="sem">Q</td>';
	$res .= '<td class="sem">S</td>';
	$res .= '<td class="sem">S</td>';
	$res .= '</tr><tr>';
	$dt = 1;
	if($branco > 0){
 for($x = 0; $x < $branco; $x++){
 $res .= '<td> </td>';/*preenche os espaços em branco*/
 $dt++;
 }
	}

	for($i = 1; $i <= $n; $i++ ){/*agora vamos no banco de dados verificar os evendos*/
 $dtevento = $i."-".$month."-".$_SESSION['ano'];
 mysql_query("SET CHARACTER SET utf8");
 $sqlag = mysql_query("SELECT * FROM agenda WHERE dtevento = '$dtevento'") or die(mysql_error());
 $num = mysql_num_rows($sqlag);/*quantos eventos tem para o mes*/
 $id = @mysql_result($sqlag, 0, "id");
 $idev = @mysql_result($sqlag, 0, "dtevento");
 $eve = @mysql_result($sqlag, 0, "evento");
 if($num > 0){/*prevalece qualquer dia especial do calendario, por isso está em primeiro*/
 $res .= '<td class="evt">';
 $res .= "<a href=\"java script:void(0);\" onclick=\"xajax_Mostrar($id);\">".$i."</a>";
 $res .= '</td>';
 $dt++;/*incrementa os dias da semana*/
 $qt++;/*quantos eventos tem no mes*/
 }elseif($i == $hoje){/*imprime os dia corrente*/
 $res .= '<td class="hj">';
 $res .= $i;
 $res .= '</td>';
 $dt++;

 }elseif($dt == 1){/*imprime os domingos*/
 $res .= '<td class="dom">';
 $res .= $i;
 $res .= '</td>';
 $dt++;
 }else{/*imprime os dias normais*/
 $res .= '<td class="td">';
 $res .= $i;
 $res .= '</td>';
 $dt++;
 }
 if($dt > 7){/*faz a quebra no sabado*/
 $res .= '</tr><tr>';
 $dt = 1;
 }
	}
	$res .= '</tr>';
	$res .= '</table>';
	$resposta->assign("conteudo", "innerHTML", $res);//Registra os valores
	$resposta->clear("eventos", "innerHTML");//apaga o evento mostrado
	return $resposta;//Retorna os valores
}

########################################

Funçao que avança entre os meses #

########################################

function Proximo($proximo){
	$resposta = new xajaxResponse();
	//sleep(2);//habilite para ver loading no localserver
	$dia = date('d');
	$month = $proximo;
	$_SESSION['ano'];
	$hoje = date('j');//função importante pego o dia corrente
	if($month == 13){//caso o mes for maior que dezembro
 $month = 1;
 $_SESSION['ano'] = $_SESSION['ano'] + 1;
 }

switch($month.$n){/notem duas variaveis para o switch para identificar dia e limitar numero de dias/

	case 1: $mes = "JANEIRO";
 $n = 31;
	break;
	case 2: $mes = "FEVEREIRO";// todo ano bixesto fev tem 29 dias
 $bi = $ano % 4;//anos multiplos de 4 são bixestos
 if($bi == 0){
 $n = 29;
 }else{
 $n = 28;
 }
	break;
	case 3: $mes = "MARÇO";
 $n = 31;
	break;
	case 4: $mes = "ABRIL";
 $n = 30;
	break;
	case 5: $mes = "MAIO";
 $n = 31;
	break;
	case 6: $mes = "JUNHO";
 $n = 30;
	break;
	case 7: $mes = "JULHO";
 $n = 31;
	break;
	case 8: $mes = "AGOSTO";
 $n = 31;
	break;
	case 9: $mes = "SETEMBRO";
 $n = 30;
	break;
	case 10: $mes = "OUTUBRO";
 $n = 31;
	break;
	case 11: $mes = "NOVEMBRO";
 $n = 30;
	break;
	case 12: $mes = "DEZEMBRO";
 $n = 31;
	break;
}

$pdianu = mktime(0,0,0,$month,1,$_SESSION['ano']);//primeiros dias do mes

$dialet = date('D', $pdianu);//escolhe pelo dia da semana
switch($dialet){//verifica que dia cai

	case "Sun": $branco = 0; break;
	case "Mon": $branco = 1; break;
	case "Tue": $branco = 2; break;
	case "Wed": $branco = 3; break;
	case "Thu": $branco = 4; break;
	case "Fri": $branco = 5; break;
	case "Sat": $branco = 6; break;
}

	$res .= '<table class="tabela" >';//construção do calendario
	$res .= '<tr>';
	$antes = $month - 1;
	$proximo = $month + 1;
	$res .= "<td class=\"mes\"><a href=\"java script:void(0);\" onclick=\"xajax_Antes($antes);\" title=\"Mês anterior\"><img src=\"ant.gif\" border=\"0\"></a></td>";/*mês anterior*/
	$res .= '<td class="mes" colspan="5">'.$mes.'/'.$_SESSION['ano'].'</td>';/*mes atual e ano*/
	$res .= "<td class=\"mes\"><a href=\"java script:void(0);\" onclick=\"xajax_Proximo($proximo);\" title=\"Próximo mês\"><img src=\"prox.gif\" border=\"0\"></a></td>";/*Proximo mês*/
	$res .= '</tr><tr>';
	$res .= '<td class="sem">D</td>';//$res .= ar os dias da semana
	$res .= '<td class="sem">S</td>';
	$res .= '<td class="sem">T</td>';
	$res .= '<td class="sem">Q</td>';
	$res .= '<td class="sem">Q</td>';
	$res .= '<td class="sem">S</td>';
	$res .= '<td class="sem">S</td>';
	$res .= '</tr><tr>';
	$dt = 1;
	if($branco > 0){
 for($x = 0; $x < $branco; $x++){
 $res .= '<td> </td>';/*preenche os espaços em branco*/
 $dt++;
 }
	}

	for($i = 1; $i <= $n; $i++ ){/*agora vamos no banco de dados verificar os evendos*/
 $dtevento = $i."-".$month."-".$_SESSION['ano'];
 mysql_query("SET CHARACTER SET utf8");
 $sqlag = mysql_query("SELECT * FROM agenda WHERE dtevento = '$dtevento'") or die(mysql_error());
 $num = mysql_num_rows($sqlag);/*quantos eventos tem para o mes*/
 $id = @mysql_result($sqlag, 0, "id");
 $idev = @mysql_result($sqlag, 0, "dtevento");
 $eve = @mysql_result($sqlag, 0, "evento");
 if($num > 0){/*prevalece qualquer dia especial do calendario, por isso está em primeiro*/
 $res .= '<td class="evt">';
 $res .= "<a href=\"java script:void(0);\" onclick=\"xajax_Mostrar($id);\">".$i."</a>";
 $res .= '</td>';
 $dt++;/*incrementa os dias da semana*/
 $qt++;/*quantos eventos tem no mes*/
 }elseif($i == $hoje){/*imprime os dia corrente*/
 $res .= '<td class="hj">';
 $res .= $i;
 $res .= '</td>';
 $dt++;

 }elseif($dt == 1){/*imprime os domingos*/
 $res .= '<td class="dom">';
 $res .= $i;
 $res .= '</td>';
 $dt++;
 }else{/*imprime os dias normais*/
 $res .= '<td class="td">';
 $res .= $i;
 $res .= '</td>';
 $dt++;
 }
 if($dt > 7){/*faz a quebra no sabado*/
 $res .= '</tr><tr>';
 $dt = 1;
 }
	}
	$res .= '</tr>';
	$res .= '</table>';
	$resposta->assign("conteudo", "innerHTML", $res);//Registra os valores
	$resposta->clear("eventos", "innerHTML");//apaga o evento mostrado
	return $resposta;//Retorna os valores
}

####################################################

Função que cria o Calendário e registra o Ano #

####################################################

function Agenda(){
	$resposta = new xajaxResponse();
	//sleep(2);//Habilite para ver o loading no localserver
	$dia = date('d');
	$month = ltrim(date('m'),"0");/*ltrim elimina os zeros anteposto no mes*/
	session_register('ano');//Regitra a sessão
	$_SESSION['ano']= date('Y');//Registra o ano corrente
	$hoje = date('j');//função importante pego o dia corrente

switch($month.$n){/notem duas variaveis para o switch para identificar dia e limitar numero de dias/

	case 1: $mes = "JANEIRO";
 $n = 31;
	break;
	case 2: $mes = "FEVEREIRO";// todo ano bixesto fev tem 29 dias
 $bi = $_SESSION['ano'] % 4;//anos multiplos de 4 são bixestos
 if($bi == 0){
 $n = 29;
 }else{
 $n = 28;
 }
	break;
	case 3: $mes = "MARÇO";
 $n = 31;
	break;
	case 4: $mes = "ABRIL";
 $n = 30;
	break;
	case 5: $mes = "MAIO";
 $n = 31;
	break;
	case 6: $mes = "JUNHO";
 $n = 30;
	break;
	case 7: $mes = "JULHO";
 $n = 31;
	break;
	case 8: $mes = "AGOSTO";
 $n = 31;
	break;
	case 9: $mes = "SETEMBRO";
 $n = 30;
	break;
	case 10: $mes = "OUTUBRO";
 $n = 31;
	break;
	case 11: $mes = "NOVEMBRO";
 $n = 30;
	break;
	case 12: $mes = "DEZEMBRO";
 $n = 31;
	break;
}

$pdianu = mktime(0,0,0,$month,1,$_SESSION['ano']);//primeiros dias do mes

$dialet = date('D', $pdianu);//escolhe pelo dia da semana
switch($dialet){//verifica que dia cai

	case "Sun": $branco = 0; break;
	case "Mon": $branco = 1; break;
	case "Tue": $branco = 2; break;
	case "Wed": $branco = 3; break;
	case "Thu": $branco = 4; break;
	case "Fri": $branco = 5; break;
	case "Sat": $branco = 6; break;
}

	$res .= '<table class="tabela" >';//construção do calendario
	$res .= '<tr>';
	$antes = $month - 1;//diminui um mes quando volta
	$proximo = $month + 1;// aumenta um mes quando avança
	$res .= "<td class=\"mes\"><a href=\"java script:void(0);\" onclick=\"xajax_Antes($antes);\" title=\"Mês anterior\"><img src=\"ant.gif\" border=\"0\"></a></td>";/*mês anterior*/
	$res .= '<td class="mes" colspan="5">'.$mes.'/'.$_SESSION['ano'].'</td>';/*mes atual e ano*/
	$res .= "<td class=\"mes\"><a href=\"java script:void(0);\" onclick=\"xajax_Proximo($proximo);\" title=\"Próximo mês\"><img src=\"prox.gif\" border=\"0\"></a></td>";/*Proximo mês*/
	$res .= '</tr><tr>';
	$res .= '<td class="sem">D</td>';
	$res .= '<td class="sem">S</td>';
	$res .= '<td class="sem">T</td>';
	$res .= '<td class="sem">Q</td>';
	$res .= '<td class="sem">Q</td>';
	$res .= '<td class="sem">S</td>';
	$res .= '<td class="sem">S</td>';
	$res .= '</tr><tr>';
	$dt = 1;
	if($branco > 0){
 for($x = 0; $x < $branco; $x++){
 $res .= '<td> </td>';/*preenche os espaços em branco*/
 $dt++;
 }
	}

	for($i = 1; $i <= $n; $i++ ){/*agora vamos no banco de dados verificar os evendos*/
 $dtevento = $i."-".$month."-".$_SESSION['ano'];
 mysql_query("SET CHARACTER SET utf8");
 $sqlag = mysql_query("SELECT * FROM agenda WHERE dtevento = '$dtevento'") or die(mysql_error());
 $num = mysql_num_rows($sqlag);/*quantos eventos tem para o mes*/
 $id = @mysql_result($sqlag, 0, "id");
 $idev = @mysql_result($sqlag, 0, "dtevento");
 $eve = @mysql_result($sqlag, 0, "evento");
 if($num > 0){/*prevalece qualquer dia especial do calendario, por isso está em primeiro*/
 $res .= '<td class="evt">';
 $res .= "<a href=\"java script:void(0);\" onclick=\"xajax_Mostrar($id);\">".$i."</a>";
 $res .= '</td>';
 $dt++;/*incrementa os dias da semana*/
 $qt++;/*quantos eventos tem no mes*/
 }elseif($i == $hoje){/*imprime os dia corrente*/
 $res .= '<td class="hj">';
 $res .= $i;
 $res .= '</td>';
 $dt++;

 }elseif($dt == 1){/*imprime os domingos*/
 $res .= '<td class="dom">';
 $res .= $i;
 $res .= '</td>';
 $dt++;
 }else{/*imprime os dias normais*/
 $res .= '<td class="td">';
 $res .= $i;
 $res .= '</td>';
 $dt++;
 }
 if($dt > 7){/*faz a quebra no sabado*/
 $res .= '</tr><tr>';
 $dt = 1;
 }
	}
	$res .= '</tr>';
	$res .= '</table>';
	$resposta->assign("conteudo", "innerHTML", $res);//Recebe os valore os valores
	return $resposta;//Retorna os valores
}

###############################################

Funçao que mostra os eventos relacionados #

###############################################

function Mostrar($id){
	$resposta = new xajaxResponse();
	//sleep(2); //Habilite para ver no servidor local
	mysql_query("SET CHARACTER SET utf8");/* Configura os caracteres especiais do banco*/
	$select = mysql_query("SELECT * FROM agenda WHERE id = '$id'");
	$mais = @mysql_result($select, 0, "dtevento");
	$sqlev = mysql_query("SELECT * FROM agenda WHERE dtevento = '$mais' ORDER BY hora ASC") or die(mysql_error());
	$numev = mysql_num_rows($sqlev);
	for($j = 0; $j < $numev; $j++){/*caso no mesmo dia tenha mais eventos continua imprimindo */
	$eve = @mysql_result($sqlev, $j, "evento");/*pegando os valores do banco referente ao evento*/
	$dev = @mysql_result($sqlev, $j, "dtevento");
	$dsev = @mysql_result($sqlev, $j, "conteudo");
	$auev = @mysql_result($sqlev, $j, "autor");
	$lev = @mysql_result($sqlev, $j, "local");
	$psev = @mysql_result($sqlev, $j, "data");
	$nowev = date('d/m/Y - H:i', strtotime($psev));/*transforma a data para data padrão brazil*/
	$hev = @mysql_result($sqlev, $j, "hora");
	$res .= '<table width="300" cellspacing="0" cellpadding="0">';/*monta a tabela de eventos*/
	$res .= '<tr><td class="show">'.$dev.' - '.$eve.'</td></tr>';
	$res .= '<tr><td class="linha"><b>Hora: </b>'.$hev.'hs</td></tr>';
	$res .= '<tr><td class="linha"><b>Local: </b>'.$lev.'</td></tr>';
	$res .= '<tr><td class="linha"><b>Descrição: </b>'.nl2br($dsev).'</td></tr>';/*mantem o quebra da linha para dascriçao do evento*/
	$res .= '<tr><td class="linha"><b>Postado: </b><small>'.$nowev.'hs por '.$auev.'</small></td></tr>';
	$res .= '</table>';
	}
	$resposta->assign("eventos", "innerHTML", $res);//Registra os valores e destinos
	return $resposta;//Retorna os valores
}
?>

No link abaixo é possível visualizar o tópico sobre a área administrativa do Calendário:

ÁREA ADMINISTRATIVA DO CALENDÁRIO

Baixar os arquivos utilizados neste Tutorial

DOWNLOAD ARQUIVOS DA AGENDA

Bom galera espero ter ajudado à todos.

Qualquer dúvida, posta aí ou envia e-mail para gaspar.teixeira@gmail.com

Grande abraço e um Feliz Natal à todos!!!! http://forum.imasters.com.br/public/style_emoticons/default/natal_wink.gif

Gaspar Teixeira

Discussão (6)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

Carregando comentários...