ScriptCase Forum

Aplicações => Calendário => Tópico iniciado por: Wennys Carlos em Dezembro 12, 2013, 12:28:53 am

Título: UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 12:28:53 am

Prezados, segue um exemplo bem detalhado de uma alternativa, ao meu ver, ao uso das apps tipo calendário do SC.

Utilizo a mesma biblioteca(fullcalendar), porém utilizando uma app do tipo blank, da seguinte forma:


http://wennys.com.br/sistemas/modelos/fullcalendar/


Observem que dá para personalizar cores, eventos, formato das horas , títulos, limitar horários, desabilitar arrastar e soltar etc...


Postarei em seguida o passo a passo de como fazer e o código completo das aplicações.


Espero que ajude aos colegas.


Wennys Carlos
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 07:37:53 am
Segue código comentado da app blank:

echo "<script>
   
   var sc_pathToTB = '" . $this->Ini->path_prod . "/third/jquery_plugin/thickbox/'; /*VAR. NECESSARIA PARA O SC ENCONTRAR O PATH DO thickbox*/
   
     </script>";

echo "<link href='" . $this->Ini->path_prod . "/third/jquery_plugin/fullcalendar/fullcalendar.css' rel='stylesheet' />";

echo "<link href='" . $this->Ini->path_prod . "/third/jquery_plugin/fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print' />";

echo "<link href='" . $this->Ini->path_prod . "/third/jquery_plugin/thickbox/thickbox.css' rel='stylesheet' media='screen' />";

echo "<script type='text/javascript' src='" . $this->Ini->path_prod . "/third/jquery/js/jquery.js'></script>";

echo "<script type='text/javascript' src='" . $this->Ini->path_prod . "/third/jquery/js/jquery-ui.js'></script>"; //drag and drop

echo "<script type='text/javascript' src='" . $this->Ini->path_prod . "/third/jquery_plugin/fullcalendar/fullcalendar.min.js'></script>";

echo "<script type='text/javascript' src='" . $this->Ini->path_prod . "/third/jquery_plugin/thickbox/thickbox-compressed.js'></script>";
?>

<style>

   body {
      margin-top: 40px;
      text-align: center;
      font-size: 14px;
      font-family: Helvetica,Arial,Verdana,sans-serif;
      }

   #calendar {
      width: 1000px;
      margin: 0 auto;
      }

</style>
<script>

   $(document).ready(function() {
   
      var date = new Date();
      var d = date.getDate();
      var m = date.getMonth();
      var y = date.getFullYear();
      
      $('#calendar').fullCalendar({
         header: {
            left: 'month,agendaWeek,agendaDay' ,
            center: 'title',
            right: 'prev,next today'
         },
         
         buttonText: {
                 prev: '&lt;' , /*Botão Previous*/
                 next: '&gt;' , /*Botão Next*/
             today: 'Hoje', /*Botão Today*/
            month: 'Mês' , /*Botão Month*/
            week:  'Semana' , /*Botão Month*/
            day: 'Dia' /*Botão Day*/
          },
         
         /*TRADUÇÃO DOS MESES E DIAS*/
         monthNames: ["Janeiro","Fevereiro","Março","Abril","Maio","Junho","Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro" ],
         
         monthNamesShort: ["Jan","Fev","Mar","Abr","Mai","Jun","Jul", "Ago", "Set", "Out", "Nov", "Dez" ],

         dayNames: [ 'Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sábado'],
         
         dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb'] ,
         /*************************/
         
         timeFormat: 'H:mm', /*FORMATO DA HORA*/
         
         columnFormat: {
                
                week: 'dddd dd/M', /*Ex: Segunda 09/12*/
                   day: 'dddd'  /*Ex: Segunda*/
         },
         
         titleFormat: {
            //month: '',
            week: "MMM dd[ yyyy]{ '—'[ MMM] dd, yyyy}", /*FORMATO DO TITULO NO MODO AGENDA SEMANAL*/
            day: 'dddd, d/M/yyyy' /*FORMATO DO TÍTULO NO MODO DIA*/
         },
         
         editable: false , /*SE false, não permite arrastar e soltar os eventos*/
         
         /*EXEMPLOS DE ALGUMAS CONFIGURAÇÕES PARA O MODO AGENDA SEMANAL*/
         axisFormat: 'HH:mm' , /*FORMATO DA HORA MOSTRADA DO LADO ESQUERDO*/
         
         minTime: 8 , /*LIMITA O INICIO DO HORARIO A SER MOTRADO A 08:00 (0 a 23)*/
         
         maxTime: 21 , /*LIMITA O FIM DO HORARIO A SER MOTRADO A 20:00  (0 a 23)*/
         
         events: '../json/json.php' , /*AQUI É CHAMADO O ARQUIVO QUE FARÁ O PROCESSAMENTO PHP*/
         
         dayClick: function(date, allDay, jsEvent, view) {

            var diaClicado = $.fullCalendar.formatDate( date , 'yyyy-MM-dd' );
            
            var dia = $.fullCalendar.formatDate( date , 'dd/MM/yyyy' );
            
            tb_show('', '../form_evento/form_evento.php?diaClicado='+diaClicado+'&sc_cal_click_date=&nmgp_outra_jan=true&nmgp_url_saida=modal&TB_iframe=false&modal=false&height=400&width=600', '');
            //TAMBEM PODE SER ASSIM:   
            //window.open('../form_evento/form_evento.php?diaClicado='+diaClicado , '_blank' ,  'width=600,height=500');
         
          },
         
         height: 600, /*ALTURA DO CALENDARIO*/
         
         eventClick: function(calEvent, jsEvent, view) {
            
            var idevento   = calEvent.id;
            
            tb_show('', '../form_evento/form_evento.php?idevento='+idevento+'&sc_cal_click_date=&nmgp_outra_jan=true&nmgp_url_saida=modal&TB_iframe=false&modal=false&height=400&width=600', '');
            //TAMBEM PODE SER ASSIM:
            //window.open('../form_evento/form_evento.php?idevento='+idevento , 'JANELA' ,  'width=600,height=500');
            
         },
         
      });
      
   });

</script>
<div id='calendar'></div>
<?php
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 12, 2013, 07:39:33 am
Wennys, o resultado ficou muito bom mesmo vou testar o código. Muito obrigado e parabéns.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 07:44:42 am
Obrigado, Paulo.

A ideia é ajudar.

Tô comentando o código do arquivo que retorna o json para publicar.


Wennys
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 12, 2013, 07:45:42 am
Wennys, o json.php
 é mais ou menos assim em uma blank ou você usa as macros do scriptcase para a consulta:
<?php

 $json = array();

 $requete = "SELECT * FROM eventos ORDER BY id";

 // connection to the database
 try {
 $bdd = new PDO('mysql:host=localhost;dbname=fullcalendar', 'root', 'root');
 } catch(Exception $e) {
  exit('Unable to connect to database.');
 }
 // Execute the query
 $resultat = $bdd->query($requete) or die(print_r($bdd->errorInfo()));

 // sending the encoded result to success page
 echo json_encode($resultat->fetchAll(PDO::FETCH_ASSOC));

?>
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 07:48:26 am
//CÓDIGO DO ARQUIVO QUE GERA O JSON:
//APP DO TIPO BLANK:

sc_lookup(ds , "SELECT idevento , descricao , data , horainicio , horafim , status FROM evento");


for($i = 0 ; $i < count({ds}) ; $i++){

   $idevento = {ds[$i][0]};
      
   $descricao = {ds[$i][1]};
      
   $data = {ds[$i][2]};
      
   $horainicio = {ds[$i][3]};
      
   $horafim = {ds[$i][4]};
      
   $status = {ds[$i][5]};
      
   switch($status){
      
      case 'confirmado': $color = 'green';
      
      break;
   
      case 'aguardando' : $color = 'blue';
   
      break;
      
      case 'cancelado': $color = 'red';
      
      break;
   
   }      
   
   $resultado[] = array(
                  'id'     => $idevento ,
                  'title'  => utf8_encode($descricao) ,
                  'start'  => $data . " " . $horainicio ,
                  'end'    => $data . " " . $horafim,
                  'allDay' => false,
                  'color'  => $color
               );
   
      
}

echo json_encode( $resultado);
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 12, 2013, 07:48:55 am
Beleza vou esperar o seu código do arquivo json. O form_eventos é um form normal né? Ai a variável diaClicado você pega no form_evento como variável global de entrada?
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 07:52:13 am
Exato, Paulo.

form_evento é uma app do tipo form onde recebe [diaClicado].

Fiz apenas umas personalizações nela pra poder dar o efeito de atualizar o calendário embaixo qdo um evento é criado ou editado.

Wennys
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: George Carvalho em Dezembro 12, 2013, 08:06:45 am
Parabéns pela colaboração,

Tem 5 eventos cadastrados no Domingo 1/12 e só 4 são exibidos, como faço para corrigir?
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: George Carvalho em Dezembro 12, 2013, 08:09:30 am
Desculpa, esta correto, eu que não recarreguei a página.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 08:14:44 am
Olá, George.

É que, para efeito de demonstração, restringi o horário do calendário no modo SEMANA para os horários entre 08:00 e 20:00.

Por isso não aparecia o 4º evento do dia, que era 21;00.

Agora coloquei de 08:00 as 22:00 e aparece normalmente.

minTime: 8 , /*LIMITA O INICIO DO HORARIO A SER MOTRADO A 08:00 (0 a 23)*/
         
maxTime: 23 , /*LIMITA O FIM DO HORARIO A SER MOTRADO A 20:00  (0 a 23)*/


Wennys
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: George Carvalho em Dezembro 12, 2013, 08:18:17 am
Parabéns, perfeito.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: George Carvalho em Dezembro 12, 2013, 08:21:09 am
Obrigado, pode apagar o meu teste.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: George Carvalho em Dezembro 12, 2013, 08:24:39 am
Wennys,

