MOBILE-3320 quiz: Fix orientation change in D&D questions

src/addons/qtype/ddimageortext/classes/ddimageortext.ts

@@ -360,7 +360,7 @@ export class AddonQtypeDdImageOrTextQuestion {
             this.pollForImageLoad();
         });
 
-        this.resizeFunction = this.repositionDragsForQuestion.bind(this);
+        this.resizeFunction = this.windowResized.bind(this);
         window.addEventListener('resize', this.resizeFunction!);
     }
 
@@ -679,6 +679,15 @@ export class AddonQtypeDdImageOrTextQuestion {
         }
     }
 
+    /**
+     * Window resized.
+     */
+    async windowResized(): Promise<void> {
+        await CoreDomUtils.waitForResizeDone();
+
+        this.repositionDragsForQuestion();
+    }
+
 }
 
 /**

src/addons/qtype/ddmarker/classes/ddmarker.ts

@@ -601,7 +601,7 @@ export class AddonQtypeDdMarkerQuestion {
             this.pollForImageLoad();
         });
 
-        this.resizeFunction = this.redrawDragsAndDrops.bind(this);
+        this.resizeFunction = this.windowResized.bind(this);
         window.addEventListener('resize', this.resizeFunction!);
     }
 
@@ -869,6 +869,15 @@ export class AddonQtypeDdMarkerQuestion {
         }
     }
 
+    /**
+     * Window resized.
+     */
+    async windowResized(): Promise<void> {
+        await CoreDomUtils.waitForResizeDone();
+
+        this.redrawDragsAndDrops();
+    }
+
 }
 
 /**

src/addons/qtype/ddwtos/classes/ddwtos.ts

@@ -214,7 +214,7 @@ export class AddonQtypeDdwtosQuestion {
 
         this.positionDragItems();
 
-        this.resizeFunction = this.positionDragItems.bind(this);
+        this.resizeFunction = this.windowResized.bind(this);
         window.addEventListener('resize', this.resizeFunction!);
     }
 
@@ -515,6 +515,15 @@ export class AddonQtypeDdwtosQuestion {
         });
     }
 
+    /**
+     * Window resized.
+     */
+    async windowResized(): Promise<void> {
+        await CoreDomUtils.waitForResizeDone();
+
+        this.positionDragItems();
+    }
+
 }
 
 /**

src/core/services/utils/dom.ts

@@ -1847,6 +1847,32 @@ export class CoreDomUtilsProvider {
         CoreForms.triggerFormSubmittedEvent(formRef, online, siteId);
     }
 
+    /**
+     * In iOS the resize event is triggered before the window size changes. Wait for the size to change.
+     *
+     * @param windowWidth Initial window width.
+     * @param windowHeight Initial window height.
+     * @param retries Number of retries done.
+     */
+    async waitForResizeDone(windowWidth?: number, windowHeight?: number, retries = 0): Promise<void> {
+        if (!CoreApp.isIOS()) {
+            return; // Only wait in iOS.
+        }
+
+        windowWidth = windowWidth || window.innerWidth;
+        windowHeight = windowHeight || window.innerHeight;
+
+        if (windowWidth != window.innerWidth || windowHeight != window.innerHeight || retries >= 10) {
+            // Window size changed or max number of retries reached, stop.
+            return;
+        }
+
+        // Wait a bit and try again.
+        await CoreUtils.wait(50);
+
+        return this.waitForResizeDone(windowWidth, windowHeight, retries+1);
+    }
+
 }
 
 export const CoreDomUtils = makeSingleton(CoreDomUtilsProvider);