refactor: use i18n in every data component

2026-01-10 03:32:52 +00:00 · 2021-03-22 13:40:49 +01:00
parent 1a8660590f
commit 55be9d4d4e
40 changed files with 156 additions and 337 deletions
--- a/src/app/modules/data/data.html
+++ b/src/app/modules/data/data.html
@@ -1,18 +0,0 @@
-<!--
-  Generated template for the DataPage page.
-
-  See http://ionicframework.com/docs/components/#navigation for more info on
-  Ionic pages and navigation.
-->
-<ion-header>
-
-  <ion-toolbar>
-    <ion-title>data</ion-title>
-  </ion-toolbar>
-
-</ion-header>
-
-
-<ion-content class="ion-padding">
-
-</ion-content>
--- a/src/app/modules/data/elements/address-detail.html
+++ b/src/app/modules/data/elements/address-detail.html
@@ -1,39 +1,39 @@
 <ion-card>
-  <ion-card-header>Address</ion-card-header>
+  <ion-card-header>{{'data.detail.address.TITLE' | translate | titlecase}}</ion-card-header>
  <ion-card-content>
    <ion-grid>
      <ion-row>
-        <ion-col>Street:</ion-col>
+        <ion-col>{{'data.detail.address.STREET' | translate | titlecase}}:</ion-col>
        <ion-col width-60 text-right>
          {{address.streetAddress}}
        </ion-col>
      </ion-row>
      <ion-row>
-        <ion-col>Postal code:</ion-col>
+        <ion-col>{{'data.detail.address.POSTCODE' | translate | titlecase}}:</ion-col>
        <ion-col width-60 text-right>
          {{address.postalCode}}
        </ion-col>
      </ion-row>
      <ion-row>
-        <ion-col>City:</ion-col>
+        <ion-col>{{'data.detail.address.CITY' | translate | titlecase}}:</ion-col>
        <ion-col width-60 text-right>
          {{address.addressLocality}}
        </ion-col>
      </ion-row>
      <ion-row *ngIf="address.addressRegion">
-        <ion-col>Region:</ion-col>
+        <ion-col>{{'data.detail.address.REGION' | translate | titlecase}}:</ion-col>
        <ion-col width-60 text-right>
          {{address.addressRegion}}
        </ion-col>
      </ion-row>
      <ion-row>
-        <ion-col>Country:</ion-col>
+        <ion-col>{{'data.detail.address.COUNTRY' | translate | titlecase}}:</ion-col>
        <ion-col width-60 text-right>
          {{address.addressCountry}}
        </ion-col>
      </ion-row>
      <ion-row *ngIf="address.postOfficeBoxNumber">
-        <ion-col>Post office box:</ion-col>
+        <ion-col>{{'data.detail.address.POST_OFFICE_BOX' | translate | titlecase}}</ion-col>
        <ion-col width-60 text-right>
          {{address.postOfficeBoxNumber}}
        </ion-col>
--- a/src/app/modules/data/elements/offers-detail.html
+++ b/src/app/modules/data/elements/offers-detail.html
@@ -1,10 +1,10 @@
 <ion-card>
-  <ion-card-header>Offers</ion-card-header>
+  <ion-card-header>{{'data.detail.offers.TITLE' | translate | titlecase}}</ion-card-header>
  <ion-card-content>
    <div *ngFor="let offer of offers">
      <p *ngIf="offer.inPlace">
        <ion-icon name="location"></ion-icon>
-        <a [routerLink]="['/data-detail', offer.inPlace.uid]">{{offer.inPlace.name}}</a>,&nbsp;
+        <a [routerLink]="['/data-detail', offer.inPlace.uid]">{{'name' | thingTranslate: item.inPlace}}</a>,&nbsp;
        <span *ngIf="offer.availabilityStarts">
          <ion-icon name="calendar"></ion-icon> {{offer.availabilityStarts | amDateFormat:'ll'}}
        </span>
--- a/src/app/modules/data/elements/offers-in-list.html
+++ b/src/app/modules/data/elements/offers-in-list.html
@@ -1,6 +1,6 @@
 <div>
  <h2>{{offers[0].prices.default | currency:'EUR':'symbol':undefined:'de'}}</h2>
  <p *ngIf="offers[0].inPlace">
-    <ion-icon name="location"></ion-icon> {{offers[0].inPlace.name}} <span *ngIf="offers.length > 1">...</span>
+    <ion-icon name="location"></ion-icon>{{offers[0].inPlace.name}}<span *ngIf="offers.length > 1">...</span>
  </p>
 </div>
--- a/src/app/modules/data/elements/origin-detail.html
+++ b/src/app/modules/data/elements/origin-detail.html
@@ -1,25 +1,27 @@
 <ion-card *ngIf="origin.type === 'user'">
-  <ion-card-header>Origin(user)</ion-card-header>
+  <ion-card-header>{{'data.types.origin.TITLE' | translate | titlecase}}: {{'data.types.origin.USER' | translate | titlecase}}</ion-card-header>
  <ion-card-content>
-    <p>Created: {{origin.created | amDateFormat:'ll'}}</p>
-    <p *ngIf="origin.updated">Updated: {{origin.updated | amDateFormat:'ll'}}</p>
-    <p *ngIf="origin.modified">Modified: {{origin.modified | amDateFormat:'ll'}}</p>
+    <p>{{'data.types.origin.detail.CREATED' | translate | titlecase}}: {{origin.created | amDateFormat:'ll'}}</p>
+    <p *ngIf="origin.updated">{{'data.types.origin.detail.UPDATED' | translate | titlecase}}: {{origin.updated | amDateFormat:'ll'}}</p>
+    <p *ngIf="origin.modified">{{'data.types.origin.detail.MODIFIED' | translate | titlecase}}: {{origin.modified | amDateFormat:'ll'}}</p>
+    <p *ngIf="origin.name">{{'data.types.origin.detail.MAINTAINER' | translate }}: {{origin.name}}</p>
    <p *ngIf="origin.maintainer">