Estou cancelando o evento TESTE e não acontece nada, verifica aí por favor.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 08:51:43 am
Corrigido, George.

Havia realmente um pequeno bug.

Wennys
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 12, 2013, 08:55:31 am
Mas o bug está nestes códigos disponibilizados ou no form_eventos?
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 09:06:35 am

Por causa de algumas limitações, programei para atualizar o calendário ao clicar no botão Fechar, da barra de ferramentas superior, logo que um evento é atualizado ou inserido.

Minha ideia era utilizar o fechamento automático após a inserção ou atualização, mas há um bug ou uma limitação no SC que não permitiu isso.

Wennys

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 09:42:37 am
O 'bug' ou limitação é no form_evento.

Quando uso um botão javascript para fazer o seguinte:

nm_atualiza('alterar');

window.parent.location.reload(); //para recarregar o calendario

Isso só funciona às vezes.

A opção de usar um botão javascript é pq não dá pra utilizar código javascript nos eventos onvalidate, onvalidatesucess etc..

por exemplo:

echo "<script>window.parent.location.reload();</script>";  //nao funciona nos eventos


Moral da história:

Como não deu certo nenhuma das 2 opções, utilizo mesmo os botões Incluir e Alterar do form e criei o botão javascript Fechar para recarregar o calendário e fechar a modal.



Wennys
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 12, 2013, 11:50:00 am
Wennys, sem querer abusar da sua generosidade em compartilhar este conhecimento conosco, o meu não está funcionando, veja abaixoo create da tabela e o json que ele retornoou

Json:
[{"id":"1","title":"teste","start":"2013-12-12 00:00:00.000 2013-12-12 09:00:00.000","end":"2013-12-12 00:00:00.000 1900-01-01 10:00:00.000","allDay":false,"color":"green"}]

SQL:
create table tbl_teste_eventos(
idevento int identity(1,1) Primary Key,
descricao varchar(255) not null,
data_evento datetime,
horainicio datetime,
horafim datetime,
status varchar(30)

)
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 12, 2013, 12:08:56 pm
Wennys deu certo mudei só os tipos de dados e funcionou.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 12, 2013, 12:09:32 pm
create table tbl_teste_eventos(
idevento int identity(1,1) Primary Key,
descricao varchar(255) not null,
data_evento date,
horainicio time,
horafim time,
status_evento varchar(30)

)

está assim agora e alterei os nomes de dois campos data e status
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 12:10:30 pm
Paulo, a diferença está no tipo de dado da data e das horas.

Eu utilizei tipo date pra data e tipo time pra hora.


Observa que no teu jso  retornado ta meio estranha a data e hora.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 12, 2013, 12:13:43 pm
Blza. Não tinha visto tua resposta.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 12, 2013, 12:36:34 pm
Ficou ótimo Wennys, fiz o teste aqui com o sql server e funcionou.
Título: UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: gilmonteiro em Dezembro 14, 2013, 12:33:22 pm
Wennys Carlos


Muito bom, Parabéns!


Estou com problema na mudança da cor só mostra a cor azul, tudo estar igual como no exemplo e nada.

No select do form no campo status atribuir o Label = Confirmado e Valor = Confirmado  e assim para os demais.


O que pode ser?


Gilmar Monteiro


Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 14, 2013, 12:51:03 pm
Gil, no switch da aplicação json, utilizo confirmado, cancelado e aguardando, pois esses sao os valores que cadastro no campo status da minha tabela evento.

Verifica se não teria que alterar isso no seu código .

Obrigado pelo feedback.


Wennys
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: gilmonteiro em Dezembro 14, 2013, 03:46:14 pm
Wennys Carlos

Nada feito!

Será que têm haver com a versão do sc a minha é v5.


segue anexo um arquivo com o código e do form

Gilmar Monteiro

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 14, 2013, 04:04:21 pm
No meu caso o scriptcase é da versão 7, não sei se isso influencia, só se a biblioteca fullcalendar mudou, você olhou no banco se os status estão sendo salvos corretamente.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 14, 2013, 04:14:43 pm
Não creio que seja algo relacionado com a versão do SC.

Sugiro que vc inspecione o código no seu navegador pra verificar se aparece algum erro javascript.

Ou execute diretamente o json para ver se tá gerando com as cores diferentes.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 14, 2013, 04:16:19 pm
executa o json para cada cor deferente e copia o que ele retorna e cola aqui
Exemplo:
[{"id":"1","title":"teste","start":"2013-12-12 00:00:00.000 2013-12-12 09:00:00.000","end":"2013-12-12 00:00:00.000 1900-01-01 10:00:00.000","allDay":false,"color":"green"}]
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: gilmonteiro em Dezembro 14, 2013, 05:50:20 pm
Paulo,

Se tiver correto!!!

[{"id":"9","title":"cccc","start":"2013-12-20 08:00:00","end":"2013-12-20 13:30:00","allDay":false,"color":"red"},{"id":"10","title":"dasd","start":"2013-12-20 08:00:00","end":"2013-12-20 22:00:00","allDay":false,"color":"green"}]

Mas no calendário só mostra a cor azul.


Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 14, 2013, 05:58:24 pm
Gil, ta gerando certinho.

Tenta limpar teu cache pra ver. Tenta em outro navegador tbm.

Era pra aparecerem as cores....
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: gilmonteiro em Dezembro 14, 2013, 06:11:19 pm
Wennys Carlos

Nada feito!!

Limpei todos os cache dos navegadores (internet,firefox e chrome).

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 14, 2013, 06:27:52 pm
Gil, vou dar uma olhada na versão do fullcalendar que o SC 5 utiliza.

Pode ser que seja uma versão bem antiga.

A versão que o SC7 utiliza é a 1.6.4.

Utilizo o fullcalendar desde a versão 1.5 e sempre aceitou cores nos eventos.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: gilmonteiro em Dezembro 14, 2013, 07:17:47 pm
Wennys ,

Se poder me informar o código a criar um botão javascript Fechar para recarregar o calendário e fechar a modal.

Ainda não conseguir mudar a cores.

Ficarei  no aguardo.

obg





Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 14, 2013, 07:47:54 pm
Eu havia esquecido de postar.

Para recarregar o calendário e fechar a janela modal crio um botão JavaScript e nele coloco o seguinte código :

window.parent.location.reload(); //recarrega o calendário

tb_remove(); //fecha a modal
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 14, 2013, 10:32:30 pm
Olá, Gil.

Verifiquei que a versão 5 do SC utiliza a versão 1.4.4 do Fullcalendar.

Pelo que vi na documentação do Fullcalendar, essa possibilidade de diferenciar as cores dos eventos foi implementada somente a partir da versão 1.5.

Vc tem 2 opções:

Ou faz upgrade do seu SC ou substitui o Fullcalendar em prod/third/jquery_plugin/fullcalendar por uma versão mais recente(são 3 arquivos somente).

Acho q isso não impactaria nas suas apps calendário que por ventura já existam.

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: paulomarcelo em Dezembro 15, 2013, 12:21:29 am
Muito bom Wennys, eu bem que desconfiei que podia ser a biblioteca, pois como eu mesmo já testei seu exemplo e funcionou, logo a não ser que a pessoa erre em algum detalhe do exemplo a diferença estaria nas bibliotecas do scriptcase devido a diferença de versões.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Alexandre Luiz em Dezembro 19, 2013, 08:52:24 am
Primeiramente parabéns pelo ótimo trabalho Wennys.

É possível retirar o campo hora no grid para aparecer somente a descrição ?

att.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 19, 2013, 09:26:45 am
Olá, aleluiz.

´
É possível sim.

Colocando-se assim o parâmetro timeFormat:

timeFormat: '', /*FORMATO DA HORA*/

Não aparecerá a hora ao lado do evento.


Wennys

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Alexandre Luiz em Dezembro 19, 2013, 11:12:01 am
SHOW !!!

Obrigado.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: gilmonteiro em Dezembro 22, 2013, 10:52:28 pm
Wennys Carlos

Onde eu pegaria os 3 arquivos para a substituição do Fullcalendar.

Pode ser da v6 ?


obg

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Dezembro 23, 2013, 11:19:59 am
Olá, Gil.

Os arquivos do fullcalendar estão no diretório:

/scriptcase/prod/third/jquery_plugin/fullcalendar.

Pode ser usado do SC6 sim.

Abraço.

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Jean Matos em Março 01, 2014, 11:16:33 am
Prezado, comecei a estudar essa app só que eu gravo o evento mas ele nao aparece na tela.
conferi e está gravando certo no BD - SQLSERVER.

mas nao renderiza na tela.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Jean Matos em Março 01, 2014, 11:26:02 am
Prezado, comecei a estudar essa app só que eu gravo o evento mas ele nao aparece na tela.
conferi e está gravando certo no BD - SQLSERVER.

mas nao renderiza na tela.

percebí que no Firefox acontece isso.. no Chrome Funfa.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Março 01, 2014, 11:32:20 am
Olá, Jean.

Aqui funciona certinho no firefox também.

Talvez seja algum outro detalhe.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Jean Matos em Março 01, 2014, 11:57:51 am
Olá, Jean.

Aqui funciona certinho no firefox também.

Talvez seja algum outro detalhe.
Nem imagino o que seja..

Mas mudando de assunto.. quero mostrar umas informações de uma tabela de ligações(telefonemas agendados), que já existe..
como faço ?

ví também que posso habilitar o arrastar e soltar.. como faz para atualizar o agendamento neste caso ?
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Março 01, 2014, 12:30:50 pm
Ainda não precisei utilizar o arrastar e soltar, mas não é muito complicado.

Tem uns exemplos aqui:

