Skip to content

developit/puredom-view

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

puredom-view NPM Version Bower Version

A simple view-presenter base class/mixin for puredom.

Acts as a glue between puredom's RouteManager and ViewManager.


Instantiation

Using AMD:

define(['puredom-view'], function(view) {
	return view({
		template : 'Hello, world!'
	});
});

Without AMD:

<script src="puredom-rest.js"></script>
<script>
	var routes = new puredom.RouteManager();

	var route = view({
		url : '/hello',
		template : 'Hello.'
	});

	routes.register('hello', route);
</script>

Usage

define(['puredom-view'], function(view) {

	// the caller just registers this as a route/controller
	return view({

		// for the router:
		name : 'about',
		title : 'About',
		customUrl : '/about',

		// View template, usually obtained via a text dependency:
		template : '{{#terms}}<a class="term" href="{{url}}">{{name}}</a>{{/terms}}',

		// Event delegation mappings
		events : {
			'click a.term' : 'openThing'
		},

		// Delegated handler, called in response to clicks on <a class="term">
		openThing : function(e) {
			window.open( e.target.href );
			return e.cancel();
		},

		// Some default data to populate with. Real data can be passed to .populate()
		data : {
			terms : [
				{ name:'Dinosaur', url:'http://wikipedia.org/wiki/Dinosaur' },
				{ name:'Koala', url:'http://wikipedia.org/wiki/Koala' },
				{ name:'Thu`um', url:'http://wikipedia.org/wiki/Skyrim' }
			]
		}

	});

});

About

A simple view-presenter base class/mixin for puredom. Works with puredom-router and puredom-viewmanager

Resources

License

Stars

Watchers

Forks

Packages

No packages published