szurubooru/client/js/views/user_view.js
rr- 54e3099c56 client/general: refactor control flow
- Controller lifetime is bound to route lifetime
- View lifetime is bound to controller lifetime
- Control lifetime is bound to view lifetime
- Enhanced event dispatching
- Enhanced responsiveness in some places
- Views communicate user input to controllers via new event system
2016-06-18 10:35:20 +02:00

66 lines
1.9 KiB
JavaScript

'use strict';
const events = require('../events.js');
const views = require('../util/views.js');
const UserDeleteView = require('./user_delete_view.js');
const UserSummaryView = require('./user_summary_view.js');
const UserEditView = require('./user_edit_view.js');
const template = views.getTemplate('user');
class UserView extends events.EventTarget {
constructor(ctx) {
super();
this._hostNode = document.getElementById('content-holder');
ctx.section = ctx.section || 'summary';
views.replaceContent(this._hostNode, template(ctx));
for (let item of this._hostNode.querySelectorAll('[data-name]')) {
if (item.getAttribute('data-name') === ctx.section) {
item.className = 'active';
} else {
item.className = '';
}
}
ctx.hostNode = this._hostNode.querySelector('#user-content-holder');
if (ctx.section == 'edit') {
this._view = new UserEditView(ctx);
this._view.addEventListener('submit', e => {
this.dispatchEvent(
new CustomEvent('change', {detail: e.detail}));
});
} else if (ctx.section == 'delete') {
this._view = new UserDeleteView(ctx);
this._view.addEventListener('submit', e => {
this.dispatchEvent(
new CustomEvent('delete', {detail: e.detail}));
});
} else {
this._view = new UserSummaryView(ctx);
}
}
clearMessages() {
this._view.clearMessages();
}
showSuccess(message) {
this._view.showSuccess(message);
}
showError(message) {
this._view.showError(message);
}
enableForm() {
this._view.enableForm();
}
disableForm() {
this._view.disableForm();
}
}
module.exports = UserView;