Skip to content

Commit

Permalink
Merge pull request #213 from nmaas-platform/209-fill-all-preceding-st…
Browse files Browse the repository at this point in the history 
…ars-when-rating-an-application

fixed stars and changed app details view
  • Loading branch information
@llopat
llopat authored Mar 27, 2024
2 parents 5766f3d + 066af8c commit 02a1328
Show file tree
Hide file tree
Showing 7 changed files with 108 additions and 115 deletions.
38 changes: 17 additions & 21 deletions src/app/appmarket/appdetails/appdetails.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,28 +10,28 @@
<div class="col-xs-8 col-sm-9 col-md-9 col-lg-10">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6" *ngIf="app">
<h2 style="margin-bottom: 4px;">{{app?.name}}</h2>
<h2 style="margin: 4px 0;">{{app?.name}}</h2>
<rate [showVotes]="true" [short]="true" [pathUrl]="getPathUrl(appId)"></rate>
<div class="text-muted" style="font-size: small;">
<span pTooltip="{{'APPLICATIONS.TOOLTIP_MESSAGE_NOT_AVAILABLE' | translate}}" tooltipPosition="bottom" [showDelay]="50" [tooltipDisabled]="activeVersions.length !== 0">
<a class="{{activeVersions.length > 0 ? '' : 'disabled-url'}}" style="cursor: pointer;" (click)="showVersions()">{{'APP_INSTANCE.SHOW_VERSIONS_LABEL' | translate }}</a>
</span>
<div class="text-muted mt-2" style="font-size: small;">
<span pTooltip="{{'APPLICATIONS.TOOLTIP_MESSAGE_NOT_AVAILABLE' | translate}}" tooltipPosition="bottom" [showDelay]="50" [tooltipDisabled]="activeVersions.length !== 0">
<a class="{{activeVersions.length > 0 ? '' : 'disabled-url'}}" style="cursor: pointer;" (click)="showVersions()">{{'APP_INSTANCE.SHOW_VERSIONS_LABEL' | translate }}</a>
</span>
|
<span pTooltip="{{'APPLICATIONS.TOOLTIP_MESSAGE_NOT_AVAILABLE' | translate}}" tooltipPosition="bottom" [showDelay]="50" [tooltipDisabled]="!!app?.licenseUrl">
<a class="{{app?.licenseUrl ? '' : 'disabled-url'}}" [href]="getValidLink(app?.licenseUrl)" target="_blank">{{app?.license || 'License'}}</a>
</span>
<a class="{{app?.licenseUrl ? '' : 'disabled-url'}}" [href]="getValidLink(app?.licenseUrl)" target="_blank">{{app?.license || 'License'}}</a>
</span>
|
<span pTooltip="{{'APPLICATIONS.TOOLTIP_MESSAGE_NOT_AVAILABLE' | translate}}" tooltipPosition="bottom" [showDelay]="50" [tooltipDisabled]="!!app?.wwwUrl">
<a class="{{app?.wwwUrl ? '' : 'disabled-url'}}" [href]="getValidLink(app?.wwwUrl)">WWW</a>
</span>
<a class="{{app?.wwwUrl ? '' : 'disabled-url'}}" [href]="getValidLink(app?.wwwUrl)">WWW</a>
</span>
|
<span pTooltip="{{'APPLICATIONS.TOOLTIP_MESSAGE_NOT_AVAILABLE' | translate}}" tooltipPosition="bottom" [showDelay]="50" [tooltipDisabled]="!!app?.sourceUrl">
<a class="{{app?.sourceUrl ? '' : 'disabled-url'}}" [href]="getValidLink(app?.sourceUrl)" target="_blank">{{'APP_INSTANCE.SOURCE' | translate}}</a>
</span>
<a class="{{app?.sourceUrl ? '' : 'disabled-url'}}" [href]="getValidLink(app?.sourceUrl)" target="_blank">{{'APP_INSTANCE.SOURCE' | translate}}</a>
</span>
|
<span pTooltip="{{'APPLICATIONS.TOOLTIP_MESSAGE_NOT_AVAILABLE' | translate}}" tooltipPosition="bottom" [showDelay]="50" [tooltipDisabled]="!!app?.issuesUrl">
<a class="{{app?.issuesUrl ? '' : 'disabled-url'}}" [href]="getValidLink(app?.issuesUrl)" target="_blank">{{'APP_INSTANCE.ISSUES' | translate}}</a>
</span>
<a class="{{app?.issuesUrl ? '' : 'disabled-url'}}" [href]="getValidLink(app?.issuesUrl)" target="_blank">{{'APP_INSTANCE.ISSUES' | translate}}</a>
</span>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
Expand All @@ -47,15 +47,14 @@ <h2 style="margin-bottom: 4px;">{{app?.name}}</h2>
</a>
</div>
</div>
<hr>
<div class="row">
<div class="row mt-2">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6" *ngIf="app?.tags">
<a *ngFor="let tag of app.tags" class="tag-button">
{{tag.name | lowercase}}
</a>
</div>
</div>
<!-- block the button until app and domain are downloaded to load proper tooltip state-->
<!-- block the button until app and domain are downloaded to load proper tooltip state-->
<div class="row" *ngIf="app && domain">
<div *ngIf="!subscribed && isSubscriptionAllowed()" class="btn-group pull-right"
pTooltip="{{'APPLICATIONS.TOOLTIP_MESSAGE_SUBSCRIBE' | translate}}" tooltipPosition="bottom" [showDelay]="50" [tooltipDisabled]="defaultTooltipDisabled">
Expand All @@ -74,21 +73,18 @@ <h2 style="margin-bottom: 4px;">{{app?.name}}</h2>

