[Tree] Implement label for tree

This commit is contained in:
Victor Woeltjen 2016-03-11 14:10:30 -08:00
parent 4f293f22a6
commit c5ab6c6c97
2 changed files with 36 additions and 8 deletions

View File

@ -1,8 +1,8 @@
<span class="rep-object-label">
<div class="t-object-label l-flex-row flex-elem grows">
<div class="t-item-icon flex-elem" ng-class="{ 'l-icon-link':location.isLink() }">
<div class="t-item-icon-glyph">{{type.getGlyph()}}</div>
<div class="t-item-icon flex-elem">
<div class="t-item-icon-glyph"></div>
</div>
<div class='t-title-label flex-elem grows'>{{model.name}}</div>
<div class='t-title-label flex-elem grows'></div>
</div>
</span>

View File

@ -22,19 +22,47 @@
/*global define*/
define([
'angular',
'zepto',
'text!../../res/templates/ui/tree-label.html'
], function (angular, labelTemplate) {
], function ($, labelTemplate) {
'use strict';
var $ = angular.element.bind(angular);
function TreeLabelView() {
this.el = $(labelTemplate);
}
function getGlyph(domainObject) {
var type = domainObject.getCapability('type');
return type.getGlyph();
}
TreeLabelView.prototype.updateView = function (domainObject) {
var titleEl = this.el.find('.t-title-label'),
glyphEl = this.el.find('.t-item-icon-glyph'),
iconEl = this.el.find('.t-item-icon');
titleEl.text(domainObject ? domainObject.getModel().name : "");
glyphEl.text(domainObject ? getGlyph(domainObject) : "");
if (domainObject && isLink(domainObject)) {
iconEl.addClass('l-icon-link');
} else {
iconEl.removeClass('l-icon-link');
}
};
TreeLabelView.prototype.model = function (domainObject) {
if (this.unlisten) {
this.unlisten();
delete this.unlisten;
}
this.updateView(domainObject);
if (domainObject) {
this.unlisten = domainObject.getCapability('mutation')
.listen(this.updateView.bind(this));
}
};
TreeLabelView.prototype.elements = function () {