Flip header image horizontally on RTL pages

[rails.git] / app / assets / javascripts / application.js

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index 7d5b99f601e54ef8eacd9882c766a4305be356eb..ebb0ff5808b65c6cd7d287d7e9dd40a2c83757aa 100644 (file)
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -1,18 +1,17 @@
-//= require jquery
+//= require jquery3
 //= require jquery_ujs
 //= require jquery.timers
 //= require jquery.cookie
 //= require jquery.throttle-debounce
 //= require bootstrap.tooltip
 //= require bootstrap.dropdown
-//= require augment
 //= require osm
 //= require leaflet
 //= require leaflet.osm
 //= require leaflet.map
 //= require leaflet.zoom
 //= require leaflet.locationfilter
-//= require i18n/translations
+//= require i18n
 //= require oauth
 //= require piwik
 //= require richtext
@@ -79,18 +78,6 @@ $(document).ready(function () {
   var headerWidth = 0,
       compactWidth = 0;
 
-  $("header").children(":visible").each(function (i,e) {
-    headerWidth = headerWidth + $(e).outerWidth();
-  });
-
-  $("body").addClass("compact");
-
-  $("header").children(":visible").each(function (i,e) {
-    compactWidth = compactWidth + $(e).outerWidth();
-  });
-
-  $("body").removeClass("compact");
-
   function updateHeader() {
     var windowWidth = $(window).width();
 
@@ -103,9 +90,29 @@ $(document).ready(function () {
     }
   }
 
-  updateHeader();
+  /*
+   * Chrome 60 and later seem to fire the "ready" callback
+   * before the DOM is fully ready causing us to measure the
+   * wrong sizes for the header elements - use a 0ms timeout
+   * to defer the measurement slightly as a workaround.
+   */
+  setTimeout(function () {
+    $("header").children(":visible").each(function (i,e) {
+      headerWidth = headerWidth + $(e).outerWidth();
+    });
+
+    $("body").addClass("compact");
+
+    $("header").children(":visible").each(function (i,e) {
+      compactWidth = compactWidth + $(e).outerWidth();
+    });
+
+    $("body").removeClass("compact");
+
+    updateHeader();
 
-  $(window).resize(updateHeader);
+    $(window).resize(updateHeader);
+  }, 0);
 
   $("#menu-icon").on("click", function(e) {
     e.preventDefault();