Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Updated anchor link and formatting

...

Code Block
titleapp/views/index.xml
linenumberstrue
languagexml
<TableView id="table" dataCollection="locations" dataFunction="updateUi" dataTransform="transformData">
	<Require src="row"/>
</TableView>
<View id="footer" class="toolbar">
    <Label id="leftButton" onClick="doChanges">change</Label>
    <View class="divider"/>
    <Label id="rightButton" onClick="updateUi">update</Label>
</View>

...

Code Block
titleapp/controllers/index.js
linenumberstrue
languagejs
function doChanges(e) {
	// grab a random model by index
	var index = Math.round((locations.length-1)*Math.random());
	var model = locations.at(index);
	// Modify the model by adding a "+" to the end of the model's name
	model.set(
		{ name: model.get('name') + '+' },
		// set silent to true to prevent data binding from firing automatically. 
		// Silent changes will not trigger data binding to update.
		{ silent: true }
	);
}
// On first run, call the binding function name we defined in the TableView's dataFunction attribute
updateUi();

...

Code Block
titleapp/alloy.js
linenumberstrue
languagejs
var Location = Backbone.Model.extend();
var Locations = Backbone.Collection.extend({
	model: Location
});
Alloy.Collections.locations = new Locations();
Alloy.Collections.locations.reset([
	{ name: 'G.I. Lab', color: '#a00', direction: 'left' },
	{ name: 'Medical Treatment Unit', color: '#a00', direction: 'right' },
	{ name: 'Outpatient Surgery', color: '#a00', direction: 'left' },
	{ name: 'Telephone', color: '#a00', direction: 'right' },
	{ name: 'Central Village', color: '#008', direction: 'left' },
	{ name: 'Psychiatric Unit', color: '#008', direction: 'left' },
	{ name: 'Tower Elevators', color: '#05B8CC', direction: 'left' },
	{ name: 'Main Village', color: '#3B5323', direction: 'left' },
	{ name: 'Conference Center', color: '#3B5323', direction: 'left' },
	{ name: 'Parking Garage', color: '#3B5323', direction: 'left' },
	{ name: 'Suite A-D', color: '#3B5323', direction: 'left' }
]);

See

...

also