From 665cb5f63f005fb16c74f242707a09fe12d3d6be Mon Sep 17 00:00:00 2001
From: Ruslan Kabalin <ruslan.kabalin@gmail.com>
Date: Tue, 28 Nov 2023 12:59:57 +0000
Subject: [PATCH] Fix direction icons on Mac.

---
 public/js/lib/Browser.js         |  1 -
 public/js/module/photo/fields.js | 39 ++++++++++++++++++++++----------
 public/js/module/photo/photo.js  |  8 ++-----
 3 files changed, 29 insertions(+), 19 deletions(-)

diff --git a/public/js/lib/Browser.js b/public/js/lib/Browser.js
index b0bf54b57..32d698b0a 100644
--- a/public/js/lib/Browser.js
+++ b/public/js/lib/Browser.js
@@ -67,7 +67,6 @@ define([], function () {
             }()),
             cssAnimation: true,
             chromeframe: false,
-            selectOptionFont: !(uA.indexOf('FIREFOX') >= 0 || navigator.platform.toUpperCase().indexOf('MAC') >= 0),
         },
     };
 
diff --git a/public/js/module/photo/fields.js b/public/js/module/photo/fields.js
index 18c65c220..50d4435bf 100644
--- a/public/js/module/photo/fields.js
+++ b/public/js/module/photo/fields.js
@@ -3,8 +3,34 @@
  * GNU Affero General Public License v3.0+ (see COPYING or https://www.gnu.org/licenses/agpl.txt)
  */
 
-define(['m/photo/status'], function () {
+define(['Browser'], function (Browser) {
+    const dirIcons = {
+        // Arrows are not unified accross browsers and platforms.
+        // The choices we use [default, FF, Mac].
+        n: ['&#xf1e0;', '🡡', '↑'],
+        ne: ['&#xf1e1;', '🡥', '↗'],
+        e: ['&#xf1df;', '🡢', '→'],
+        se: ['&#xf1e4;', '🡦', '↘'],
+        s: ['&#xf1e3;', '🡣', '↓'],
+        sw: ['&#xf1e5;', '🡧', '↙'],
+        w: ['&#xf1e6;', '🡠', '←'],
+        nw: ['&#xf1e2;', '🡤', '↖'],
+        aero: ['&#xe3f7;', '◎', '◎'],
+    };
+
+    const getDirIcon = function (dir) {
+        const iconIndex = Browser.platform.indexOf('MAC') >= 0 ? 2 : Browser.name === 'FIREFOX' ? 1 : 0;
+
+        if (iconIndex === 2 && !(dir === 'e' || dir === 'w' || dir === 'aero')) {
+            // Ugly hack to align text in options on Mac.
+            return dirIcons[dir][iconIndex] + '&nbsp;';
+        }
+
+        return dirIcons[dir][iconIndex];
+    };
+
     return {
+        getDirIcon: getDirIcon,
         s: 'Статус',
         y: 'Год',
         geo: 'Координаты',
@@ -32,17 +58,6 @@ define(['m/photo/status'], function () {
             nw: 'Северо-Запад',
             aero: 'Аэро/Спутник',
         },
-        dirIcons: {
-            n: ['&#xf1e0;', '🡡'],
-            ne: ['&#xf1e1;', '🡥'],
-            e: ['&#xf1df;', '🡢'],
-            se: ['&#xf1e4;', '🡦'],
-            s: ['&#xf1e3;', '🡣'],
-            sw: ['&#xf1e5;', '🡧'],
-            w: ['&#xf1e6;', '🡠'],
-            nw: ['&#xf1e2;', '🡤'],
-            aero: ['&#xe3f7;', '◎'],
-        },
         dirValsArr: ['w', 'nw', 'n', 'ne', 'e', 'se', 's', 'sw', 'aero'],
         watersign: {
             'title': 'Подпись на вотермарке',
diff --git a/public/js/module/photo/photo.js b/public/js/module/photo/photo.js
index b31f466c8..1290bfbce 100644
--- a/public/js/module/photo/photo.js
+++ b/public/js/module/photo/photo.js
@@ -2230,17 +2230,13 @@ define(['underscore', 'Utils', 'Browser', 'socket!', 'Params', 'knockout', 'knoc
         setDirOptionHTML: function (option, item) {
             // Render option content as html to decode entitites.
             if (item !== undefined) {
-                const iconIndex = Browser.support.selectOptionFont ? 0 : 1;
-
                 ko.applyBindingsToNode(option, {
-                    html: fields.dirIcons[item][iconIndex] + '&nbsp;' + fields.dirVals[item],
+                    html: fields.getDirIcon(item) + '&nbsp;' + fields.dirVals[item],
                 });
             }
         },
         getDirIcon: function (dir) {
-            const iconIndex = Browser.support.selectOptionFont ? 0 : 1;
-
-            return fields.dirIcons[dir][iconIndex];
+            return fields.getDirIcon(dir);
         },
     });
 });