From 23f64d03f5740f0378fe763df9d8f7f776d28026 Mon Sep 17 00:00:00 2001
From: thiemowmde <thiemo.kreuz@wikimedia.de>
Date: Thu, 4 Apr 2024 09:00:09 +0200
Subject: [PATCH] Avoid a bit of confusing code duplication in .js code

Change-Id: I0cd203e3b2f7ad2be873b92325b80cde462124a5
---
 resources/js/ext.uls.displaysettings.js |  3 +--
 resources/js/ext.uls.launch.js          | 28 ++++++++++++-------------
 2 files changed, 15 insertions(+), 16 deletions(-)

diff --git a/resources/js/ext.uls.displaysettings.js b/resources/js/ext.uls.displaysettings.js
index 9b566075..9132f388 100644
--- a/resources/js/ext.uls.displaysettings.js
+++ b/resources/js/ext.uls.displaysettings.js
@@ -481,8 +481,7 @@
 			// uls-ui-font-selector-label
 			// uls-content-font-selector-label
 			$fontLabel = this.$template.find( '#' + target + '-font-selector-label' );
-			$fontLabel.empty();
-			$fontLabel.append( $( '<strong>' ) );
+			$fontLabel.empty().append( $( '<strong>' ) );
 
 			// Possible messages:
 			// ext-uls-webfonts-select-for-ui-info
diff --git a/resources/js/ext.uls.launch.js b/resources/js/ext.uls.launch.js
index a72fa005..6bc40ce9 100644
--- a/resources/js/ext.uls.launch.js
+++ b/resources/js/ext.uls.launch.js
@@ -157,34 +157,34 @@ function launchULS( $trigger, languagesObject, forCLS ) {
 		};
 		ulsConfig.onPosition = function () {
 			// Compact language links specific positioning with a caret
-			var top, left, offset, height, width, triangleWidth;
+			var left;
 			// The panel is positioned carefully so that our pointy triangle,
 			// which is implemented as a square box rotated 45 degrees with
 			// rotation origin in the middle. See the corresponding style file.
 
 			// These are for the trigger
-			offset = $trigger.offset();
-			width = $trigger.outerWidth();
-			height = $trigger.outerHeight();
+			var offset = $trigger.offset(),
+				width = $trigger.outerWidth(),
+				height = $trigger.outerHeight();
 
 			// Triangle width is: who knows now, but this still looks fine.
-			triangleWidth = 12;
+			var triangleWidth = 12;
 
+			var isRight = offset.left > $( window ).width() / 2;
 			// selector-{left,right} control which side the caret appears.
 			// It needs to match the positioning of the dialog.
-			if ( offset.left > $( window ).width() / 2 ) {
-				left = offset.left - this.$menu.outerWidth() - triangleWidth;
-				this.$menu.removeClass( 'selector-left' ).addClass( 'selector-right' );
+			this.$menu.toggleClass( 'selector-left', !isRight )
+				.toggleClass( 'selector-right', isRight );
+			if ( isRight ) {
+				left = -this.$menu.outerWidth() - triangleWidth;
 			} else {
-				left = offset.left + width + triangleWidth;
-				this.$menu.removeClass( 'selector-right' ).addClass( 'selector-left' );
+				left = width + triangleWidth;
 			}
-			// Offset from the middle of the trigger
-			top = offset.top + ( height / 2 ) - 27;
 
 			return {
-				left: left,
-				top: top
+				left: offset.left + left,
+				// Offset from the middle of the trigger
+				top: offset.top + ( height / 2 ) - 27
 			};
 		};
 	}