Posted By

jschilling on 05/02/09

Tagged

javascript

Versions (?)

Last Edited at 05/02/09 06:37pm

Statistics

Viewed 478 times

Favorited by 2 user(s)

Related snippets

intelligent logging

/ Published in: JavaScript

Intelligent logging for javascript (also compatible with Firebug). Thanks to Prototype.js, PPK, and Danny Goodman for the idea!

Highlighted TextExpand

BASE = {
       /**
       * USAGE
       * BASE.log(o)
	   * outputs the value of whatever is passed to it in either the firebug console,
	   * or a newly created window on top of your content;
	   * useful to debug various problems within your scripts
       * @param o = any object, array, number, or string
       */
       log:function(o)
	   {
		var logger = (this.isObject(window.console) && window.console.firebug) || null;
		if(!logger){
			if(document.createElement && document.getElementById){
				var elem = document.createElement('div') || document.getElementById('logger'),
					p = document.createElement('pre') || elem.firstChild,
					t = null, d = document.getElementsByTagName('body')[0],
					r = null, res = 'no data passed
', opac = 20, that = this;
					
				if(this.isObject(o) && !this.isArray(o)){
					r = [];
					for(var i in o){
						var name = o.nodeName || o.toString();
						r.push(name + '.' + i + '=' + o[i] + '
');
					}
					r.sort();
					res = r.join('
') || 'empty object
';
				}
				else if(this.isArray(o)){
					r = [];
					for(var i in o){
						var name = o.nodeName || o.toString();
						r.push(i + '=' + o[i] + '
');
					}
					r.sort();
					res = r.join('
') || 'empty array
';
				}
				else if(this.isString(o)){
					res = o + '
' || 'no string to display
';
				}
				else if(this.isNumber(o)){
					res = o + '
' || 'no number to display
';
				};
				if(!document.getElementById('logger')){
					t = document.createTextNode(res);
					p.appendChild(t); elem.appendChild(p);
					//required styles 
					elem.id = 'logger'; elem.className = 'console-window';
					elem.style['overflow'] = 'auto'; elem.style['top'] = '0px'; elem.style['zIndex'] = '1000';
					elem.style['left'] = '25%'; elem.style['width'] = '50%'; elem.style['margin'] = '10px auto';
					elem.style['position'] = 'fixed';
					if(this.isIE){
						elem.style['position'] = 'absolute';
						document.body.style['overflowY'] = 'auto';
						document.body.style['height'] = '100%'
					}
					p.style.className = 'window-text'; p.style['whiteSpace'] = 'pre'; p.style['textAlign'] = 'left';
					//default styles can be overridden using !important declarations in style sheets
					elem.style['padding'] = '5px 20px'; elem.style['height'] = '250px'; elem.style['backgroundColor'] = '#ffffff';
					elem.style['border'] = '1px solid red';
					//add transparency
					this.setOpacity(opac, elem);
					elem.onmouseover = function(){
						that.setOpacity(100, elem);
						//this.style['position'] = 'fixed';
					};
					elem.onmouseout = function(){
						that.setOpacity(opac, elem);
						//this.style['position'] = 'absolute';
					};
					//return new node to add to DOM 
					return d.insertBefore(elem, d.firstChild);
				}
				else {
					return document.getElementById('logger').firstChild.firstChild.nodeValue += res;
				}
			}
			else {
				window.alert('you should probably upgrade your browser!');
			}
		}
		else {
			if(this.isObject(o)){
				console.dir(o);
			}
			else {
				console.log(o);
			}
		}
	},
	isArray: function(object){
		return object !== null && typeof object == "object" && 
		'splice' in object && 'join' in object;
	},
	isFunction: function(object){
		return typeof object == "function";
	},
	isObject: function(object){
		return (object && (typeof object === 'object' || this.isFunction(object))) || false;
        },
	isString: function(object){
		return typeof object == "string";
	},
	isNumber: function(object){
		return typeof object == "number";
	},
	isIE:function()
	{
	  return !!( (/(msie 6|msie 7)/i).test(navigator.userAgent) && !(/opera/i).test(navigator.userAgent.indexOf('opera')) && window.ActiveXObject );
	}(),
	setOpacity:function(opacity, element)
	{
		if(!element.style['zoom']) {
			//correct hasLayout IE transparency
			element.style['zoom'] = 1;
		};
		if(element.style['MozOpacity']) {
			element.style['MozOpacity'] = (opacity / 100);
		};
		if(element.style['KhtmlOpacity']) {
			element.style['KhtmlOpacity'] = (opacity / 100);
		};
		if(element.filters) {
			element.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + opacity + ')';
			element.style.filter = 'alpha(opacity=' + Math.round(opacity) + ')';
		};
		element.style['opacity'] = (opacity / 100);
	}
};

URL: http://www.six-degrees.com/six-degrees.html

Report this snippet Tweet

Comments

Subscribe to comments

Comment:

You need to login to post a comment.