-      Maintainer: <a [routerLink]="['/data-detail', origin.maintainer.uid]">{{origin.maintainer.name}}</a>
+      {{'data.types.origin.detail.MAINTAINER' | translate }}: <a [routerLink]="['/data-detail', origin.maintainer.uid]">{{origin.maintainer.name}}</a>
    </p>
  </ion-card-content>
 </ion-card>

 <ion-card *ngIf="origin.type === 'remote'">
-  <ion-card-header>Origin(remote)</ion-card-header>
+  <ion-card-header>{{'data.types.origin.TITLE' | translate | titlecase}}: {{'data.types.origin.REMOTE' | translate | titlecase}}</ion-card-header>
  <ion-card-content>
-    <p>Indexed: {{origin.indexed | amDateFormat:'ll'}}</p>
-    <p *ngIf="origin.modified">Modified: {{origin.modified | amDateFormat:'ll'}}</p>
+    <p>{{'data.types.origin.detail.INDEXED' | translate | titlecase}}: {{origin.indexed | amDateFormat:'ll'}}</p>
+    <p *ngIf="origin.modified">{{'data.types.origin.detail.MODIFIED' | translate | titlecase}}: {{origin.modified | amDateFormat:'ll'}}</p>
+    <p *ngIf="origin.name">{{'data.types.origin.detail.MAINTAINER' | translate }}: {{origin.name}}</p>
    <p *ngIf="origin.maintainer">
-      Maintainer: <a [routerLink]="['/data-detail', origin.maintainer.uid]">{{origin.maintainer.name}}</a>
+      {{'data.types.origin.detail.MAINTAINER' | translate | titlecase}}: <a [routerLink]="['/data-detail', origin.maintainer.uid]">{{origin.maintainer.name}}</a>
    </p>
    <p *ngIf="origin.responsibleEntity">
-      Responsible: <a [routerLink]="['/data-detail', origin.responsibleEntity.uid]">{{origin.responsibleEntity.name}}</a>
+      {{'data.types.origin.detail.RESPONSIBLE' | translate | titlecase}}: <a [routerLink]="['/data-detail', origin.responsibleEntity.uid]">{{origin.responsibleEntity.name}}</a>
    </p>
  </ion-card-content>
 </ion-card>
--- a/src/app/modules/data/elements/simple-card.html
+++ b/src/app/modules/data/elements/simple-card.html
@@ -16,7 +16,7 @@
      </ng-container>
      <ng-template #thingList>
        <a [routerLink]="['/data-detail', thing.uid]" *ngFor="let thing of content">
-          <p>{{thing.name}}</p>
+          <p>{{'name' | thingTranslate: thing}}</p>
        </a>
      </ng-template>
      <ng-template #textList>
--- a/src/app/modules/data/list/data-list-item.html
+++ b/src/app/modules/data/list/data-list-item.html
@@ -23,11 +23,11 @@
        <ion-row>
          <ion-col>
            <div class="ion-text-wrap">
-              <h2 class="name">{{item.name}}</h2>
+              <h2 class="name">{{'name' | thingTranslate: item}}</h2>
              <p *ngIf="item.description">
-                <stapps-long-inline-text [text]="item.description" [size]="110"></stapps-long-inline-text>
+                <stapps-long-inline-text [text]="'description' | thingTranslate: item" [size]="80"></stapps-long-inline-text>
              </p>
-              <ion-note>{{item.type}}</ion-note>
+              <ion-note>{{'type' | thingTranslate: item}}</ion-note>
            </div>
          </ion-col>
        </ion-row>
--- a/src/app/modules/data/types/article/article-detail-content.component.ts
+++ b/src/app/modules/data/types/article/article-detail-content.component.ts
@@ -13,8 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
 import {Component, Input} from '@angular/core';
-import {SCArticle, SCThing, SCTranslations} from '@openstapps/core';
-import {SCThingTranslator} from '@openstapps/core';
+import {SCArticle} from '@openstapps/core';

 /**
 * TODO
@@ -28,22 +27,4 @@ export class ArticleDetailContentComponent {
   * TODO
   */
  @Input() item: SCArticle;
-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-  /**
-   * TODO
-   */
-  constructor() {
-    this.translator = new SCThingTranslator(this.language);
-  }
 }
--- a/src/app/modules/data/types/article/article-detail-content.html
+++ b/src/app/modules/data/types/article/article-detail-content.html
@@ -1,6 +1,6 @@
-<stapps-simple-card [title]="'Categories'" [content]="translator.translate(item).categories">
+<stapps-simple-card [title]="'categories' | propertyNameTranslate: item | titlecase" [content]="'categories' | thingTranslate: item">
 </stapps-simple-card>
-<stapps-simple-card *ngIf="item.datePublished" [title]="'Published'"
+<stapps-simple-card *ngIf="item.datePublished" [title]="'datePublished' | propertyNameTranslate: item | titlecase"
  [content]="item.datePublished | amDateFormat:'ll'"></stapps-simple-card>
-<stapps-simple-card [title]="'Content'" [content]="translator.translate(item).articleBody" [isMarkdown]="true">
+<stapps-simple-card [title]="'articleBody' | propertyNameTranslate: item | titlecase" [content]="'articleBody' | thingTranslate: item" [isMarkdown]="true">
 </stapps-simple-card>
--- a/src/app/modules/data/types/article/article-list-item.html
+++ b/src/app/modules/data/types/article/article-list-item.html
@@ -1,12 +1,12 @@
 <ion-grid>
  <ion-row>
    <ion-col>