<div class='row'>
<h3>{{'SCREENSHOTS.HEADER' | translate}}</h3>
<hr>
<screenshots [pathUrl]="'/apps/' + appId + '/screenshots'"></screenshots>
</div>

<div class="row">
<div class="row mt-5 mb-8">
<h3>{{'APPLICATIONS.DESCRIPTION' | translate}}</h3>
<hr>
<div [innerHTML]="getDescription()?.fullDescription">

</div>
</div>

<hr>

<div *ngIf="appId" class="row">
<div *ngIf="appId" class="row mb-6 mt-6">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 block-border">
<rating-extended name="appRateUpdate" [editable]="true" (onChange)="onRateChanged()" [pathUrl]="getPathUrl(appId)"></rating-extended>
</div>
Expand Down
42 changes: 19 additions & 23 deletions src/app/appmarket/appmanagement/app-preview/apppreview.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,10 @@
<div class="col-xs-8 col-sm-9 col-md-9 col-lg-10" *ngIf="app">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
<h2 style="margin-bottom: 4px;">{{app?.applicationBase.name}}</h2>
<h2 style="margin: 4px 0;">{{app?.applicationBase.name}}</h2>
<rate *ngIf="app?.applicationBase.id" [showVotes]="true" [short]="true" [pathUrl]="getPathUrl(app?.applicationBase.id)"></rate>
<rate *ngIf="!app?.applicationBase.id" [showVotes]="true" [short]="true" [pathUrl]="getPathUrl(1)"></rate>
<div class="text-muted" style="font-size: small;">
<div class="text-muted mt-2" style="font-size: small;">
<span *ngIf="isVersionView()">v.{{app?.application.version}}</span>
<a *ngIf="!isVersionView()" style="cursor: pointer;" (click)="showVersions()">{{'APP_INSTANCE.SHOW_VERSIONS_LABEL' | translate }}</a>
| <a [href]="getValidLink(app?.applicationBase.licenseUrl)" target="_blank">{{app?.applicationBase.license}}</a>
Expand All @@ -39,8 +39,7 @@ <h2 style="margin-bottom: 4px;">{{app?.applicationBase.name}}</h2>
</a>
</div>
</div>
<hr>
<div class="row">
<div class="row mt-2">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6" *ngIf="app?.applicationBase.tags">
<a *ngFor="let tag of app?.applicationBase.tags" class="tag-button">
{{tag.name | titlecase}}
Expand All @@ -59,46 +58,43 @@ <h2 style="margin-bottom: 4px;">{{app?.applicationBase.name}}</h2>

