Merge branch 'ui_improvements_to_resolve_272_276_277' into 'development'

Ui improvements to resolve 272 276 277

See merge request sharing/codeability-sharing-platform!102

src/main/webapp/app/exercise/exercise-details/exercise-details.component.html

@@ -30,8 +30,8 @@
 
                 <!-- modal rating-->
                 <div *ngIf="exercise.rating" class="positionRating">
-                  <div style="float: left">
-                    <p class="card-text" jhiTranslate="exercise.details.rating"></p>
+                  <div [ngbTooltip]="helpForRating" style="float: left">
+                    <p class="card-text" jhiTranslate="exercise.details.accuracy"></p>
                   </div>
                   <div class="star-container">
                     <span
@@ -41,6 +41,7 @@
                     >
                     </span>
                   </div>
+                  <ng-template #helpForRating> {{ 'exercise.details.rating' | translate }} </ng-template>
                 </div>
                 <!-- modal rating end-->
 
@@ -100,7 +101,7 @@
 
                 <div *ngIf="exercise.views" class="positionRating">
                   <div style="float: left">
-                    <div>
+                    <div [ngbTooltip]="helpForViews">
                       <fa-icon icon="eye"></fa-icon>
                     </div>
                   </div>
@@ -109,11 +110,12 @@
                       {{ exercise.views }}
                     </span>
                   </div>
+                  <ng-template #helpForViews> {{ 'exercise.details.views' | translate }}</ng-template>
                 </div>
                 <!-- modal views end-->
 
                 <div *ngIf="exercise.downloads >= 0" class="positionRating">
-                  <div style="float: left">
+                  <div [ngbTooltip]="helpForDownloads" style="float: left">
                     <fa-icon icon="download"></fa-icon>
                   </div>
                   <div class="star-container">
@@ -121,11 +123,12 @@
                       {{ exercise.downloads }}
                     </span>
                   </div>
+                  <ng-template #helpForDownloads> {{ 'exercise.details.downloads' | translate }}</ng-template>
                 </div>
                 <!-- modal views end-->
 
                 <div *ngIf="exercise.numberOfWatchlistEntries >= 0" class="positionRating">
-                  <div style="float: left">
+                  <div [ngbTooltip]="helpForWatchlists" style="float: left">
                     <fa-icon icon="star"></fa-icon>
                   </div>
                   <div class="star-container">
@@ -133,6 +136,7 @@
                       {{ exercise.numberOfWatchlistEntries }}
                     </span>
                   </div>
+                  <ng-template #helpForWatchlists> {{ 'exercise.details.watchlists' | translate }}</ng-template>
                 </div>
 
                 <!-- modal bookmark-->
@@ -155,7 +159,7 @@
                 <!-- modal bookmark end-->
 
                 <div *ngIf="exercise.originalResult.file.parentId" style="float: left; width: 100%; padding-top: 15px; margin-bottom: 25px">
-                  <ng-template #helpToParent data-container="body"> {{ 'exercise.help.toParent' | translate }}</ng-template>
+                  <ng-template #helpToParent data-container="body"> {{ 'exercise.help.toParent' | translate }} </ng-template>
                   <fa-icon
                     style="padding: 5px 0px 0px 5px; float: left"
                     [ngbTooltip]="helpToParent"
@@ -200,49 +204,41 @@
               <div class="col-12">
                 <p style="text-align: left; margin-top: 20px"><strong jhiTranslate="exercise.export.export"></strong></p>
                 <hr />
