Merge pull request #526 from correctexam/235-on-mobile-add-swipe-righ…

…t-and-left-to-go-from-one-student-to-the-next-one provide a button to switch back zen mode (useful when using a tablet)
correctexam · Mar 28, 2024 · 60cf1a8 · 60cf1a8
2 parents c9a5306 + 0e36879
commit 60cf1a8
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 7 deletions.
diff --git a/src/main/webapp/app/scanexam/corrigequestion/corrigequestion.component.html b/src/main/webapp/app/scanexam/corrigequestion/corrigequestion.component.html
@@ -309,11 +309,16 @@ <h3 jhiTranslate="scanexam.layoutoptions">Layout options</h3>
       [style]="{ height: '6px' }"
     ></p-progressBar>
   </div>
-  <div class="col-12">
+  <div *ngIf="focusView">
+    <a (click)="layoutsidebarVisible = true" class="float">
+      <i class="pi pi-cog my-float" style="font-size: 1.5rem"></i>
+    </a>
+  </div>
+  <div class="col-12 p-0">
     <div class="grid grid-nogutter">
       <div class="col-12 sm:col-12 md:col-12 lg:col-9 xl:col-10">
         <div class="d-flex justify-content-center" *ngIf="!focusView">
-          <div class="col-5">
+          <div class="col-5 p-0">
             <button
               class="sm:text-xs md:text-xs lg:text-base"
               pButton
@@ -353,7 +358,7 @@ <h3 jhiTranslate="scanexam.layoutoptions">Layout options</h3>
             <button [hidden]="!debug" type="text" pButton [label]="'reset'" (click)="removeAllAnswer()"></button>
           </div>
 
-          <div class="col-2" *ngIf="!focusView">
+          <div class="col-2 p-0" *ngIf="!focusView">
             <button
               class="sm:text-xs md:text-xs lg:text-base"
               pButton
@@ -368,7 +373,7 @@ <h3 jhiTranslate="scanexam.layoutoptions">Layout options</h3>
             <p-progressSpinner *ngIf="blocked" styleClass="w-2rem h-2rem"></p-progressSpinner>
           </div>
 
-          <div class="col-1" *ngIf="!focusView">
+          <div class="col-1 p-0" *ngIf="!focusView">
             <fa-icon
               *ngIf="studentName !== undefined"
               [size]="'2x'"
@@ -379,7 +384,7 @@ <h3 jhiTranslate="scanexam.layoutoptions">Layout options</h3>
             ></fa-icon>
           </div>
 
-          <div class="col-4 flex flex-row-reverse" *ngIf="!focusView">
+          <div class="col-4 p-0 flex flex-row-reverse" *ngIf="!focusView">
             <button
               [disabled]="!this.examId"
               type="submit"

diff --git a/src/main/webapp/app/scanexam/corrigequestion/corrigequestion.component.ts b/src/main/webapp/app/scanexam/corrigequestion/corrigequestion.component.ts
@@ -2695,9 +2695,9 @@ export class CorrigequestionComponent implements OnInit, AfterViewInit {
       verticalScroll = false;
     }
     if (event.direction === 'x' && event.distance > 70) {
-      await this.nextStudent();
-    } else if (event.direction === 'x' && event.distance < -70) {
       await this.previousStudent();
+    } else if (event.direction === 'x' && event.distance < -70) {
+      await this.nextStudent();
     } else if (event.direction === 'y' && event.distance > 70 && verticalScroll) {
       await this.nextQuestion();
     } else if (event.direction === 'y' && event.distance < -70 && verticalScroll) {

diff --git a/src/main/webapp/content/scss/global.scss b/src/main/webapp/content/scss/global.scss
@@ -10,6 +10,22 @@
   //  margin-top: -1rem;
 }
 
+.myfloat {
+  position: fixed;
+  width: 60px;
+  height: 60px;
+  top: 20px;
+  left: 20px;
+  background-color: #0c9;
+  color: #fff;
+  border-radius: 50px;
+  text-align: center;
+  box-shadow: 2px 2px 3px #999;
+}
+.my-float {
+  margin-top: 5px;
+}
+
 /* ==============================================================
 Bootstrap tweaks
 ===============================================================*/