# HG changeset patch
# User Marcin Lulek <mlulek@rhodecode.com>
# Date 2016-08-23 10:55:23
# Node ID 5d204bcee2fb39e2a2af2563f1047091f1ccf7bd
# Parent  3cb906bd5ab1a18d59d19b9f6a31210e94003c8d

polymer: introduce webcomponents to rhodecode

diff --git a/.hgignore b/.hgignore
--- a/.hgignore
+++ b/.hgignore
@@ -23,6 +23,7 @@ syntax: regexp
 ^_dev
 ^._dev
 ^build/
+^bower_components/
 ^coverage\.xml$
 ^data$
 ^\.eggs/
diff --git a/Gruntfile.js b/Gruntfile.js
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -8,7 +8,14 @@ module.exports = function(grunt) {
         "dest": "rhodecode/public/js"
       }
     },
-
+    copy: {
+      main: {
+        expand: true,
+        cwd: 'bower_components',
+        src: 'webcomponentsjs/**',
+        dest: '<%= dirs.js.dest %>/vendors',
+      },
+    },
     concat: {
       dist: {
         src: [
@@ -120,7 +127,7 @@ module.exports = function(grunt) {
         tasks: ["less:production"]
       },
       js: {
-        files: ["<%= dirs.js.src %>/**/*.js"],
+        files: ["<%= dirs.js.src %>/**/*.js", "<%= dirs.js.src %>/components/*.*"],
         tasks: ["concat:dist"]
       }
     },
@@ -132,6 +139,19 @@ module.exports = function(grunt) {
           jshintrc: '.jshintrc'
         }
       }
+    },
+    vulcanize: {
+      default: {
+        options: {
+          abspath: '',
+          inlineScripts: true,
+          inlineCss: true,
+          stripComments: true
+        },
+        files: {
+          '<%= dirs.js.dest %>/rhodecode-components.html': '<%= dirs.js.src %>/components/shared-components.html'
+        }
+      }
     }
   });
 
@@ -139,6 +159,9 @@ module.exports = function(grunt) {
   grunt.loadNpmTasks('grunt-contrib-concat');
   grunt.loadNpmTasks('grunt-contrib-watch');
   grunt.loadNpmTasks('grunt-contrib-jshint');
+  grunt.loadNpmTasks('grunt-vulcanize');
+  grunt.loadNpmTasks('grunt-crisper');
+  grunt.loadNpmTasks('grunt-contrib-copy');
 
-  grunt.registerTask('default', ['less:production', 'concat:dist']);
+  grunt.registerTask('default', ['copy','vulcanize', 'less:production', 'concat:dist']);
 };
diff --git a/package.json b/package.json
--- a/package.json
+++ b/package.json
@@ -3,10 +3,15 @@
   "version": "0.0.1",
   "devDependencies": {
     "grunt": "^0.4.5",
+    "grunt-contrib-copy": "^1.0.0",
     "grunt-contrib-concat": "^0.5.1",
     "grunt-contrib-jshint": "^0.12.0",
     "grunt-contrib-less": "^1.1.0",
     "grunt-contrib-watch": "^0.6.1",
+    "crisper": "^2.0.2",
+    "vulcanize": "^1.14.8",
+    "grunt-crisper": "^1.0.1",
+    "grunt-vulcanize": "^1.0.0",
     "jshint": "^2.9.1-rc3"
   }
 }
diff --git a/rhodecode/public/js/src/components/shared-components.html b/rhodecode/public/js/src/components/shared-components.html
new file mode 100644
--- /dev/null
+++ b/rhodecode/public/js/src/components/shared-components.html
@@ -0,0 +1,4 @@
+<link rel="import" href="../../../../../bower_components/paper-toggle-button/paper-toggle-button.html">
+<link rel="import" href="../../../../../bower_components/paper-toast/paper-toast.html">
+<link rel="import" href="../../../../../bower_components/paper-tooltip/paper-tooltip.html">
+<link rel="import" href="../../../../../bower_components/paper-button/paper-button.html">
diff --git a/rhodecode/templates/base/root.html b/rhodecode/templates/base/root.html
--- a/rhodecode/templates/base/root.html
+++ b/rhodecode/templates/base/root.html
@@ -82,6 +82,25 @@ c.template_context['visual']['default_re
             <!--[if lt IE 9]>
             <script language="javascript" type="text/javascript" src="${h.asset('js/excanvas.min.js')}"></script>
             <![endif]-->
+            <script>
+                // setup Polymer options
+                window.Polymer = {lazyRegister: true, dom: 'shadow'};
+
+                // load webcomponents polyfills
+                (function() {
+                    if ('registerElement' in document
+                            && 'import' in document.createElement('link')
+                            && 'content' in document.createElement('template')) {
+                        // browser has web components
+                    } else {
+                        // polyfill web components
+                        var e = document.createElement('script');
+                        e.src = '${h.asset('js/vendors/webcomponentsjs/webcomponents-lite.min.js', ver=c.rhodecode_version_hash)}';
+                        document.head.appendChild(e);
+                    }
+                })();
+            </script>
+            <link rel="import" href="${h.asset('js/rhodecode-components.html', ver=c.rhodecode_version_hash)}">
             <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>
             ## avoide escaping the %N