veyron-browser: Upgrading Polymer to the lastest verion and fixing
breaking changes. Also since Polymer now has a spinner component
removing our custom paper-loading web component and using paper-spinner
instead.
Change-Id: I97568ea293d495fce46da878870d79b8bfa58ce9
diff --git a/.gitignore b/.gitignore
index 11f9724..b6b14d5 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,8 +2,7 @@
bower_components/
go/pkg/
public/bundle.*
-public/platform.*
-public/polymer.*
+public/webcomponents.js
npm-debug.log
go/bin/
*.vdl.go
diff --git a/Makefile b/Makefile
index f5692ae..8b7ffa5 100644
--- a/Makefile
+++ b/Makefile
@@ -29,7 +29,7 @@
VDL_FILES = $(shell find go -name "*.vdl")
# Builds everything.
-all: directories public/bundle.js public/bundle.html public/platform.js public/platform.js.map public/polymer.js.map
+all: directories public/bundle.js public/bundle.html public/webcomponents.js
# Creating the bundle JS file.
public/bundle.js: $(BROWSERIFY_FILES) node_modules
@@ -41,14 +41,8 @@
:;vulcanize --output public/bundle.html web-component-dependencies.html --inline
# Copies the web components platform file.
-public/platform.js: bower_components
- cp bower_components/platform/platform.js public/platform.js
-
-public/platform.js.map: bower_components
- cp bower_components/platform/platform.js.map public/platform.js.map
-
-public/polymer.js.map: bower_components
- cp bower_components/polymer/polymer.js.map public/polymer.js.map
+public/webcomponents.js: bower_components
+ cp bower_components/webcomponentsjs/webcomponents.js public/webcomponents.js
# Install what we need from NPM.
node_modules: package.json
@@ -96,8 +90,7 @@
# Clean all build artifacts.
clean:
rm -f public/bundle.*
- rm -f public/platform.*
- rm -f public/polymer.*
+ rm -f public/webcomponents.js
rm -rf node_modules
rm -rf go/bin
rm -rf bower_components
diff --git a/bower.json b/bower.json
index e8ac722..a322029 100644
--- a/bower.json
+++ b/bower.json
@@ -1,8 +1,8 @@
{
"name": "veyron-browser",
"dependencies": {
- "polymer": "Polymer/polymer#~0.4.0",
- "core-elements": "Polymer/core-elements#~0.4.0",
- "paper-elements": "Polymer/paper-elements#~0.4.0"
+ "polymer": "Polymer/polymer#~0.5.1",
+ "core-elements": "Polymer/core-elements#~0.5.1",
+ "paper-elements": "Polymer/paper-elements#~0.5.1"
}
}
diff --git a/public/index.html b/public/index.html
index e2cc225..8c64701 100644
--- a/public/index.html
+++ b/public/index.html
@@ -8,7 +8,7 @@
<meta name="description" content="">
<link href='//fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
<title>Veyron Browser</title>
- <script src="platform.js"></script>
+ <script src="webcomponents.js"></script>
<link rel="import" href="bundle.html">
<head>
<body fullbleed>
diff --git a/src/components/browse/index.css b/src/components/browse/index.css
index 4af6e36..98ec674 100644
--- a/src/components/browse/index.css
+++ b/src/components/browse/index.css
@@ -173,6 +173,11 @@
.search-box {
white-space: nowrap;
+ width: var(--size-input-width-normal);
+}
+
+.search-box core-tooltip {
+ width: 100%;
}
.search-box .icon, .namespace-box .icon {
@@ -205,11 +210,11 @@
color: inherit;
}
-paper-autocomplete.autocomplete {
- width: 16em;
+paper-autocomplete {
+ width: var(--size-input-width-normal);
}
-paper-autocomplete.autocomplete::shadow #suggest-box {
+paper-autocomplete::shadow #suggest-box {
background-color: var(--color-grey-light);
}
diff --git a/src/components/browse/item-details/index.css b/src/components/browse/item-details/index.css
index c95afb2..ea6f1f9 100644
--- a/src/components/browse/item-details/index.css
+++ b/src/components/browse/item-details/index.css
@@ -36,8 +36,6 @@
color: var(--color-bright);
display: inline-block;
margin: 0.5em;
- padding-top: 0.3em;
- padding-bottom: 0.3em;
}
.method-output table, .method-output th {
diff --git a/src/components/browse/item-details/index.js b/src/components/browse/item-details/index.js
index 391eece..95798b1 100644
--- a/src/components/browse/item-details/index.js
+++ b/src/components/browse/item-details/index.js
@@ -80,7 +80,10 @@
var tabContent;
if(state.showLoadingIndicator) {
- tabContent = h('paper-loading');
+ tabContent = h('paper-spinner', {
+ 'active': new AttributeHook(true),
+ 'aria-label': new AttributeHook('Loading')
+ });
} else if(state.item) {
var detailsContent = renderDetailsContent(state, events);
diff --git a/src/components/common-style/defaults.css b/src/components/common-style/defaults.css
index c0673dd..b93862a 100644
--- a/src/components/common-style/defaults.css
+++ b/src/components/common-style/defaults.css
@@ -26,6 +26,10 @@
display: none;
}
-paper-loading {
+paper-spinner {
margin: var(--size-space-xsmall);
-}
\ No newline at end of file
+}
+
+::shadow paper-input-decorator {
+ padding: 0;
+}
diff --git a/src/components/common-style/sizes.css b/src/components/common-style/sizes.css
index dd67ed9..8cb8ca0 100644
--- a/src/components/common-style/sizes.css
+++ b/src/components/common-style/sizes.css
@@ -14,4 +14,6 @@
--size-space-normal: 1em;
--size-space-large: 1.25em;
--size-space-xlarge: 1.5em;
+
+ --size-input-width-normal: 16em;
}
diff --git a/src/components/viewport/index.js b/src/components/viewport/index.js
index 10d7fa9..39185d0 100644
--- a/src/components/viewport/index.js
+++ b/src/components/viewport/index.js
@@ -61,7 +61,10 @@
insertCss(css);
if(!state.navigation.pageKey) {
- return mercury.h('paper-loading');
+ return mercury.h('paper-spinner', {
+ 'active': new AttributeHook(true),
+ 'aria-label': new AttributeHook('Loading')
+ });
}
var panelAttributes = {
diff --git a/src/lib/web-components/paper-loading/paper-loading.css b/src/lib/web-components/paper-loading/paper-loading.css
deleted file mode 100644
index f4f4c03..0000000
--- a/src/lib/web-components/paper-loading/paper-loading.css
+++ /dev/null
@@ -1,32 +0,0 @@
-:host {
- display: inline-block;
- box-sizing: border-box;
- white-space: nowrap;
-}
-
-.frame {
- display: flex;
- align-items: center;;
-}
-
-.label {
- margin-left: 5px;
-}
-
-.screen-reader {
- position: absolute !important;
- top: -1000px !important;
- left: -1000px !important;
- width: 0px !important;
- height: 0px !important;
-}
-
-.spinner {
- display: inline-block;
- width: 16px;
- height: 16px;
- background-size: contain;
- background-repeat: no-repeat;
- background-position: top left;
- background-image: url(data:image/gif;base64,R0lGODlhEwATAPf/AECsUvozM/FoKv20tN4jH2HFer3HUBOXjftlZRG1af2jo//qpmtvzvy4R/L5+v/z8sS8PVNWrou3SXmi+vZyUm6b+cE3Vzq/iN7MSwSra+769H3WrPuTZVNlx/tcXJ26+/3OmUTFibPPeVeL+fKcMtTPXf2VlYis+vH79v/XXKu7Rg2TdwezYwCbU2S1UQCkWISD0rEvS//eemNUpySrWCSJt70bGfT3/9ZgK2PPneKmIPudUeiIIeb16f2SkoVGhP/gg/eiOACUT3lLkPaEO//99dpsLv3JeP/YYTRy5f/VV/UpJPdTKzl48yB7tP/4+PRHJb+y2v3ESv2xbabB/CS7dYrbtf/78P/ss/C9NVbLlU9x44swVP/ffv3+//n6/6zG/PpCQv/rrSprzv/++uvq90iA+P2amv/ccv7z6/H2///u7tDclGSzwu0iIv/+/YhgpvY9KtK+Qf/kj6uDta88ZupCSfC4NFC3rv/LSUFm0/vGRnnLu0DEhl6o06h8rvz+/Zbfvf/LbU6E+PrJQ+ArIgSkV81JJfHx+/39/liU6mae7CiBxrwoOP/uuxKnVx2rh5g+bzyL2yS0YQSYXuby9+v1+JbC6PvLXDmRxPyxm/GzM/qoSy951+I3KQCuXTt29frMRPgkJACpWvvNRTJs4jt39/UjI//UT/G+N94eHjZx6tEcHCpj0P/+/v7//v///i1m1v7+/6C9/PoqKvj9+uGmHyto00yD+KDhwv/9/YPZsf7//x66cn/Yrvx5eaoUFErHjRq5b3Kd+rXM/PtSUv/88/s6Ojh77ej19uZOKf/09JTAUkKTxjh+4zS+fQevXG+/ZeqYOvKBLEC6YzR84zZ86sRIaJUmPiqhmaBHfxGwXOEmL+wnLvrNRJhlm2KQ9cVxkfyRkTB71//48vhePbLhtNkxQCZxw+zNSn+15Jug4N53MZvRg+3RXOq9OIPTnFtfv/v+/MW53gejbP/wwYBaqWiV96Kn4ha3bDx4+EF7+ACxX//TS/okJP///yH/C05FVFNDQVBFMi4wAwEAAAAh/wtYTVAgRGF0YVhNUDw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo3Q0VBMjk3MUQ4QzMxMUUxOTFCMzg4RDhFRjBGMkQ2QiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo3Q0VBMjk3MkQ4QzMxMUUxOTFCMzg4RDhFRjBGMkQ2QiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjdDRUEyOTZGRDhDMzExRTE5MUIzODhEOEVGMEYyRDZCIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjdDRUEyOTcwRDhDMzExRTE5MUIzODhEOEVGMEYyRDZCIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1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)
-}
\ No newline at end of file
diff --git a/src/lib/web-components/paper-loading/paper-loading.html b/src/lib/web-components/paper-loading/paper-loading.html
deleted file mode 100644
index 1bb4f07..0000000
--- a/src/lib/web-components/paper-loading/paper-loading.html
+++ /dev/null
@@ -1,36 +0,0 @@
-<!--
-
-`paper-loading` displays a loading spinner with optional label beside it.
-If label not specified, an off-screen text that reads 'loading' will be inserted
-for better screen-reader accessibility.
-
-Example:
- <paper-loading></paper-loading>
- <paper-loading label="Loading items..."></paper-loading>
-
--->
-<polymer-element name="paper-loading" attributes="label">
- <template>
- <link href="paper-loading.css" rel="stylesheet">
- <div class="frame">
- <span class="spinner"></span>
- <template if="{{label !== null}}">
- <span class="label">{{ label }}</span>
- </template>
- <template if="{{label === null}}">
- <span class="screen-reader">Loading</span>
- </template>
- </div>
- </template>
- <script>
- Polymer({
- /**
- * Label to display beside loading spinner
- *
- * @attribute: label
- * @type: string | null
- */
- label: null
- });
- </script>
-</polymer-element>
\ No newline at end of file
diff --git a/web-component-dependencies.html b/web-component-dependencies.html
index 0b79d5b..6dc457a 100644
--- a/web-component-dependencies.html
+++ b/web-component-dependencies.html
@@ -22,7 +22,7 @@
<link rel="import" href="bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="bower_components/paper-input/paper-input.html">
<link rel="import" href="bower_components/paper-item/paper-item.html">
+<link rel="import" href="bower_components/paper-spinner/paper-spinner.html">
<link rel="import" href="bower_components/paper-tabs/paper-tabs.html">
<link rel="import" href="bower_components/paper-toast/paper-toast.html">
-<link rel="import" href="src/lib/web-components/paper-autocomplete/paper-autocomplete.html">
-<link rel="import" href="src/lib/web-components/paper-loading/paper-loading.html">
\ No newline at end of file
+<link rel="import" href="src/lib/web-components/paper-autocomplete/paper-autocomplete.html">
\ No newline at end of file