<div class='row' *ngIf="app?.applicationBase.id && !screenshots">
<h3>{{'SCREENSHOTS.HEADER' | translate}}</h3>
<hr>
<screenshots [pathUrl]="'/apps/' + app?.applicationBase.id + '/screenshots'"></screenshots>
</div>

<div class='row' *ngIf="!app?.applicationBase.id || screenshots">
<h3>{{'SCREENSHOTS.HEADER' | translate}}</h3>
<hr>
<div class="carousel slide media-carousel col-md-12" id="app-preview-carousel" *ngIf="screenshots">
<div class="carousel-inner">
<div class="item" *ngFor="let row of screenshots | group:3; let firstRow = last" [ngClass]="{'active': firstRow}">
<div class="row">
<div class="col-md-4" *ngFor="let screenshot of row">
<a class="thumbnail">
<img alt="Screenshot" [src]="screenshot.objectURL || 'assets/images/app-screenshot-example.png'">
</a>
</div>
</div>
</div>
<div class="carousel-inner">
<div class="item" *ngFor="let row of screenshots | group:4; let firstRow = last" [ngClass]="{'active': firstRow}">
<div class="row">
<div class="col-md-3" *ngFor="let screenshot of row">
<a class="thumbnail">
<img alt="Screenshot" [src]="screenshot.objectURL || 'assets/images/app-screenshot-example.png'">
</a>
</div>
</div>
<a data-slide="prev" href="#app-preview-carousel" class="left carousel-control" *ngIf="screenshots.length > 3">&lt;</a>
<a data-slide="next" href="#app-preview-carousel" class="right carousel-control" *ngIf="screenshots.length > 3">&gt;</a>
</div>
</div>
<a data-slide="prev" href="#app-preview-carousel" class="left flex justify-content-center align-items-center carousel-control" *ngIf="screenshots.length > 3"><span class="fa fa-angle-left" style="width: 20px; height: 20px"></span></a>
<a data-slide="next" href="#app-preview-carousel" class="right flex justify-content-center align-items-center carousel-control" *ngIf="screenshots.length > 3"><span class="fa fa-angle-right" style="width: 20px; height: 20px"></span></a>
</div>
</div>

<div class="row">
<div class="row mt-5 mb-8">
<h3>{{'APPLICATIONS.DESCRIPTION' | translate}}</h3>
<hr>
<div [innerHTML]="getDescription()?.fullDescription">

</div>
</div>

<hr>

<div *ngIf="app?.applicationBase.id" class="row">
<div *ngIf="app?.applicationBase.id" class="row mb-6 mt-6">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 block-border">
<rating-extended name="appRateUpdate" [editable]="false" [pathUrl]="getPathUrl(app?.applicationBase.id)"></rating-extended>
</div>
</div>
<div *ngIf="!app?.applicationBase.id" class="row">
<div *ngIf="!app?.applicationBase.id" class="row mb-6 mt-6">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 block-border">
<rating-extended name="appRateUpdate" [editable]="false" [pathUrl]="getPathUrl(1)"></rating-extended>
</div>
Expand All @@ -116,7 +112,7 @@ <h3>{{'APPS_PREVIEW.CONFIG_WIZARD_PREVIEW_HEADER' | translate}}</h3>
</div>
</div>

