[turbolizer] Make the top bar sticky

The top bar was being scrolled down since the whole viewpane was
scrollable. It will now work in the way the "Dissasembly" tab
works: the content is scrollable, but not the pane.

This change makes Schedule and Sequence consistent within the
other panels.

As a drive-by fix, remove some unused constants.

Bug: v8:7327, v8:9517
Notry: true
Change-Id: I22f8abb6524cb297f43930fc8036b36b7ce59751
Reviewed-on: https://chromium-review.googlesource.com/c/v8/v8/+/1863203
Commit-Queue: Santiago Aboy Solanes <solanes@chromium.org>
Reviewed-by: Sigurd Schneider <sigurds@chromium.org>
Cr-Commit-Position: refs/heads/master@{#64347}

tools/turbolizer/src/constants.ts

@@ -14,8 +14,6 @@ export const GENERATED_PANE_ID = 'right';
 export const DISASSEMBLY_PANE_ID = 'disassembly';
 export const DISASSEMBLY_COLLAPSE_ID = 'disassembly-shrink';
 export const DISASSEMBLY_EXPAND_ID = 'disassembly-expand';
-export const COLLAPSE_PANE_BUTTON_VISIBLE = 'button-input';
-export const COLLAPSE_PANE_BUTTON_INVISIBLE = 'button-input-invisible';
 export const UNICODE_BLOCK = '▋';
 export const PROF_COLS = [
   { perc: 0, col: { r: 255, g: 255, b: 255 } },

tools/turbolizer/src/graphmultiview.ts

@@ -106,7 +106,6 @@ export class GraphMultiView extends View {
   displayPhaseView(view: PhaseView, data, selection?: Set<any>) {
     const rememberedSelection = selection ? selection : this.hideCurrentPhase();
     view.initializeContent(data, rememberedSelection);
-    this.divNode.classList.toggle("scrollable", view.isScrollable());
     this.currentPhaseView = view;
   }
 

tools/turbolizer/src/schedule-view.ts

@@ -12,6 +12,7 @@ export class ScheduleView extends TextView {
   createViewElement() {
     const pane = document.createElement('div');
     pane.setAttribute('id', "schedule");
+    pane.classList.add("scrollable");
     return pane;
   }
 

tools/turbolizer/src/sequence-view.ts

@@ -13,6 +13,7 @@ export class SequenceView extends TextView {
   createViewElement() {
     const pane = document.createElement('div');
     pane.setAttribute('id', "sequence");
+    pane.classList.add("scrollable");
     return pane;
   }
 

tools/turbolizer/src/text-view.ts

@@ -247,8 +247,4 @@ export abstract class TextView extends PhaseView {
   }
 
   public onresize(): void {}
-
-  isScrollable() {
-    return true;
-  }
 }

tools/turbolizer/src/view.ts

@@ -30,8 +30,4 @@ export abstract class PhaseView extends View {
   constructor(idOrContainer: string | HTMLElement) {
     super(idOrContainer);
   }
-
-  public isScrollable(): boolean {
-    return false;
-  }
 }

tools/turbolizer/turbo-visualizer.css

@@ -351,6 +351,8 @@ input:hover,
 .viewpane {
   height: 100vh;
   background-color: #FFFFFF;
+  display: flex;
+  flex-direction: column;
 }
 
 .multiview {
@@ -371,19 +373,16 @@ input:hover,
   height: 100%;
 }
 
-.toolbox-anchor {
-  height: 0px;
-}
-
 .graph-toolbox {
   position: relative;
   border-bottom: 2px solid #eee8d5;
   z-index: 5;
-  background: rgba(100%, 100%, 100%, 0.7);
+  background: rgba(100%, 100%, 100%);
   box-sizing: border-box;
   padding: 3px;
   margin-left: 4px;
   margin-right: 4px;
+  overflow-x: hidden;
 }
 
 .disassembly-toolbox {
@@ -511,12 +510,10 @@ text {
 
 #sequence {
   font-family: monospace;
-  margin-top: 50px;
 }
 
 #schedule {
   font-family: monospace;
-  margin-top: 50px;
 }
 
 .schedule-block {