[DevTools] make breakpoints better

third_party/WebKit/Source/devtools/front_end/ui/InlineBreakpoint.js

+// 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.
+
+/**
+ * @unrestricted
+ */
+WebInspector.InlineBreakpoint = class extends HTMLSpanElement {
+  constructor() {
+    super();
+  }
+
+  /**
+   * @return {!WebInspector.InlineBreakpoint}
+   */
+  static create() {
+    if (!WebInspector.InlineBreakpoint._constructor)
+      WebInspector.InlineBreakpoint._constructor =
+          registerCustomElement('span', 'inline-breakpoint', WebInspector.InlineBreakpoint.prototype);
+    return /** @type {!WebInspector.InlineBreakpoint} */ (new WebInspector.InlineBreakpoint._constructor());
+  }
+
+  setEnabled(enabled) {
+    if (!enabled)
+      this._swatchInner.classList.add('breakpoint-disabled');
+    else
+      this._swatchInner.classList.remove('breakpoint-disabled');
+  }
+
+  setConditional(conditional) {
+    // different type for never pause here (condition === "false")
+    if (conditional)
+      this._swatchInner.classList.add('inline-condition-breakpoint');
+    else
+      this._swatchInner.classList.remove('inline-condition-breakpoint');
+  }
+
+  /**
+   * @override
+   */
+  createdCallback() {
+    var root = WebInspector.createShadowRootWithCoreStyles(this, 'ui/inlineBreakpoint.css');
+    this._swatchInner = root.createChild('span', 'inline-breakpoint');
+    this._swatchInner.addEventListener('dblclick', (e) => e.consume(), false);
+    this._swatchInner.addEventListener('mousedown', (e) => e.consume(), false);
+  }
+};