-      <h2 class="name">{{item.name}}</h2>
+      <h2 class="name">{{'name' | thingTranslate: item}}</h2>
      <p *ngIf="item.keywords">
        <stapps-long-inline-text [text]="item.keywords.join(', ')" [size]="110"></stapps-long-inline-text>
      </p>
      <ion-note>
-        {{item.type}}
+        {{'type' | thingTranslate: item}}
      </ion-note>
    </ion-col>
  </ion-row>
--- a/src/app/modules/data/types/catalog/catalog-detail-content.component.ts
+++ b/src/app/modules/data/types/catalog/catalog-detail-content.component.ts
@@ -13,8 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
 import {Component, Input} from '@angular/core';
-import {SCCatalog, SCThing, SCTranslations} from '@openstapps/core';
-import {SCThingTranslator} from '@openstapps/core';
+import {SCCatalog} from '@openstapps/core';

 /**
 * TODO
@@ -28,22 +27,4 @@ export class CatalogDetailContentComponent {
   * TODO
   */
  @Input() item: SCCatalog;
-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-  /**
-   * TODO
-   */
-  constructor() {
-    this.translator = new SCThingTranslator(this.language);
-  }
 }
--- a/src/app/modules/data/types/catalog/catalog-detail-content.html
+++ b/src/app/modules/data/types/catalog/catalog-detail-content.html
@@ -1,2 +1,2 @@
-<stapps-simple-card [title]="'Categories'" [content]="translator.translate(item).categories">
+<stapps-simple-card [title]="'categories' | propertyNameTranslate: item | titlecase" [content]="'categories' | thingTranslate: item">
 </stapps-simple-card>
--- a/src/app/modules/data/types/catalog/catalog-list-item.html
+++ b/src/app/modules/data/types/catalog/catalog-list-item.html
@@ -2,9 +2,9 @@
  <ion-row>
    <ion-col>
      <div class="ion-text-wrap">
-        <h2 class="name">{{item.name}}</h2>
+        <h2 class="name">{{'name' | thingTranslate: item}}</h2>
        <p *ngIf="item.description">
-          <stapps-long-inline-text [text]="item.description" [size]="110"></stapps-long-inline-text>
+          <stapps-long-inline-text [text]="'description' | thingTranslate: item" [size]="80"></stapps-long-inline-text>
        </p>
        <p *ngIf="item.academicTerm">{{item.academicTerm.name}}</p>
      </div>
--- a/src/app/modules/data/types/date-series/date-series-detail-content.component.ts
+++ b/src/app/modules/data/types/date-series/date-series-detail-content.component.ts
@@ -13,8 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
 import {Component, Input} from '@angular/core';
-import {SCDateSeries, SCThing, SCTranslations} from '@openstapps/core';
-import {SCThingTranslator} from '@openstapps/core';
+import {SCDateSeries} from '@openstapps/core';

 /**
 * TODO
@@ -28,22 +27,4 @@ export class DateSeriesDetailContentComponent {
   * TODO
   */
  @Input() item: SCDateSeries;
-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-  /**
-   * TODO
-   */
-  constructor() {
-    this.translator = new SCThingTranslator(this.language);
-  }
 }
--- a/src/app/modules/data/types/date-series/date-series-detail-content.html
+++ b/src/app/modules/data/types/date-series/date-series-detail-content.html
@@ -1,12 +1,12 @@
 <ion-card *ngIf="item.inPlace">
  <ion-card-header>
-    Place
+    {{'inPlace' | propertyNameTranslate: item | titlecase}}
  </ion-card-header>
  <ion-card-content>
-    <ion-icon name="location"></ion-icon> <a [routerLink]="['/data-detail', item.inPlace.uid]">{{item.inPlace.name}}</a>
+    <ion-icon name="location"></ion-icon> <a [routerLink]="['/data-detail', item.inPlace.uid]">{{'name' | thingTranslate: item.inPlace}}</a>
    <stapps-address-detail *ngIf="item.inPlace.address" [address]="item.inPlace.address"></stapps-address-detail>
  </ion-card-content>
 </ion-card>
 <stapps-simple-card [title]="'Duration'" [content]="[item.duration | amDuration:'minutes']"></stapps-simple-card>
-<stapps-simple-card *ngIf="item.performers" [title]="'Performers'" [content]="item.performers"></stapps-simple-card>
+<stapps-simple-card *ngIf="item.performers" [title]="'performers' | propertyNameTranslate: item | titlecase" [content]="item.performers"></stapps-simple-card>
 <stapps-offers-detail *ngIf="item.offers" [offers]="item.offers"></stapps-offers-detail>
--- a/src/app/modules/data/types/date-series/date-series-list-item.html
+++ b/src/app/modules/data/types/date-series/date-series-list-item.html
@@ -2,7 +2,7 @@
  <ion-row>
    <ion-col>
      <div class="ion-text-wrap">
-        <h2 class="name">{{item.name}}</h2>
+        <h2 class="name">{{'name' | thingTranslate: item}}</h2>
        <p>
          <ion-icon name="calendar"></ion-icon>
          <span>
@@ -10,7 +10,7 @@
            <span>({{item.dates[0] | amDateFormat:'ll'}} - {{item.dates[item.dates.length - 1] | amDateFormat:'ll'}})</span>
        </span>
        </p>
-        <ion-note *ngIf="item.event.type === 'academic event'">{{item.event.categories.join(', ')}}</ion-note>
+        <ion-note *ngIf="item.event.type === 'academic event'">{{'categories' | thingTranslate: item.event | join: ', '}}</ion-note>
      </div>
    </ion-col>
    <ion-col width-20 text-right>
