CalendarJS mit anderer HTML Struktur (Scriptsprachen)

Micha , Karlsruhe, Dienstag, 05. Januar 2010, 14:35 (vor 247 Tagen) @ Dodo

Hallo,

Ich bekomme im IE8 und auch im Firebug immer "'this.tableNavi.childNodes.2.nodeValue.length' ist Null oder kein Objekt

Ich habe es mit Opera, FF und dem IE probiert - keine Fehlermeldung. Firebug habe und nutze ich nicht, da es bei JS Problemen mir nicht mehr hilft als als die Fehlerkonsole.

Ich habe den Code noch mal umgeschrieben, teste ihn bitte noch mal!

Zum leeren SPAN, das wird für abgerunde Ecken benötigt.

Struktur und Designtrennung ;-)

Dein SPAN ist dabei...

Micha

 
/**********************************************************************
*          Calendar JavaScript [DOM] v3.10 by Michael Loesler          *
************************************************************************
* Copyright (C) 2005-09 by Michael Loesler, http//derletztekick.com    *
*                                                                      *
*                                                                      *
* This program is free software; you can redistribute it and/or modify *
* it under the terms of the GNU General Public License as published by *
* the Free Software Foundation; either version 3 of the License, or    *
* (at your option) any later version.                                  *
*                                                                      *
* This program is distributed in the hope that it will be useful,      *
* but WITHOUT ANY WARRANTY; without even the implied warranty of       *
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the        *
* GNU General Public License for more details.                         *
*                                                                      *
* You should have received a copy of the GNU General Public License    *
* along with this program; if not, see <http://www.gnu.org/licenses/>  *
* or write to the                                                      *
* Free Software Foundation, Inc.,                                      *
* 59 Temple Place - Suite 330, Boston, MA  02111-1307, USA.            *
*                                                                      *
 **********************************************************************/
 
	function CalendarJS() {
		this.now = new Date();
		this.dayname = ["Mo","Di","Mi","Do","Fr","Sa","So"];
		this.monthname = ["Januar","Februar","März","April","Mai","Juni","Juli","August","September","Oktober","November","Dezember"];	
		this.tooltip = ["vorheriger Monat","nächster Monat","aktuelles Datum"];
		this.monthCell = document.createElement("th");
		this.tableNavi = null;
		this.tableHead = null;
		this.parEl = null;
 
		this.init = function( id, initDate ) {
			this.now = initDate?initDate:new Date();
			this.date = this.now.getDate();
			this.month = this.mm = this.now.getMonth();
			this.year = this.yy = this.now.getFullYear();
			this.monthCell.colSpan = 5;
			this.monthCell.appendChild(document.createTextNode( this.monthname[this.mm]+" "+this.yy ));
 
			this.tableNavi = this.createTableNavi();
 
			this.tableHead = this.createTableHead();
			this.parEl = document.getElementById( id );
			this.show();
			if (!initDate) this.checkDate();
		},
 
 
		this.checkDate = function() {
			var self = this;
			var today = new Date();
			if (this.date != today.getDate()) {
				this.date  = today.getDate();
				if (this.mm == this.month && this.yy == this.year)
					this.switchMonth("current");
				this.month = today.getMonth();
				if (this.mm == this.month && this.yy == this.year)
					this.switchMonth("current");
				this.year  = today.getFullYear();
				if (this.mm == this.month && this.yy == this.year)
					this.switchMonth("current");
 
			}
			window.setTimeout(function() { self.checkDate(); }, Math.abs(new Date(this.year, this.month, this.date, 24, 0, 0)-this.now));
		},
 
		this.removeElements = function( Obj ) {
			while( Obj.childNodes.length > 0)
				Obj.removeChild(Obj.childNodes[Obj.childNodes.length-1]);
			return Obj;
		},
 
		this.show = function() {
			this.parEl = this.removeElements( this.parEl );
			this.monthCell.firstChild.replaceData(0, this.monthCell.firstChild.nodeValue.length, this.monthname[this.mm]+" "+this.yy);
 
			var textKnoten = this.tableNavi.firstChild;
			while (textKnoten != null) {
				if (textKnoten.nodeType == 3) {
					textKnoten.replaceData(0, textKnoten.nodeValue.length, this.monthname[this.mm]+" "+this.yy);
					break;
				}
				textKnoten = textKnoten.nextSibling;
			}
 
			//this.tableNavi.childNodes[2].replaceData(0, this.tableNavi.childNodes[2].nodeValue.length, this.monthname[this.mm]+" "+this.yy);
			var table = document.createElement("table");
			table.appendChild( this.createTableBody() );
			table.appendChild( this.tableHead );
			this.parEl.appendChild( this.tableNavi );
			this.parEl.appendChild( document.createElement("hr") );
			this.parEl.appendChild( table );
		},
 
		this.createTableNavi = function() {
			var h3 = document.createElement("h3");
			h3.className = "catbg centertext";
			var span = document.createElement("span");
			span.className = "left";
			h3.appendChild( span );
 
			span = document.createElement("span");
			span.className = "last_month";
			span.appendChild(document.createTextNode( "\u00AB" ));
			span.Instanz = this;
			span.onclick = function() { this.Instanz.switchMonth("prev"); };
			span.title = this.tooltip[0];
			try { span.style.cursor = "pointer"; } catch(e){ span.style.cursor = "hand"; }
			h3.appendChild( span );
 
			span = document.createElement("span");
			span.className = "next_month";
			span.appendChild(document.createTextNode( "\u00BB" ));
			span.Instanz = this;
			span.onclick = function() { this.Instanz.switchMonth("prev"); };
			span.title = this.tooltip[1];
			try { span.style.cursor = "pointer"; } catch(e){ span.style.cursor = "hand"; }
			h3.appendChild( span );
 
			h3.appendChild(document.createTextNode( this.monthname[this.mm]+" "+this.yy ));
			return h3;
		},
 
		this.createTableHead = function() {
			var thead = document.createElement("thead");
			/*
			var tr = document.createElement("tr");
			var th = this.getCell( "th", "\u00AB", "last_month" )
			th.Instanz = this;
			th.onclick = function() { this.Instanz.switchMonth("prev"); };
			th.title = this.tooltip[0];
			try { th.style.cursor = "pointer"; } catch(e){ th.style.cursor = "hand"; }
			tr.appendChild( th );
			this.monthCell.Instanz = this;
			this.monthCell.onclick = function() { this.Instanz.switchMonth("current"); };
			this.monthCell.title = this.tooltip[2];
			try { this.monthCell.style.cursor = "pointer"; } catch(e){ this.monthCell.style.cursor = "hand"; }
			tr.appendChild( this.monthCell );			
			th = this.getCell( "th", "\u00BB", "next_month" )
			th.Instanz = this;
			th.onclick = function() { this.Instanz.switchMonth("next"); };
			th.title = this.tooltip[1];
			try { th.style.cursor = "pointer"; } catch(e){ th.style.cursor = "hand"; }
			tr.appendChild( th );
			thead.appendChild( tr );
			*/
			var tr = document.createElement('tr');
			for (var i=0; i<this.dayname.length; i++)
				tr.appendChild( this.getCell("th", this.dayname[i], "weekday" ) );
			thead.appendChild( tr );
			return thead;
		},
 
		this.createTableBody = function() {
			var dayspermonth = [31,28,31,30,31,30,31,31,30,31,30,31];
			var sevendaysaweek = 0;
			var begin = new Date(this.yy, this.mm, 1);
			var firstday = begin.getDay()-1;
			if (firstday < 0)
				firstday = 6;
			if ((this.yy%4==0) && ((this.yy%100!=0) || (this.yy%400==0)))
				dayspermonth[1] = 29;
			var tbody = document.createElement("tbody");
			var tr = document.createElement('tr');
			if (firstday == 0) {
				for (var i=0; i<this.dayname.length; i++) {
					var prevMonth = (this.mm == 0)?11:this.mm-1;
					tr.appendChild( this.getCell( "td", dayspermonth[prevMonth]-6+i, "last_month" ) );
				}
				tbody.appendChild( tr );
				tr = document.createElement('tr');
			}
 
			for (var i=0; i<firstday; i++, sevendaysaweek++) {
				var prevMonth = (this.mm == 0)?11:this.mm-1;
				tr.appendChild( this.getCell( "td", dayspermonth[prevMonth]-firstday+i+1, "last_month" ) );
 
			}
 
			for (var i=1; i<=dayspermonth[this.mm]; i++, sevendaysaweek++){
				if (this.dayname.length == sevendaysaweek){
					tbody.appendChild( tr );
					tr = document.createElement('tr');
					sevendaysaweek = 0;
				}
 
				var td = null;
				if (i==this.date && this.mm==this.month && this.yy==this.year && (sevendaysaweek == 5 || sevendaysaweek == 6))
					td = this.getCell( "td", i, "today weekend" );
				else if (i==this.date && this.mm==this.month && this.yy==this.year)
					td = this.getCell( "td", i, "today" );
				else if (sevendaysaweek == 5 || sevendaysaweek == 6)
					td = this.getCell( "td", i, "weekend" );
				else
					td = this.getCell( "td", i, null ); 
 
				td.setDate = this.setDate;
				td.dd = i;
				td.mm = this.mm;
				td.yy = this.yy;
				td.onclick = function(e) {
					var currentDate = new Date(this.yy, this.mm, this.dd);
					this.setDate( currentDate );
				};
				tr.appendChild( td );
			}
 
			var daysNextMonth = 1;
			for (var i=sevendaysaweek; i<this.dayname.length; i++) 
				tr.appendChild( this.getCell( "td", daysNextMonth++, "next_month"  ) );
 
			tbody.appendChild( tr );
 
			while (tbody.getElementsByTagName("tr").length<6) {
				tr = document.createElement('tr');
				for (var i=0; i<this.dayname.length; i++) 
					tr.appendChild( this.getCell( "td", daysNextMonth++, "next_month"  ) );
				tbody.appendChild( tr );
			}
 
			return tbody;
 
		},
 
		this.setDate = function(date) {
			// Weiterverarbeitung des geklickten Datums
			//window.alert( date );
		}
 
		this.getCell = function(tag, str, cssClass) {
			var El = document.createElement( tag );
			El.appendChild(document.createTextNode( str ));
			if (cssClass != null)
				El.className = cssClass;
			return El;
		},
 
		this.switchMonth = function( s ){
			switch (s) {
				case "prev": 
					this.yy = (this.mm == 0)?this.yy-1:this.yy;
					this.mm = (this.mm == 0)?11:this.mm-1;
				break;
 
				case "next":
					this.yy = (this.mm == 11)?this.yy+1:this.yy;
					this.mm = (this.mm == 11)?0:this.mm+1;
				break;
 
				case "current":
					this.yy = this.year;
					this.mm = this.month;
				break;
			}
			this.show();
		}
	}
 
	var DOMContentLoaded = false;
	function addContentLoadListener (func) {
		if (document.addEventListener) {
			var DOMContentLoadFunction = function () {
				window.DOMContentLoaded = true;
				func();
			};
			document.addEventListener("DOMContentLoaded", DOMContentLoadFunction, false);
		}
		var oldfunc = (window.onload || new Function());
		window.onload = function () {
			if (!window.DOMContentLoaded) {
				oldfunc();
				func();
			}
		};
	}
 
	addContentLoadListener( function() { 
			new CalendarJS().init("calendar");
			//new CalendarJS().init("calendar", new Date(2009, 1, 15));
	} );