var Widget = require('./widget'); module.exports = new Class({ Extends: Widget ,Tag: 'htk-repeater' ,Child: 'model' ,Properties: { /** * The source data model. */ model: { type: Db.Model ,set: function(x) { this.link({_model: x}, { 'status-changed': this._onModelChange ,'row-deleted': this._onRowDelete ,'row-updated': this._onRowUpdate ,'row-inserted': this._onRowInsert }); this._onModelChange(); } ,get: function() { this._model; } } /** * The identifier for internal iterator. */ ,formId: { type: String ,set: function(x) { this._formId = x; } ,get: function() { this._formId; } } /** * {Function (Vn.BuilderResult, Db.Form)} Function to call after every * box rendering. */ ,renderer: { type: Function ,set: function(x) { this._renderer = x; } ,get: function() { this._renderer; } } /** * Wether to show the model status. */ ,showStatus: { type: Boolean ,set: function(x) { this._showStatus = x; this._onModelChange(); } ,get: function() { this._showStatus; } } /** * Message that should be displayed when source model is not ready. */ ,emptyMessage: { type: String ,value: null } } ,_builder: null ,_formId: 'form' ,_showStatus: true ,render: function() { var div = this.createRoot('div'); this._container = this.createElement('div'); this._container.className = 'htk-repeater'; div.appendChild(this._container); } ,loadXml: function(scope, node) { this.parent(scope, node); this._parentScope = scope; var builder = this._builder = new Vn.Builder(); builder.compileNode(node.firstElementChild, [this._formId]); this._onModelChange(); } ,getChild: function(index) { return this._container.childNodes[index]; } ,getBuilder: function(index) { return this._childsData[index].builder; } ,getForm: function(index) { return this._childsData[index].set; } ,_buildBox: function(index) { var set = new Db.SimpleIterator({ model: this._model, row: index }); var scope = this._builder.load(this.doc, null, this._parentScope); scope.link([set.getObject()], { [this._formId]: set }); this._childsData.push({ builder: scope, set: set }); if (this._renderer) this._renderer(scope, set); return scope.getMain(); } ,_onModelChange: function() { if (!this._model || !this._builder) return; this.node.removeChild(this._container); Vn.Node.removeChilds(this._container); this._freeChildsData(); this._childsData = []; switch (this._model.status) { case Db.Model.Status.READY: { for (var i = 0; i < this._model.numRows; i++) this._container.appendChild(this._buildBox(i)); this._showNoRecordsFound(); break; } case Db.Model.Status.LOADING: this._showMessage(_('Loading'), null); break; case Db.Model.Status.CLEAN: { var emptyMessage = this.emptyMessage ? this.emptyMessage : _('NoData'); this._showMessage(emptyMessage, 'refresh'); break; } case Db.Model.Status.ERROR: this._showMessage(_('ErrorLoadingData'), 'error'); break; } this.node.appendChild(this._container); this.emit('change'); } ,_showNoRecordsFound: function() { if (this._model.numRows === 0) this._showMessage(_('EmptyList'), 'block'); } ,_showMessage: function(message, src) { if (!this._showStatus) return; var div = this.createElement('div'); div.className = 'message'; this._container.appendChild(div); if (src) { const icon = new Htk.Icon({ name: src }); div.appendChild(icon.node); } else { var spinner = new Htk.Spinner(); spinner.start(); div.appendChild(spinner.node); } div.appendChild(this.createTextNode(message)); } ,_onRowDelete: function(model, row) { Vn.Node.remove(this._container.childNodes[row]); this._unrefChildData(row); this._childsData.splice(row, 1); for (var i = row; i < this._model.numRows; i++) this._childsData[i].set.row = i; this._showNoRecordsFound(); } ,_onRowUpdate: function(model, row) { this._childsData[row].set.iterChanged(); } ,_onRowInsert: function(model, row) { var box = this._buildBox(row); this._container.appendChild(box); } ,_freeChildsData: function() { if (this._childsData) for (var i = 0; i < this._childsData.length; i++) this._unrefChildData(i); } ,_unrefChildData: function(index) { var childData = this._childsData[index]; childData.set.unref(); childData.builder.unref(); } ,destroy: function() { this._freeChildsData(); this.parent(); } });