javascript object event

Tom schreef op 02.03.2009 17:57

ik krijg hierbij:
window.onload is not a function

window.onload werkt zo namenlijk niet. het moet namelijk zo:

window.onload = function()
{
    liveOS = new windows_container();
    window1 = new liveOS.window('hi','test');
    new window1.on_resize.event(function() {
        alert('hi :D');
    });
}

Jelmer schreef op 02.03.2009 17:26

Die 'new' is op regel 7 van je main.js scriptje niet nodig. New gebruik je alleen wanneer je een nieuw object aan wilt maken. Dat doe je door een functie met 'new' ervoor aan te roepen.

Jij wilt alleen een functie uitvoeren. Dan is 'new' niet nodig.

<?
var custom_event = new window1.on_resize.event(function(){....});
custom_event.exec();//om handmatig de event te triggeren
custom_event.destroy();//om de event te verwijderen
?>

<?
		this.on_resize = function(){
			current_event = current_window.on_resize;
			if(current_event.handlers===undefined) {
				current_event.handlers = new Array();
			}
			current_event.add_handler = function(func) {
				for(var x=0;current_event.handlers[x];x++);
				current_event.handlers[x] = func;
				this.handler_id = x;
				this.exec = current_event.handlers[x];
				this.destroy = function() {
					current_event.handlers[x] = null;
				}
			}
			for(var x=0;x<current_event.handlers.length;x++) {
				if(current_event.handlers[x]) {
					if(current_event.handlers[x]()===false) {
						return false;
					}
				}
			}
			return true;
		}
?>

