blob: 2a98a5cb90d765d611ef0c337b93760b546fe3b4 [file] [log] [blame]
Copybara854996b2021-09-07 19:36:02 +00001// Copyright 2019 The Chromium Authors. All rights reserved.
2// Use of this source code is governed by a BSD-style license that can be
3// found in the LICENSE file.
4
5import {LitElement, html, css} from 'lit-element';
6
7import 'elements/chops/chops-timestamp/chops-timestamp.js';
8import {connectStore} from 'reducers/base.js';
9import * as sitewide from 'reducers/sitewide.js';
10
11export class MrSiteBanner extends connectStore(LitElement) {
12 /** @override */
13 static get styles() {
14 return css`
15 :host([hidden]) {
16 display: none;
17 }
18 :host {
19 display: block;
20 font-weight: bold;
21 color: var(--chops-field-error-color);
22 background: var(--chops-orange-50);
23 padding: 5px;
24 text-align: center;
25 }
26 `;
27 }
28
29 /** @override */
30 render() {
31 return html`
32 ${this.bannerMessage}
33 ${this.bannerTime ? html`
34 <chops-timestamp
35 .timestamp=${this.bannerTime}
36 ></chops-timestamp>
37 ` : ''}
38 `;
39 }
40
41 /** @override */
42 static get properties() {
43 return {
44 hidden: {
45 type: Boolean,
46 reflect: true,
47 },
48 bannerMessage: {type: String},
49 bannerTime: {type: Number},
50 };
51 }
52
53 /** @override */
54 constructor() {
55 super();
56 this.bannerMessage = '';
57 this.bannerTime = 0;
58 this.hidden = false;
59 }
60
61 /** @override */
62 stateChanged(state) {
63 this.bannerMessage = sitewide.bannerMessage(state);
64 this.bannerTime = sitewide.bannerTime(state);
65 }
66
67 /** @override */
68 updated(changedProperties) {
69 if (changedProperties.has('bannerMessage')) {
70 this.hidden = !this.bannerMessage;
71 }
72 }
73}
74
75customElements.define('mr-site-banner', MrSiteBanner);