Setup Background Services DevTools UI.
Sets up the side panel elements, and the view that will be used to
render the information. The view consists of the toolbar with the
buttons that will communicate with the DevTools protocol handlers.
This is just the UI without functionality.
UI mocks: https://bugs.chromium.org/p/chromium/issues/detail?id=927726#c6
Bug: 927726
Change-Id: I1d00ad98c481127e57054413db0ed0c298ab6546
Reviewed-on: https://chromium-review.googlesource.com/c/1477253
Commit-Queue: Rayan Kanso <[email protected]>
Reviewed-by: Dmitry Gozman <[email protected]>
Cr-Original-Commit-Position: refs/heads/master@{#634174}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 955610c988beee8289ef73073de721da80c3fc48diff --git a/front_end/resources/BackgroundServiceView.js b/front_end/resources/BackgroundServiceView.js
new file mode 100644
index 0000000..62c2db9
--- /dev/null
+++ b/front_end/resources/BackgroundServiceView.js
@@ -0,0 +1,46 @@
+// Copyright 2019 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.
+
+Resources.BackgroundServiceView = class extends UI.VBox {
+ /**
+ * @param {string} serviceName
+ */
+ constructor(serviceName) {
+ super(true);
+ this.registerRequiredCSS('resources/backgroundServiceView.css');
+
+ /** @const {string} */
+ this._serviceName = serviceName;
+
+ /** @const {!UI.Toolbar} */
+ this._toolbar = new UI.Toolbar('background-service-toolbar', this.contentElement);
+ this._setupToolbar();
+ }
+
+ /**
+ * Creates the toolbar UI element.
+ */
+ _setupToolbar() {
+ const recordButton =
+ new UI.ToolbarToggle(Common.UIString('Toggle Record'), 'largeicon-start-recording', 'largeicon-stop-recording');
+ recordButton.addEventListener(
+ UI.ToolbarButton.Events.Click, () => recordButton.setToggled(!recordButton.toggled()));
+ recordButton.setToggleWithRedColor(true);
+ this._toolbar.appendToolbarItem(recordButton);
+
+ const refreshButton = new UI.ToolbarButton(Common.UIString('Refresh'), 'largeicon-refresh');
+ refreshButton.addEventListener(UI.ToolbarButton.Events.Click, () => {});
+ this._toolbar.appendToolbarItem(refreshButton);
+
+ const clearButton = new UI.ToolbarButton(Common.UIString('Clear'), 'largeicon-clear');
+ clearButton.addEventListener(UI.ToolbarButton.Events.Click, () => {});
+ this._toolbar.appendToolbarItem(clearButton);
+
+ this._toolbar.appendSeparator();
+
+ const deleteButton = new UI.ToolbarButton(Common.UIString('Delete'), 'largeicon-trash-bin');
+ deleteButton.addEventListener(UI.ToolbarButton.Events.Click, () => {});
+ this._toolbar.appendToolbarItem(deleteButton);
+ }
+};
