From b2e98fa4aca2626f1816645283794cae3db725dd Mon Sep 17 00:00:00 2001
From: Marcin Lulek <mlulek@rhodecode.com>
Date: Mon, 29 Aug 2016 18:16:14 +0200
Subject: [PATCH] polymer: slim out the styles and change the flow of
 initialization to avoid race conditions

---
 .hgignore                                     |  1 +
 Gruntfile.js                                  | 20 ++++++++++++++-----
 rhodecode/public/css/polymer.less             |  3 ---
 .../js/src/components/root-styles-prefix.html |  3 +++
 ...es-suffix.html => root-styles-suffix.html} |  0
 .../src/components/shared-styles-prefix.html  |  3 ---
 .../my_account/my_account_notifications.html  |  1 -
 rhodecode/templates/base/root.html            |  3 ++-
 8 files changed, 21 insertions(+), 13 deletions(-)
 create mode 100644 rhodecode/public/js/src/components/root-styles-prefix.html
 rename rhodecode/public/js/src/components/{shared-styles-suffix.html => root-styles-suffix.html} (100%)
 delete mode 100644 rhodecode/public/js/src/components/shared-styles-prefix.html

diff --git a/.hgignore b/.hgignore
index 28c1494f..59671bc4 100644
--- a/.hgignore
+++ b/.hgignore
@@ -43,6 +43,7 @@ syntax: regexp
 ^rhodecode/public/css/style-polymer.css$
 ^rhodecode/public/js/scripts.js$
 ^rhodecode/public/js/rhodecode-components.html$
+^rhodecode/public/js/src/components/root-styles.gen.html$
 ^rhodecode\.db$
 ^rhodecode\.log$
 ^rhodecode_dev\.log$
diff --git a/Gruntfile.js b/Gruntfile.js
index 0aa16233..205192ad 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -17,6 +17,16 @@ module.exports = function(grunt) {
       },
     },
     concat: {
+      polymercss:{
+        src: [
+          // Base libraries
+          '<%= dirs.js.src %>/components/root-styles-prefix.html',
+          '<%= dirs.css %>/style-polymer.css',
+          '<%= dirs.js.src %>/components/root-styles-suffix.html'
+        ],
+        dest: '<%= dirs.js.dest %>/src/components/root-styles.gen.html',
+        nonull: true
+      },
       dist: {
         src: [
           // Base libraries
@@ -133,12 +143,12 @@ module.exports = function(grunt) {
 
     watch: {
       less: {
-        files: ["<%= dirs.css %>/*.less"],
-        tasks: ["less:development", 'less:components', "vulcanize"]
+        files: ["<%= dirs.css %>/**/*.less"],
+        tasks: ["less:development", 'less:components', 'concat:polymercss', "vulcanize"]
       },
       js: {
-        files: ["<%= dirs.js.src %>/**/*.js", "<%= dirs.js.src %>/components/*.*"],
-        tasks: ["vulcanize", "concat:dist"]
+        files: ["<%= dirs.js.src %>/**/*.js", "<%= dirs.js.src %>/components/**/*.html"],
+        tasks: ['less:components', 'concat:polymercss', "vulcanize", "concat:dist"]
       }
     },
 
@@ -173,5 +183,5 @@ module.exports = function(grunt) {
   grunt.loadNpmTasks('grunt-crisper');
   grunt.loadNpmTasks('grunt-contrib-copy');
 
-  grunt.registerTask('default', ['less:production', 'less:components', 'copy','vulcanize', 'concat:dist']);
+  grunt.registerTask('default', ['less:production', 'less:components', 'concat:polymercss', 'copy','vulcanize', 'concat:dist']);
 };
diff --git a/rhodecode/public/css/polymer.less b/rhodecode/public/css/polymer.less
index 7e7ec628..fe24a25e 100644
--- a/rhodecode/public/css/polymer.less
+++ b/rhodecode/public/css/polymer.less
@@ -2,10 +2,7 @@
 //--- IMPORTS ------------------//
 @import 'helpers';
 @import 'mixins';
-@import 'rcicons';
-@import 'fonts';
 @import 'variables';
-@import 'type';
 @import 'buttons';
 
 :root {
diff --git a/rhodecode/public/js/src/components/root-styles-prefix.html b/rhodecode/public/js/src/components/root-styles-prefix.html
new file mode 100644
index 00000000..49a5a91b
--- /dev/null
+++ b/rhodecode/public/js/src/components/root-styles-prefix.html
@@ -0,0 +1,3 @@
+<dom-module id="root-styles">
+    <template>
+        <style>
diff --git a/rhodecode/public/js/src/components/shared-styles-suffix.html b/rhodecode/public/js/src/components/root-styles-suffix.html
similarity index 100%
rename from rhodecode/public/js/src/components/shared-styles-suffix.html
rename to rhodecode/public/js/src/components/root-styles-suffix.html
diff --git a/rhodecode/public/js/src/components/shared-styles-prefix.html b/rhodecode/public/js/src/components/shared-styles-prefix.html
deleted file mode 100644
index 1c2dfb57..00000000
--- a/rhodecode/public/js/src/components/shared-styles-prefix.html
+++ /dev/null
@@ -1,3 +0,0 @@
-<dom-module id="shared-styles">
-    <template>
-        <style>
diff --git a/rhodecode/templates/admin/my_account/my_account_notifications.html b/rhodecode/templates/admin/my_account/my_account_notifications.html
index 1a7569f9..72d66111 100644
--- a/rhodecode/templates/admin/my_account/my_account_notifications.html
+++ b/rhodecode/templates/admin/my_account/my_account_notifications.html
@@ -1,5 +1,4 @@
 <template is="dom-bind" id="notificationsPage">
-<style include="shared-styles" is="custom-style"></style>
 <iron-ajax id="toggleNotifications"
            method="post"
            url="${url('my_account_notifications_toggle_visibility')}"
diff --git a/rhodecode/templates/base/root.html b/rhodecode/templates/base/root.html
index 09a844fe..b8a70e82 100644
--- a/rhodecode/templates/base/root.html
+++ b/rhodecode/templates/base/root.html
@@ -60,7 +60,6 @@ c.template_context['visual']['default_renderer'] = h.get_visual_attr(c, 'default
                     }
                 })();
             </script>
-            <link rel="import" href="${h.asset('js/rhodecode-components.html', ver=c.rhodecode_version_hash)}" async>
 
             <script src="${h.asset('js/rhodecode/i18n/%s.js' % c.language, ver=c.rhodecode_version_hash)}"></script>
             <script type="text/javascript">
@@ -104,6 +103,8 @@ c.template_context['visual']['default_renderer'] = h.get_visual_attr(c, 'default
             <![endif]-->
             <script language="javascript" type="text/javascript" src="${h.asset('js/rhodecode/routes.js', ver=c.rhodecode_version_hash)}"></script>
             <script language="javascript" type="text/javascript" src="${h.asset('js/scripts.js', ver=c.rhodecode_version_hash)}"></script>
+            <link rel="import" href="${h.asset('js/rhodecode-components.html', ver=c.rhodecode_version_hash)}">
+            <style include="shared-styles" is="custom-style"></style>
             ## avoide escaping the %N
             <script>CodeMirror.modeURL = "${h.asset('') + 'js/mode/%N/%N.js?ver='+c.rhodecode_version_hash}";</script>