--- a/src/app/modules/data/types/dish/dish-detail-content.component.ts
+++ b/src/app/modules/data/types/dish/dish-detail-content.component.ts
@@ -27,14 +27,4 @@ export class DishDetailContentComponent {
   * TODO
   */
  @Input() item: SCDish;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  constructor() {
-    // nothing yet
-  }
 }
--- a/src/app/modules/data/types/favorite/favorite-detail-content.component.ts
+++ b/src/app/modules/data/types/favorite/favorite-detail-content.component.ts
@@ -13,8 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
 import {Component, Input} from '@angular/core';
-import {SCFavorite, SCThing, SCTranslations} from '@openstapps/core';
-import {SCThingTranslator} from '@openstapps/core';
+import {SCFavorite} from '@openstapps/core';

 /**
 * TODO
@@ -28,22 +27,4 @@ export class FavoriteDetailContentComponent {
   * TODO
   */
  @Input() item: SCFavorite;
-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-  /**
-   * TODO
-   */
-  constructor() {
-    this.translator = new SCThingTranslator(this.language);
-  }
 }
--- a/src/app/modules/data/types/favorite/favorite-list-item.html
+++ b/src/app/modules/data/types/favorite/favorite-list-item.html
@@ -2,11 +2,11 @@
  <ion-row>
    <ion-col>
      <div class="ion-text-wrap">
-        <h2 class="name">{{item.name}}: {{item.data.name}}</h2>
+        <h2 class="name">{{'name' | thingTranslate: item}}: {{'name' | thingTranslate: item.data}}</h2>
        <p *ngIf="item.data.description">
-          <stapps-long-inline-text [text]="item.data.description" [size]="110"></stapps-long-inline-text>
+          <stapps-long-inline-text [text]="'description' | thingTranslate: item.data" [size]="80"></stapps-long-inline-text>
        </p>
-        <ion-note>{{item.type}} ({{item.data.type}})</ion-note>
+        <ion-note>{{'type' | thingTranslate: item}} ({{'type' | thingTranslate: item.data}})</ion-note>
      </div>
    </ion-col>
    <ion-col width-20 text-right>
--- a/src/app/modules/data/types/message/message-detail-content.component.ts
+++ b/src/app/modules/data/types/message/message-detail-content.component.ts
@@ -13,8 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
 import {Component, Input} from '@angular/core';
-import {SCMessage, SCThing, SCTranslations} from '@openstapps/core';
-import {SCThingTranslator} from '@openstapps/core';
+import {SCMessage} from '@openstapps/core';

 /**
 * TODO
@@ -28,22 +27,4 @@ export class MessageDetailContentComponent {
   * TODO
   */
  @Input() item: SCMessage;
-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-  /**
-   * TODO
-   */
-  constructor() {
-    this.translator = new SCThingTranslator(this.language);
-  }
 }
--- a/src/app/modules/data/types/message/message-detail-content.html
+++ b/src/app/modules/data/types/message/message-detail-content.html
@@ -1,5 +1,5 @@
-<stapps-simple-card [title]="'Content'" [content]="item.messageBody"></stapps-simple-card>
-<stapps-simple-card [title]="'Audiences'" [content]="item.audiences"></stapps-simple-card>
-<stapps-simple-card *ngIf="item.datePublished" [title]="'Published'" [content]="item.datePublished | amDateFormat:'ll'"></stapps-simple-card>
-<stapps-simple-card *ngIf="item.authors" [title]="'Author(s)'" [content]="item.authors"></stapps-simple-card>
-<stapps-simple-card *ngIf="item.publishers" [title]="'Publisher(s)'" [content]="item.publishers"></stapps-simple-card>
+<stapps-simple-card [title]="'messageBody' | propertyNameTranslate: item | titlecase" [content]="'messageBody' | thingTranslate: item"></stapps-simple-card>
+<stapps-simple-card [title]="'audiences' | propertyNameTranslate: item | titlecase" [content]="'audiences' | thingTranslate: item"></stapps-simple-card>
+<stapps-simple-card *ngIf="item.datePublished" [title]="'datePublished' | propertyNameTranslate: item | titlecase" [content]="item.datePublished | amDateFormat:'ll'"></stapps-simple-card>
+<stapps-simple-card *ngIf="item.authors" [title]="'authors' | propertyNameTranslate: item | titlecase" [content]="item.authors"></stapps-simple-card>
+<stapps-simple-card *ngIf="item.publishers" [title]="'publishers' | propertyNameTranslate: item | titlecase" [content]="item.publishers"></stapps-simple-card>
--- a/src/app/modules/data/types/message/message-list-item.html
+++ b/src/app/modules/data/types/message/message-list-item.html
@@ -2,11 +2,11 @@
  <ion-row>
    <ion-col>
      <div class="ion-text-wrap">
-        <h2 class="name">{{item.name}}</h2>
+        <h2 class="name">{{'name' | thingTranslate: item}}</h2>
        <p *ngIf="item.messageBody">
-          <stapps-long-inline-text [text]="item.messageBody" [size]="110"></stapps-long-inline-text>
+          <stapps-long-inline-text [text]="item.messageBody" [size]="80"></stapps-long-inline-text>
        </p>
-        <ion-note>{{item.type}}</ion-note>
+        <ion-note>{{'type' | thingTranslate: item}}</ion-note>
      </div>
    </ion-col>
  </ion-row>
--- a/src/app/modules/data/types/organization/organization-detail-content.component.ts
+++ b/src/app/modules/data/types/organization/organization-detail-content.component.ts
@@ -13,8 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
 import {Component, Input} from '@angular/core';
-import {SCOrganization, SCThing, SCTranslations} from '@openstapps/core';
-import {SCThingTranslator} from '@openstapps/core';
+import {SCOrganization} from '@openstapps/core';

 /**
 * TODO
@@ -28,23 +27,4 @@ export class OrganizationDetailContentComponent {
   * TODO
   */
  @Input() item: SCOrganization;
-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-
-  /**
-   * TODO
-   */
-  constructor() {
-    this.translator = new SCThingTranslator(this.language);
-  }
 }
--- a/src/app/modules/data/types/organization/organization-detail-content.html
+++ b/src/app/modules/data/types/organization/organization-detail-content.html
@@ -1,9 +1,9 @@
 <ion-card *ngIf="item.inPlace">
  <ion-card-header>
-    Place
+    {{'inPlace' | propertyNameTranslate: item | titlecase}}
  </ion-card-header>
  <ion-card-content>
-    <ion-icon name="location"></ion-icon> <a [routerLink]="['/data-detail', item.inPlace.uid]">{{item.inPlace.name}}</a>
+    <ion-icon name="location"></ion-icon> <a [routerLink]="['/data-detail', item.inPlace.uid]">{{'name' | thingTranslate: item.inPlace}}</a>
    <stapps-address-detail *ngIf="item.inPlace.address" [address]="item.inPlace.address"></stapps-address-detail>
  </ion-card-content>
 </ion-card>
--- a/src/app/modules/data/types/organization/organization-list-item.html
+++ b/src/app/modules/data/types/organization/organization-list-item.html
@@ -2,14 +2,14 @@
  <ion-row>
    <ion-col>
      <div class="ion-text-wrap">
-        <h2 class="name">{{item.name}}</h2>
-        <p *ngIf="item.description">{{item.description}}</p>
-        <ion-note>{{item.type}}</ion-note>
+        <h2 class="name">{{'name' | thingTranslate: item}}</h2>
+        <p *ngIf="item.description">{{'description' | thingTranslate: item}}</p>
+        <ion-note>{{'type' | thingTranslate: item}}</ion-note>
      </div>
    </ion-col>
    <ion-col width-20 text-right *ngIf="item.inPlace">
      <span *ngIf="item.inPlace">
-        <ion-icon name="location"></ion-icon> {{item.inPlace.name}}
+        <ion-icon name="location"></ion-icon> {{'name' | thingTranslate: item.inPlace}}
      </span>
    </ion-col>
  </ion-row>
--- a/src/app/modules/data/types/person/person-detail-content.component.ts
+++ b/src/app/modules/data/types/person/person-detail-content.component.ts
@@ -13,8 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
 import {Component, Input} from '@angular/core';
-import {SCPerson, SCThing, SCTranslations} from '@openstapps/core';
-import {SCThingTranslator} from '@openstapps/core';
+import {SCPerson} from '@openstapps/core';

 /**
 * TODO
@@ -28,23 +27,4 @@ export class PersonDetailContentComponent {
   * TODO
   */
  @Input() item: SCPerson;
-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-
-  /**
-   * TODO
-   */
-  constructor() {
-    this.translator = new SCThingTranslator(this.language);
-  }
 }
--- a/src/app/modules/data/types/person/person-detail-content.html
+++ b/src/app/modules/data/types/person/person-detail-content.html
@@ -1,32 +1,32 @@
 <ion-card *ngIf="item.workLocations">
  <ion-card-header>
-    Contact information
+    {{'type' | thingTranslate: item.workLocations[0] | titlecase}}
  </ion-card-header>
  <ion-card-content>
    <ng-container *ngIf="item.workLocations.length === 1">
-      <p *ngIf="item.workLocations[0].telephone">Tel: <a
+      <p *ngIf="item.workLocations[0].telephone">{{'telephone' | propertyNameTranslate: item.workLocations[0] | titlecase}}: <a
          [href]="'tel:' + item.workLocations[0].telephone">{{item.workLocations[0].telephone}}</a>
      </p>
-      <p *ngIf="item.workLocations[0].email">Email: <a
+      <p *ngIf="item.workLocations[0].email">{{'email' | propertyNameTranslate: item.workLocations[0] | titlecase}}: <a
          [href]="'mailto:' + item.workLocations[0].email">{{item.workLocations[0].email}}</a></p>
-      <p *ngIf="item.workLocations[0].faxNumber">Fax: {{item.workLocations[0].faxNumber}}</p>
-      <p *ngIf="item.workLocations[0].url">URL: <a
+      <p *ngIf="item.workLocations[0].faxNumber">{{'faxNumber' | propertyNameTranslate: item.workLocations[0] | titlecase}}: {{item.workLocations[0].faxNumber}}</p>
+      <p *ngIf="item.workLocations[0].url">{{'url' | propertyNameTranslate: item.workLocations[0] | titlecase}}: <a
          [href]="item.workLocations[0].url">{{item.workLocations[0].url}}</a>
      </p>
-      <p *ngIf="item.workLocations[0].areaServed">Office: <a
+      <p *ngIf="item.workLocations[0].areaServed">{{'areaServed' | propertyNameTranslate: item.workLocations[0] | titlecase}}: <a
        [routerLink]="[ '/data-detail', item.workLocations[0].areaServed.uid]">{{item.workLocations[0].areaServed.name}}</a>
      </p>
    </ng-container>
    <ion-slides *ngIf="item.workLocations.length > 1" pager="true" class="work-locations">
      <ion-slide *ngFor="let workLocation of item.workLocations">
-        <p *ngIf="workLocation.telephone">Tel: <a
+        <p *ngIf="workLocation.telephone">{{'telephone' | propertyNameTranslate: item.workLocation | titlecase}}: <a
            [href]="'tel:' + workLocation.telephone">{{workLocation.telephone}}</a>
        </p>
-        <p style="display:block !important" *ngIf="workLocation.email">Email: <a [href]="'mailto:' + workLocation.email">{{workLocation.email}}</a>
+        <p style="display:block !important" *ngIf="workLocation.email">{{'email' | propertyNameTranslate: item.workLocation | titlecase}}: <a [href]="'mailto:' + workLocation.email">{{workLocation.email}}</a>
        </p>
-        <p *ngIf="workLocation.faxNumber">Fax: {{workLocation.faxNumber}}</p>
-        <p *ngIf="workLocation.url">URL: <a [href]="workLocation.url">{{workLocation.url}}</a></p>
-        <p *ngIf="workLocation.areaServed">Office: <a
+        <p *ngIf="workLocation.faxNumber">{{'faxNumber' | propertyNameTranslate: item.workLocation | titlecase}}: {{workLocation.faxNumber}}</p>
+        <p *ngIf="workLocation.url">{{'url' | propertyNameTranslate: item.workLocation | titlecase}}: <a [href]="workLocation.url">{{workLocation.url}}</a></p>
+        <p *ngIf="workLocation.areaServed">{{'areaServed' | propertyNameTranslate: item.workLocation | titlecase}}: <a
            [routerLink]="[ '/data-detail', workLocation.areaServed.uid]">{{workLocation.areaServed.name}}</a>
        </p>
        <!-- Used for making the additional space, so that slide pager doesn't show over the text but under it -->
@@ -35,4 +35,4 @@
    </ion-slides>
  </ion-card-content>
 </ion-card>
-<stapps-simple-card *ngIf="item.jobTitles" [title]="'Positions'" [content]="item.jobTitles"></stapps-simple-card>
+<stapps-simple-card *ngIf="item.jobTitles" [title]="'jobTitles' | propertyNameTranslate: item | titlecase" [content]="item.jobTitles"></stapps-simple-card>
--- a/src/app/modules/data/types/person/person-list-item.html
+++ b/src/app/modules/data/types/person/person-list-item.html
@@ -2,7 +2,7 @@
  <ion-row>
    <ion-col>
      <div class="ion-text-wrap">
-        <h2 class="name">{{item.name}} <span *ngIf="item.honorificPrefix">, {{item.honorificPrefix}}</span></h2>
+        <h2 class="name">{{'name' | thingTranslate: item}} <span *ngIf="item.honorificPrefix">, {{item.honorificPrefix}}</span></h2>
        <p *ngIf="item.telephone || item.email"><span *ngIf="item.telephone">
            <ion-icon name="call"></ion-icon>&nbsp;{{item.telephone}}&nbsp;
          </span><span *ngIf="item.email">
--- a/src/app/modules/data/types/place/place-detail-content.component.ts
+++ b/src/app/modules/data/types/place/place-detail-content.component.ts
@@ -13,8 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
 import {Component, Input} from '@angular/core';
-import {SCBuilding, SCFloor, SCPointOfInterest, SCRoom, SCThing, SCTranslations} from '@openstapps/core';
-import {SCThings, SCThingTranslator} from '@openstapps/core';
+import {SCBuilding, SCFloor, SCPointOfInterest, SCRoom, SCThings} from '@openstapps/core';
 import {DataProvider} from '../../data.provider';

 /**
@@ -30,25 +29,6 @@ export class PlaceDetailContentComponent {
   * TODO
   */
  @Input() item: SCBuilding | SCRoom | SCPointOfInterest | SCFloor;
-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-
-  /**
-   * TODO
-   */
-  constructor() {
-    this.translator = new SCThingTranslator(this.language);
-  }

  /**
   * TODO
--- a/src/app/modules/data/types/place/place-detail-content.html
+++ b/src/app/modules/data/types/place/place-detail-content.html
@@ -1,15 +1,15 @@
 <stapps-place-mensa-detail-content [item]="item" [language]="language" *ngIf="isMensaThing(item)"></stapps-place-mensa-detail-content>
 <ng-container *ngIf="item.type !== 'floor'">
-  <stapps-simple-card *ngIf="item.type !== 'floor' && item.categories" [title]="'Categories'" [content]="translator.translate(item).categories"></stapps-simple-card>
+  <stapps-simple-card *ngIf="item.type !== 'floor' && item.categories" [title]="'categories' | propertyNameTranslate: item | titlecase" [content]="'categories' | thingTranslate: item"></stapps-simple-card>
  <stapps-address-detail *ngIf="item.type !== 'floor' && item.address" [address]="item.address"></stapps-address-detail>
 </ng-container>
 <ng-container  *ngIf="item.type !== 'building'">
  <ion-card *ngIf="item.inPlace">
    <ion-card-header>
-      Building:
+      {{'inPlace' | propertyNameTranslate: item | titlecase}}
    </ion-card-header>
    <ion-card-content>
-      <ion-icon name="location"></ion-icon> <a [routerLink]="['/data-detail', item.inPlace.uid]">{{item.inPlace.name}}</a>
+      <ion-icon name="location"></ion-icon> <a [routerLink]="['/data-detail', item.inPlace.uid]">{{'name' | thingTranslate: item.inPlace}}</a>
    </ion-card-content>
  </ion-card>
  <stapps-address-detail *ngIf="item.inPlace && item.inPlace.address" [address]="item.inPlace.address"></stapps-address-detail>
--- a/src/app/modules/data/types/place/place-list-item.html
+++ b/src/app/modules/data/types/place/place-list-item.html
@@ -2,14 +2,14 @@
  <ion-row>
    <ion-col>
      <div class="ion-text-wrap">
-        <h2 class="name">{{item.name}}</h2>
-        <p *ngIf="item.description">{{item.description}}</p>
-        <ion-note>{{item.type}}</ion-note>
+        <h2 class="name">{{'name' | thingTranslate: item}} </h2>
+        <p *ngIf="item.description">{{'description' | thingTranslate: item}} </p>
+        <ion-note>{{'type' | thingTranslate: item}} </ion-note>
      </div>
    </ion-col>
    <ion-col width-20 text-right *ngIf="item.type !== 'building'">
      <span *ngIf="item.inPlace">
-        <ion-icon name="location"></ion-icon> {{item.inPlace.name}}
+        <ion-icon name="location"></ion-icon>{{'name' | thingTranslate: item.inPlace}}
      </span>
    </ion-col>
  </ion-row>
--- a/src/app/modules/data/types/place/special/mensa/place-mensa-detail.component.ts
+++ b/src/app/modules/data/types/place/special/mensa/place-mensa-detail.component.ts
@@ -16,7 +16,7 @@
 import moment, {Moment} from 'moment';

 import {AfterViewInit, ChangeDetectorRef, Component, Input} from '@angular/core';
-import {SCDish, SCPlace, SCThing, SCThingTranslator, SCTranslations} from '@openstapps/core';
+import {SCDish, SCPlace} from '@openstapps/core';
 import {PlaceMensaService} from './place-mensa-service';

 /**
@@ -44,11 +44,6 @@ export class PlaceMensaDetailComponent implements AfterViewInit {
   */
  @Input() item: SCPlace;