-                <table>
-                  <tr>
-                    <td>
-                      <a
-                        class="btn btn-outline-secondary"
-                        role="button"
-                        aria-pressed="true"
-                        style="float: left; margin-right: 5px; margin-top: 5px"
-                        (click)="download()"
-                        jhiTranslate="exercise.export.download"
-                      ></a>
-                    </td>
-                    <td style="vertical-align: middle">
-                      <input
-                        type="checkbox"
-                        [checked]="downloadWithChildren"
-                        (change)="toggleWithChildren()"
-                        value=""
-                        value=""
-                        id="withChildren"
-                      />
-                      <label class="form-check-label" for="withChildren" jhiTranslate="exercise.details.withChildren"></label>
-                    </td>
-                  </tr>
-                </table>
-                <a
-                  *ngFor="let action of exercise.originalResult.supportedActions"
-                  class="btn btn-outline-secondary positionAction"
-                  role="button"
-                  aria-pressed="true"
-                  (click)="startAction(action, exercise)"
-                  >{{ action.commandName }}</a
-                >
-                <div [ngbTooltip]="helpComingSoon" placement="bottom">
+              </div>
+              <div class="col-6">
+                <span>
+                  <a
+                    class="btn btn-outline-secondary"
+                    role="button"
+                    aria-pressed="true"
+                    style="float: left; margin-right: 5px; margin-top: 5px"
+                    (click)="download()"
+                    jhiTranslate="exercise.export.download"
+                  ></a>
+                  <label style="padding-top: 10px" for="withChildren">
+                    {{ 'exercise.details.withChildren' | translate }}
+                    <input type="checkbox" [hidden]="false" [(ngModel)]="downloadWithChildren" id="withChildren" />
+                  </label>
+                </span>
+              </div>
+              <a
+                *ngFor="let action of exercise.originalResult.supportedActions"
+                class="btn btn-outline-secondary positionAction col-6"
+                role="button"
+                aria-pressed="true"
+                (click)="startAction(action, exercise)"
+                >{{ action.commandName }}</a
+              >
+              <div class="col-6" placement="bottom">
+                <span [ngbTooltip]="helpComingSoon">
                   <button
                     *ngIf="hasChildren()"
                     type="button"
                     class="btn btn-outline-secondary positionAction"
                     jhiTranslate="exercise.export.latex"
-                    title="{{ 'exercise.comingSoon' | translate }}"
                     disabled
                   ></button>
-                </div>
+                </span>
               </div>
             </div>
           </div>

src/main/webapp/app/exercise/exercise-details/exercise-details.component.scss

@@ -73,3 +73,7 @@
   margin-right: 5px;
   margin-top: 5px;
 }
+
+#myModal {
+  overflow-y: scroll;
+}

src/main/webapp/i18n/de/exercise.json

@@ -3,15 +3,17 @@
     "comingSoon": "demnächst verfügbar :-)",
     "details": {
       "details": "Details",
-      "rating": "Trefferqualität",
+      "accuracy": "Trefferübereinstimmung",
+      "rating": "Diese Metrik zeigt wie gut die Suchanfrage mit den gefundenen Treffern übereinstimmt.",
       "bookmark": "Merken",
       "withChildren": "mit Unteraufgaben",
       "hitDetails": "Suchergebnis Details",
       "allExercises": "Alle Aufgaben für diesen Kurs anzeigen",
       "git": "In GitLab öffnen",
       "editOEResource": "In OEResource bearbeiten",
-      "views": "Anzahl der Aufrufe",
-      "downloads": "Anzahl der Downloads",
+      "views": "Anzahl der Aufrufe!",
+      "downloads": "Anzahl der Downloads!",
+      "watchlists": "Anzahl der Merklisten, in welchen diese Resource vorkommt!",
       "readmeNotFound": "# Keine README.md Datei (oder Alternative) gefunden!",
       "toParent": "zum übergeordneten Objekt",
       "like": "Wenn Ihnen diese Aufgabe gefällt, dann klicken Sie auf das Herz!",

src/main/webapp/i18n/en/exercise.json

@@ -3,15 +3,17 @@
     "comingSoon": "coming soon",
     "details": {
       "details": "Details",
-      "rating": "Hit quality",
+      "accuracy": "Search accuracy",
+      "rating": "This metric shows how well the search term overlaps with the found resources!",
       "bookmark": "Bookmark",
       "withChildren": "with children",
       "hitDetails": "Show hit details",
       "allExercises": "Show all exercises for this course",
       "git": "Open in GitLab",
       "editOEResource": "Edit in OEResource",
-      "views": "Number of views",
-      "downloads": "Number of downloads",
+      "views": "Number of views!",
+      "downloads": "Number of downloads!",
+      "watchlists": "Number of times this resource was saved in a watchlist!",
       "readmeNotFound": "# No README.md (or alternatives) found!",
       "toParent": "to parent object",
       "like": "If you like this exercise, you can click here!",