<div class="row" *ngIf="app?.application.configUpdateWizardTemplate">
<div class="row" *ngIf="app?.application.configUpdateWizardTemplate">
<hr>
<div class="col-xs-12">
<h3>{{'APPS_PREVIEW.UPDATE_CONFIG_WIZARD_PREVIEW_HEADER' | translate}}</h3>
Expand Down
66 changes: 33 additions & 33 deletions src/app/shared/comments/comments.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ <h4>{{'COMMENTS.ADD_COMMENT' | translate}}:</h4>
<div class="form-group">
<label class="sr-only" for="comment">{{'COMMENTS.ADD_COMMENT' | translate}}:</label>
<textarea #textAreaNewComment name="comment" id="comment" placeholder="{{'COMMENTS.PLACEHOLDER' | translate}}"
class="form-control" rows="2" required [(ngModel)]="newComment.comment"></textarea>
class="form-control mb-4" rows="2" required [(ngModel)]="newComment.comment" style="resize: none; height: 100px; border-radius: 10px"></textarea>
<button type="submit" class="btn btn-default pull-right">{{'COMMENTS.ADD_BUTTON' | translate}}</button>
<div class="alert alert-danger" *ngIf="commentErrorMsg">
{{commentErrorMsg}}
Expand All @@ -18,43 +18,43 @@ <h4>{{'COMMENTS.ADD_COMMENT' | translate}}:</h4>
<h3>{{'COMMENTS.NO_COMMENTS_MESSAGE' | translate}}</h3>
</div>
<div class="row" *ngIf="comments.length > 0">
<h3>{{'COMMENTS.COMMENTS_LIST' | translate}}:</h3>
<ul class="media-list">
<li *ngFor="let comment of comments|slice:0:showMainCommentsList let x=index" class="media">
<app-single-comment *ngIf="!comment.parentId" [createdAt]=comment.createdAt [commentAuthor]=comment.owner.username
[commentId]=comment.id [commentText]=comment.comment
(removeEvent)="OnRemove($event)" (addReplyEvent)="onAddReply($event)">
<h3>{{'COMMENTS.COMMENTS_LIST' | translate}}:</h3>
<ul class="media-list mt-4">
<li *ngFor="let comment of comments|slice:0:showMainCommentsList let x=index" class="media">
<app-single-comment *ngIf="!comment.parentId" [createdAt]=comment.createdAt [commentAuthor]=comment.owner.username
[commentId]=comment.id [commentText]=comment.comment
(removeEvent)="OnRemove($event)" (addReplyEvent)="onAddReply($event)">
</app-single-comment>
<div class="media-body">
<ul *ngIf="comment.subComments !== null" class="media-list">
<li class="media" *ngFor="let subcomment of comment.subComments|slice:0:show[comment.id] let i=index">
<app-single-comment [createdAt]=subcomment.createdAt [commentAuthor]=subcomment.owner.username
[commentId]=subcomment.id [commentText]=subcomment.comment [parentId]=comment.id
(removeEvent)="OnRemove($event)" (addReplyEvent)="onAddReply($event)">
</app-single-comment>
<div class="media-body">
<ul *ngIf="comment.subComments !== null" class="media-list">
<li class="media" *ngFor="let subcomment of comment.subComments|slice:0:show[comment.id] let i=index">
<app-single-comment [createdAt]=subcomment.createdAt [commentAuthor]=subcomment.owner.username
[commentId]=subcomment.id [commentText]=subcomment.comment [parentId]=comment.id
(removeEvent)="OnRemove($event)" (addReplyEvent)="onAddReply($event)">
</app-single-comment>
<div [id]="'load_more_' + subcomment.id.toString()"
*ngIf="(i+1) % 3 == 0 && show[comment.id] < (i+2) && comment.subComments.length > 3"
class="col-xs-offset-2 col-sm-offset-1 col-xs-10 col-sm-11">
<div class="load-more-box">
<p class="text-center load-more-box-text">
<a (click)="loadMore(comment.subComments.length,
('load_more_' + subcomment.id.toString()), comment.id)">Load more</a>
</p>
</div>
</div>
</li>
</ul>
</div>
<div [id]="'load_more_comm_' + comment.id.toString()"
*ngIf="(x+1) % 5 == 0 && showMainCommentsList <= (x+2)"
<div [id]="'load_more_' + subcomment.id.toString()"
*ngIf="(i+1) % 3 == 0 && show[comment.id] < (i+2) && comment.subComments.length > 3"
class="col-xs-offset-2 col-sm-offset-1 col-xs-10 col-sm-11">
<div class="load-more-box">
<p class="text-center load-more-box-text">
<a (click)="loadMoreComments(comments.length,
('load_more_comm_' + comment.id.toString() ) )">Load more</a>
<a (click)="loadMore(comment.subComments.length,
('load_more_' + subcomment.id.toString()), comment.id)">Load more</a>
</p>
</div>
</div>
</li>
</ul>
</div>
</ul>
</div>
<div [id]="'load_more_comm_' + comment.id.toString()"
*ngIf="(x+1) % 5 == 0 && showMainCommentsList <= (x+2)"
class="col-xs-offset-2 col-sm-offset-1 col-xs-10 col-sm-11">
<div class="load-more-box">
<p class="text-center load-more-box-text">
<a (click)="loadMoreComments(comments.length,
('load_more_comm_' + comment.id.toString() ) )">Load more</a>
</p>
</div>
</div>
</li>
</ul>
</div>
2 changes: 1 addition & 1 deletion src/app/shared/rate/rate.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,4 @@
<span [ngClass]="(rate?.averageRate >= 4) ? 'fa fa-star fa-star-small fa-star-checked' : 'fa fa-star fa-star-small'" (click)="update(4)"></span>
<span [ngClass]="(rate?.averageRate >= 5) ? 'fa fa-star fa-star-small fa-star-checked' : 'fa fa-star fa-star-small'" (click)="update(5)"></span>
<span *ngIf="!short" class="text">{{rate?.averageRate | number:'1.0-1'}}</span>
<span *ngIf="showVotes" class="text text-muted" style="font-size: smaller">{{totalVotes}} votes</span>
<span *ngIf="showVotes" class="text text-muted ml-2" style="font-size: smaller">{{totalVotes}} votes</span>
29 changes: 15 additions & 14 deletions src/app/shared/rating-extended/rating-extended.component.css
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
.rate-container{
margin-top: 10px;
direction: rtl;
}

