Desenvolvendo um componente de calendário dinâmico em PHP

Estou desenvolvendo uma aplicação em PHP que vai utilizar módulos, já tenho muitas coisas desenvolvidas para o sistema. A medida que eu for terminando meus componentes, pretendo escrever passo a passo como foram desenvolvidos cada um deles. Hoje irei falar sobre o primeiro módulo (calendário).

[ Hits: 31.610 ]

Por: Leonam Souza em 09/11/2007


Código completo



Bom, espero ter sido útil. Logo abaixo estarei deixando o código completo.

Se por um acaso alguém estiver interessado na estrutura que montei usando o fireworks, basta me mandar um e-mail no lsouzabr@gmail.com, que eu mando o pacote completo com todas as imagens (já fatiadas), e claro o código em php.

Até mais!!!

"As produções de todas as artes são tipos de poesias e seus artesões são todos poetas." - Platão

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Blogsphere Calendar</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
td img {display: block;}body,td,th {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 10px;
   color: #000000;
}
body {
   margin-left: 0px;
   margin-top: 0px;
}
.style5 {font-family: Arial, Helvetica, sans-serif; font-size: 9px; }
.style2 {color: #FF0000}
.style3 {font-size: 10px}
</style>
<!--Fireworks 8 Dreamweaver 8 target.  Created Thu Oct 04 09:31:01 GMT-0400 2007-->
</head>
<body bgcolor="#ffffff">
<table border="0" cellpadding="0" cellspacing="0" width="138">
<!-- fwtable fwsrc="calendar.png" fwbase="calendar.jpg" fwstyle="Dreamweaver" fwdocid = "1456270348" fwnested="0" -->
  <tr>
   <td><img src="images/spacer.gif" width="1" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="3" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="16" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="3" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="16" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="3" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="16" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="3" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="16" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="3" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="16" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="3" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="16" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="3" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="16" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="3" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="1" height="1" border="0" alt="" /></td>
   <td><img src="images/spacer.gif" width="1" height="1" border="0" alt="" /></td>
  
    <?php
   /*
   **************************************************
   *   ESTE TRECHO DE CÓDIGO FAZ PARTE DO PROJETO BLOGSPHERE, FOI PROGRAMADO POR LEONAM
   *   SOUZA.
   *   VOCÊ TÊM TOTAL LIBERDADE DE USAR, MODIFICAR E DISTRIBUIR
   *   SEJA UM PROGRAMADOR DE ESTILO E PRESERVE O NOME DO CRIADOR.
   *************************************************
   */
  

//$_GET[$mes];
//$_GET[$ano];

$mes=date(m);

$ano=date(Y);






switch($mes)
{
   case "1":
    $mes_pt="Janeiro";
    break;
   case "2":
    $mes_pt="Fevereiro";
    break;
   case "3":
    $mes_pt="Março";
    break;
   case "4":
    $mes_pt="Abril";
    break;
   case "5":
    $mes_pt="Maio";
    break;
   case "6":
    $mes_pt="Junho";
    break;
   case "7":
    $mes_pt="Julho";
    break;
   case "8":
    $mes_pt="Agosto";
    break;
   case "9":
    $mes_pt="Setembro";
    break;
   case "10":
    $mes_pt="Outubro";
    break;
   case "11":
    $mes_pt="Novembro";
    break;
   case "12":
    $mes_pt="Dezembro";
    break;
}


$inicio_mes=date('w',mktime(0, 0, 0, $mes, 1,$ano))+1;

$fim_mes=date('t', mktime (0,0,0,$mes,1,$ano));



$vet[$inicio_mes]=1;

//echo $fim_mes;

for($x=$inicio_mes;$x<=$fim_mes+($inicio_mes-1);$x++)
{
$vet[$x]=$vet[$x-1]+1;
}
?>
</tr>

  <tr>
   <td colspan="17"><img name="calendar_r1_c1" src="images/calendar_r1_c1.jpg" width="138" height="1" border="0" id="calendar_r1_c1" alt="" /></td>
   <td><img src="images/spacer.gif" width="1" height="1" border="0" alt="" /></td>
  </tr>
  <tr>
   <td rowspan="16"><img name="calendar_r2_c1" src="images/calendar_r2_c1.jpg" width="1" height="150" border="0" id="calendar_r2_c1" alt="" /></td>
   <td colspan="15" align="center" valign="middle" background="images/calendar_r2_c2.jpg"><div align="center" class="style5 style3"><?php echo $mes_pt; ?></div></td>
   <td rowspan="16"><img name="calendar_r2_c17" src="images/calendar_r2_c17.jpg" width="1" height="150" border="0" id="calendar_r2_c17" alt="" /></td>
   <td><img src="images/spacer.gif" width="1" height="12" border="0" alt="" /></td>
  </tr>
  <tr>
   <td colspan="15"><img name="calendar_r3_c2" src="images/calendar_r3_c2.jpg" width="136" height="4" border="0" id="calendar_r3_c2" alt="" /></td>
   <td><img src="images/spacer.gif" width="1" height="4" border="0" alt="" /></td>
  </tr>
  <tr>
   <td rowspan="14"><img name="calendar_r4_c2" src="images/calendar_r4_c2.jpg" width="3" height="134" border="0" id="calendar_r4_c2" alt="" /></td>
   <td><div align="center" class="style2">D</div></td>
   <td rowspan="14"><div align="center"><img name="calendar_r4_c4" src="images/calendar_r4_c4.jpg" width="3" height="134" border="0" id="calendar_r4_c4" alt="" /></div></td>
   <td><div align="center">S</div></td>
   <td rowspan="14"><div align="center"><img name="calendar_r4_c6" src="images/calendar_r4_c6.jpg" width="3" height="134" border="0" id="calendar_r4_c6" alt="" /></div></td>
   <td><div align="center">T</div></td>
   <td rowspan="14"><div align="center"><img name="calendar_r4_c8" src="images/calendar_r4_c8.jpg" width="3" height="134" border="0" id="calendar_r4_c8" alt="" /></div></td>
   <td><div align="center">Q</div></td>
   <td rowspan="14"><div align="center"><img name="calendar_r4_c10" src="images/calendar_r4_c10.jpg" width="3" height="134" border="0" id="calendar_r4_c10" alt="" /></div></td>
   <td><div align="center">Q</div></td>
   <td rowspan="14"><div align="center"><img name="calendar_r4_c12" src="images/calendar_r4_c12.jpg" width="3" height="134" border="0" id="calendar_r4_c12" alt="" /></div></td>
   <td><div align="center">S</div></td>
   <td rowspan="14"><div align="center"><img name="calendar_r4_c14" src="images/calendar_r4_c14.jpg" width="3" height="134" border="0" id="calendar_r4_c14" alt="" /></div></td>
   <td><div align="center">S</div></td>
   <td rowspan="14"><img name="calendar_r4_c16" src="images/calendar_r4_c16.jpg" width="3" height="134" border="0" id="calendar_r4_c16" alt="" /></td>
   <td><img src="images/spacer.gif" width="1" height="16" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><img name="calendar_r5_c3" src="images/calendar_r5_c3.jpg" width="16" height="3" border="0" id="calendar_r5_c3" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r5_c5" src="images/calendar_r5_c5.jpg" width="16" height="3" border="0" id="calendar_r5_c5" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r5_c7" src="images/calendar_r5_c7.jpg" width="16" height="3" border="0" id="calendar_r5_c7" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r5_c9" src="images/calendar_r5_c9.jpg" width="16" height="3" border="0" id="calendar_r5_c9" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r5_c11" src="images/calendar_r5_c11.jpg" width="16" height="3" border="0" id="calendar_r5_c11" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r5_c13" src="images/calendar_r5_c13.jpg" width="16" height="3" border="0" id="calendar_r5_c13" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r5_c15" src="images/calendar_r5_c15.jpg" width="16" height="3" border="0" id="calendar_r5_c15" alt="" /></div></td>
   <td><img src="images/spacer.gif" width="1" height="3" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><?php echo $vet[1]; ?></div></td>
   <td><div align="center"><?php echo $vet[2]; ?></div></td>
   <td><div align="center"><?php echo $vet[3]; ?></div></td>
   <td><div align="center"><?php echo $vet[4]; ?></div></td>
   <td><div align="center"><?php echo $vet[5]; ?></div></td>
   <td><div align="center"><?php echo $vet[6]; ?></div></td>
   <td><div align="center"><?php echo $vet[7]; ?></div></td>
   <td><img src="images/spacer.gif" width="1" height="16" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><img name="calendar_r7_c3" src="images/calendar_r7_c3.jpg" width="16" height="3" border="0" id="calendar_r7_c3" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r7_c5" src="images/calendar_r7_c5.jpg" width="16" height="3" border="0" id="calendar_r7_c5" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r7_c7" src="images/calendar_r7_c7.jpg" width="16" height="3" border="0" id="calendar_r7_c7" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r7_c9" src="images/calendar_r7_c9.jpg" width="16" height="3" border="0" id="calendar_r7_c9" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r7_c11" src="images/calendar_r7_c11.jpg" width="16" height="3" border="0" id="calendar_r7_c11" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r7_c13" src="images/calendar_r7_c13.jpg" width="16" height="3" border="0" id="calendar_r7_c13" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r7_c15" src="images/calendar_r7_c15.jpg" width="16" height="3" border="0" id="calendar_r7_c15" alt="" /></div></td>
   <td><img src="images/spacer.gif" width="1" height="3" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><?php echo $vet[8]; ?></div></td>
   <td><div align="center"><?php echo $vet[9]; ?></div></td>
   <td><div align="center"><?php echo $vet[10]; ?></div></td>
   <td><div align="center"><?php echo $vet[11]; ?></div></td>
   <td><div align="center"><?php echo $vet[12]; ?></div></td>
   <td><div align="center"><?php echo $vet[13]; ?></div></td>
   <td><div align="center"><?php echo $vet[14]; ?></div></td>
   <td><img src="images/spacer.gif" width="1" height="16" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><img name="calendar_r9_c3" src="images/calendar_r9_c3.jpg" width="16" height="3" border="0" id="calendar_r9_c3" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r9_c5" src="images/calendar_r9_c5.jpg" width="16" height="3" border="0" id="calendar_r9_c5" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r9_c7" src="images/calendar_r9_c7.jpg" width="16" height="3" border="0" id="calendar_r9_c7" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r9_c9" src="images/calendar_r9_c9.jpg" width="16" height="3" border="0" id="calendar_r9_c9" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r9_c11" src="images/calendar_r9_c11.jpg" width="16" height="3" border="0" id="calendar_r9_c11" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r9_c13" src="images/calendar_r9_c13.jpg" width="16" height="3" border="0" id="calendar_r9_c13" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r9_c15" src="images/calendar_r9_c15.jpg" width="16" height="3" border="0" id="calendar_r9_c15" alt="" /></div></td>
   <td><img src="images/spacer.gif" width="1" height="3" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><?php echo $vet[15]; ?></div></td>
   <td><div align="center"><?php echo $vet[16]; ?></div></td>
   <td><div align="center"><?php echo $vet[17]; ?></div></td>
   <td><div align="center"><?php echo $vet[18]; ?></div></td>
   <td><div align="center"><?php echo $vet[19]; ?></div></td>
   <td><div align="center"><?php echo $vet[20]; ?></div></td>
   <td><div align="center"><?php echo $vet[21]; ?></div></td>
   <td><img src="images/spacer.gif" width="1" height="16" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><img name="calendar_r11_c3" src="images/calendar_r11_c3.jpg" width="16" height="3" border="0" id="calendar_r11_c3" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r11_c5" src="images/calendar_r11_c5.jpg" width="16" height="3" border="0" id="calendar_r11_c5" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r11_c7" src="images/calendar_r11_c7.jpg" width="16" height="3" border="0" id="calendar_r11_c7" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r11_c9" src="images/calendar_r11_c9.jpg" width="16" height="3" border="0" id="calendar_r11_c9" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r11_c11" src="images/calendar_r11_c11.jpg" width="16" height="3" border="0" id="calendar_r11_c11" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r11_c13" src="images/calendar_r11_c13.jpg" width="16" height="3" border="0" id="calendar_r11_c13" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r11_c15" src="images/calendar_r11_c15.jpg" width="16" height="3" border="0" id="calendar_r11_c15" alt="" /></div></td>
   <td><img src="images/spacer.gif" width="1" height="3" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><?php echo $vet[22]; ?></div></td>
   <td><div align="center"><?php echo $vet[23]; ?></div></td>
   <td><div align="center"><?php echo $vet[24]; ?></div></td>
   <td><div align="center"><?php echo $vet[25]; ?></div></td>
   <td><div align="center"><?php echo $vet[26]; ?></div></td>
   <td><div align="center"><?php echo $vet[27]; ?></div></td>
   <td><div align="center"><?php echo $vet[28]; ?></div></td>
   <td><img src="images/spacer.gif" width="1" height="16" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><img name="calendar_r13_c3" src="images/calendar_r13_c3.jpg" width="16" height="3" border="0" id="calendar_r13_c3" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r13_c5" src="images/calendar_r13_c5.jpg" width="16" height="3" border="0" id="calendar_r13_c5" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r13_c7" src="images/calendar_r13_c7.jpg" width="16" height="3" border="0" id="calendar_r13_c7" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r13_c9" src="images/calendar_r13_c9.jpg" width="16" height="3" border="0" id="calendar_r13_c9" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r13_c11" src="images/calendar_r13_c11.jpg" width="16" height="3" border="0" id="calendar_r13_c11" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r13_c13" src="images/calendar_r13_c13.jpg" width="16" height="3" border="0" id="calendar_r13_c13" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r13_c15" src="images/calendar_r13_c15.jpg" width="16" height="3" border="0" id="calendar_r13_c15" alt="" /></div></td>
   <td><img src="images/spacer.gif" width="1" height="3" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><?php echo $vet[29]; ?></div></td>
   <td><div align="center"><?php echo $vet[30]; ?></div></td>
   <td><div align="center"><?php echo $vet[31]; ?></div></td>
   <td><div align="center"><?php echo $vet[32]; ?></div></td>
   <td><div align="center"><?php echo $vet[33]; ?></div></td>
   <td><div align="center"><?php echo $vet[34]; ?></div></td>
   <td><div align="center"><?php echo $vet[35]; ?></div></td>
   <td><img src="images/spacer.gif" width="1" height="16" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><img name="calendar_r15_c3" src="images/calendar_r15_c3.jpg" width="16" height="3" border="0" id="calendar_r15_c3" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r15_c5" src="images/calendar_r15_c5.jpg" width="16" height="3" border="0" id="calendar_r15_c5" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r15_c7" src="images/calendar_r15_c7.jpg" width="16" height="3" border="0" id="calendar_r15_c7" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r15_c9" src="images/calendar_r15_c9.jpg" width="16" height="3" border="0" id="calendar_r15_c9" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r15_c11" src="images/calendar_r15_c11.jpg" width="16" height="3" border="0" id="calendar_r15_c11" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r15_c13" src="images/calendar_r15_c13.jpg" width="16" height="3" border="0" id="calendar_r15_c13" alt="" /></div></td>
   <td><div align="center"><img name="calendar_r15_c15" src="images/calendar_r15_c15.jpg" width="16" height="3" border="0" id="calendar_r15_c15" alt="" /></div></td>
   <td><img src="images/spacer.gif" width="1" height="3" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><div align="center" class="style2"><?php echo $vet[36]; ?></div></td>
   <td><div align="center"><?php echo $vet[37]; ?></div></td>
   <td><div align="center"><?php echo $vet[38]; ?></div></td>
   <td><div align="center"><?php echo $vet[36]; ?></div></td>
   <td><div align="center"><?php echo $vet[40]; ?></div></td>
   <td><div align="center"><?php echo $vet[41]; ?></div></td>
   <td><div align="center"><?php echo $vet[42]; ?></div></td>
   <td><img src="images/spacer.gif" width="1" height="16" border="0" alt="" /></td>
  </tr>
  <tr>
   <td><img name="calendar_r17_c3" src="images/calendar_r17_c3.jpg" width="16" height="4" border="0" id="calendar_r17_c3" alt="" /></td>
   <td><img name="calendar_r17_c5" src="images/calendar_r17_c5.jpg" width="16" height="4" border="0" id="calendar_r17_c5" alt="" /></td>
   <td><img name="calendar_r17_c7" src="images/calendar_r17_c7.jpg" width="16" height="4" border="0" id="calendar_r17_c7" alt="" /></td>
   <td><img name="calendar_r17_c9" src="images/calendar_r17_c9.jpg" width="16" height="4" border="0" id="calendar_r17_c9" alt="" /></td>
   <td><img name="calendar_r17_c11" src="images/calendar_r17_c11.jpg" width="16" height="4" border="0" id="calendar_r17_c11" alt="" /></td>
   <td><img name="calendar_r17_c13" src="images/calendar_r17_c13.jpg" width="16" height="4" border="0" id="calendar_r17_c13" alt="" /></td>
   <td><img name="calendar_r17_c15" src="images/calendar_r17_c15.jpg" width="16" height="4" border="0" id="calendar_r17_c15" alt="" /></td>
   <td><img src="images/spacer.gif" width="1" height="4" border="0" alt="" /></td>
  </tr>
</table>
</body>
</html>

Página anterior    

Páginas do artigo
   1. Preparando o espaço para trabalhar
   2. Inserindo os dados na tabela
   3. Código completo
Outros artigos deste autor
Nenhum artigo encontrado.
Leitura recomendada

JOOMLA no openSUSE em 10 passos

Uma introdução à biblioteca GD

Gráficos em PHP Highcharts

O uso de templates em PHP

Lista de extensões preferidas para Joomla!

  
Comentários
[1] Comentário enviado por alexnuvix em 09/11/2007 - 09:54h

Muito Bom o artigo.

Como você deu a permissão gostária de usar em um portal Intranet que tenho aqui na empresa.
Teria como você disponibilizar as imagens ?

Se puder me envia por e -mail, se não puder ok, mas de qualquer forma valeu pelo artigo.

Abraço.

[2] Comentário enviado por engos em 09/11/2007 - 11:56h

Gostei da iniciativa.

Ainda tenho que parar e analisar com calma o código, mas sua idéia é bem interessante.

Recomendo colocar o script com imagens e tudo mais que for necessário na parte de scripts do VOL antes e depois quando for publicar já colocar o endereço do script.

Espero apenas que você tenha feito conforme as regras do W3C, principalmente no que diz respeito a separação dos arquivos de estilos, script, html etc.

Só o que não consegui visualizar ainda (nessa passagem rápida que fiz) foi a criação do script como uma classe para ser usada com os conceitos de orientação a objetos. Se não o fez, seria interessante migrar e já fazer os próximos assim.

Abraço.

[3] Comentário enviado por lsouzabr em 09/11/2007 - 16:53h

Bom, com relação as imagens, quando você acessa a versão para impressão elas irão aparecer, com relação ao w3c se não me engano falta uma correção com relação a forma como o bg foi declarado, mas isso é um ajuste muito simples.
Quando você for utilizar na forma de módulo, você precisa eliminar todo o código que não for relativo a tabela do calendário, por tanto, os heads, body, etc, precisam ser eliminados do html, ficando somente o <table> </table>.
Com relação ao conceito de orientação a objetos você realmente têm razão, porém é algo que pra te ser sincero eu preciso estudar mais pra criar algo do tipo.

Qualquer coisa, ou qualquer sugestão estamos ai!!!!
Falows, abração.

[4] Comentário enviado por fagnerfjas em 18/12/2009 - 15:57h

Era tudo o que eu precisava.
Ajudou e muito o meu trabalho!!!


Contribuir com comentário




Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts