Frontend Helper RatingDirective

← zurück zur Übersicht

RatingDirective

Definition: [RatingDirective](Frontend Interface RatingDirective)
Modul: happyHour.directives.RatingDirective
Dateiname: components/directives/RatingDirective.js
Typ: Angular Directive
Autor: Dorothee Nies

Abhängigkeiten

keine

Funktionsweise

Es wird eine Sternebewertung mit 10 Sternen übergeben, da allerdings nur 5 Sternicons vorhanden sind, wird diese Bewertung angepasst.

if($scope.type === 'star') {
  starRating = starRating/2;
}

Die Bewertung die in 0.1er Schritten vorliegt wird auf 0.5er Schritte gerundet.

var value  = Math.round($scope.value*2)/2;

In einer Zählschleife die i von 0 bis zur maximalen Iconmenge zählen lässt, wird die Bewertung in Symbole umgewandelt. Die maximale Menge an Sternenicons beträgt 5, die für die Eurozeichen 4.

var maxIcons = 5;
if($scope.type === 'euro') {
  maxIcons = 4;
}

Wenn von i bis zur Bewertung nurnoch 0.5 übrig sind, wird ein halbes Icon hinzugefügt.

if(i + 0.5 === value) {
  strings.push('<span class="i__' + $scope.type + '-halfcolored"></span>');
}

Wenn i kleiner als die Bewertung ist, wird ein ganzes Icon hinzugefügt.

else if(i < value){
  strings.push('<span class="i__' + $scope.type + '-colored"></span>');
}

Ansonsten wird ein leeres Icon hinzugefügt.

else {
  strings.push('<span class="i__' + $scope.type + '"></span>');
}

Für die Sternebewertung wird eine textuelle Angabe hinzugefügt.

if($scope.type === 'star') {
  strings.push('<span class="e__rating-description">('+$scope.value+'/10)</span>');
}

Liegt keine Bewertung vor, wird der String 'keine Bewertung' zurückgegeben.

else {
  strings.push('<span class="e__rating-description">Keine Bewertung</span>');
}