contact class

contact.js

class Contact {
	@observable title;
	@observable firstName;
	@observable lastName;
	@observable username;

	@observable picture = {
		thumbnail: null,
		medium: null,
		large: null,
	};

	@observable tags = [];
	@observable isDeleted = false;

	_saveHandle;

	constructor(store, id, name, username, picture) {
		this.store = store;
		this.id = id;
		this.title = name.title;
		this.firstName = name.first;
		this.lastName = name.last;
		this.username = username;
		this.picture = picture;
		this.autoSave = false;

		// automatically store item in local storage, debounce each second
		this._saveHandle = autorunAsync(() => {
			window.localStorage.setItem(STORAGE_PREFIX + this.id, JSON.stringify(this.asJSON));
		}, 1000);
	}

	@computed get displayName() {
		const cfl = capitalizeFirstLetter;
		return `${cfl(this.title)}. ${cfl(this.firstName)} ${cfl(this.lastName)}`;
	}

	@computed get asJSON() {
		return {
			id: this.id,
			username: this.username,
			name: {
				title: this.title,
				first: this.firstName,
				last: this.lastName,
			},
			picture: this.picture,
			tags: this.tags.map(tag => tag.name),
		}
	}

	getAvailableTags() {
		return this.store.tagStore.tags.filter(tag => this.tags.indexOf(tag) === -1);
	}

	@action	addTag(name) {
		this.tags.push(this.store.tagStore.findOrCreateTag(name));
	}

	@action	deleteTag(name) {
		this.tags.remove(this.store.tagStore.findOrCreateTag(name));
	}

	@action	updateFirstName(firstName) {
		this.firstName = firstName;
	}

	@action	updateLastName(lastName) {
		this.lastName = lastName;
	}

	@action	updateAutoSave(autoSave) {
		this.autoSave = autoSave;
	}

	@action	delete() {
		this._saveHandle(); // stop saving future changes
		this.store.removeContact(this);
	}
}