mirror of
https://github.com/wassname/ray.git
synced 2026-07-03 06:36:36 +08:00
Robert Nishihara
f1d4dda8cb
* Start process for monitoring log files and push changes to redis. * Display log files in UI. * Bug fix for recent tasks. * Use flatbuffers to parse local scheduler heartbeats.
141 lines
4.6 KiB
HTML
141 lines
4.6 KiB
HTML
<link rel="import" href="../bower_components/polymer/polymer.html">
|
|
<link rel="import" href="../bower_components/app-layout/app-drawer/app-drawer.html">
|
|
<link rel="import" href="../bower_components/app-layout/app-drawer-layout/app-drawer-layout.html">
|
|
<link rel="import" href="../bower_components/app-layout/app-header/app-header.html">
|
|
<link rel="import" href="../bower_components/app-layout/app-header-layout/app-header-layout.html">
|
|
<link rel="import" href="../bower_components/app-layout/app-scroll-effects/app-scroll-effects.html">
|
|
<link rel="import" href="../bower_components/app-layout/app-toolbar/app-toolbar.html">
|
|
<link rel="import" href="../bower_components/app-route/app-location.html">
|
|
<link rel="import" href="../bower_components/app-route/app-route.html">
|
|
<link rel="import" href="../bower_components/iron-pages/iron-pages.html">
|
|
<link rel="import" href="../bower_components/iron-selector/iron-selector.html">
|
|
<link rel="import" href="../bower_components/paper-icon-button/paper-icon-button.html">
|
|
<link rel="import" href="ray-icons.html">
|
|
|
|
<dom-module id="ray-app">
|
|
<template>
|
|
<style>
|
|
:host {
|
|
--app-primary-color: #4285f4;
|
|
--app-secondary-color: black;
|
|
|
|
display: block;
|
|
}
|
|
|
|
app-header {
|
|
color: #fff;
|
|
background-color: var(--app-primary-color);
|
|
}
|
|
app-header paper-icon-button {
|
|
--paper-icon-button-ink-color: white;
|
|
}
|
|
|
|
.drawer-list {
|
|
margin: 0 20px;
|
|
}
|
|
|
|
.drawer-list a {
|
|
display: block;
|
|
padding: 0 16px;
|
|
text-decoration: none;
|
|
color: var(--app-secondary-color);
|
|
line-height: 40px;
|
|
}
|
|
|
|
.drawer-list a.iron-selected {
|
|
color: black;
|
|
font-weight: bold;
|
|
}
|
|
</style>
|
|
|
|
<app-location route="{{route}}"></app-location>
|
|
<app-route
|
|
route="{{route}}"
|
|
pattern="/:page"
|
|
data="{{routeData}}"
|
|
tail="{{subroute}}"></app-route>
|
|
|
|
<app-drawer-layout fullbleed>
|
|
<!-- Drawer content -->
|
|
<app-drawer id="drawer">
|
|
<app-toolbar>Menu</app-toolbar>
|
|
<iron-selector selected="[[page]]" attr-for-selected="name" class="drawer-list" role="navigation">
|
|
<a name="overview" href="/overview">Overview</a>
|
|
<a name="cluster-health" href="/cluster-health">Cluster Health</a>
|
|
<a name="objects" href="/objects">Objects</a>
|
|
<a name="tasks" href="/tasks">Tasks</a>
|
|
<a name="events" href="/events">Events</a>
|
|
<a name="errors" href="/errors">Errors</a>
|
|
<a name="timeline" href="/timeline">Timeline</a>
|
|
<a name="recent-tasks" href="/recent-tasks">Recent Tasks</a>
|
|
<a name="log-files" href="/log-files">Log Files</a>
|
|
</iron-selector>
|
|
</app-drawer>
|
|
|
|
<!-- Main content -->
|
|
<app-header-layout has-scrolling-region>
|
|
|
|
<app-header condenses reveals effects="waterfall">
|
|
<app-toolbar>
|
|
<paper-icon-button icon="ray-icons:menu" drawer-toggle></paper-icon-button>
|
|
<div main-title>Ray UI</div>
|
|
</app-toolbar>
|
|
</app-header>
|
|
|
|
<iron-pages
|
|
selected="[[page]]"
|
|
attr-for-selected="name"
|
|
fallback-selection="view404"
|
|
role="main">
|
|
<ray-overview name="overview"></ray-overview>
|
|
<ray-cluster-health name="cluster-health"></ray-cluster-health>
|
|
<ray-objects name="objects"></ray-objects>
|
|
<ray-tasks name="tasks"></ray-tasks>
|
|
<ray-events name="events"></ray-events>
|
|
<ray-errors name="errors"></ray-errors>
|
|
<ray-timeline name="timeline"></ray-timeline>
|
|
<ray-recent-tasks name="recent-tasks"></ray-recent-tasks>
|
|
<ray-log-files name="log-files"></ray-log-files>
|
|
<ray-view404 name="view404"></ray-view404>
|
|
</iron-pages>
|
|
</app-header-layout>
|
|
</app-drawer-layout>
|
|
</template>
|
|
|
|
<script>
|
|
Polymer({
|
|
is: 'ray-app',
|
|
|
|
properties: {
|
|
page: {
|
|
type: String,
|
|
reflectToAttribute: true,
|
|
observer: '_pageChanged',
|
|
},
|
|
},
|
|
|
|
observers: [
|
|
'_routePageChanged(routeData.page)',
|
|
],
|
|
|
|
_routePageChanged: function(page) {
|
|
this.page = page || 'overview';
|
|
|
|
if (!this.$.drawer.persistent) {
|
|
this.$.drawer.close();
|
|
}
|
|
},
|
|
|
|
_pageChanged: function(page) {
|
|
// Load page import on demand. Show 404 page if fails
|
|
var resolvedPageUrl = this.resolveUrl('ray-' + page + '.html');
|
|
this.importHref(resolvedPageUrl, null, this._showPage404, true);
|
|
},
|
|
|
|
_showPage404: function() {
|
|
this.page = 'view404';
|
|
},
|
|
});
|
|
</script>
|
|
</dom-module>
|