Event Handling

The model will have unified handling on element property change events. By this way, users can response to all property change events just by monitoring graph model, instead of adding monitoring to every element alone

Element change events

When element property changes, the graph model will transmit corresponding events via #dataChangeDispatcher. When the set membership of elements change, the monitoring can be performed by #parentChangeDispatcher

• #dataChangeDispatcher :Q.Dispatcher - Dispatcher of element property change event
• #beforeDataPropertyChange(event) - before element property change event
• #onDataPropertyChanged(event) - after element property change event
• #parentChangeDispatcher :Q.Dispatcher - Dispatcher of change event about set membership of elements

Example 1

Adds the element property change listener

var model = graph.graphModel;
var a = new Q.Node();
model.add(a);
model.dataChangeDispatcher.addListener({
    onEvent: function(evt){
        Q.log(evt.kind + ' changed. from [' + evt.oldValue + '] to [' + evt.value + ']');
    }
});
a.name = 'A';
a.name = 'B';

Print results:

name changed. from [undefined] to [A]
name changed. from [A] to [B]

Example 2

Monitors the change of parent node. Pay attention that another writing method for listener is used here. The monitoring function is introduced directly

var model = graph.graphModel;
 
var a = new Q.Node('A');
model.add(a);
var b = new Q.Node('B');
model.add(b);
 
model.parentChangeDispatcher.addListener(function(evt){
    Q.log(evt.source.name + '\'s ' + evt.kind + ' changed. from [' + evt.oldValue + '] to [' + evt.value.name + ']');
});
 
a.parent = b;

Print results:

A's parent changed. from [undefined] to [B]

Change event of graph model

When any change happens to element collection (such as adding, deleting……), the system will dispatch the collection change event, and monitor via #listChangeDispatcher

#listChangeDispatcher :Q.Dispatcher - Dispatcher of collection change event

Example

Monitors change event of graph model collection

var model = graph.graphModel;
 
model.listChangeDispatcher.addListener(function(evt){
    Q.log(evt.kind);
});
 
var a = new Q.Node('A');
model.add(a);
var b = new Q.Node('B');
model.add(b);
model.remove(a);
model.clear();

Print results:

add
add
remove
clear