From 20a1aa9be8de3f2b0848011aeb6830b46945efa4 Mon Sep 17 00:00:00 2001
From: Ruslan Kabalin <ruslan.kabalin@gmail.com>
Date: Mon, 27 Nov 2023 19:57:47 +0000
Subject: [PATCH] Fix direction icons for Firefox (and possibly Mac).

Fixes #540
---
 public/js/lib/Browser.js         |  1 +
 public/js/module/photo/fields.js | 18 +++++++++---------
 public/js/module/photo/photo.js  | 11 +++++++++--
 views/module/photo/photo.pug     |  2 +-
 4 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/public/js/lib/Browser.js b/public/js/lib/Browser.js
index 32d698b0a..b0bf54b57 100644
--- a/public/js/lib/Browser.js
+++ b/public/js/lib/Browser.js
@@ -67,6 +67,7 @@ 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 7efd1ddce..18c65c220 100644
--- a/public/js/module/photo/fields.js
+++ b/public/js/module/photo/fields.js
@@ -33,15 +33,15 @@ define(['m/photo/status'], function () {
             aero: 'Аэро/Спутник',
         },
         dirIcons: {
-            n: '&#xf1e0;',
-            ne: '&#xf1e1;',
-            e: '&#xf1df;',
-            se: '&#xf1e4;',
-            s: '&#xf1e3;',
-            sw: '&#xf1e5;',
-            w: '&#xf1e6;',
-            nw: '&#xf1e2;',
-            aero: '&#xe3f7;',
+            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: {
diff --git a/public/js/module/photo/photo.js b/public/js/module/photo/photo.js
index 97a015b8d..b31f466c8 100644
--- a/public/js/module/photo/photo.js
+++ b/public/js/module/photo/photo.js
@@ -7,7 +7,7 @@
 /**
  * Модель страницы фотографии
  */
-define(['underscore', 'Utils', 'socket!', 'Params', 'knockout', 'knockout.mapping', 'm/_moduleCliche', 'globalVM', 'renderer', 'moment', 'noties', 'model/Photo', 'model/Region', 'model/storage', 'm/photo/fields', 'm/photo/status', 'text!tpl/photo/photo.pug', 'css!style/photo/photo', 'bs/ext/multiselect', 'jquery-plugins/imgareaselect'], function (_, Utils, socket, P, ko, koMapping, Cliche, globalVM, renderer, moment, noties, Photo, Region, storage, fields, statuses, pug) {
+define(['underscore', 'Utils', 'Browser', 'socket!', 'Params', 'knockout', 'knockout.mapping', 'm/_moduleCliche', 'globalVM', 'renderer', 'moment', 'noties', 'model/Photo', 'model/Region', 'model/storage', 'm/photo/fields', 'm/photo/status', 'text!tpl/photo/photo.pug', 'css!style/photo/photo', 'bs/ext/multiselect', 'jquery-plugins/imgareaselect'], function (_, Utils, Browser, socket, P, ko, koMapping, Cliche, globalVM, renderer, moment, noties, Photo, Region, storage, fields, statuses, pug) {
     const $window = $(window);
     const imgFailTpl = _.template('<div class="imgFail"><div class="failContent" style="${ style }">${ txt }</div></div>');
     const statusKeys = statuses.keys;
@@ -2230,10 +2230,17 @@ define(['underscore', 'Utils', 'socket!', 'Params', 'knockout', 'knockout.mappin
         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] + '&nbsp;' + fields.dirVals[item],
+                    html: fields.dirIcons[item][iconIndex] + '&nbsp;' + fields.dirVals[item],
                 });
             }
         },
+        getDirIcon: function (dir) {
+            const iconIndex = Browser.support.selectOptionFont ? 0 : 1;
+
+            return fields.dirIcons[dir][iconIndex];
+        },
     });
 });
diff --git a/views/module/photo/photo.pug b/views/module/photo/photo.pug
index eb2095692..580567742 100644
--- a/views/module/photo/photo.pug
+++ b/views/module/photo/photo.pug
@@ -291,7 +291,7 @@
         //ko if: p.dir && p.dir() && p.dir().length
         .info
             span.infoName(data-bind="html: fields.dir+':'")
-            span.direction-icon(data-bind="html: fields.dirIcons[p.dir()]")
+            span.direction-icon(data-bind="html: getDirIcon(p.dir())")
             | &nbsp;
             span(data-bind="text: fields.dirVals[p.dir()]", style="text-transform: lowercase;")
         // /ko