I have written up a notifications / alert class for a recent project and thought I would share it. Too much to go into in a post, so there is a big page for it here.

Before anyone brings it up, this is not yet in the MooTools Forge, but it will be soon assuming I don’t become distracted by something else…

This is just a little something I whipped up because I found it useful. Tips.Glossary is used for helpful tool-tips that gracefully degrade when JavaScript is not available for whatever reason. The basic idea is that you include an HTML glossary in the page, and if Tips.Glossary is available, the tips will come up however you specify, if not, they are simply anchors to their entries in the HTML.

This probably works with most MooTools stuff post 1.2, you are smart and will figure it out.

Check it out here.

Download the example.

or have a look at the code:

Selectors.Pseudo.hash = function(hash){
	if(!$chk(hash))
		return this.get('href').contains('#');
	var currentHash = this.get('href').split('#')[1];
	return currentHash === hash;
}
 
 
Tips.Glossary = new Class({
 
	Extends: Tips,
 
	options: {
		'anchorClass':	false,
		'hideGlossary':	true
	},
 
	initialize: function(glossary, options){
		this.parent(options);
		this.glossary = $(glossary);
		if(!$chk(this.glossary))
			throw "Glossary not found / defined, quitting";
		if(this.options.hideGlossary)
			this.glossary.setStyle('display', 'none');
		this.indexGlossary();
		return this;
	},
 
	indexGlossary: function(){
		this.items = this.glossary.getElements('*[id]');
		this.anchors = new Elements();
		this.items.each(function(e){
			var anchor = $(document.body).getElement('a:hash('+e.get('id')+')');
			if($chk(anchor)){
				if(this.options.hideGlossary);
				anchor.addEvent('click', function(event){
					new Event(event).stop();
				});
				this.setTipContent(anchor, e);
				this.anchors.push(anchor);
			}
			if(this.options.anchorClass)
				this.anchors.addClass(this.options.anchorClass);
			this.attach(this.anchors);
		}, this);
	},
 
	setTipContent: function(anchor, target){
		anchor.store('tip:title', target.get('title'));
		anchor.store('tip:text', target.get('html'));
		this.fireEvent('settingContent', [anchor, target]);
	}
 
});

On a side note, notice the psuedo selector being added. This has been added because for whatever reason, the following CSS3 selector is goofy:

$(document.body).getElements('a[href="http://trickeries.com"]'); // works
$(document.body).getElements('a[href="#glossary-username"]');    // does not work

Anyone have any idea why?

I am very pleased to introduce trickyInc, a flexible and extensible dynamic css / javascript library written in php.

Download

Documentation

I won’t go into detail here about what it does, because the google code project covers that pretty well. If you have any interest in dynamic css and/or javascript, I urge you to check it out. I have been using it on all of my projects lately, and I am enjoying the hell out of it.

I would love some developer feedback on this, so if anyone finds this interesting enough to use, please let me know about your experience, and open issues in the google code project as necessary. I would also love any feedback regarding making it faster / safer / better / whatever.

If you are a codeigniter user please use caution when outputting any user input into your views, even after it has been passed through xss_clean, or you have global xss filtering on. This will not prepare output for form field use. In order to safely output user input in a form field, you will need to load the form helper class as well and use the form_prep() function. The form_prep function is not available in the input class.

This is something I have discussed with the codeigniter developers, and they do not feel it is necessary to change:

“All global_xss_filtering does is run the Input::xss_clean() filter on user input for you automatically. It does not make assumptions about where or how that data will be used, and it would be improper to always format the content as needed for use in a form field.”

I do not feel that it is adequately documented that you need to make further alterations to input after the xss_clean, especially when it includes loading a helper file. This is not mentioned in the documentation for the input class.

At first I thought I was making undue assumptions, but a few quick injection attempts on other codeigniter run sites / projects, I realize that I am not the only one assuming.

First off, let me just say I feel really stupid for posting this. It seems like I stumbled onto something for the first time that should be common knowledge for a JavaScript developer.  However, I am still making the post because I find this to be rather strange.  Using the event ‘preventDefault’ method, you can completely disable Firefox’s built in keyboard shortcuts.  If you click on the following js bookmarklet:

ruin my browser!

You won’t be able to pop firebug up with f12, ctrl+t yourself a new tab, get yourself a fresh version of the page with f5, and you won’t even be able to view the source. When I ran into this for the first time, I thought my computer was fucked up.

Apparently, this is also just Firefox. I just tested it in IE and Chrome, and it appears to do nothing. Is this a XUL thing?

Does anyone else find this to be strange or annoying? Is this surprising or am I stupid? It just seems like this shouldn’t happen.