http://stackoverflow.com/questions/18238405/how-to-send-an-ajax-request-to-update-event-in-fullcalender-ui-when-eventdrop-i

http://stackoverflow.com/questions/18238405/how-to-send-an-ajax-request-to-update-event-in-fullcalender-ui-when-eventdrop-i

http://arshaw.com/fullcalendar/docs/event_ui/

Vou ver se arrumo um tempo pra postar um exemplo.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: wnolau em Março 07, 2014, 12:26:51 pm
Wennys, desculpe pela falta de conhecimento.

Fiz o app blank e funcionou.

Agora onde eu coloco o código que define as cores?
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Março 07, 2014, 01:33:35 pm
//CÓDIGO DO ARQUIVO QUE GERA O JSON:
//APP DO TIPO BLANK:

sc_lookup(ds , "SELECT idevento , descricao , data , horainicio , horafim , status FROM evento");


for($i = 0 ; $i < count({ds}) ; $i++){

   $idevento = {ds[$i][0]};
      
   $descricao = {ds[$i][1]};
      
   $data = {ds[$i][2]};
      
   $horainicio = {ds[$i][3]};
      
   $horafim = {ds[$i][4]};
      
   $status = {ds[$i][5]};
      
   switch($status){
      
      case 'confirmado': $color = 'green';
      
      break;
   
      case 'aguardando' : $color = 'blue';
   
      break;
      
      case 'cancelado': $color = 'red';
      
      break;
   
   }      
   
   $resultado[] = array(
                  'id'     => $idevento ,
                  'title'  => utf8_encode($descricao) ,
                  'start'  => $data . " " . $horainicio ,
                  'end'    => $data . " " . $horafim,
                  'allDay' => false,
                  'color'  => $color
               );
   
      
}

echo json_encode( $resultado);
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Paulo (ClickInformatica) em Março 23, 2014, 07:41:34 pm
Parabéns pela postagem
O problema e que eu tô meio perdido, você poderia colocar tipo um passo a passo, para implementar essa solução
agradeço a ajuda

Paulo
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: wnolau em Março 28, 2014, 01:52:10 pm
Parabéns pela postagem
O problema e que eu tô meio perdido, você poderia colocar tipo um passo a passo, para implementar essa solução
agradeço a ajuda

Paulo

Eu não comentei mais para não ser mais chato ainda, mas também não consegui implantar essa agenda.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: FredKeyster em Março 28, 2014, 04:39:26 pm
Eu consegui de boa, qual sua dificuldade?
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: jorgepopel em Março 28, 2014, 04:45:44 pm
Wennys,

Vc que é um expert no Full Calendar, já integrou ele com o Google Calendar?

Tem esse link que de repente ajude (a quem é mais esperto que eu) heheheh

http://arshaw.com/fullcalendar/docs/google_calendar/


Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: wnolau em Março 28, 2014, 05:44:59 pm
Eu consegui de boa, qual sua dificuldade?

Na verdade acho que minha dificuldade é total.

Eu crio o app blank e colo o codigo lá, crio a form, e funciona eu clico no dia e adiciono o evento, mas o calendário não me exibe nada, só vejo o que foi lançado quando clico na data ai me abre o form e vejo os eventos adicionados.

Também não soube onde por o código do  JSON. Crio outro app blank, mas com que nome? Não sei como funciona, sou iniciante.

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Março 29, 2014, 11:31:52 am
Eu consegui de boa, qual sua dificuldade?

Na verdade acho que minha dificuldade é total.

Eu crio o app blank e colo o codigo lá, crio a form, e funciona eu clico no dia e adiciono o evento, mas o calendário não me exibe nada, só vejo o que foi lançado quando clico na data ai me abre o form e vejo os eventos adicionados.

Também não soube onde por o código do  JSON. Crio outro app blank, mas com que nome? Não sei como funciona, sou iniciante.

Para o JSON, é necessária uma outra app BLANK. O nome dessa app, vc coloca nesse trecho de código na app do calendário: 

Citar
events: '../json/json.php' , /*AQUI É CHAMADO O ARQUIVO QUE FARÁ O PROCESSAMENTO PHP*/

Sem o JSON, não vai aparecer nada no calendário.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Março 29, 2014, 11:32:59 am
Wennys,

Vc que é um expert no Full Calendar, já integrou ele com o Google Calendar?

Tem esse link que de repente ajude (a quem é mais esperto que eu) heheheh

http://arshaw.com/fullcalendar/docs/google_calendar/

Olá, grande Jorge.

Vou dar uma olhada.

Grande abraço.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: wnolau em Março 30, 2014, 11:39:59 pm
Wennys, consegui! Obrigado.

Agora quando clico em qualquer evento lançado ele me abre um modal com todos lançamentos começando pelo id 1.
Como faço para abrir direto o evento clicado?

Grande abraço
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Março 30, 2014, 11:54:03 pm
Wennys, consegui! Obrigado.

Agora quando clico em qualquer evento lançado ele me abre um modal com todos lançamentos começando pelo id 1.
Como faço para abrir direto o evento clicado?

Grande abraço

Se vc fez exatamente como eu descrevi no JSON  e no calendário, é pra funcionar....

Esse trecho de código no JSON é o responsável por passar o código do evento(id) para o calendário:
Código: [Selecionar]
$resultado[] = array(
                  'id'     => $idevento ,
                  'title'  => utf8_encode($descricao) ,
                  'start'  => $data . " " . $horainicio ,
                  'end'    => $data . " " . $horafim,
                  'allDay' => false,
                  'color'  => $color
               );
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: wnolau em Março 31, 2014, 02:16:34 pm
Meus campos são um pouco diferentes, e eu não estou usando data e hora final, será esse o problema?

Olha como está o json:



sc_lookup(ds , "SELECT id , usuario , empresa , contato , telefone , email , obs , h_ini , d_ini FROM eventos");


for($i = 0 ; $i < count({ds}) ; $i++){

   $id = {ds[$i][0]};
     
   $usuario = {ds[$i][1]};
     
   $empresa = {ds[$i][2]};
     
   $contato = {ds[$i][3]};
     
   $telefone = {ds[$i][4]};
     
   $email = {ds[$i][5]};
      
   $obs = {ds[$i][6]};
      
   $h_ini = {ds[$i][7]};
      
   $d_ini = {ds[$i][8]};
      
   switch($usuario){
     
      case 'Admin': $color = 'green';
     
      break;
   
      case 'Leandro Soares' : $color = 'pink';
   
      break;
     
      case 'cancelado': $color = 'red';
     
      break;
   
   }     
   
   $resultado[] = array(
                  'id'     => $id ,
                  'title'  => utf8_encode($empresa) ,
                  'start'  => $d_ini . " " . $h_ini ,
                  'end'    => $d_ini . " " . $h_ini,
                  'allDay' => false,
                  'color'  => $color
               );
   
     
}

echo json_encode( $resultado);
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: liga em Abril 04, 2014, 06:23:57 pm
Parabéns Wennys!!! Muito obrigado pelas informações. Consegui implementar aqui e ficou show de bola.

Como foi feito, o calendário sempre carrega na visão mês (month), após clicar no botão javascript Fechar do form_evento.php, mesmo que o usuário esteja usando a agenda na visão dia (agendaDay).

Seria muito bom se a aplicação blank carregasse na mesma visão que estava antes de carregar o formulário form_evento.php.

Seria possível isso? Espero ter sido claro. Obrigado.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: liga em Abril 07, 2014, 10:28:56 pm
Após algumas tentativas consegui resolver, utilizando variável global e a opção defaultView do FullCalendar.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Celso R. em Abril 07, 2014, 10:42:38 pm
Parabéns atrasado pela postagem. Ficou muito bom.
Assim que possível quero estudar essa sua app.
Uma vez até comprei uma app para sc sobre esse assunto e não consegui ir para frente... srsrsrs
Com seu exemplo ficou muito bom mesmo.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: julianoo em Abril 21, 2014, 06:44:54 pm
Muito obrigado Wennys, funcionou, parabéns!

Só não consegui capturar data e hora para evento novo, alguém conseguiu?

[]´s
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: julianoo em Abril 26, 2014, 05:24:52 pm
Resolvi minha dúvida, vou colocar  a solução para quem esta na mesma situação
"Só não consegui capturar data e hora para evento novo, alguém conseguiu?"

No blank fullcalendar

Acrescentei uma linha após a var diaClicado
    var diaClicado = $.fullCalendar.formatDate( date , 'yyyy-MM-dd' );
    var HoraIni  = $.fullCalendar.formatDate( date , 'HH:mm' );

A chamada do form_evento ficou assim:
tb_show('', '../form_evento/form_evento.php?par_controle=0&diaClicado='+diaClicado+'&HoraIni='+HoraIni+'&sc_cal_click_date=&nmgp_outra_jan=true&nmgp_opcao=igual&nmgp_url_saida=modal&TB_iframe=true&height=600&width=600&modal=true', '');

Peguei a hora inicial e somei 30 minutos para hora_final

No form_evento coloquei no event OnLoad
if (isset($_GET['diaClicado'])){data_inicio} =  $_GET['diaClicado'];
if (isset($_GET['HoraIni'])){
   {hora_inicio} =  $_GET['HoraIni'];
   
   $horaNova = strtotime($_GET['HoraIni']." + 30 minutes");
   // Formato o resultado
   {hora_final} = date("H:i",$horaNova);
}

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: weber em Maio 09, 2014, 10:41:02 am
BOM DIA Wennys Carlos
cara parabéns, eu estava fazendo varias dessas implementações diretamente editando o arquivos do plugin, muito boa a tua sacada, genial!

uma duvida como faço para implementar a atualização da data e hora ao arrastar o evento do calendário.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: William .'. em Maio 20, 2014, 03:50:17 pm
Ola Pessoal,

