navim - delegate test page

The delegate version of navim allows you to write your own "up" and "down" functions for navim to call. This can be useful in a number of cases, for example:

  1. You use ajax to add/remove elements - without a delegate, you'd have to reinitialize jvim whenever your page contents change (which could be a lot)
  2. You have a large number of selectable elements, or elements are loaded on demand
  3. You want more control of the selection process - maybe you want to skip over hidden elements, or load a new page when the last element is scrolled past.

It's up to you...

The javascript for this page is:

function init_vim() {
	// note: a scenario this simple should just use the standard
	// mode, rather than a delegate. This is just to illustrate the
	// delegate callbacks
	var delegate = {
		up: function(currentElement) {
			if(currentElement == null) return null;
			return $(currentElement).prev('.scrollable');
		},

		down: function(currentElement) {
			if(currentElement == null) return $('.scrollable').eq(0);
			var next_elem = $(currentElement).next('.scrollable');
			if(next_elem.length == 0) {
				return currentElement;
			} else {
				return next_elem;
			}
		}
	};

	// now install our navigation delegate with navim:
	$.vimNavigation(delegate);
}

$(init_vim);

See the main example for an overview of navim, as well as download instructions.

Here's some more <li> elements for you to select (using "j" and "k"):