| Index: dashboard/dashboard/elements/revision-picker.html
|
| diff --git a/dashboard/dashboard/elements/revision-picker.html b/dashboard/dashboard/elements/revision-picker.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..e58ef0ce1e5a57e648e97539b7759eb72c2a9cf8
|
| --- /dev/null
|
| +++ b/dashboard/dashboard/elements/revision-picker.html
|
| @@ -0,0 +1,152 @@
|
| +<!DOCTYPE html>
|
| +<!--
|
| +Copyright 2016 The Chromium Authors. All rights reserved.
|
| +Use of this source code is governed by a BSD-style license that can be
|
| +found in the LICENSE file.
|
| +-->
|
| +
|
| +<link rel="import" href="/components/iron-flex-layout/iron-flex-layout-classes.html">
|
| +<link rel="import" href="/components/paper-button/paper-button.html">
|
| +<link rel="import" href="/components/paper-icon-button/paper-icon-button.html">
|
| +<link rel="import" href="/components/paper-progress/paper-progress.html">
|
| +
|
| +<link rel="import" href="/dashboard/elements/autocomplete-box.html">
|
| +<link rel="import" href="/dashboard/static/simple_xhr.html">
|
| +<link rel="import" href="/dashboard/static/testselection.html">
|
| +
|
| +<dom-module id="revision-picker">
|
| + <template>
|
| + <style include="iron-flex iron-flex-alignment">
|
| + #container * {
|
| + margin-right: 3px;
|
| + }
|
| +
|
| + #dnd-btn {
|
| + padding: 1px 2px;
|
| + margin: 2px 4px 2px 2px;
|
| + font-size: 11px;
|
| + cursor:grabbing;
|
| + cursor:-moz-grabbing;
|
| + cursor:-webkit-grabbing;
|
| + }
|
| +
|
| + paper-button {
|
| + height: 35px;
|
| + }
|
| +
|
| + paper-button:not([disabled]) {
|
| + color: #4285f4;
|
| + }
|
| +
|
| + paper-button[raised]:not([disabled]) {
|
| + background: #4285f4;
|
| + color: #fff;
|
| + }
|
| +
|
| + iron-icon {
|
| + height: 25px;
|
| + }
|
| +
|
| + #suite-description {
|
| + padding: 10px;
|
| + }
|
| +
|
| + #loading {
|
| + display: block;
|
| + position: relative;
|
| + width: 152px;
|
| + height: 35px;
|
| + }
|
| +
|
| + paper-progress {
|
| + display: block;
|
| + position: absolute;
|
| + bottom: -1px;
|
| + height: 1px;
|
| + width: 100%;
|
| + }
|
| + </style>
|
| +
|
| + <div id="container" class="layout horizontal center wrap">
|
| + <template is="dom-repeat" items="{{selectionModels}}">
|
| + <autocomplete-box datalist={{item.datalist}}
|
| + placeholder="{{item.placeholder}}"
|
| + disabled={{item.disabled}}
|
| + multi={{item.multi}}
|
| + on-dropdownselect="onDropdownSelect"
|
| + id="selection-{{index}}"></autocomplete-box>
|
| + </template>
|
| +
|
| + <template is="dom-if" if="{{loading}}">
|
| + <div id="loading">
|
| + <paper-progress indeterminate></paper-progress>
|
| + </div>
|
| + </template>
|
| +
|
| + <paper-button raised
|
| + id="add-graph-btn"
|
| + on-click=""
|
| + disabled$="{{!enableAddSeries}}">Add</paper-button>
|
| + </div>
|
| +
|
| + <div id="suite-description"></div>
|
| + </template>
|
| +
|
| + <script>
|
| + 'use strict';
|
| +
|
| + Polymer({
|
| +
|
| + is: 'revision-picker',
|
| + properties: {
|
| +
|
| + selectionModels: {
|
| + type: Array,
|
| + value: () => ([
|
| + {
|
| + datalist: undefined,
|
| + placeholder: 'Revision Start',
|
| + },
|
| + {
|
| + datalist: undefined,
|
| + placeholder: 'Revision End',
|
| + }
|
| + ])
|
| + },
|
| + xsrfToken: { notify: true }
|
| + },
|
| +
|
| + ready: function() {
|
| + var revisions = this.getRevisions();
|
| + this.set('selectionModels.0.datalist', revisions);
|
| + this.set('selectionModels.1.datalist', revisions);
|
| + this.getSelectionMenu(0).items = this.selectionModels[0].datalist;
|
| + console.log(this.selectionModels);
|
| +
|
| + },
|
| +
|
| + onDropdownSelect: function(event) {
|
| + console.log('winner winner chicken dinner');
|
| + },
|
| +
|
| + getRevisions: function() {
|
| + var revisionItems = [];
|
| + for (var i = 0; i < 1000; i++) {
|
| + var revisionInfo = {
|
| + name: i,
|
| + tag: 'hi'
|
| + };
|
| + revisionItems.push(revisionInfo);
|
| + }
|
| + return revisionItems;
|
| + },
|
| +
|
| + getSelectionMenu: function(index) {
|
| + Polymer.dom.flush();
|
| + return Polymer.dom(this.$.container).children[index];
|
| + },
|
| +
|
| +
|
| + });
|
| + </script>
|
| +</dom-module>
|
|
|
Chromium Code Reviews
Issue 2588203002:
Added in a revision picker with dummy data (Closed)