Faço coro aos que deram parabéns a essa sacada... de fato, vai ser muito útil para diversos desenvolvedores que precisam utilizar desta funcionalidade, mas que esbarra em diversas limitações.

Sem dúvida o app de calendário tem que evoluir mmmmuito.

Pois bem, praticamente conclui a implementação do novo calendário mas em certos navegadores ao fechar o modal recebo a msg em anexo ... alguém identificou esse mesmo comportamento ?

William


Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: thalessilva em Agosto 13, 2014, 01:57:48 am
alguem poderia me passar todos os arquivos desse calendario prontos, estou com dificuldade de criar
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Arquimedes em Outubro 01, 2014, 07:45:05 pm
Esta de parabens amigo, muito bom, mais muito bom mesmo, nao gostava da versao fechado do scriptcase, essa eu gero as datas em um Blank e ao clicar na data da alteracao eu chamo uma consulta. Deu para personalizar conforme a necessidade agora.

 Como gosto de ajudar vou preparar um arquivo de exemplo para disponibilizar.


Att Arquimedes
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Arquimedes em Outubro 01, 2014, 08:18:47 pm
 Muito obrigado Wennys Carlos 

Projeto calendario montado em sc8 banco postgres.
Mais mastigado que isso.



http://www.4shared.com/zip/qvlgcCY0ba/sc_201410012001_export_calenda.html
banco postgres
CREATE TABLE evento
(
  idevento serial NOT NULL,
  descricao character varying(60) NOT NULL,
  data date,
  horainicio time without time zone,
  horafim time without time zone,
  status character varying(30),
  CONSTRAINT evento_pkey PRIMARY KEY (idevento)
)

Att Arquimedes
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: mbaumer em Novembro 25, 2014, 02:47:26 pm
Poderia disponibilizar o material por e-mail ? Infelizmente o 4shared é bloqueado aqui na empresa.

mayllon.baumer@nttdata.com

Muito obrigado Wennys Carlos 

Projeto calendario montado em sc8 banco postgres.
Mais mastigado que isso.



http://www.4shared.com/zip/qvlgcCY0ba/sc_201410012001_export_calenda.html
banco postgres
CREATE TABLE evento
(
  idevento serial NOT NULL,
  descricao character varying(60) NOT NULL,
  data date,
  horainicio time without time zone,
  horafim time without time zone,
  status character varying(30),
  CONSTRAINT evento_pkey PRIMARY KEY (idevento)
)

Att Arquimedes

Grato.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Endrigo em Novembro 30, 2014, 03:49:57 pm
O que é necessário fazer no form_evento para que funcione a inclusão de um novo evento automaticamente?

Para visualizar um evento já cadastrado funciona pois coloque na cláusula where do SQL o seguinte:
Código: [Selecionar]
(age_id = 0[idevento])

Mas para qualquer outro lugar que clico para criar um novo evento, sempre aparece o último evento aberto.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: gilmonteiro em Dezembro 03, 2014, 12:49:45 pm
Wennys Carlos

Como fazer para alterar a cor do texto na caixa dos dias.

obg

Gilmar Monteiro
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: lincolnajsi em Dezembro 09, 2014, 09:47:15 am

Prezados, segue um exemplo bem detalhado de uma alternativa, ao meu ver, ao uso das apps tipo calendário do SC.

Utilizo a mesma biblioteca(fullcalendar), porém utilizando uma app do tipo blank, da seguinte forma:


http://wennys.com.br/sistemas/modelos/fullcalendar/


Observem que dá para personalizar cores, eventos, formato das horas , títulos, limitar horários, desabilitar arrastar e soltar etc...


Postarei em seguida o passo a passo de como fazer e o código completo das aplicações.


Espero que ajude aos colegas.


Wennys Carlos

Olá meu amigo, gostaria de saber se consigo com o calendário scriptcase criar uma agenda para salão de cabeleireiro usando nas colunas o nome dos profissionais e nas linhas os horários, para que a cliente clique diretamente em cada pessoa agendada ou clique diretamento no harário para agendar e abrir uma comanda por ex.?
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: FredKeyster em Dezembro 09, 2014, 12:58:24 pm

Prezados, segue um exemplo bem detalhado de uma alternativa, ao meu ver, ao uso das apps tipo calendário do SC.

Utilizo a mesma biblioteca(fullcalendar), porém utilizando uma app do tipo blank, da seguinte forma:


http://wennys.com.br/sistemas/modelos/fullcalendar/


Observem que dá para personalizar cores, eventos, formato das horas , títulos, limitar horários, desabilitar arrastar e soltar etc...


Postarei em seguida o passo a passo de como fazer e o código completo das aplicações.


Espero que ajude aos colegas.


Wennys Carlos

Olá meu amigo, gostaria de saber se consigo com o calendário scriptcase criar uma agenda para salão de cabeleireiro usando nas colunas o nome dos profissionais e nas linhas os horários, para que a cliente clique diretamente em cada pessoa agendada ou clique diretamento no harário para agendar e abrir uma comanda por ex.?

Sim!
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Arquimedes em Dezembro 12, 2014, 03:47:58 pm
Não estou conseguindo passar a data do dia clicado para o formulario sem evento.
quando clico em uma data com evento aparece normalmente.

Att Arquimedes
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Igor Kennedy em Dezembro 23, 2014, 11:12:27 am
Arquimedes importei o projeto funcionol perfeitamente, porem eu tambem nao cosegui que o formulario pegasse a data que foi clicada no calendário.

Aguem conseguiu ?
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: FredKeyster em Dezembro 23, 2014, 05:10:44 pm
Rapaz, aqui ta funcionando de boa! Coloca seu código ai pra mim ver o que pode ser! Abraço!
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Igor Kennedy em Dezembro 23, 2014, 10:18:29 pm
conseguir utilizando no formulario evento , {data}=[diaClicado];
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Igor Kennedy em Dezembro 23, 2014, 10:21:33 pm
codigo do calendario

echo "<script>
   
   var sc_pathToTB = '" . $this->Ini->path_prod . "/third/jquery_plugin/thickbox/'; /*VAR. NECESSARIA PARA O SC ENCONTRAR O PATH DO thickbox*/
   
     </script>";

echo "<link href='" . $this->Ini->path_prod . "/third/jquery_plugin/fullcalendar/fullcalendar.css' rel='stylesheet' />";

echo "<link href='" . $this->Ini->path_prod . "/third/jquery_plugin/fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print' />";

echo "<link href='" . $this->Ini->path_prod . "/third/jquery_plugin/thickbox/thickbox.css' rel='stylesheet' media='screen' />";

echo "<script type='text/javascript' src='" . $this->Ini->path_prod . "/third/jquery/js/jquery.js'></script>";

echo "<script type='text/javascript' src='" . $this->Ini->path_prod . "/third/jquery/js/jquery-ui.js'></script>"; //drag and drop

echo "<script type='text/javascript' src='" . $this->Ini->path_prod . "/third/jquery_plugin/fullcalendar/fullcalendar.min.js'></script>";

echo "<script type='text/javascript' src='" . $this->Ini->path_prod . "/third/jquery_plugin/thickbox/thickbox-compressed.js'></script>";
?>

<style>

   body {
      margin-top: 40px;
      text-align: center;
      font-size: 14px;
      font-family: Helvetica,Arial,Verdana,sans-serif;
      }

   #calendar {
      width: 1000px;
      margin: 0 auto;
      }

</style>
<script>

   $(document).ready(function() {
   
      var date = new Date();
      var d = date.getDate();
      var m = date.getMonth();
      var y = date.getFullYear();
     
      $('#calendar').fullCalendar({
         header: {
            left: 'month' ,
         //left: 'month,agendaWeek,agendaDay' ,
            center: 'title',
            right: 'prev,next today'
         },
         
         buttonText: {
                 prev: '&lt;' , /*Botão Previous*/
                 next: '&gt;' , /*Botão Next*/
             today: 'Hoje', /*Botão Today*/
            month: 'Mês' , /*Botão Month*/
            week:  'Semana' , /*Botão Month*/
           day: 'Dia' /*Botão Day*/
          },
         
         /*TRADUÇÃO DOS MESES E DIAS*/
         monthNames: ["Janeiro","Fevereiro","Março","Abril","Maio","Junho","Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembrooo" ],
         
         monthNamesShort: ["Jan","Fev","Mar","Abr","Mai","Jun","Jul", "Ago", "Set", "Out", "Nov", "Dez" ],

         dayNames: [ 'Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sábado'],
         
         dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb'] ,
         /*************************/
         timeFormat: 'H:mm', /*FORMATO DA HORA*/
         
         columnFormat: {
               
                week: 'dddd dd/M', /*Ex: Segunda 09/12*/
                   day: 'dddd'  /*Ex: Segunda*/
         },
         
         titleFormat: {
            //month: '',
            week: "MMM dd[ yyyy]{ '—'[ MMM] dd, yyyy}", /*FORMATO DO TITULO NO MODO AGENDA SEMANAL*/
            day: 'dddd, d/M/yyyy' /*FORMATO DO TÍTULO NO MODO DIA*/
         } 
      ,
         
         editable: false , /*SE false, não permite arrastar e soltar os eventos*/
         
         /*EXEMPLOS DE ALGUMAS CONFIGURAÇÕES PARA O MODO AGENDA SEMANAL*/
      //   axisFormat: 'HH:mm' , /*FORMATO DA HORA MOSTRADA DO LADO ESQUERDO*/
         
         minTime: 8 , /*LIMITA O INICIO DO HORARIO A SER MOTRADO A 08:00 (0 a 23)*/
         
         maxTime: 21 , /*LIMITA O FIM DO HORARIO A SER MOTRADO A 20:00  (0 a 23)*/
         
         events: '../json/json.php' , /*AQUI É CHAMADO O ARQUIVO QUE FARÁ O PROCESSAMENTO PHP*/
         
         dayClick: function(date, allDay, jsEvent, view) {
      
   var diaClicado = $.fullCalendar.formatDate( date , 'yyyy-MM-dd' );
           
            var dia = $.fullCalendar.formatDate( date , 'dd/MM/yyyy' );
           
            tb_show('', '../form_evento/form_evento.php?diaClicado='+diaClicado+'&sc_cal_click_date=&nmgp_outra_jan=true&nmgp_url_saida=modal&TB_iframe=false&modal=false&height=450&width=850', '');
            //TAMBEM PODE SER ASSIM:   
            //window.open('../form_evento/form_evento.php?diaClicado='+diaClicado , '_blank' ,  'width=600,height=500');
         
          },
         
         height: 600, /*ALTURA DO CALENDARIO*/
         
         eventClick: function(calEvent, jsEvent, view) {
           
            var id_bg   = calEvent.id;
           
            tb_show('', '../boletim_detalhe/boletim_detalhe.php?id='+id+'&sc_cal_click_date=&nmgp_outra_jan=true&nmgp_url_saida=modal&TB_iframe=false&modal=false&height=700&width=850', '');
            //TAMBEM PODE SER ASSIM:
            //window.open('../form_evento/form_evento.php?idevento='+idevento , 'JANELA' ,  'width=600,height=500');
           
         },
         
      });
     
   });