<?
function windows_container(element_id) {
	var minwidth = 49
	var minheight = 20;
	var parent = this;
	if(!element_id) {
		this.element = document.createElement('div');
		this.element.style.position = 'absolute';
		this.element.style.top = '0px';
		this.element.style.left = '0px';
		this.element.style.width = '0px';
		this.element.style.height = '0px';
		this.element.style.zIndex = '10';
		
		this.local_id = 0;
		while(document.getElementById('windows_container_'+this.local_id)) {
			this.local_id++;
		}
		this.element.id = 'windows_container_'+this.local_id;
		this.local_id = this.element.id;
		document.body.appendChild(this.element);
	} else {
		this.element = document.getElementById(element_id);
		this.local_id = element_id;
	}
	//variables
	this.windows = new Array();
	
	//events
	this.on_new_window = function(){return true;}
	
	//functions
	this.window = function(title,content,innerDimension) {
		var current_window = this;
		
		//functions
		this.drag_start = function() {
			if(current_window.positioning==2){
				return false;
			}
			current_window.temp_window_offset = new Array(current_window.element.offsetLeft - mouse_fixed[0],current_window.element.offsetTop - mouse_fixed[1]);
			document_onmouseup.push(function() {
				current_window.temp_window_offset = null;
				document_onmousemove.pop();
				document_onmouseup.pop();
			});
			document_onmousemove.push(function() {
				if(current_window.temp_window_offset) {
					current_window.set_location(mouse_fixed[0]+current_window.temp_window_offset[0],mouse_fixed[1]+current_window.temp_window_offset[1]);
				}
			});
		}
		
		this.set_location = function(x,y) {
			current_window.element.style.marginLeft = parseInt(x)+'px';	
			current_window.element.style.marginRight = 'auto';			
			current_window.element.style.marginTop = parseInt(y)+'px';
			current_window.element.style.marginBottom = 'auto';
		}
		
		this.set_width = function(width,no_event) {
			if(!no_event && !current_window.on_resize()) {return false;}
			width = Math.max(parseInt(width),minwidth);
			current_window.element.style.width = (width)+'px';
			current_window.content_element.style.width = (width)+'px';
			current_window.content_container.style.width = (width)+'px';
			current_window.title_element.style.width = (width-minwidth)+'px';
		}
		
		this.set_height = function(height,no_event) {
			if(!no_event && !current_window.on_resize()) {return false;}
			height = Math.max(parseInt(height),minheight);
			current_window.element.style.height = (height)+'px';
			current_window.content_element.style.height = (height-minheight)+'px';
			current_window.content_container.style.height = (height-minheight)+'px';
		}
		
		this.set_dimension = function(width,height,no_event) {
			if(!no_event && !current_window.on_resize()) {return false;}
			current_window.set_width(width,1);
			current_window.set_height(height,1);
		}
		
		this.set_innerWidth = function(width,no_event) {
			if(!no_event && !current_window.on_resize()) {return false;}
			current_window.set_width(width,1);			
		}
		
		this.set_innerHeight = function(height,no_event) {	
			if(!no_event && !current_window.on_resize()) {return false;}
			current_window.set_height(height+minheight,1);			
		}
		
		this.set_innerDimension = function(width,height,no_event) {
			if(!no_event && !current_window.on_resize()) {return false;}
			current_window.set_innerWidth(width,1);
			current_window.set_innerHeight(height,1);
		}
		
		this.minimize = function() {
			current_window.positioning = 0;
			current_window.float_position = new Array(
				current_window.element.offsetLeft,
				current_window.element.offsetTop,
				parseInt(current_window.element.style.width),
				parseInt(current_window.element.style.height)
			);
			current_window.content_element.style.display = 'none';
			current_window.set_innerDimension(0,0);
			current_window.set_location(0,body_height() - parseInt(current_window.element.style.height));
		}
		
		this.maximize = function() {
			if(current_window.positioning==0) {
				current_window.content_element.style.display = 'block';
			}
			if(current_window.positioning==1) {
				current_window.float_position = new Array(
					current_window.element.offsetLeft,
					current_window.element.offsetTop,
					parseInt(current_window.element.style.width),
					parseInt(current_window.element.style.height)
				);
				current_window.set_location(-1,-1);
				current_window.set_dimension(body_width()+2,body_height()+2);	
				current_window.positioning = 2;	
			} else {
				current_window.set_location(current_window.float_position[0],current_window.float_position[1]);
				current_window.set_dimension(current_window.float_position[2],current_window.float_position[3]);
				current_window.positioning = 1;	
			}
		}
		
		this.destroy = function(no_event) {
			if(!no_event && !current_window.on_destroy()) {return false;}
			this.element.parentNode.removeChild(this.element);
		}
		
		//variables
		this.float_position = new Array(0,0,0,0);
		this.positioning = 1;
		
		//events
		this.on_resize = function(){
			current_event = current_window.on_resize;
			if(current_event.handlers===undefined) {
				current_event.handlers = new Array();
			}
			current_event.add_handler = function(func) {
				for(var x=0;current_event.handlers[x];x++);
				current_event.handlers[x] = func;
				this.handler_id = x;
				this.exec = current_event.handlers[x];
				this.destroy = function() {
					current_event.handlers[x] = null;
				}
			}
			for(var x=0;x<current_event.handlers.length;x++) {
				if(current_event.handlers[x]) {
					if(current_event.handlers[x]()===false) {
						return false;
					}
				}
			}
			return true;
		}
		this.on_destroy = function(){
			var events = new Array();
			this.event = function(func) {
				for(var x=0;events[x];x++);
				events[x] = func;
			}
			for(var x=0;x<events.length;x++) {
				if(events[x]) {
					events[x]();
				}
			}
			return true;
		}
		this.on_move = function(){
			var events = new Array();
			this.event = function(func) {
				for(var x=0;events[x];x++);
				events[x] = func;
			}
			for(var x=0;x<events.length;x++) {
				if(events[x]) {
					events[x]();
				}
			}
			return true;
		}
		
		this.local_id = 0;
		while(parent.windows[this.local_id]) {
			this.local_id++;
		}
		if(parent.on_new_window(this.local_id,title,content)===false) {//indien "return false" gebruikt is in de "on_new_window" event...
			return false;//stop het maken van een nieuwe window
		}
		parent.windows[this.local_id] = this;
		
		if(!title) {
			title = '';
		} else {
			title = title.toString();
		}
		if(!content) {
			content = '';
		} else {
			content = content.toString();
		}
		
		this.element = document.createElement('table');
		this.element.cellSpacing = '0';
		this.element.id = 'window_'+parent.local_id+'_'+this.local_id;
		this.element.className = 'window_inactive';		
		parent.element.appendChild(this.element);
		
		
		this.element.appendChild(document.createElement('tbody'));
		
		
		this.element.childNodes[0].appendChild(document.createElement('tr'));
		this.element.childNodes[0].appendChild(document.createElement('tr'));
		
		
		this.element.childNodes[0].childNodes[0].appendChild(document.createElement('td'));
		this.element.childNodes[0].childNodes[0].appendChild(document.createElement('td'));
		this.element.childNodes[0].childNodes[1].appendChild(document.createElement('td'));
		
		this.element.childNodes[0].childNodes[0].childNodes[0].innerHTML = title;
		this.element.childNodes[0].childNodes[0].childNodes[0].className = 'window_title';
		this.element.childNodes[0].childNodes[0].childNodes[0].onmousedown = function(){current_window.drag_start();return false;};
		this.element.childNodes[0].childNodes[0].childNodes[0].ondblclick = function(){current_window.maximize();return false};
		this.title_element = this.element.childNodes[0].childNodes[0].childNodes[0];
		
		this.element.childNodes[0].childNodes[0].childNodes[1].className = 'window_buttons';
		this.element.childNodes[0].childNodes[0].childNodes[1].appendChild(document.createElement('img'));
		this.element.childNodes[0].childNodes[0].childNodes[1].appendChild(document.createElement('img'));
		this.element.childNodes[0].childNodes[0].childNodes[1].appendChild(document.createElement('img'));
		
		this.element.childNodes[0].childNodes[0].childNodes[1].childNodes[0].src='img/windows/min.png';
		this.element.childNodes[0].childNodes[0].childNodes[1].childNodes[0].alt='[-]';
		this.element.childNodes[0].childNodes[0].childNodes[1].childNodes[0].onclick=function() {
			current_window.minimize();
			return false;
		};
		this.element.childNodes[0].childNodes[0].childNodes[1].childNodes[1].src='img/windows/plus.png';
		this.element.childNodes[0].childNodes[0].childNodes[1].childNodes[1].alt='[+]';
		this.element.childNodes[0].childNodes[0].childNodes[1].childNodes[1].onclick=function() {
			current_window.maximize();
			return false;
		};
		this.element.childNodes[0].childNodes[0].childNodes[1].childNodes[2].src='img/windows/blank.png';
		this.element.childNodes[0].childNodes[0].childNodes[1].childNodes[2].alt='[x]';
		this.element.childNodes[0].childNodes[0].childNodes[1].childNodes[2].onclick=function() {
			current_window.destroy();
			return false;
		};
		
		
		this.element.childNodes[0].childNodes[1].childNodes[0].colSpan = '2';
		this.element.childNodes[0].childNodes[1].childNodes[0].className = 'window_content_container';
		this.element.childNodes[0].childNodes[1].childNodes[0].appendChild(document.createElement('div'));
		this.element.childNodes[0].childNodes[1].childNodes[0].childNodes[0].innerHTML = content;
		this.element.childNodes[0].childNodes[1].childNodes[0].childNodes[0].className = 'window_content';
		this.content_element = this.element.childNodes[0].childNodes[1].childNodes[0].childNodes[0];
		this.content_container = this.element.childNodes[0].childNodes[1].childNodes[0];
		
		if(innerDimension) {
			if(typeof(innerDimension)=='object' && (innerDimension instanceof Array) && innerDimension.length == 2) {
				this.set_innerDimension(innerDimension[0],innerDimension[1]);
			} else if(typeof(innerDimension)=='number') {
				this.set_innerWidth(innerDimension);
			} else if(typeof(parseInt(innerDimension))=='number') {
				this.set_innerWidth(parseInt(innerDimension));
			}
		}
		this.set_innerDimension(this.content_container.offsetWidth,this.content_container.offsetHeight);
	}
	
}

?>

<?

var window_onload = new Array();
window.onload=function(e) {
	for(var x=0;x<window_onload.length;x++) {
		window_onload[x](e);
	}
}

var liveOS,window1;
window_onload.push(function() {
	liveOS = new windows_container();
	window1 = new liveOS.window('hi','test');
	new window1.on_resize.add_handler(function() {
		alert('hi :D');
	});
	new window1.on_resize.add_handler(function() {
		alert('hi2 :D');
	});
	
});

?>