frontend: Use Polymer 2.0

This commit is contained in:
Marcin Lulek 2018-07-29 14:47:23 +02:00
parent 16fc665e10
commit 3522f323e5
8 changed files with 246 additions and 2546 deletions

View file

@ -3,15 +3,15 @@
"description": "User interface for elements for rhodecode",
"main": "index.html",
"dependencies": {
"webcomponentsjs": "^0.7.22",
"polymer": "Polymer/polymer#^1.6.1",
"paper-button": "PolymerElements/paper-button#^1.0.13",
"paper-spinner": "PolymerElements/paper-spinner#^1.2.0",
"paper-tooltip": "PolymerElements/paper-tooltip#^1.1.2",
"paper-toast": "PolymerElements/paper-toast#^1.3.0",
"paper-toggle-button": "PolymerElements/paper-toggle-button#^1.2.0",
"iron-ajax": "PolymerElements/iron-ajax#^1.4.4",
"iron-autogrow-textarea": "PolymerElements/iron-autogrow-textarea#^1.0.13",
"iron-a11y-keys": "PolymerElements/iron-a11y-keys#^1.0.6"
"webcomponentsjs": "^1.2.3",
"polymer": "Polymer/polymer#^2.6.0",
"paper-button": "PolymerElements/paper-button#^2.1.2",
"paper-spinner": "PolymerElements/paper-spinner#^2.1.0",
"paper-tooltip": "PolymerElements/paper-tooltip#^2.1.1",
"paper-toast": "PolymerElements/paper-toast#^2.1.2",
"paper-toggle-button": "PolymerElements/paper-toggle-button#^2.1.1",
"iron-ajax": "PolymerElements/iron-ajax#^2.1.3",
"iron-autogrow-textarea": "PolymerElements/iron-autogrow-textarea#^2.2.0",
"iron-a11y-keys": "PolymerElements/iron-a11y-keys#^2.1.2"
}
}

View file

@ -15,8 +15,8 @@
"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",
"crisper": "^2.1.1",
"vulcanize": "^1.16.0",
"grunt-crisper": "^1.0.1",
"grunt-vulcanize": "^1.0.0",
"node2nix": "^1.0.0",

View file

@ -33,7 +33,7 @@ var rhodeCodeApp = Polymer({
},
faviconUpdate: function (data) {
this.$$('rhodecode-favicon').counter = data.count;
this.shadowRoot.querySelector('rhodecode-favicon').counter = data.count;
},
/** opens connection to ws server */

View file

@ -1,5 +1,4 @@
<link rel="import" href="../../../../../../bower_components/paper-button/paper-button.html">
<link rel="import" href="../../../../../../bower_components/paper-toast/paper-toast.html">
<link rel="import" href="../../../../../../bower_components/iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
<link rel="import" href="../rhodecode-unsafe-html/rhodecode-unsafe-html.html">
<dom-module id="rhodecode-toast">

View file

@ -3,7 +3,7 @@
<dom-module id="rhodecode-unsafe-html">
<template>
<style include="shared-styles"></style>
<content></content>
<slot></slot>
</template>
<script src="rhodecode-unsafe-html.js"></script>
</dom-module>

File diff suppressed because it is too large Load diff

View file

@ -1,4 +1,5 @@
<template is="dom-bind" id="notificationsPage">
<dom-bind id="notificationsPage">
<template>
<iron-ajax id="toggleNotifications"
method="post"
url="${h.route_path('my_account_notifications_toggle_visibility')}"
@ -60,6 +61,10 @@
</div>
</template>
</dom-bind>
<script type="text/javascript">
/** because im not creating a custom element for this page
* we need to push the function onto the dom-template
@ -81,7 +86,7 @@
var levels = ['info', 'error', 'warning', 'success'];
var level = levels[Math.floor(Math.random()*levels.length)];
function getRandomArbitrary(min, max) {
return parseInt(Math.random() * (max - min) + min);
return parseInt(Math.random() * (max - min) + min);
}
function shuffle(a) {
var j, x, i;
@ -126,5 +131,3 @@
};
</script>
</template>

View file

@ -27,7 +27,7 @@ c.template_context['default_user'] = {
%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="${h.asset('js/vendors/webcomponentsjs/webcomponents-lite.min.js', ver=c.rhodecode_version_hash)}"></script>
<script src="${h.asset('js/vendors/webcomponentsjs/webcomponents-lite.js', ver=c.rhodecode_version_hash)}"></script>
<link rel="import" href="${h.asset('js/rhodecode-components.html', ver=c.rhodecode_version_hash)}">
<title>${self.title()}</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
@ -63,33 +63,6 @@ c.template_context['default_user'] = {
## JAVASCRIPT
<%def name="js()">
<script>
// setup Polymer options
window.Polymer = {lazyRegister: true, dom: 'shadow'};
// Load webcomponentsjs polyfill if browser does not support native Web Components
(function() {
'use strict';
var onload = function() {
// For native Imports, manually fire WebComponentsReady so user code
// can use the same code path for native and polyfill'd imports.
if (!window.HTMLImports) {
document.dispatchEvent(
new CustomEvent('WebComponentsReady', {bubbles: true})
);
}
};
var webComponentsSupported = (
'registerElement' in document
&& 'import' in document.createElement('link')
&& 'content' in document.createElement('template')
);
if (!webComponentsSupported) {
} else {
onload();
}
})();
</script>
<script src="${h.asset('js/rhodecode/i18n/%s.js' % c.language, ver=c.rhodecode_version_hash)}"></script>
<script type="text/javascript">