</script>
<div id='calendar'></div>
<?php
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: FredKeyster em Dezembro 23, 2014, 11:41:05 pm
O código esta correto! Faça o seguinte, no form "form_evento" vá no campo dessa data do evento e lá procure "Valor Inicial (tipo)" e coloque logo abaixo: [diaClicado], em seguida vá em Aplicação => "Variáveis Globais" e marque como Entrada.

Assim resolve esse problema.

Abraço!
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Igor Kennedy em Dezembro 28, 2014, 08:31:41 am
Obrigado FredKeyster, deu certo assim como vc passou.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Thiago Faria em Fevereiro 02, 2015, 09:55:35 am
Olá, eu utilizo em uma aplicação, somente a visão mensal.
Tem alguma forma de alterar a cor do fundo de determinados dias?
Por exemplo, os dias 4, 5 e 6 ficarem com uma cor diferente para mostrar que aqueles dias estão habilitados.
Outra dúvida é se existe a possibilidade de bloquear a função de clicar em determinados dias que no caso não estiverem habilitados para inserir nenhuma agenda.
Obrigado.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: FredKeyster em Fevereiro 02, 2015, 10:53:20 am
Caro Thiago, tem como fazer sim, mas exige grande experiência em JS com relação ao bloqueios nos clicks. Eu particularmente não sei como fazer. Sobre as cores acho que você pode modificar no arquivo Json.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Nadai em Março 04, 2015, 11:02:49 am
Caro Igor Kennedy, muito obrigado pela dica.

Eu não sei se vc tentou com a nova versão do fullcalendar, a que existe hoje no site, mas não funcionou.
A do SC8 funcionou normalmente.

Abusando um pouco, preciso ter acesso ao calendário do Zimbra.
Vc sabe onde encontro alguma coisa para fazer esta interface?

Obrigado mais uma vez pela dica.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: twm em Março 04, 2015, 02:56:22 pm
    //window.open('../form_evento/form_evento.php?diaClicado='+diaClicado , '_blank' ,  'width=600,height=500');
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: jobsoncunha em Abril 29, 2015, 09:04:51 am
Wennys, gostei muito de seu exemplo. Estou pretendendo usar, mas preciso que o usuário arraste os eventos para acomodação de datas e horários conforme conveniência. A perguntas é a seguinte: como e onde entra os comandos de update para alterar os dados na tabela quando o usuário arrastar o evento? e como atualizar a tela do calendário após a alteração do registro quando utilizo o form e faço alterações?

 

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: reinaldo lima em Maio 22, 2015, 01:22:38 pm
olá Wennys Carlos

Parabéns, gostaria de saber uma coisa, no intervalo de cada horário do calendário, possui apenas duas linhas, sabe me dizer se é possível customizar para adicionar mais linhas e como fazer isso? quebrei a cabeça aqui e até agora nada.

abraços

att
Reinaldo
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: andreluiz em Junho 10, 2015, 08:45:25 am
oi  tentei atualizar da forma ai deu erro mas beleza


Tenho uma dúvida, gostaria de travar a data do calendário exemplo depois que cadastra essa data dia 13/06/2015 exemplo não tem como alterar e nem gravar ela novamente tipo fica o dia todo reservado, entende?
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: jpinto em Junho 11, 2015, 05:12:23 am
Bom dia meus amigos
Partilho com você este meu exemplo que esta baseado no wdCalendar
link do meu exemplo
http://scriptcase.scantec.pt/v8/app/ServiceWEBXX/calendar/ (http://scriptcase.scantec.pt/v8/app/ServiceWEBXX/calendar/)


Codigo
http://jquerylabs.com/wdcalendar-jquery-plugin-html/ (http://jquerylabs.com/wdcalendar-jquery-plugin-html/)
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Celso R. em Junho 11, 2015, 09:50:23 am
Muito bom mesmo.....
Será que nós pobres mortais conseguiremos implementar isso....
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Joni Morais em Junho 11, 2015, 10:30:31 am
kkk "podres mortais" é boa Celso. Ajuda ai jpinto essa parte de calendário está mesmo fraca no SC! Um tutorialzinho como o Wennys fez ajudaria muito. Desde já agradeço.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: jpinto em Junho 12, 2015, 07:14:22 am

link do meu exemplo
http://scriptcase.scantec.pt/v8/app/ServiceWEBXX/calendar/


Codigo
http://jquerylabs.com/wdcalendar-jquery-plugin-html/
download código
http://sourceforge.net/projects/jqeventcalendar/

Criar uma aplicação blank


$dbhost=substr([sc_glo_servidor],0,strpos([sc_glo_servidor],":"));
$dbuser=[sc_glo_usuario];
$dbpsw =sc_decode([sc_glo_senha]);
$dbname=[sc_glo_banco];
//$dbname='XXXXXXXXX';
//$user='XXXXXXXX';
$user=isset($_SESSION['nm_session']['user']['login'])?$_SESSION['nm_session']['user']['login']:"";

