From 697ab9e1175ab5676e58c6611dfa8209aa2f9714 Mon Sep 17 00:00:00 2001
From: Sohom <sohom.datta@learner.manipal.edu>
Date: Mon, 30 Aug 2021 21:27:29 +0530
Subject: [PATCH] Partial support for VE (height's dont work)

Change-Id: I8356c2b647339ee5cddc9de4ccdcc5c0eb89c535
---
 includes/Page/PageDisplayHandler.php                |  5 +++--
 modules/page/ext.proofreadpage.page.edit.js         | 11 ++++-------
 .../ve.init.mw.ProofreadPagePageTarget.js           | 13 +++++++------
 3 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/includes/Page/PageDisplayHandler.php b/includes/Page/PageDisplayHandler.php
index 397a42d2..866d6ee4 100644
--- a/includes/Page/PageDisplayHandler.php
+++ b/includes/Page/PageDisplayHandler.php
@@ -129,10 +129,11 @@ class PageDisplayHandler {
 	public function buildPageContainerEnd( Title $pageTitle ) {
 		return Html::closeElement( 'div' ) .
 			Html::openElement( 'div', [
-					'id' => 'prp-page-image-openseadragon',
 					'class' => 'prp-page-image'
  ] ) .
-			$this->buildImageHtml( $pageTitle ) .
+			$this->buildImageHtml( $pageTitle ) . Html::rawElement( 'div', [
+				'id' => 'prp-page-image-openseadragon-vertical'
+			] ) .
 			Html::closeElement( 'div' ) .
 			Html::closeElement( 'div' );
 	}
diff --git a/modules/page/ext.proofreadpage.page.edit.js b/modules/page/ext.proofreadpage.page.edit.js
index 2d125609..bc6f4389 100644
--- a/modules/page/ext.proofreadpage.page.edit.js
+++ b/modules/page/ext.proofreadpage.page.edit.js
@@ -180,8 +180,7 @@
 		isLayoutHorizontal = horizontal === undefined ? !isLayoutHorizontal : horizontal;
 
 		if ( viewer ) {
-			// eslint-disable-next-line no-jquery/no-global-selector
-			$( '.openseadragon-container' ).detach();
+			viewer.destroy();
 			viewer = null;
 		}
 
@@ -200,7 +199,7 @@
 				width: ''
 			} );
 			$.when( mw.loader.using( 'ext.wikiEditor' ), $.ready ).then( function () {
-				ensureImageZoomInitialization( 'prp-page-image-openseadragon' );
+				ensureImageZoomInitialization( 'prp-page-image-openseadragon-vertical' );
 			} );
 
 			// eslint-disable-next-line no-jquery/no-global-selector
@@ -210,8 +209,6 @@
 			if ( !$imgContHorizontal ) {
 				$imgContHorizontal = $imgCont
 					.clone()
-					.addClass( 'prp-page-image-horizontal' )
-					.removeClass( 'prp-page-image' )
 					.attr( 'id', 'prp-page-image-openseadragon-horizontal' );
 				$imgContHorizontal.insertBefore( $editForm );
 			} else {
@@ -540,11 +537,11 @@
 
 		if ( $imgCont === undefined ) {
 			// eslint-disable-next-line no-jquery/no-global-selector
-			$imgCont = $( '#prp-page-image-openseadragon' );
+			$imgCont = $( '#prp-page-image-openseadragon-vertical' );
 		}
 
 		if ( $img === undefined ) {
-			$img = $imgCont.find( 'img' );
+			$img = $( '.prp-page-image' ).find( 'img' );
 		}
 
 		if ( imgHeight === undefined ) {
diff --git a/modules/ve/pageTarget/ve.init.mw.ProofreadPagePageTarget.js b/modules/ve/pageTarget/ve.init.mw.ProofreadPagePageTarget.js
index b027c90f..0ac4b171 100644
--- a/modules/ve/pageTarget/ve.init.mw.ProofreadPagePageTarget.js
+++ b/modules/ve/pageTarget/ve.init.mw.ProofreadPagePageTarget.js
@@ -37,14 +37,15 @@ ve.init.mw.ProofreadPagePageTarget = function VeInitMwProofreadPagePageTarget()
 
 	// eslint-disable-next-line no-jquery/no-global-selector
 	this.$imgCont = $( '.prp-page-image' );
-	this.$imgCont.css( 'display', 'initial' );
+	this.$imgOSDCont = $( '#prp-page-image-openseadragon-vertical' )
+	this.$imgOSDCont.css( 'display', 'initial' );
 
-	this.$imgCont.before( this.$imageZoomDiv );
+	this.$imgOSDCont.before( this.$imageZoomDiv );
 
 	this.$img = this.$imgCont.find( 'img' );
 
-	this.$imgCont.height( this.$imgCont.height() );
-	this.$imgCont.width( this.$imgCont.width() );
+	this.$imgOSDCont.height( this.$img.height() );
+	this.$imgOSDCont.width( this.$img.width() );
 
 	zoomOut = new OO.ui.ButtonWidget( { id: 'prp-page-ve-zoomOut', icon: 'zoomOut', title: ve.msg( 'proofreadpage-button-zoom-out-label' ) } );
 	zoomReset = new OO.ui.ButtonWidget( { id: 'prp-page-ve-zoomReset', icon: 'zoomReset', title: ve.msg( 'proofreadpage-button-reset-zoom-label' ) } );
@@ -102,7 +103,7 @@ ve.init.mw.ProofreadPagePageTarget.prototype.afterActivate = function () {
 		.removeClass( 've-init-mw-desktopArticleTarget-uneditableContent' )
 		.before( this.$zoomButtonsCont );
 
-	this.$imageZoomDiv.removeClass( 've-init-mw-desktopArticleTarget-uneditableContent' ).append( this.$zoomButtonsCont, this.$imgCont );
+	this.$imageZoomDiv.removeClass( 've-init-mw-desktopArticleTarget-uneditableContent' ).append( this.$zoomButtonsCont, this.$imgOSDCont );
 
 	// eslint-disable-next-line no-jquery/no-global-selector
 	$( '.openseadragon-container' ).detach();
@@ -140,7 +141,7 @@ ve.init.mw.ProofreadPagePageTarget.prototype.ensureImageZoomInitialization = fun
 	this.$img.hide();
 
 	this.viewer = OpenSeadragon( {
-		id: 'prp-page-image-openseadragon',
+		id: 'prp-page-image-openseadragon-vertical',
 		zoomInButton: 'prp-page-ve-zoomIn',
 		zoomOutButton: 'prp-page-ve-zoomOut',
 		homeButton: 'prp-page-ve-zoomReset',
-- 
2.25.1