-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-
  /**
   * TODO
   */
@@ -59,15 +54,9 @@ export class PlaceMensaDetailComponent implements AfterViewInit {
   */
  startingDay: Moment;

-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-

  constructor(private mensaService: PlaceMensaService, private changeDectectorRef: ChangeDetectorRef) {
    // TODO: translation
-    this.translator = new SCThingTranslator(this.language);
    this.startingDay = moment();
    this.startingDay.hour(0);
    this.startingDay.minute(0);
@@ -120,7 +109,7 @@ export class PlaceMensaDetailComponent implements AfterViewInit {
          }
        }
      }
-      if (selectedDishes.length) {
+      if (selectedDishes.length > 0) {
        out[startingDay.format('L')] = selectedDishes;
      }
      // tslint:disable-next-line:no-parameter-reassignment
--- a/src/app/modules/data/types/semester/semester-detail-content.component.ts
+++ b/src/app/modules/data/types/semester/semester-detail-content.component.ts
@@ -13,8 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
 import {Component, Input} from '@angular/core';
-import {SCSemester, SCThing, SCTranslations} from '@openstapps/core';
-import {SCThingTranslator} from '@openstapps/core';
+import {SCSemester} from '@openstapps/core';

 /**
 * TODO
@@ -28,23 +27,4 @@ export class SemesterDetailContentComponent {
   * TODO
   */
  @Input() item: SCSemester;
-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-
-  /**
-   * TODO
-   */
-  constructor() {
-    this.translator = new SCThingTranslator(this.language);
-  }
 }
--- a/src/app/modules/data/types/semester/semester-detail-content.html
+++ b/src/app/modules/data/types/semester/semester-detail-content.html
@@ -1,2 +1,3 @@
-<ion-card *ngIf="item.eventsStartDate && item.eventsEndDate">
-<stapps-simple-card [title]="'Events'" [content]="(item.eventsStartDate | amDateFormat: 'll') + ' - ' + (item.eventsEndDate | amDateFormat: 'll')"></stapps-simple-card>
+<stapps-simple-card *ngIf="item.eventsStartDate && item.eventsEndDate"
+[title]="('eventsStartDate' | propertyNameTranslate: item | titlecase) + ' - ' + ('eventsEndDate' | propertyNameTranslate: item | titlecase)"
+[content]="(item.eventsStartDate | amDateFormat: 'll') + ' - ' + (item.eventsEndDate | amDateFormat: 'll')"></stapps-simple-card>
--- a/src/app/modules/data/types/semester/semester-list-item.html
+++ b/src/app/modules/data/types/semester/semester-list-item.html
@@ -2,12 +2,12 @@
  <ion-row>
    <ion-col>
      <div class="ion-text-wrap">
-        <h2 class="name">{{item.name}}</h2>
+        <h2 class="name">{{'name' | thingTranslate: item}}</h2>
        <p>
          <ion-icon name="calendar"></ion-icon>
          <span>{{item.startDate | amDateFormat: 'll'}} - {{item.endDate | amDateFormat:'ll'}}</span>
        </p>
-        <ion-note>{{item.type}}</ion-note>
+        <ion-note>{{'type' | thingTranslate: item}}</ion-note>
      </div>
    </ion-col>
  </ion-row>
--- a/src/app/modules/data/types/video/video-detail-content.component.ts
+++ b/src/app/modules/data/types/video/video-detail-content.component.ts
@@ -13,8 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
 import {Component, Input} from '@angular/core';
-import {SCThing, SCTranslations, SCVideo} from '@openstapps/core';
-import {SCThingTranslator} from '@openstapps/core';
+import {SCVideo} from '@openstapps/core';

 /**
 * TODO
@@ -28,23 +27,4 @@ export class VideoDetailContentComponent {
   * TODO
   */
  @Input() item: SCVideo;
-  /**
-   * TODO
-   */
-  @Input() language: keyof SCTranslations<SCThing>;
-  /**
-   * TODO
-   */
-  objectKeys = Object.keys;
-  /**
-   * TODO
-   */
-  translator: SCThingTranslator;
-
-  /**
-   * TODO
-   */
-  constructor() {
-    this.translator = new SCThingTranslator(this.language);
-  }
 }