?>
<!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">
<head id="Head1">
    <title>   My Calendar </title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <link href="../_lib/wdCalendar/css/dailog.css" rel="stylesheet" type="text/css" />
    <link href="../_lib/wdCalendar/css/calendar.css" rel="stylesheet" type="text/css" />
    <link href="../_lib/wdCalendar/css/dp.css" rel="stylesheet" type="text/css" />   
    <link href="../_lib/wdCalendar/css/alert.css" rel="stylesheet" type="text/css" />
    <link href="../_lib/wdCalendar/css/main.css" rel="stylesheet" type="text/css" />
   
    <script src="../_lib/wdCalendar/src/jquery.js" type="text/javascript"></script> 
   
    <script src="../_lib/wdCalendar/src/Plugins/Common.js" type="text/javascript"></script>
    <!--<script src="../_lib/wdCalendar/src/Plugins/datepicker_lang_US.js" type="text/javascript"></script>-->
    <script src="../_lib/wdCalendar/src/Plugins/datepicker_lang_PT.js" type="text/javascript"></script>
    <script src="../_lib/wdCalendar/src/Plugins/jquery.datepicker.js" type="text/javascript"></script>

    <script src="../_lib/wdCalendar/src/Plugins/jquery.alert.js" type="text/javascript"></script>
    <script src="../_lib/wdCalendar/src/Plugins/jquery.ifrmdailog.js" defer="defer" type="text/javascript"></script>
    <!--<script src="src/Plugins/wdCalendar_lang_US.js" type="text/javascript"></script>-->
    <script src="../_lib/wdCalendar/src/Plugins/wdCalendar_lang_PT.js" type="text/javascript"></script>
    <script src="../_lib/wdCalendar/src/Plugins/jquery.calendar.js" type="text/javascript"></script>
    <!--<script src="src/Plugins/common_lang_US.js" type="text/javascript"></script>-->
    <script src="../_lib/wdCalendar/src/Plugins/common_lang_PT.js" type="text/javascript"></script>
   
    <script type="text/javascript">
        $(document).ready(function() {
            updateLang();
            var view="week";
            var DATA_FEED_URL = "../_lib/wdCalendar/php/datafeed.php";
            var op = {
                view: view,
                theme:0,
                showday: new Date(),
                EditCmdhandler:Edit,
                DeleteCmdhandler:Delete,
                ViewCmdhandler:View,   
                onWeekOrMonthToDay:wtd,
                onBeforeRequestData: cal_beforerequest,
                onAfterRequestData: cal_afterrequest,
                onRequestDataError: cal_onerror,
                autoload:true,
                url: DATA_FEED_URL + "?method=list&db=<?php echo $dbname;?>&User=<?php echo $user;?>", 
                quickAddUrl: DATA_FEED_URL + "?method=add&db=<?php echo $dbname;?>&User=<?php echo $user;?>",
                quickUpdateUrl: DATA_FEED_URL + "?method=update&db=<?php echo $dbname;?>&User=<?php echo $user;?>",
                quickDeleteUrl: DATA_FEED_URL + "?method=remove&db=<?php echo $dbname;?>&User=<?php echo $user;?>",
                extParam: [{name:"db", value: "<?php echo $dbname;?>"},{name:"User", value: "<?php echo $user;?>"},{name:"DateFormat", value: i18n.xgcalendar.dateformat.fulldayvalue}]
            };

            var $dv = $("#calhead");
            var _MH = document.documentElement.clientHeight;
            var dvH = $dv.height() + 2;
            op.height = _MH - dvH;
            op.eventItems =[];

            var p = $("#gridcontainer").bcalendar(op).BcalGetOp();
            if (p && p.datestrshow) {
                $("#txtdatetimeshow").text(p.datestrshow);
            }
            $("#caltoolbar").noSelect();
           
            $("#hdtxtshow").datepicker({ picker: "#txtdatetimeshow", showtarget: $("#txtdatetimeshow"),
                onReturn:function(r){                         
                    var p = $("#gridcontainer").gotoDate(r).BcalGetOp();
                    if (p && p.datestrshow) {
                        $("#txtdatetimeshow").text(p.datestrshow);
                    }
                }
            });
            function cal_beforerequest(type) {
                // var t="Loading data...";
                var t = i18n.common.index.loading_data;
                switch(type)
                {
                    case 1:
                        // t="Loading data...";
                        t = i18n.common.index.loading_data;
                        break;
                    case 2:                     
                    case 3: 
                    case 4:   
                        //t="The request is being processed ...";
                        t = i18n.common.index.request_processed;                                   
                        break;
                }
                $("#errorpannel").hide();
                $("#loadingpannel").html(t).show();
                removeDrag();   
            }

            function cal_afterrequest(type) {
                switch(type){
                    case 1:
                        $("#loadingpannel").hide();
                        break;
                    case 2:
                    case 3:
                    case 4:
                        // $("#loadingpannel").html("Success!");
                        $("#loadingpannel").html(i18n.common.index.success);
                        window.setTimeout(function(){ $("#loadingpannel").hide();},2000);
                    break;
                }             
                removeDrag();
            }
            function cal_onerror(type,data) {
            $("#gridcontainer").reload();
                $("#errorpannel").show();
            }
            function Edit(data) {
                // console.log(data);
                var eurl="../_lib/wdCalendar/php/edit.php?id={0}&start={2}&end={3}&isallday={4}&title={1}&db=<?php echo $dbname;?>";   
                if(data && data[0] != -1) {
                    var url = StrFormat(eurl,data);
                    // OpenModelWindow(url,{ width: 600, height: 400, caption:"Manage  The Calendar",onclose:function(){
                    OpenModelWindow(url,{ width: 600, height: 400, caption: i18n.common.index.edit_caption,onclose:function(){
                       $("#gridcontainer").reload();
                    }});
                }
            }
            function View(data) {
                // console.log(data);
                var str = "";
                $.each(data, function(i, item){
                    switch (i) {
                        case 1:
                            str += "<b>" + i18n.common.index.view_subject + "</b> " + item + "\n";
                            break;
                        case 2:
                            str += "<b>" + i18n.common.index.view_from + "</b> " + item.toLocaleString() + "\n";
                            break;
                        case 3:
                            str += "<b>" + i18n.common.index.view_to + "</b> " + item.toLocaleString() + "\n";
                            break;
                        case 9:
                            str += "<b>" + i18n.common.index.view_local + "</b> " + item + "\n";
                            break;
                        case 11:
                            str += "<b>" + i18n.common.index.view_notes + "</b> " + item + "\n";
                            break;
                        case 13:
                            str += "<b>" + i18n.common.index.view_user + "</b> " + item + "\n";
                            break;
                        default:
                            break;
                    }
                    // str += "[" + i + "]: " + item + "\n";
                });
                // alert(str);
                $.alerts.okButton= i18n.common.index.ok;
                // $.alerts.cancelButton="Cancel";
                // hiAlert(str, "Detalhes");
                hiAlert(str, i18n.common.index.view_title);
            }
            function Delete(data,callback) {
                $.alerts.okButton=i18n.common.index.ok;
                $.alerts.cancelButton=i18n.common.index.cancel;
                if (data[0] != -1) {
                    hiConfirm(i18n.common.index.delete_question, 'Confirm',function(r){ r && callback(0);});
                }           
            }
            function wtd(p) {
               if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                $("#caltoolbar div.fcurrent").each(function() {
                    $(this).removeClass("fcurrent");
                })
                $("#showdaybtn").addClass("fcurrent");
                removeDrag();
            }
            //to show day view
            $("#showdaybtn").click(function(e) {
                //document.location.href="#day";
                $("#caltoolbar div.fcurrent").each(function() {
                    $(this).removeClass("fcurrent");
                })
                $(this).addClass("fcurrent");
                var p = $("#gridcontainer").swtichView("day").BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();
            });
            //to show week view
            $("#showweekbtn").click(function(e) {
                //document.location.href="#week";
                $("#caltoolbar div.fcurrent").each(function() {
                    $(this).removeClass("fcurrent");
                })
                $(this).addClass("fcurrent");
                var p = $("#gridcontainer").swtichView("week").BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();

            });
            //to show month view
            $("#showmonthbtn").click(function(e) {
                //document.location.href="#month";
                $("#caltoolbar div.fcurrent").each(function() {
                    $(this).removeClass("fcurrent");
                })
                $(this).addClass("fcurrent");
                var p = $("#gridcontainer").swtichView("month").BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();
            });
            $("#showreflashbtn").click(function(e){
                $("#gridcontainer").reload();
                removeDrag();
            });
            //Add a new event
            $("#faddbtn").click(function(e) {
                var url ="../_lib/wdCalendar/php/edit.php?db=<?php echo $dbname;?>&User=<?php echo $user;?>";
                OpenModelWindow(url,{ width: 500, height: 400, caption: "Create New Calendar"});
            });
          //Add a new event timesheet
            $("#faddbtnt").click(function(e) {
                var url ="../form_agenda/form_agenda.php";
                OpenModelWindow(url,{ width: 600, height: 500, caption: "Create New timesheet"});
            });
            //go to today
            $("#showtodaybtn").click(function(e) {
                var p = $("#gridcontainer").gotoDate().BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();
            });
            //previous date range
            $("#sfprevbtn").click(function(e) {
                var p = $("#gridcontainer").previousRange().BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();
            });
            //next date range
            $("#sfnextbtn").click(function(e) {
                var p = $("#gridcontainer").nextRange().BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();
            });
            removeDrag();
            function removeDrag() {
                $("div[id=bbit_cal_event_-1]").each(function(){
                    $(this).removeClass("drag");
                    if (!$(this).hasClass("cal_-1")) {
                        $(this).addClass("cal_-1");
                    }
                    // $(this).unbind("click");
                    $(this).find(".rb-m").css('background','#87a96b');
                    $(this).find(".rb-i").children().each(function(){
                        if($(this).hasClass("cic cic-tmr")) {
                            $(this).remove();
                        }
                    })
                });
            }
            function updateLang() {
                $("#calendar_title").html(i18n.common.index.calendar_title);
                $("#loadingpannel").html(i18n.common.index.loadingpannel);
                $("#errorpannel").html(i18n.common.index.errorpannel);
                $("#span_new_event").html(i18n.common.index.span_new_event);
                $("#span_today").html(i18n.common.index.span_today);
                $("#span_day").html(i18n.common.index.span_day);
                $("#span_week").html(i18n.common.index.span_week);
                $("#span_month").html(i18n.common.index.span_month);
                $("#span_refresh").html(i18n.common.index.span_refresh);
                $("#txtdatetimeshow").html(i18n.common.index.txtdatetimeshow);
            }
        });
    </script>   
</head>
<body>
  <div>
    <div id="calhead" style="padding-left:1px;padding-right:1px;">
        <div class="cHead">
            <div id="calendar_title" class="ftitle">My Calendar</div>
            <div id="loadingpannel" class="ptogtitle loadicon" style="display: none;">Loading data...</div>
            <div id="errorpannel" class="ptogtitle loaderror" style="display: none;">Sorry, could not load your data, please try again later</div>
        </div>
        <div id="caltoolbar" class="ctoolbar">
            <div id="faddbtn" class="fbutton">
                <div><span id="span_new_event" title='Click to Create New Event' class="addcal">New Event</span></div>
            </div>
         <div id="faddbtnt" class="fbutton">
             <div><span id="span_new_timesheet" title='Click to Create New Timesheet' class="addcal">New Timesheet</span></div>
            </div>
            <div class="btnseparator"></div>
            <div id="showtodaybtn" class="fbutton">
                <div><span id="span_today" title='Click to back to today ' class="showtoday">Today</span></div>
            </div>
            <div class="btnseparator"></div>
            <div id="showdaybtn" class="fbutton">
                <div><span id="span_day" title='Day' class="showdayview">Day</span></div>
            </div>
            <div id="showweekbtn" class="fbutton fcurrent">
                <div><span id="span_week" title='Week' class="showweekview">Week</span></div>
            </div>
            <div id="showmonthbtn" class="fbutton">
                <div><span id="span_month" title='Month' class="showmonthview">Month</span></div>
            </div>
            <div class="btnseparator"></div>
            <div id="showreflashbtn" class="fbutton">
                <div><span id="span_refresh" title='Refresh view' class="showdayflash">Refresh</span></div>
            </div>
            <div class="btnseparator"></div>
            <div id="sfprevbtn" title="Prev" class="fbutton">
                <span class="fprev"></span>
            </div>
            <div id="sfnextbtn" title="Next" class="fbutton">
                <span class="fnext"></span>
            </div>
            <div class="fshowdatep fbutton">
                <div>
                    <input type="hidden" name="txtshow" id="hdtxtshow" />
                    <span id="txtdatetimeshow">Loading</span>
                </div>
            </div>
            <div class="clear"></div>
        </div>
    </div>
    <div style="padding:1px;">
        <div class="t1 chromeColor">&nbsp;</div>
        <div class="t2 chromeColor">&nbsp;</div>
        <div id="dvCalMain" class="calmain printborder">
            <div id="gridcontainer" style="overflow-y: visible;"></div>
        </div>
        <div class="t2 chromeColor">&nbsp;</div>
        <div class="t1 chromeColor">&nbsp;</div>
    </div>
  </div>
