Ver Mensaje Individual
  #1 (permalink)  
Antiguo 10/06/2010, 06:18
Avatar de Flow89
Flow89
 
Fecha de Ingreso: abril-2010
Ubicación: Valladolid
Mensajes: 346
Antigüedad: 14 años
Puntos: 1
Adaptar Calendario a PHP+MySQL.

Hola compañeros, una vez más estoy aquí para que me echéis una mano.

Tengo un calendario en Javascript, el cual tiene Eventos, y estos se definen en un array, mi propósito final es que en vez de añadirlos mediante un array, se añadan mediante un formulario, y se queden guardados en la base de datos.

Para que veais el funcionamiento del calendario pasaros por www.juventudmdc.comlu.com, como veis al darle a "Listar todo el mes" se abre la ventanita con los eventos que hay.

Para ver el codigo del calendario;

Calendario: PARTE1
Código Javascript:
Ver original
  1. /*No tocar nada de aquí. La configuración en el archivo calendarioefemerides_config.js */
  2. var hoy = new Date()
  3. var mes = hoy.getMonth()
  4. var dia = 1
  5. var anio = hoy.getFullYear()
  6. var diasSemana = new Array ('L','M','M','J','V','S','D')
  7. var meses = new Array('Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre')
  8. var tunIex=navigator.appName=="Microsoft Internet Explorer"?true:false;
  9. if(tunIex && navigator.userAgent.indexOf('Opera')>=0){tunIex = false}
  10. tunOp = navigator.userAgent.indexOf('Opera')>=0 ? true: false;
  11. var tunSel = false
  12. var gHoy = 0;
  13. var anCelda, alCelda, carga =false;
  14. function tunCalendario(){
  15.     if(!carga) escribeControles();
  16.     dia2 = dia
  17.     tab = document.createElement('table')
  18.     tab.id = 'calendario'
  19.     document.getElementById(idContenedor).appendChild(tab)
  20.     tcabeza = document.createElement('thead')
  21.     tab.appendChild(tcabeza)
  22.     fCalendario = document.createElement('div')
  23.     fCalendario.style.position= 'relative';
  24.     fCalendario.className = "cuadroTexto"
  25.     fCalendario.id = 'tunCuadroTexto'
  26.     document.getElementById(idContenedor).appendChild(fCalendario)
  27.     fi2 = document.createElement('tr')
  28.     fi2b = document.createElement('th')
  29.     fi2b.colSpan = 7
  30.     fi2.id = 'mesCalendario'
  31.     fi2b.appendChild(document.createTextNode(meses[mes] + "  -  " + anio))
  32.     fi2.appendChild(fi2b)
  33.     tcabeza.appendChild(fi2)
  34.     fi = document.createElement('tr')
  35.     tcabeza.appendChild(fi)
  36.     for(m=0;m<7;m++){
  37.         ce = document.createElement('th')
  38.         ce.appendChild(document.createTextNode(diasSemana[m]))
  39.         fi.appendChild(ce)
  40.         }
  41.         var escribe = false
  42.         var escribe2 = true
  43.     fecha = new Date(anio,mes,dia)
  44.     var d = fecha.getDay()-1
  45.     if(d<0){d = 6}
  46.     tcuerpo = document.createElement('tbody')
  47.     tab.appendChild(tcuerpo)
  48.     while(escribe2){
  49.     fi = document.createElement('tr')
  50.     co = 0
  51.         for(t=0;t<7;t++){
  52.             ce = document.createElement('td')
  53.             if(escribe && escribe2){
  54.                 fecha2 = new Date(anio,mes,dia)
  55.            
  56.                 /*****EVENTOS****/
  57.                 var _anio = fecha2.getFullYear().toString()
  58.                 var _mes = fecha2.getMonth() + 1
  59.                 _mes = _mes < 10 ? '0' + _mes : _mes.toString()
  60.                 var _dia = fecha2.getDate()
  61.                 _dia = _dia < 10 ? '0' + _dia : _dia.toString()
  62.                 buscaEv = buscaEvento(_anio + _mes + _dia, _mes + _dia)
  63.                 if(buscaEv){
  64.                     _titl = '';
  65.                     for( var x in buscaEv){
  66.                         _titl += buscaEv[x].titulo
  67.                         _titl += x < (buscaEv.length - 1) ? '; ' : '';
  68.                     }
  69.                 }
  70.                 ce.title = buscaEv ? _titl : formatoFecha(_anio + _mes + _dia)
  71.                 ce.className = buscaEv ? 'hayEvento' : ''
  72.                 /****FIN EVENTOS****/
  73.            
  74.                 if(fecha2.getMonth() != mes){escribe2 = false;}
  75.                 else{
  76.                     ce.appendChild(document.createTextNode(dia));
  77.                     dia++;
  78.                     co++;
  79.                     ce.style.cursor = calendarioCursor
  80.                     ce.onclick = marcaCalendario
  81.                 }
  82.             }
  83.             if(d == t && !escribe){
  84.                 ce.appendChild(document.createTextNode(dia))
  85.                 /*****EVENTOS****/
  86.                 var _anio = anio
  87.                 var _mes = mes + 1
  88.                 _mes = _mes < 10 ? '0' + _mes : _mes.toString()
  89.                 var _dia = dia
  90.                 _dia = _dia < 10 ? '0' + _dia : _dia.toString()
  91.                 buscaEv = buscaEvento(_anio + _mes + _dia, _mes + _dia)
  92.                 if(buscaEv){
  93.                     _titl = '';
  94.                     for( var x in buscaEv){
  95.                         _titl += buscaEv[x].titulo
  96.                         _titl += x < (buscaEv.length - 1) ? '; ' : '';
  97.                     }
  98.                 }
  99.                 ce.title = buscaEv ? _titl :  formatoFecha(_anio + _mes + _dia)
  100.                 ce.className = buscaEv ? 'hayEvento' : ''
  101.                 /****FIN EVENTOS****/
  102.                 dia++;co++
  103.                 escribe = true
  104.                 ce.style.cursor = calendarioCursor
  105.                 ce.onclick = marcaCalendario
  106.             }
  107.             else{
  108.                 ce.appendChild(document.createTextNode(" "))
  109.             }
  110.             fi.appendChild(ce)
  111.             if(hoy.getDate()+1 == dia && mes == hoy.getMonth() && anio == hoy.getFullYear() && !gHoy){
  112.                 ce.className = "Hoy"
  113.                 gHoy = 1;
  114.                 if(buscaEv){ escribeEvento(buscaEv)}
  115.                 else{ escribeFecha(_anio + _mes + _dia); enlaceListarMes()}
  116.  
  117.             }
  118.         }
  119.            
  120.         if(co>0){tcuerpo.appendChild(fi)}
  121.        
  122.         }
  123.     dia = dia2
  124. }
  125. function marcaCalendario(){
  126.     /*eventos*/
  127.     var _anio = anio.toString();
  128.     var _mes = mes + 1
  129.     _mes = _mes < 10 ? '0' + _mes  : _mes.toString()
  130.     var _dia = this.firstChild.nodeType == 1 ? this.firstChild.nextSibling.nodeValue : this.firstChild.nodeValue;
  131.     _dia = _dia < 10 ? '0' + _dia  : _dia.toString()
  132.     hayEvento = buscaEvento(_anio + _mes + _dia, _mes + _dia)
  133.     /*fin eventos */
  134.     if(hayEvento){ escribeEvento(hayEvento)}
  135.     else {escribeFecha(_anio + _mes + _dia); enlaceListarMes()}
  136.     ceSe = document.createElement('div')
  137.     ceSe.id = "tunSeleccionado"
  138.     with(ceSe.style){
  139.         borderWidth = "1px"
  140.         borderStyle = "solid"
  141.         borderColor = "#ff0000"
  142.         width = this.scrollWidth  + "px"
  143.         height = this.scrollHeight + "px"
  144.         position = "absolute"
  145.         zIndex = "1000"
  146.         }
  147.     if(tunSel){
  148.         tunSel.removeChild(tunSel.firstChild)
  149.     }
  150.     tunSel = this
  151.     this.insertBefore(ceSe,this.firstChild)
  152.     with(ceSe.style){
  153.         width = this.scrollWidth  + "px"
  154.         marginLeft = "-" + (calendarioPaddingCelda + 1) + "px"
  155.         marginTop = "-" + (calendarioPaddingCelda + 1) + "px"
  156.     }
  157. }
  158.  
  159. function borra(){
  160.     document.getElementById(idContenedor).removeChild(document.getElementById('calendario'))
  161.     document.getElementById(idContenedor).removeChild(document.getElementById('tunCuadroTexto'))
  162. }
  163. function establecerFecha(){
  164.     tunFe = new Date()
  165.     document.getElementById('tunMes').options[tunFe.getMonth()].selected = true
  166.     document.getElementById('tunAnio').value = tunFe.getFullYear()
  167. }
  168.  
  169. function buscaEvento(f, fc){
  170.     try{
  171.         eval(meses[mes].toLowerCase())
  172.     }
  173.     catch(error){
  174.         return false
  175.     }
  176.     var _array = eval(meses[mes].toLowerCase())
  177.     var _eventos = new Array()
  178.     for(var m in _array){
  179.         if(_array[m].fecha == f || _array[m].fecha == fc){
  180.             _eventos.push(_array[m])
  181.         }
  182.     }
  183.     return _eventos.length > 0 ? _eventos : false;
  184. }
  185.  
  186. function escribeEvento(obj){
  187.     escribeFecha(obj[0].fecha)
  188.     escribeEvento2(obj, false)
  189. }
  190. function escribeEvento2(obj, fec){
  191.     for(var w in obj){
  192.         var ti = document.createElement(tagTitulos)
  193.         if(fec){
  194.             _fec = formatoFecha(obj[w].fecha)
  195.             _d = _fec.substr(0,2)
  196.             ti.appendChild(document.createTextNode(_d + " - "))
  197.         }
  198.         var o = ti
  199.         if(obj[w].enlace){
  200.             var en = document.createElement('a')
  201.             en.href =obj[w].enlace
  202.             o.appendChild(en)
  203.             o = en
  204.         }
  205.  
  206.         o.appendChild(document.createTextNode(obj[w].titulo))
  207.         document.getElementById('tunCuadroTexto').appendChild(ti)
  208.         var te = document.createElement('p')
  209.         te.appendChild(document.createTextNode(obj[w].texto))
  210.         document.getElementById('tunCuadroTexto').appendChild(te)
  211.     }
  212.     enlaceListarMes()
  213. }
  214. function enlaceListarMes(){
  215.     try{
  216.         eval(meses[mes].toLowerCase())
  217.     }
  218.     catch(error){
  219.         return false
  220.     }
  221.     var verTodos = document.createElement('strong')
  222.     verTodos.style.cursor = 'pointer'
  223.     verTodos.style.display = 'block'
  224.     verTodos.appendChild(document.createTextNode(textoVerTodos))
  225.     verTodos.onclick = escribirEventosMes
  226.     document.getElementById('tunCuadroTexto').appendChild(verTodos)
  227.    
  228. }
  229. function escribeFecha(fecha){
  230.     lNodos = document.getElementById('tunCuadroTexto').childNodes.length
  231.     if(lNodos){
  232.         for(var m = 0; m < lNodos; m++){
  233.             document.getElementById('tunCuadroTexto').removeChild(document.getElementById('tunCuadroTexto').childNodes[0])
  234.         }
  235.     }
  236.     var fe = document.createElement('strong')
  237.     fe.appendChild(document.createTextNode(formatoFecha(fecha)))
  238.     document.getElementById('tunCuadroTexto').appendChild(fe)
  239. }
  240. function formatoDiaMes(v){
  241.     v = v < 10 ? '0' + v : v ;
  242.     return v
  243. }



****** CODIGO CORTADO; CONTINUA ABAJO. *******
__________________
Seamos realistas. Busquemos lo imposible. ;)
La forma de dar las gracias en este foro, es dando Karma, aunque a veces con un simple Gracias, basta.

Última edición por Flow89; 10/06/2010 a las 06:26