Output

You can output a Type instance on the page.

var person = new Person({
	firstname: 'John',
	lastname: 'Johnson'
});
person.output();

That's all there is to it. You can now get a hold of the person from anywhere on the page.

var person = Person.output.get();
console.log(person.fullname()); // John Johnson

That is nice, but not always practical if you don't know when the person is outputted. To cover this, you can connect an output listener. But before we can get to that, please observe the following conventions.

Output conventions

1. When a new instance is outputted, the new output replaces the old output. There can only be one instance of our Person on the page.
2. When a subclass of Person is outputted, it also replaces the output of type Person or any other subclass. There can really only be one.

According to conventions, any output listener connected to Person would also be hooked up to output of type GoodPerson or BadPerson, so let's create and output one of those.

var GoodPerson = Person.extend();
var goodperson = new GoodPerson();
goodperson.output(); // replaces the Person output

Connect a listener

The output listener must have a special method oninput to be called whenever a new Person is outputted. It listens for all kinds of Person.

Person.output.connect ({
	oninput: function(input) {
		console.log(input.data);
	}
});

Because an instance of GoodPerson is already out, the method will be called immediately. In the code above, the input parameter is not the goodperson instance, but an edb.Input object with three properties.

• data refers to the outputted instance (goodperson)
• type refers to the instance constructor (GoodPerson)
• connection refers to Type we are connected to (Person)

This elaborate setup will come in handy when we attempt to handle multiple types of output with a single method (like we do in plugins).

Disconnect a listener

If you keep a reference to listener, you can of course disconnect it.

Person.output.disconnect(listener);

Revoke the output

If you decide that a Type should no longer be output on the page, you can revoke it. There's two ways to go about this.

person.revoke(); // via the instance
Person.output.revoke(); // via the constructor

This will cause all output observers to be called with an edb.Input object whose data property is null.

Working with output

Say we're working on a list-detail view. It's fine that there is only ever one Person to deal with in the details, but what if there's more than one Person in the list? To cover this, we'll need to output a second Type on the page and this time it's an edb.Array. Note that we'll not worry about rendering techniques here, we'll save that topic for later.

var PersonList = edb.Array.extend(
	$of: Person
);
var json_array = $.getJSON('personas.json');
ver personlist = new PersonList(json_array);
personlist.output();

When a person is selected in the list, we can update the details view.

personlist[23].output();

You can render a lot of UI by outputting Objects and Arrays like this.

Observing Types

If we're coding a chat room, our rendering might also need to know:

• When a new Person goes online (and should be added to the list)
• When a Person changes status (and the details should be updated)

Instead of rendering the whole UI whenever something like this happes, we can apply incremental updates to our rendering by observing the output for microscopic changes. Let's see how.