</body>
</html>

 <?php
       
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Joni Morais em Junho 12, 2015, 09:47:58 am
Acho que posso responder em nome de todos do Forum. MUITO OBRIGADO! Toda e qualquer ajuda é muito bem-vinda e merece aplausos.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Willian Fernando Padilha em Junho 12, 2015, 11:20:38 am
Show de bola manooooo
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Kleyber em Junho 12, 2015, 02:24:13 pm
Muito legal mesmo.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: reinaldo lima em Junho 12, 2015, 11:41:43 pm
excelente!

parabens pelo compartilhamento.

att
Reinaldo
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Joni Morais em Julho 23, 2015, 04:28:52 pm

link do meu exemplo
http://scriptcase.scantec.pt/v8/app/ServiceWEBXX/calendar/ (http://scriptcase.scantec.pt/v8/app/ServiceWEBXX/calendar/)


Codigo
http://jquerylabs.com/wdcalendar-jquery-plugin-html/ (http://jquerylabs.com/wdcalendar-jquery-plugin-html/)
download código
http://sourceforge.net/projects/jqeventcalendar/ (http://sourceforge.net/projects/jqeventcalendar/)

Criar uma aplicação blank


$dbhost=substr([sc_glo_servidor],0,strpos([sc_glo_servidor],":"));
$dbuser=[sc_glo_usuario];
$dbpsw =sc_decode([sc_glo_senha]);
$dbname=[sc_glo_banco];
//$dbname='XXXXXXXXX';
//$user='XXXXXXXX';
$user=isset($_SESSION['nm_session']['user']['login'])?$_SESSION['nm_session']['user']['login']:"";

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd (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 id="Head1">
    <title>   My Calendar </title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <link href="../_lib/wdCalendar/css/dailog.css" rel="stylesheet" type="text/css" />
    <link href="../_lib/wdCalendar/css/calendar.css" rel="stylesheet" type="text/css" />
    <link href="../_lib/wdCalendar/css/dp.css" rel="stylesheet" type="text/css" />   
    <link href="../_lib/wdCalendar/css/alert.css" rel="stylesheet" type="text/css" />
    <link href="../_lib/wdCalendar/css/main.css" rel="stylesheet" type="text/css" />
   
    <script src="../_lib/wdCalendar/src/jquery.js" type="text/javascript"></script> 
   
    <script src="../_lib/wdCalendar/src/Plugins/Common.js" type="text/javascript"></script>
    <!--<script src="../_lib/wdCalendar/src/Plugins/datepicker_lang_US.js" type="text/javascript"></script>-->
    <script src="../_lib/wdCalendar/src/Plugins/datepicker_lang_PT.js" type="text/javascript"></script>
    <script src="../_lib/wdCalendar/src/Plugins/jquery.datepicker.js" type="text/javascript"></script>

    <script src="../_lib/wdCalendar/src/Plugins/jquery.alert.js" type="text/javascript"></script>
    <script src="../_lib/wdCalendar/src/Plugins/jquery.ifrmdailog.js" defer="defer" type="text/javascript"></script>
    <!--<script src="src/Plugins/wdCalendar_lang_US.js" type="text/javascript"></script>-->
    <script src="../_lib/wdCalendar/src/Plugins/wdCalendar_lang_PT.js" type="text/javascript"></script>
    <script src="../_lib/wdCalendar/src/Plugins/jquery.calendar.js" type="text/javascript"></script>
    <!--<script src="src/Plugins/common_lang_US.js" type="text/javascript"></script>-->
    <script src="../_lib/wdCalendar/src/Plugins/common_lang_PT.js" type="text/javascript"></script>
   
    <script type="text/javascript">

 //      >>>>>>>>>>>>>>>>>>>>>>>>>>>
 
      $(document).ready(function() {
            updateLang();
            var view="week";
            var DATA_FEED_URL = "../_lib/wdCalendar/php/datafeed.php";
            var op = {
                view: view,
                theme:0,
                showday: new Date(),
                EditCmdhandler:Edit,
                DeleteCmdhandler:Delete,
                ViewCmdhandler:View,   
                onWeekOrMonthToDay:wtd,
                onBeforeRequestData: cal_beforerequest,
                onAfterRequestData: cal_afterrequest,
                onRequestDataError: cal_onerror,
                autoload:true,
                url: DATA_FEED_URL + "?method=list&db=<?php echo $dbname;?>&User=<?php echo $user;?>", 
                quickAddUrl: DATA_FEED_URL + "?method=add&db=<?php echo $dbname;?>&User=<?php echo $user;?>",
                quickUpdateUrl: DATA_FEED_URL + "?method=update&db=<?php echo $dbname;?>&User=<?php echo $user;?>",
                quickDeleteUrl: DATA_FEED_URL + "?method=remove&db=<?php echo $dbname;?>&User=<?php echo $user;?>",
                extParam: [{name:"db", value: "<?php echo $dbname;?>"},{name:"User", value: "<?php echo $user;?>"},{name:"DateFormat", value: i18n.xgcalendar.dateformat.fulldayvalue}]
            };

            var $dv = $("#calhead");
            var _MH = document.documentElement.clientHeight;
            var dvH = $dv.height() + 2;
            op.height = _MH - dvH;
            op.eventItems =[];

            var p = $("#gridcontainer").bcalendar(op).BcalGetOp();
            if (p && p.datestrshow) {
                $("#txtdatetimeshow").text(p.datestrshow);
            }
            $("#caltoolbar").noSelect();
           
            $("#hdtxtshow").datepicker({ picker: "#txtdatetimeshow", showtarget: $("#txtdatetimeshow"),
                onReturn:function(r){                         
                    var p = $("#gridcontainer").gotoDate(r).BcalGetOp();
                    if (p && p.datestrshow) {
                        $("#txtdatetimeshow").text(p.datestrshow);
                    }
                }
            });
            function cal_beforerequest(type) {
                // var t="Loading data...";
                var t = i18n.common.index.loading_data;
                switch(type)
                {
                    case 1:
                        // t="Loading data...";
                        t = i18n.common.index.loading_data;
                        break;
                    case 2:                     
                    case 3: 
                    case 4:   
                        //t="The request is being processed ...";
                        t = i18n.common.index.request_processed;                                   
                        break;
                }
                $("#errorpannel").hide();
                $("#loadingpannel").html(t).show();
                removeDrag();   
            }

            function cal_afterrequest(type) {
                switch(type){
                    case 1:
                        $("#loadingpannel").hide();
                        break;
                    case 2:
                    case 3:
                    case 4:
                        // $("#loadingpannel").html("Success!");
                        $("#loadingpannel").html(i18n.common.index.success);
                        window.setTimeout(function(){ $("#loadingpannel").hide();},2000);
                    break;
                }             
                removeDrag();
            }
            function cal_onerror(type,data) {
            $("#gridcontainer").reload();
                $("#errorpannel").show();
            }
            function Edit(data) {
                // console.log(data);
                var eurl="../_lib/wdCalendar/php/edit.php?id={0}&start={2}&end={3}&isallday={4}&title={1}&db=<?php echo $dbname;?>";   
                if(data && data[0] != -1) {
                    var url = StrFormat(eurl,data);
                    // OpenModelWindow(url,{ width: 600, height: 400, caption:"Manage  The Calendar",onclose:function(){
                    OpenModelWindow(url,{ width: 600, height: 400, caption: i18n.common.index.edit_caption,onclose:function(){
                       $("#gridcontainer").reload();
                    }});
                }
            }
            function View(data) {
                // console.log(data);
                var str = "";
                $.each(data, function(i, item){
                    switch (i) {
                        case 1:
                            str += "<b>" + i18n.common.index.view_subject + "</b> " + item + "\n";
                            break;
                        case 2:
                            str += "<b>" + i18n.common.index.view_from + "</b> " + item.toLocaleString() + "\n";
                            break;
                        case 3:
                            str += "<b>" + i18n.common.index.view_to + "</b> " + item.toLocaleString() + "\n";
                            break;
                        case 9:
                            str += "<b>" + i18n.common.index.view_local + "</b> " + item + "\n";
                            break;
                        case 11:
                            str += "<b>" + i18n.common.index.view_notes + "</b> " + item + "\n";
                            break;
                        case 13:
                            str += "<b>" + i18n.common.index.view_user + "</b> " + item + "\n";
                            break;
                        default:
                            break;
                    }
                    // str += "[" + i + "]: " + item + "\n";
                });
                // alert(str);
                $.alerts.okButton= i18n.common.index.ok;
                // $.alerts.cancelButton="Cancel";
                // hiAlert(str, "Detalhes");
                hiAlert(str, i18n.common.index.view_title);
            }
            function Delete(data,callback) {
                $.alerts.okButton=i18n.common.index.ok;
                $.alerts.cancelButton=i18n.common.index.cancel;
                if (data[0] != -1) {
                    hiConfirm(i18n.common.index.delete_question, 'Confirm',function(r){ r && callback(0);});
                }           
            }
            function wtd(p) {
               if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                $("#caltoolbar div.fcurrent").each(function() {
                    $(this).removeClass("fcurrent");
                })
                $("#showdaybtn").addClass("fcurrent");
                removeDrag();
            }
            //to show day view
            $("#showdaybtn").click(function(e) {
                //document.location.href="#day";
                $("#caltoolbar div.fcurrent").each(function() {
                    $(this).removeClass("fcurrent");
                })
                $(this).addClass("fcurrent");
                var p = $("#gridcontainer").swtichView("day").BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();
            });
            //to show week view
            $("#showweekbtn").click(function(e) {
                //document.location.href="#week";
                $("#caltoolbar div.fcurrent").each(function() {
                    $(this).removeClass("fcurrent");
                })
                $(this).addClass("fcurrent");
                var p = $("#gridcontainer").swtichView("week").BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();

            });
            //to show month view
            $("#showmonthbtn").click(function(e) {
                //document.location.href="#month";
                $("#caltoolbar div.fcurrent").each(function() {
                    $(this).removeClass("fcurrent");
                })
                $(this).addClass("fcurrent");
                var p = $("#gridcontainer").swtichView("month").BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();
            });
            $("#showreflashbtn").click(function(e){
                $("#gridcontainer").reload();
                removeDrag();
            });
            //Add a new event
            $("#faddbtn").click(function(e) {
                var url ="../_lib/wdCalendar/php/edit.php?db=<?php echo $dbname;?>&User=<?php echo $user;?>";
                OpenModelWindow(url,{ width: 500, height: 400, caption: "Create New Calendar"});
            });
          //Add a new event timesheet
            $("#faddbtnt").click(function(e) {
                var url ="../form_agenda/form_agenda.php";
                OpenModelWindow(url,{ width: 600, height: 500, caption: "Create New timesheet"});
            });
            //go to today
            $("#showtodaybtn").click(function(e) {
                var p = $("#gridcontainer").gotoDate().BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();
            });
            //previous date range
            $("#sfprevbtn").click(function(e) {
                var p = $("#gridcontainer").previousRange().BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();
            });
            //next date range
            $("#sfnextbtn").click(function(e) {
                var p = $("#gridcontainer").nextRange().BcalGetOp();
                if (p && p.datestrshow) {
                    $("#txtdatetimeshow").text(p.datestrshow);
                }
                removeDrag();
            });
            removeDrag();
            function removeDrag() {
                $("div[id=bbit_cal_event_-1]").each(function(){
                    $(this).removeClass("drag");
                    if (!$(this).hasClass("cal_-1")) {
                        $(this).addClass("cal_-1");
                    }
                    // $(this).unbind("click");
                    $(this).find(".rb-m").css('background','#87a96b');
                    $(this).find(".rb-i").children().each(function(){
                        if($(this).hasClass("cic cic-tmr")) {
                            $(this).remove();
                        }
                    })
                });
            }
            function updateLang() {
                $("#calendar_title").html(i18n.common.index.calendar_title);
                $("#loadingpannel").html(i18n.common.index.loadingpannel);
                $("#errorpannel").html(i18n.common.index.errorpannel);
                $("#span_new_event").html(i18n.common.index.span_new_event);
                $("#span_today").html(i18n.common.index.span_today);
                $("#span_day").html(i18n.common.index.span_day);
                $("#span_week").html(i18n.common.index.span_week);
                $("#span_month").html(i18n.common.index.span_month);
                $("#span_refresh").html(i18n.common.index.span_refresh);
                $("#txtdatetimeshow").html(i18n.common.index.txtdatetimeshow);
            }
        });
    </script>   
</head>
<body>
  <div>
    <div id="calhead" style="padding-left:1px;padding-right:1px;">
        <div class="cHead">
            <div id="calendar_title" class="ftitle">My Calendar<>
            <div id="loadingpannel" class="ptogtitle loadicon" style="display: none;">Loading data...<>
            <div id="errorpannel" class="ptogtitle loaderror" style="display: none;">Sorry, could not load your data, please try again later<>
        <>
        <div id="caltoolbar" class="ctoolbar">
            <div id="faddbtn" class="fbutton">
                <div><span id="span_new_event" title='Click to Create New Event' class="addcal">New Event</span><>
            <>
         <div id="faddbtnt" class="fbutton">
             <div><span id="span_new_timesheet" title='Click to Create New Timesheet' class="addcal">New Timesheet</span><>
            <>
            <div class="btnseparator"><>
            <div id="showtodaybtn" class="fbutton">
                <div><span id="span_today" title='Click to back to today ' class="showtoday">Today</span><>
            <>
            <div class="btnseparator"><>
            <div id="showdaybtn" class="fbutton">
                <div><span id="span_day" title='Day' class="showdayview">Day</span><>
            <>
            <div id="showweekbtn" class="fbutton fcurrent">
                <div><span id="span_week" title='Week' class="showweekview">Week</span><>
            <>
            <div id="showmonthbtn" class="fbutton">
                <div><span id="span_month" title='Month' class="showmonthview">Month</span><>
            <>
            <div class="btnseparator"><>
            <div id="showreflashbtn" class="fbutton">
                <div><span id="span_refresh" title='Refresh view' class="showdayflash">Refresh</span><>
            <>
            <div class="btnseparator"><>
            <div id="sfprevbtn" title="Prev" class="fbutton">
                <span class="fprev"></span>
            <>
            <div id="sfnextbtn" title="Next" class="fbutton">
                <span class="fnext"></span>
            <>
            <div class="fshowdatep fbutton">
                <div>
                    <input type="hidden" name="txtshow" id="hdtxtshow" />
                    <span id="txtdatetimeshow">Loading</span>
                <>
            <>
            <div class="clear"><>
        <>
    <>
    <div style="padding:1px;">
        <div class="t1 chromeColor">&nbsp;<>
        <div class="t2 chromeColor">&nbsp;<>
        <div id="dvCalMain" class="calmain printborder">
            <div id="gridcontainer" style="overflow-y: visible;"><>
        <>
        <div class="t2 chromeColor">&nbsp;<>
        <div class="t1 chromeColor">&nbsp;<>
    <>
  <>
</body>
</html>

 <?php
       


J, não está faltando uma tag no código no local que comentei com ">>>>>>>>>>>>>>>>>" ?!?! Ele não roda do jeito que está.
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: sergiolowczy em Setembro 16, 2015, 08:24:22 am
Bom dia,

Achei perfeito o exemplo porem na hora de executar no meu fonte dá erro,
não funciona como foi postado acima

Alguem achou a solução
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: sergiolowczy em Setembro 16, 2015, 11:21:43 am
O outro exemplo tbm é perfeito, consegui implementar mas

quando clico pela primeira vez em dia qualquer sem evento, ok vem em branco pra incluir
se clico em evento existente vem para edit ,ok
mas se clicar novamente em dia sem evento vem o ultimo registro que achou o evento existente

onde estou errando
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: julioalbuquerque em Janeiro 06, 2016, 02:19:31 pm
Alguém já usou o wdCalendar com o SQL Server?
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: julioalbuquerque em Janeiro 07, 2016, 04:25:31 pm
Tudo funcionando perfeito!
Funciona tanto em MySql quanto em MSSQL!
Também consegui fazer por usuário!
Tudo no wdCalendar!

Show de bola!
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: jorgepopel em Janeiro 07, 2016, 07:16:52 pm
Julio,

Grava um video mostrando pra gente.

Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Nariga em Julho 12, 2017, 11:52:36 am
Bom dia pessoal,

De fato o post do Wennys Carlos é muito bom. Até para alguém que está engatinhando em php é possível implementá-lo e fazer as personalizações no calendário conforme desejado (o que ainda não dá para entender é pq NM não abriu alguns parâmetros do calendário para isso).

Mas fiquei com a mesma dúvida de alguns: alguém conseguiu implementar a funcionalidade do drag and drop?

Não consigo fazer o evento salvar as alterações no banco de dados.

Att,
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Ilton em Setembro 19, 2017, 12:51:35 am
Wennys ,

Boa noite,

Eu implantei seu calendario e estou utilizando, show de bola....
Agora surgiu uma necessidade que não estou conseguindo resolver,

no arquivo json.php
inclui mais um campo "tipo"
 
   $resultado[] = array(
                  'id'     => $idevento ,
                  'title'  => $descricao ,
                  'start'  => $data . " " . $horainicio ,
                  'end'    => $data . " " . $horafim,
                  'allDay' => false,
                  'color'  => $color,
              'tipo'   => $tipo
               );

Agora no calendario eu preciso verificar se o "tipo" for "C" ou "F" ele abre um formulario cliente senão abra outro formulario fornecedor,

como faço isso alguem pode me ajudar?


Se for tipo = "C"
         eventClick: function(calEvent, jsEvent, view) {

            var idevento   = calEvent.id;
            tb_show('', '../form_cliente/form_cliente.php?id='+idevento+'&sc_cal_click_date=&nmgp_outra_jan=true&nmgp_url_saida=modal&TB_iframe=false&modal=false&height=500&width=650', '');

Se for tipo = "M"

         eventClick: function(calEvent, jsEvent, view) {

            var idevento   = calEvent.id;
            tb_show('', '../form_fornecedor/form_fornecedor.php?id='+idevento+'&sc_cal_click_date=&nmgp_outra_jan=true&nmgp_url_saida=modal&TB_iframe=false&modal=false&height=500&width=650', '');


grato

Ilton
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Wennys Carlos em Setembro 20, 2017, 01:07:23 pm
Olá, Ilton.

Ficaria mais ou menos assim:

Código: [Selecionar]

eventClick: function(calEvent, jsEvent, view) {

            var idevento   = calEvent.id;

            var tipo = calEvent.tipo;

             if(tipo == 'C'){
                   
                   tb_show('', '../form_cliente/form_cliente.php?id='+idevento+'&sc_cal_click_date=&nmgp_outra_jan=true&nmgp_url_saida=modal&TB_iframe=false&modal=false&height=500&width=650', '');

              }

               if( tipo == "M"){

                             tb_show('', '../form_fornecedor/form_fornecedor.php?id='+idevento+'&sc_cal_click_date=&nmgp_outra_jan=true&nmgp_url_saida=modal&TB_iframe=false&modal=false&height=500&width=650', '');

                 }
Título: Re:UMA ALTERNATIVA AO USO DAS APPS CALENDÁRIO
Enviado por: Ilton em Setembro 20, 2017, 02:27:39 pm
Wennys ,

Muito obrigado, funcionou perfeitamente....