--- a/src/app/modules/data/types/video/video-detail-content.html
+++ b/src/app/modules/data/types/video/video-detail-content.html
@@ -1,6 +1,6 @@
-<stapps-simple-card *ngIf="item.actors" [title]="'Actors'" [content]="item.actors"></stapps-simple-card>
-<stapps-simple-card *ngIf="item.authors" [title]="'Authors'" [content]="item.authors"></stapps-simple-card>
-<stapps-simple-card *ngIf="item.datePublished" [title]="'Authors'" [content]="item.authors"></stapps-simple-card>
-<stapps-simple-card *ngIf="item.datePublished" [title]="'Published'"
-[content]="item.datePublished | amDateFormat:'ll'"></stapps-simple-card>
+<stapps-simple-card *ngIf="item.actors" [title]="'actors' | propertyNameTranslate: item | titlecase" [content]="item.actors"></stapps-simple-card>
+<stapps-simple-card *ngIf="item.authors" [title]="'authors' | propertyNameTranslate: item | titlecase" [content]="item.authors"></stapps-simple-card>
+<stapps-simple-card *ngIf="item.datePublished" [title]="'datePublished' | propertyNameTranslate: item | titlecase"
+  [content]="item.datePublished | amDateFormat:'ll'">
+</stapps-simple-card>
 <stapps-offers-detail *ngIf="item.offers" [offers]="item.offers"></stapps-offers-detail>
--- a/src/app/modules/data/types/video/video-list-item.html
+++ b/src/app/modules/data/types/video/video-list-item.html
@@ -2,10 +2,10 @@
  <ion-row>
    <ion-col>
      <div class="ion-text-wrap">
-        <h2 class="name">{{item.name}}</h2>
-        <p *ngIf="item.description"><stapps-long-inline-text [text]="item.description" [size]="110"></stapps-long-inline-text></p>
-        <p *ngIf="item.duration">Duration: {{item.duration | amDuration:'seconds'}}</p>
-        <ion-note>{{item.type}}</ion-note>
+        <h2 class="name">{{'name' | thingTranslate: item}}</h2>
+        <p *ngIf="item.description"><stapps-long-inline-text [text]="'description' | thingTranslate: item" [size]="80"></stapps-long-inline-text></p>
+        <p *ngIf="item.duration">{{'duration' | propertyNameTranslate: item | titlecase}}: {{item.duration | amDuration:'seconds'}}</p>
+        <ion-note>{{'type' | thingTranslate: item}}</ion-note>
      </div>
    </ion-col>
  </ion-row>
--- a/src/assets/i18n/de.json
+++ b/src/assets/i18n/de.json
@@ -5,7 +5,19 @@
    "detail": {
      "TITLE": "Detailansicht",
      "NOT_FOUND": "Nicht gefunden",
-      "COULD_NOT_CONNECT": "Verbindung fehlgeschlagen"
+      "COULD_NOT_CONNECT": "Verbindung fehlgeschlagen",
+      "address": {
+        "TITLE": "Adresse",
+        "STREET": "Straße",
+        "POSTCODE": "Postleitzahl",
+        "CITY": "Stadt",
+        "REGION": "Region",
+        "Country": "Land",
+        "POST_OFFICE_BOX": "Postfach"
+      },
+      "offers": {
+        "TITLE": "Angebote"
+      }
    },
    "types": {
      "dish": {
@@ -13,12 +25,25 @@
          "AVG_NUTRITION_INFO": "Durchschnittliche Nährwertangaben",
          "CALORIES": "Brennwert",
          "FAT_TOTAL": "Fett",
-          "FAT_SATURATED": "davon gesättinge Fettsäuren",
+          "FAT_SATURATED": "davon gesättigte Fettsäuren",
          "CARBOHYDRATE" : "Kohlenhydrate",
          "SALT": "Salz",
          "SUGAR": "davon Zucker",
          "PROTEIN": "Protein"
        }
+      },
+      "origin": {
+        "TITLE": "Ursprung",
+        "USER": "Nutzer",
+        "REMOTE": "Datenquelle",
+        "detail": {
+          "CREATED": "Erstellt am",
+          "UPDATED": "Aktualisiert am",
+          "MODIFIED": "Geändert am",
+          "INDEXED": "Indexiert am",
+          "MAINTAINER": "zur Verfügung gestellt von",
+          "RESPONSIBLE": "Verantwortlich"
+        }
      }
    }
  },
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -5,7 +5,19 @@
    "detail": {
      "TITLE": "Details",
      "NOT_FOUND": "Not found",
-      "COULD_NOT_CONNECT": "Couldn't connect"
+      "COULD_NOT_CONNECT": "Couldn't connect",
+      "address": {
+        "TITLE": "address",
+        "STREET": "street",
+        "POSTCODE": "postcode",
+        "CITY": "city",
+        "REGION": "region",
+        "Country": "country",
+        "POST_OFFICE_BOX": "post office box"
+      },
+      "offers": {
+        "TITLE": "offers"
+      }
    },
    "types": {
      "dish": {
@@ -19,6 +31,19 @@
          "SUGAR": "Sugars",
          "PROTEIN": "Protein"
        }
+      },
+      "origin": {
+        "TITLE": "origin",
+        "USER": "user",
+        "REMOTE": "remote",
+        "detail": {
+          "CREATED": "created at",
+          "UPDATED": "updated at",
+          "MODIFIED": "modified at",
+          "INDEXED": "indexed",
+          "MAINTAINER": "maintainer",
+          "RESPONSIBLE": "responsible entity"
+        }
      }
    }
  },
@@ -45,7 +70,7 @@
  },
  "settings": {
    "resetAlert.title": "Reset all settings?",
-    "resetAlert.message": "Are you shure to reset all settings to defaults values?",
+    "resetAlert.message": "Are you sure to reset all settings to their default values?",
    "resetAlert.buttonYes": "yes",
    "resetAlert.buttonCancel": "cancel",
    "resetToast.message": "Settings reset",