Custom-Field version of the TP3 class of service mashup that works with Impediments

Impediment CF Colorer.js

tau.mashups
    .addDependency('tp/mashups')
    .addDependency('user/mashups')
    .addDependency('jQuery')
    .addDependency('Underscore')
    .addDependency('tp3/mashups/context')
    .addDependency('tau/core/bus.reg')
    .addDependency('tau/configurator')
    .addMashup(function (m, um, $, _, context, busRegistry, configurator) {

        var colorer = function() {
            this.init = function() {

                var self = this;

                this.fieldMapping = {
					'Tipo': {
						'Impedimento': 'background: #fdfadb',
						'Riesgo': 'background: #d2e0ef;',
						'Value3': 'background: #A1D9D6'
					}
					
                };
                this.taggedCards = {};
                this.cards = [];

				context.onChange(function(ctx) {
					self.setContext(ctx);
					self.refresh(ctx);
				});

				busRegistry.on('create', function(eventName, sender) {
                    if (sender.bus.name == 'board_plus')
                    {
                        sender.bus.on('start.lifecycle', _.bind(function(e) { this.cards = []; }, self));
                        sender.bus.on('view.card.skeleton.built', _.bind(self.cardAdded, self));
                    }
                });
            };

			this._ctx = {};
			this.setContext = function(ctx) {
				this._ctx = ctx;
			};

			this.refresh = function(ctx) {

				var acid = ctx.acid;
				var whereIdsStr = this.cards.map($.proxy(function(c){ return this._getCardId(c); }, this)).join(',');

				if (whereIdsStr == '') {
					whereIdsStr = '0';
				}

                var requestUrl = configurator.getApplicationPath() + '/api/v1/Impediments?take=1000&where=id in ('+whereIdsStr+') and EntityState.isFinal eq false&format=json&include=[Id,CustomFields]&acid=' + acid;
                $.ajax({
                    url: requestUrl,
                    context: this
                }).done(function(data) {
                        this.taggedCards = {};
                        for(var i = 0; i < data.Items.length; i++) {
                            var id = data.Items[i].Id;
                            this.taggedCards[id] = data.Items[i].CustomFields;
                        }
                        this.renderAll();
                    });
            };

			this.refreshDebounced = _.debounce(this.refresh, 100, false);

			this.cardAdded = function(eventName, sender) {
				this.cards.push(sender.element);
				this.refreshDebounced(this._ctx);
			};

			this._getCardId = function (card) {
				return card.attr('data-entity-id');
			};

            this.renderCard = function(card) {
                var self = this;
                var id = this._getCardId(card);
                var cardData = this.taggedCards[id];

                if (cardData) {
					$.each(self.fieldMapping, function(field, values) {
						console.log(field + " => ");
						console.log(values);
						console.log(cardData);
                    	$.each(values, function(value, color){
							for (var i = 0; i < cardData.length; i++) {
								if (cardData[i].Name == field) {
									if (values[cardData[i].Value] != null)
										card.attr('style', values[cardData[i].Value]);
								}
							}
	                    });
					});
                }
            };

            this.renderAll = function() {
                var self = this;
                $.each(this.cards, function(index, card) {
                    self.renderCard(card);
                });
            };

            this.getFilter = function(mapping){
                var where = [];
                $.each(mapping, function(tag, color){
                    where.push('Name=="'+ tag +'"');
                });
                return where.join(" or ");
            };
        }

        new colorer().init();

    });