.fa-star{
Expand All @@ -12,24 +13,24 @@
margin-right: 0;
}

.progress-green{
background-color: rgb(0, 190, 19) !important;
background-image: linear-gradient(rgb(0, 190, 19), rgb(0, 190, 19));
.progress-dark-green{
background-color: rgb(69, 123, 1) !important;
background-image: linear-gradient(rgb(69, 123, 1), rgb(69, 123, 1));
}

.progress-dark-blue{
background-color: rgb(0, 94, 155) !important;
background-image: linear-gradient(rgb(0, 94, 155), rgb(0, 94, 155));
.progress-green{
background-color: rgb(128, 178, 65) !important;
background-image: linear-gradient(rgb(128, 178, 65), rgb(128, 178, 65));
}

.progress-blue{
background-color: rgb(0, 152, 192) !important;
background-image: linear-gradient(rgb(0, 152, 192), rgb(0, 152, 192));
.progress-yellow{
background-color: rgb(246, 222, 0) !important;
background-image: linear-gradient(rgb(246, 222, 0), rgb(246, 222, 0));
}

.progress-yellow{
background-color: rgb(241, 189, 0) !important;
background-image: linear-gradient(rgb(241, 189, 0), rgb(241, 189, 0));
.progress-orange{
background-color: rgb(255, 138, 0) !important;
background-image: linear-gradient(rgb(255, 138, 0), rgb(255, 138, 0));
}

.progress-red{
Expand All @@ -41,7 +42,7 @@
color: gray;
}

.fa-star-button:hover{
.fa-star-button:hover, .fa-star-button:hover ~ span{
color: rgb(189, 141, 0) !important;
}

Expand All @@ -68,4 +69,4 @@

.progress{
margin-bottom: 10px;
}
}
Loading

0 comments on commit 02a1328

Please sign in to comment.