github.com/siglens/siglens@v0.0.0-20240328180423-f7ce9ae441ed/static/dashboard.html (about)

     1  <!DOCTYPE html>
     2  <html lang="en">
     3  
     4  <script async src="https://www.googletagmanager.com/gtag/js?id=G-5SBJC04YFB"></script>
     5  <script>
     6      window.dataLayer = window.dataLayer || [];
     7      function gtag(){dataLayer.push(arguments);}
     8      gtag('js', new Date());
     9  
    10      gtag('config', 'G-5SBJC04YFB');
    11  </script>
    12  
    13  <head>
    14      <meta charset="UTF-8" />
    15      <title>SigLens</title>
    16  
    17      <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    18      <link rel="apple-touch-icon" sizes="180x180" href="assets/apple-touch-icon.png" />
    19      <link rel="icon" type="image/png" sizes="32x32" href="assets/favicon-32x32.png" />
    20      <link rel="icon" type="image/png" sizes="16x16" href="assets/favicon-16x16.png" />
    21      <link rel="manifest" href="assets/site.webmanifest" />
    22      <link rel="mask-icon" href="assets/safari-pinned-tab.svg" color="#5bbad5" />
    23      <meta name="msapplication-TileColor" content="#da532c" />
    24  
    25      <link rel="stylesheet" href="./css/lib/bootstrap.min.css" />
    26      <link rel="stylesheet" href="./css/lib/all.min.css" />
    27      <link rel="stylesheet" href="./css/lib/ag-grid.min.css" />
    28      <link rel="stylesheet" href="//code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css" />
    29      <link rel="stylesheet" href="./css/dashboard.css" />
    30      <link rel="stylesheet" href="./css/siglens.css" />
    31  
    32  
    33      <script src="https://cdn.jsdelivr.net/npm/uuid@8.3.2/dist/umd/uuidv4.min.js"></script>
    34      <script src="./js/lib/lodash.min.js"></script>
    35      <script src="./js/lib/jquery-3.6.0.min.js"></script>
    36      <script src="./js/lib/jquery-ui.min.js"></script>
    37      <script src="./js/lib/js.cookie.min.js"></script>
    38      <script src="./js/lib/moment.min.js"></script>
    39      <script src="./js/lib/date_fns.min.js"></script>
    40      <script src="./js/lib/popper.min.js"></script>
    41      <script src="./js/lib/bootstrap.bundle.min.js"></script>
    42      <script src="./js/lib/ag-grid-community.min.noStyle.js"></script>
    43      <script src="./js/lib/echarts.min.js"></script>
    44      {{ .RunCheck1 | safeHTML }}
    45  </head>
    46  
    47  <body data-theme="light" class="classBody">
    48      <div id="app-container">
    49          <div id="app-side-nav">
    50          </div>
    51          <div id="new-dashboard">
    52              <div class="header-container">
    53                  <div class="dashboard-names">
    54                      <span class="panView-goToDB" title="Go back">&#8592</span>
    55                      <h4 class="all-dashboards" id="all-dashboards-text">All Dashboards</h4>
    56                      <span>></span>
    57                      <h3 class="name-dashboard"></h3>
    58                  </div>
    59                  <div class="btn-container">
    60                      <div class="dropdown">
    61                          <button class="btn dropdown-toggle btn-top index-btn-show" type="button" id="date-picker-btn" data-toggle="dropdown"
    62                              aria-haspopup="true" aria-expanded="false" data-bs-toggle="dropdown" title="Pick the time window">
    63                              <span>Time Picker</span>
    64                              <img class="dropdown-arrow orange" src="assets/arrow-btn.svg" alt="expand">
    65                              <img class="dropdown-arrow blue" src="assets/up-arrow-btn-light-theme.svg" alt="retract">
    66                          </button>
    67                          <div class="dropdown-menu daterangepicker" aria-labelledby="index-btn" id="daterangepicker ">
    68                              <p class="dt-header">Search the last</p>
    69                              <div class="ranges">
    70                                  <div class="inner-range">
    71                                      <div id="now-5m" class="db-range-item">5 Mins</div>
    72                                      <div id="now-3h" class="db-range-item">3 Hrs</div>
    73                                      <div id="now-2d" class="db-range-item">2 Days</div>
    74                                  </div>
    75                                  <div class="inner-range">
    76                                      <div id="now-15m" class="db-range-item">15 Mins</div>
    77                                      <div id="now-6h" class="db-range-item">6 Hrs</div>
    78                                      <div id="now-7d" class="db-range-item">7 Days</div>
    79                                  </div>
    80                                  <div class="inner-range">
    81                                      <div id="now-30m" class="db-range-item">30 Mins</div>
    82                                      <div id="now-12h" class="db-range-item">12 Hrs</div>
    83                                      <div id="now-30d" class="db-range-item">30 Days</div>
    84                                  </div>
    85                                  <div class="inner-range">
    86                                      <div id="now-1h" class="db-range-item">1 Hr</div>
    87                                      <div id="now-24h" class="db-range-item">24 Hrs</div>
    88                                      <div id="now-90d" class="db-range-item">90 Days</div>
    89                                  </div>
    90                                  <hr>
    91                                  </hr>
    92                                  <div class="dt-header">Custom Search <span id="reset-timepicker" type="reset">Reset</span></div>
    93                                  <div id="daterange-from"> <span id="dt-from-text"> From</span> <br />
    94                                      <input type="date" id="date-start" />
    95                                      <input type="time" id="time-start" value="00:00" />
    96                                  </div>
    97                                  <div id="daterange-to"> <span id="dt-to-text"> To </span> <br />
    98                                      <input type="date" id="date-end">
    99                                      <input type="time" id="time-end" value="00:00">
   100                                  </div>
   101                                  <div class="drp-buttons">
   102                                      <button class="applyBtn btn btn-sm btn-primary" id="customrange-btn" type="button">Apply</button>
   103                                  </div>
   104                              </div>
   105                          </div>
   106                      </div>
   107                      <button class="btn dropdown-dash" id="save-db-btn" title="Save dashboard">
   108                      </button>
   109                      <button class="btn settings-btn" title="Dashboard settings">
   110                      </button>
   111                      <div class="refresh-container">
   112                          <button class="btn refresh-btn" title="Refresh dashboard">
   113                          </button>
   114                          <div class="dropdown">
   115                              <button class="btn dropdown-toggle" type="button" id="refresh-picker-btn"
   116                                  data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
   117                                  data-bs-toggle="dropdown">
   118                                  <span></span>
   119                                  <img class="dropdown-arrow orange" src="assets/arrow-btn.svg" alt="expand">
   120                                  <img class="dropdown-arrow blue" src="assets/up-arrow-btn-light-theme.svg" alt="retract">
   121                              </button>
   122                              <div class="dropdown-menu refresh-picker" aria-labelledby="index-btn" id="refresh-picker ">
   123                                  <div class="ranges">
   124                                      <div id="0" class="refresh-range-item">Off</div>
   125                                      <div id="5m" class="refresh-range-item">5m</div>
   126                                      <div id="30m" class="refresh-range-item">30m</div>
   127                                      <div id="1h" class="refresh-range-item">1h</div>
   128                                      <div id="5h" class="refresh-range-item">5h</div>
   129                                      <div id="1d" class="refresh-range-item">1d</div>
   130                                  </div>
   131                              </div>
   132                          </div>
   133                      </div>
   134                      <button class="btn" id="add-panel-btn" title="Add panel">
   135                          <span>
   136                              <img src="./assets/add-icon.svg" class="add-icon" alt="add icon"/> </span>Add Panel
   137                      </button>
   138                  </div>
   139              </div>
   140  
   141              <div id="panel-container">
   142              </div>
   143  
   144              <div id="viewPanel-container">
   145              </div>
   146          </div>
   147          <div class="popupOverlay">
   148          </div>
   149          <div id="panel-del-prompt" class="popupContent">
   150              <h3 class="header">Confirmation</h3>
   151              <div class="prompt-text-container">
   152                  <div class="delete-db-text">Are you sure you want to delete this Panel?</div>
   153              </div>
   154              <div id="buttons-db-prompt">
   155                  <button type="button" id="cancel-btn-panel">Cancel</button>
   156                  <button type="button" id="delete-btn-panel">Delete</button>
   157              </div>
   158          </div>
   159          <div id="app-footer">2023 &copy; SigLens</div>
   160      </div>
   161      <div class="panelEditor-container">
   162          <div class="panelEditorLeft">
   163              <div class="panEdit-navBar">
   164                  <div>
   165                      <span class="panEdit-goToDB" title="Go back">&#8592</span>
   166                      <span class="panEdit-dbName over-title">DBName</span>
   167                      <span class="over-title"> / </span>
   168                      <span class="panelTitle over-title">Panel 1</span>
   169                  </div>
   170  
   171                  <div class="navbar-options">
   172                      <div class="dropdown">
   173                          <button class="btn dropdown-toggle btn-top" type="button" id="index-btn" data-toggle="dropdown"
   174                              aria-haspopup="true" aria-expanded="false" data-bs-toggle="dropdown"
   175                              title="Index Name to search on" style="display: none;">
   176                              <span>Index</span>
   177                              <img class="dropdown-arrow orange" src="assets/arrow-btn.svg" alt="expand">
   178                              <img class="dropdown-arrow blue" src="assets/up-arrow-btn-light-theme.svg" alt="retract">
   179                          </button>
   180                          <div class="dropdown-menu box-shadow" aria-labelledby="index-btn" id="available-indexes">
   181                              <div id="index-listing"></div>
   182                          </div>
   183                          <button class="btn dropdown-toggle btn-top" type="button" id="date-picker-btn" data-toggle="dropdown"
   184                              aria-haspopup="true" aria-expanded="false" data-bs-toggle="dropdown"
   185                              title="Pick the time window">
   186                              <span>Time Picker</span>
   187                              <img class="dropdown-arrow orange" src="assets/arrow-btn.svg" alt="expand">
   188                              <img class="dropdown-arrow blue" src="assets/up-arrow-btn-light-theme.svg" alt="retract">
   189                          </button>
   190                          <div class="dropdown-menu daterangepicker" aria-labelledby="index-btn" id="daterangepicker ">
   191                              <p class="dt-header">Search the last</p>
   192                              <div class="ranges">
   193                                  <div class="inner-range">
   194                                      <div id="now-5m" class="db-range-item">5 Mins</div>
   195                                      <div id="now-3h" class="db-range-item">3 Hrs</div>
   196                                      <div id="now-2d" class="db-range-item">2 Days</div>
   197                                  </div>
   198                                  <div class="inner-range">
   199                                      <div id="now-15m" class="db-range-item">15 Mins</div>
   200                                      <div id="now-6h" class="db-range-item">6 Hrs</div>
   201                                      <div id="now-7d" class="db-range-item">7 Days</div>
   202                                  </div>
   203                                  <div class="inner-range">
   204                                      <div id="now-30m" class="db-range-item">30 Mins</div>
   205                                      <div id="now-12h" class="db-range-item">12 Hrs</div>
   206                                      <div id="now-30d" class="db-range-item">30 Days</div>
   207                                  </div>
   208                                  <div class="inner-range">
   209                                      <div id="now-1h" class="db-range-item">1 Hr</div>
   210                                      <div id="now-24h" class="db-range-item">24 Hrs</div>
   211                                      <div id="now-90d" class="db-range-item">90 Days</div>
   212                                  </div>
   213                                  <hr>
   214                                  </hr>
   215                                  <div class="dt-header">Custom Search <span id="reset-timepicker"
   216                                          type="reset">Reset</span></div>
   217                                  <div id="daterange-from"> <span id="dt-from-text"> From</span> <br />
   218                                      <input type="date" id="date-start" />
   219                                      <input type="time" id="time-start" value="00:00" />
   220                                  </div>
   221                                  <div id="daterange-to"> <span id="dt-to-text"> To </span> <br />
   222                                      <input type="date" id="date-end">
   223                                      <input type="time" id="time-end" value="00:00">
   224                                  </div>
   225                                  <div class="drp-buttons">
   226                                      <button class="applyBtn btn btn-sm btn-primary" id="customrange-btn"
   227                                          type="button">Apply</button>
   228                                  </div>
   229                              </div>
   230                          </div>
   231                      </div>
   232                      <div class="table-view-toggle-container btn">
   233                          <label class="label-table-view">Table view</label>
   234                          <label class="switch">
   235                              <input type="checkbox" id="toggle-switch">
   236                              <span class="slider round"></span>
   237                          </label>
   238                      </div>
   239                  </div>
   240              </div>
   241              <div class="panelDisplay">
   242                  <div id="panEdit-panel" class="panEdit-panel"></div>
   243                  <div id="panelLogResultsGrid" class="panelLogResultsGrid ag-theme-mycustomtheme"></div>
   244                  <div id="empty-response"></div>
   245                  <div class="big-number-display-container"></div>
   246  
   247                  <div id="corner-popup">
   248                      <div class="corner-container">
   249                          <div class="corner-text"></div>
   250                      </div>
   251                  </div>
   252                  <div class="panel-info-corner"><i class="fa fa-info" aria-hidden="true" id="panel-desc-info"></i></div>
   253              </div>
   254              <div class="queryInputs">
   255                  <div class="dropDown-container">
   256                      <div class="dropDownTitle dropDown-dataSource active">
   257                          <span>Data Source</span>
   258                          <div class="caret"></div>
   259                      </div>
   260                      <ul class="editPanelMenu editPanelMenu-dataSource">
   261                          <div class="editPanelMenu-options logs-options" id="datasource-options" data-index="0">
   262                              <li data-value="Metrics">Metrics</li>
   263                          </div>
   264                          <div class="editPanelMenu-options logs-options" id="datasource-options" data-index="1">
   265                              <li data-value="Logs">Logs</li>
   266                          </div>
   267                          <div class="editPanelMenu-options logs-options" id="datasource-options" data-index="2">
   268                              <li data-value="Traces">Traces</li>
   269                          </div>
   270                      </ul>
   271                  </div>
   272                  <div class="queryInput-container">
   273                      <div class="queryInput-InnerContainer">
   274                          <input type="text" name="" id="query-input-box" class="queryInput"
   275                              placeholder="Query Input Box">
   276                          <div class="position-relative search-bar-container">
   277                              <i class="fa fa-info-circle position-absolute info-icon" rel="tooltip"
   278                                  id="info-icon-metrics" style="display: none;" title="avg by (color) (testmetric0)
   279                                  max by (car_type) (testmetric0)
   280                                  min by (model) (testmetric0)
   281                                  rate(testmetric0{color=&quot;blue&quot;}[6h])
   282                                  deriv(testmetric0{color=&quot;green&quot;}[6h])
   283                                  deriv(testmetric0[7d])">
   284                              </i>
   285                              <i class="fa fa-info-circle position-absolute info-icon" rel="tooltip" id="info-icon-sql"
   286                                  style="display: none;" title=' SELECT MAX(latency), COUNT(city) FROM `*` GROUP BY country, gender LIMIT 10
   287                                  SELECT * FROM `ind-0`
   288                                  SELECT * FROM `ind-0` ORDER BY latency ASC
   289                                  SELECT first_name AS firstnames, country AS origincountry FROM `ind-0`
   290                                  SELECT MAX(latency), COUNT(city) FROM `*` WHERE gender = male GROUP BY country LIMIT 10
   291                                  SELECT * FROM `*` WHERE app_name = Wheataccount AND gender = male LIMIT 10'></i>
   292  
   293                              <i class="fa fa-info-circle position-absolute info-icon" rel="tooltip" id="info-icon-logQL"
   294                                  style="display: none;" title=' {app="mysql",name="mysql-backup"}
   295                                      {job="mysql"} |= "error"
   296                                      {name="cassandra"} |~ error=\w+
   297                                      {job="mysql"} |= "error" != "timeout"
   298                                      {job="mysql"} |= "error" | json | line_format "&lbrace;{.err}&rbrace;"
   299                          '></i>
   300                              <i class="fa fa-info-circle position-absolute info-icon" rel="tooltip" id="info-icon-spl"
   301                                  style="display: none;" title=' app_version!=2.14.2 AND weekday=T*day
   302                              city=Boston | stats count, avg(latency) BY weekday, http_method
   303                              city=Boston | stats avg(latency) AS Avg BY weekday | eval Millis=Avg / 1000, Millis=Millis . " ms"
   304                              city=Boston | ```This is a comment``` fields http*
   305                              http_method=POST | regex city="^[a-zA-Z]+\s[a-zA-Z]+$" | fields city
   306                              city=Boston | stats count AS Count BY weekday | where Count / 2 > 6 OR weekday = "Saturday"
   307                          '></i>
   308                          </div>
   309                          <div>
   310                              <button class="btn dropdown-toggle" type="button" id="query-language-btn"
   311                                  data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
   312                                  data-bs-toggle="dropdown" title="Select Query Type" style="display: none;">
   313                                  <span>Splunk QL</span>
   314                                  <img class="dropdown-arrow orange" src="assets/arrow-btn.svg" alt="expand">
   315                                  <img class="dropdown-arrow blue" src="assets/up-arrow-btn-light-theme.svg" alt="retract">
   316                              </button>
   317                              <div class="dropdown-menu box-shadow" aria-labelledby="index-btn"
   318                                  id="query-language-options">
   319                                  <li id="option-1" class="panEdit-query-language-option">SQL</li>
   320                                  <li id="option-2" class="panEdit-query-language-option">Log QL</li>
   321                                  <li id="option-3" class="panEdit-query-language-option active">Splunk QL</li>
   322                              </div>
   323                          </div>
   324                          <div>
   325                              <button class="btn dropdown-toggle" type="button" id="metrics-query-language-btn"
   326                                  data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
   327                                  data-bs-toggle="dropdown" title="Select Query Type" style="display: none;">
   328                                  <span>PromQL</span>
   329                                  <img class="dropdown-arrow orange" src="assets/arrow-btn.svg" alt="expand">
   330                                  <img class="dropdown-arrow blue" src="assets/up-arrow-btn-light-theme.svg" alt="retract">
   331                              </button>
   332                              <div class="dropdown-menu box-shadow" aria-labelledby="index-btn"
   333                                  id="query-language-options">
   334                                  <li id="option-0" class="panEdit-query-language-option active">PromQL</li>
   335                              </div>
   336                          </div>
   337                      </div>
   338                      <button type="submit" id="run-query-btn" class="btn-runQuery">Run Query</button>
   339                  </div>
   340  
   341              </div>
   342          </div>
   343          <div class="panelEditorRight">
   344              <div class="panEdit-navBtns">
   345                  <button class="btn settings-btn panEdit-btn" title="Open dashboard settings">
   346                  </button>
   347                  <button class="panEdit-btn panEdit-discard" id="discard-btn" title="Undo all changes">Discard</button>
   348                  <button class="panEdit-btn panEdit-save" id="save-btn"
   349                      title="Apply changes and save dashboard">Save</button>
   350                  <button class="panEdit-btn panEdit-apply" id="apply-btn"
   351                      title="Apply changes and go to dashboard">Apply</button>
   352              </div>
   353              <div class="panelEditorRightTop">
   354                  <h3 class="title1">Panel Options</h3>
   355                  <div class="panEdit-nameChange">
   356                      <input type="text" id="panEdit-nameChangeInput">
   357                  </div>
   358                  <div class="panEdit-descrChange">
   359                      <textarea name="" id="panEdit-descrChangeInput" rows="4"></textarea>
   360                  </div>
   361                  <div class="dropDownTitle dropDown-chart active" title="Click to change the chart type">
   362                      <span>Chart Type</span>
   363                      <div class="caret"></div>
   364                  </div>
   365                  <ul class="editPanelMenu editPanelMenu-chart">
   366                      <div class="editPanelMenu-options chart-options" id="chart-type-options" data-index="0">
   367                          <img src="./assets/line-chart.svg" alt="line chart icon" class="chart-display" />
   368                          <li>Line Chart</li>
   369                      </div>
   370                      <div class="editPanelMenu-options chart-options" id="chart-type-options" data-index="1">
   371                          <img src="./assets/bar-chart.svg" alt="bar chart icon" class="chart-display"/>
   372                          <li>Bar Chart</li>
   373                      </div>
   374                      <div class="editPanelMenu-options chart-options" id="chart-type-options" data-index="2">
   375                          <img src="./assets/pie-chart.svg" alt="pie chart icon" class="chart-display"/>
   376                          <li>Pie Chart</li>
   377                      </div>
   378                      <div class="editPanelMenu-options chart-options" id="chart-type-options" data-index="3">
   379                          <img src="./assets/data-table.svg" alt="data table icon" class="chart-display"/>
   380                          <li>Data Table</li>
   381                      </div>
   382                      <div class="editPanelMenu-options chart-options" id="chart-type-options" data-index="4">
   383                          <img src="./assets/number-chart.svg" alt="number chart icon" class="chart-display" />
   384                          <li>Number</li>
   385                      </div>
   386                      <div class="editPanelMenu-options chart-options" id="chart-type-options" data-index="5">
   387                          <img src="./assets/log-lines.svg" alt="log lines icon" class="chart-display" />
   388                          <li>Log Lines</li>
   389                      </div>
   390                  </ul>
   391                  <div class="dropDownTitle dropDown-color active">
   392                      <span>Color Palette</span>
   393                      <div class="caret"></div>
   394                  </div>
   395                  <div class="editPanelMenu editPanelMenu-color">
   396                      <span class="span-colorCircles">Classic</span>
   397                      <div class="colorCircles">
   398                          <div class="colorCircle colorCircle-1"></div>
   399                          <div class="colorCircle colorCircle-2"></div>
   400                          <div class="colorCircle colorCircle-3"></div>
   401                      </div>
   402                      <span class="span-colorLine">Green-Yellow-Red [by Value]</span>
   403                      <div class="colorLine colorLine-gyr"></div>
   404                      <span class="span-colorLine">Blue-Green [by Value]</span>
   405                      <div class="colorLine colorLine-bg"></div>
   406                  </div>
   407                  <div class="dropDownTitle dropDown-unit active">
   408                      <span>Unit</span>
   409                      <div class="caret"></div>
   410                  </div>
   411                  <div id="nestedDropDownContainer">
   412                      <ul class="editPanelMenu editPanelMenu-unit">
   413                          <div class="editPanelMenu-unit-options" id="nestedMiscDropDown" data-index="0">
   414                              <li class="dropDown-misc-options">
   415                                  <span>Misc</span>
   416                              </li>
   417                              <div class="horizontalCaret"></div>
   418                          </div>
   419                          <div class="editPanelMenu-unit-options" id="nestedDataDropDown" data-index="1">
   420                              <li class="dropDown-data-options">
   421                                  <span>Data</span>
   422                              </li>
   423                              <div class="horizontalCaret"></div>
   424                          </div>
   425                          <div class="editPanelMenu-unit-options" id="nestedThroughputDropDown" data-index="2">
   426                              <li class="dropDown-throughput-options">
   427                                  <span>Throughput</span>
   428                              </li>
   429                              <div class="horizontalCaret"></div>
   430                          </div>
   431                          <div class="editPanelMenu-unit-options" id="nestedTimeDropDown" data-index="3">
   432                              <li class="dropDown-time-options">
   433                                  <span>Time</span>
   434                              </li>
   435                              <div class="horizontalCaret"></div>
   436                          </div>
   437                          <div class="editPanelMenu-unit-options" id="nestedDataRateDropDown" data-index="4">
   438                              <li class="dropDown-data-rate-options">
   439                                  <span>Data Rate</span>
   440                              </li>
   441                              <div class="horizontalCaret"></div>
   442                          </div>
   443                      </ul>
   444                      <ul class="editPanelMenu editPanelMenu-inner-options" id="miscOptionsDropDown">
   445                          <div class="misc-options inner-options" data-index="0">
   446                              <li>none</li>
   447                          </div>
   448                          <div class="misc-options inner-options" data-index="1">
   449                              <li>percent(0-100)</li>
   450                          </div>
   451                      </ul>
   452                      <ul class="editPanelMenu editPanelMenu-inner-options" id="dataOptionsDropDown">
   453                          <div class="data-options inner-options" data-index="0">
   454                              <li>Bytes</li>
   455                          </div>
   456                          <div class="data-options inner-options" data-index="1">
   457                              <li>kB</li>
   458                          </div>
   459                          <div class="data-options inner-options" data-index="2">
   460                              <li>MB</li>
   461                          </div>
   462                          <div class="data-options inner-options" data-index="3">
   463                              <li>GB</li>
   464                          </div>
   465                          <div class="data-options inner-options" data-index="4">
   466                              <li>TB</li>
   467                          </div>
   468                          <div class="data-options inner-options" data-index="5">
   469                              <li>PB</li>
   470                          </div>
   471                          <div class="data-options inner-options" data-index="6">
   472                              <li>EB</li>
   473                          </div>
   474                          <div class="data-options inner-options" data-index="7">
   475                              <li>ZB</li>
   476                          </div>
   477                          <div class="data-options inner-options" data-index="8">
   478                              <li>YB</li>
   479                          </div>
   480                      </ul>
   481                      <ul class="editPanelMenu editPanelMenu-inner-options" id="throughputOptionsDropDown">
   482                          <div class="throughput-options inner-options" data-index="0">
   483                              <li>counts/sec</li>
   484                          </div>
   485                          <div class="throughput-options inner-options" data-index="1">
   486                              <li>writes/sec</li>
   487                          </div>
   488                          <div class="throughput-options inner-options" data-index="2">
   489                              <li>reads/sec</li>
   490                          </div>
   491                          <div class="throughput-options inner-options" data-index="3">
   492                              <li>requests/sec</li>
   493                          </div>
   494                          <div class="throughput-options inner-options" data-index="4">
   495                              <li>ops/sec</li>
   496                          </div>
   497                      </ul>
   498                      <ul class="editPanelMenu editPanelMenu-inner-options" id="timeOptionsDropDown">
   499                          <div class="time-options inner-options" data-index="0">
   500                              <li>hertz(1/s)</li>
   501                          </div>
   502                          <div class="time-options inner-options" data-index="1">
   503                              <li>nanoseconds(ns)</li>
   504                          </div>
   505                          <div class="time-options inner-options" data-index="2">
   506                              <li>microsecond(µs)</li>
   507                          </div>
   508                          <div class="time-options inner-options" data-index="3">
   509                              <li>milliseconds(ms)</li>
   510                          </div>
   511                          <div class="time-options inner-options" data-index="4">
   512                              <li>seconds(s)</li>
   513                          </div>
   514                          <div class="time-options inner-options" data-index="5">
   515                              <li>minutes(m)</li>
   516                          </div>
   517                          <div class="time-options inner-options" data-index="6">
   518                              <li>hours(h)</li>
   519                          </div>
   520                          <div class="time-options inner-options" data-index="7">
   521                              <li>days(d)</li>
   522                          </div>
   523                      </ul>
   524                      <ul class="editPanelMenu editPanelMenu-inner-options" id="dataRateOptionsDropDown">
   525                          <div class="data-rate-options inner-options" data-index="0">
   526                              <li>packets/sec</li>
   527                          </div>
   528                          <div class="data-rate-options inner-options" data-index="1">
   529                              <li>bytes/sec</li>
   530                          </div>
   531                          <div class="data-rate-options inner-options" data-index="2">
   532                              <li>bits/sec</li>
   533                          </div>
   534                          <div class="data-rate-options inner-options" data-index="3">
   535                              <li>kilobytes/sec</li>
   536                          </div>
   537                          <div class="data-rate-options inner-options" data-index="4">
   538                              <li>kilobits/sec</li>
   539                          </div>
   540                          <div class="data-rate-options inner-options" data-index="5">
   541                              <li>megabytes/sec</li>
   542                          </div>
   543                          <div class="data-rate-options inner-options" data-index="6">
   544                              <li>megabits/sec</li>
   545                          </div>
   546                          <div class="data-rate-options inner-options" data-index="7">
   547                              <li>gigabytes/sec</li>
   548                          </div>
   549                          <div class="data-rate-options inner-options" data-index="8">
   550                              <li>gigabits/sec</li>
   551                          </div>
   552                          <div class="data-rate-options inner-options" data-index="9">
   553                              <li>terabytes/sec</li>
   554                          </div>
   555                          <div class="data-rate-options inner-options" data-index="10">
   556                              <li>terabits/sec</li>
   557                          </div>
   558                          <div class="data-rate-options inner-options" data-index="11">
   559                              <li>petabytes/sec</li>
   560                          </div>
   561                          <div class="data-rate-options inner-options" data-index="12">
   562                              <li>petabits/sec</li>
   563                          </div>
   564                      </ul>
   565                  </div>
   566                  <div class="dropDownTitle dropDown-logLinesView active">
   567                      <span>Single line display view</span>
   568                      <div class="caret"></div>
   569                  </div>
   570                  <ul class="editPanelMenu editPanelMenu-logLinesView" id="editPanelMenu-logLinesView">
   571                      <div class="editPanelMenu-options" id="logLinesView-options" data-index="0">
   572                          <li>Single line display view</li>
   573                      </div>
   574                      <div class="editPanelMenu-options" id="logLinesView-options" data-index="1">
   575                          <li>Multi line display view</li>
   576                      </div>
   577                  </ul>
   578              </div>
   579          </div>
   580          <div class="popupOverlay">
   581          </div>
   582          <div id="panel-edit-prompt" class="popupContent">
   583              <h3 class="header">Confirmation</h3>
   584              <div class="prompt-text-container">
   585                  <div class="edit-db-text">You have unsaved changes. Are you sure you want to exit?</div>
   586              </div>
   587              <div id="buttons-db-prompt">
   588                  <button type="button" id="cancel-btn-panel">Cancel</button>
   589                  <button type="button" id="exit-btn-panel">Discard and Exit</button>
   590              </div>
   591          </div>
   592      </div>
   593      <div class="dbSet-container">
   594          <div class="dbSet-navBar">
   595              <div>
   596                  <span class="dbSet-goToDB" title="Go back">&#8592</span>
   597                  <span class="dbSet-name">DBName</span>
   598              </div>
   599              <div>
   600                  <button class="panEdit-btn" id="dbSet-discard" title="Discard Changes">Discard</button>
   601                  <button class="panEdit-btn" id="dbSet-save" title="Save Changes">Save</button>
   602              </div>
   603          </div>
   604          <div class="dbSet-body">
   605              <div class="dbSet-left">
   606                  <div class="dbSet-nav">
   607                      <span class="dbSet-heading">Settings</span>
   608                  </div>
   609                  <div class="dbSet-options">
   610                      <span class="dbSet-general">General</span>
   611                      <span class="dbSet-jsonModel">JSON Model</span>
   612                  </div>
   613              </div>
   614              <div class="dbSet-right">
   615                  <div class="dbSet-generalHTML">
   616                      <div class="dbSet-inputContainer" id="dbSet-nameContainer">
   617                          <label for="dbSet-dbName">Name</label>
   618                          <input type="text" class="dbSet-dbName" placeholder="Name">
   619                      </div>
   620  <!-- PopupOverlay elements -->
   621  <div class="popupOverlay"></div>
   622  <div class="popupContent" id="error-message-popup">
   623      <h3 class="header">Error</h3>
   624      <p id="error-message"></p>
   625      <div id="buttons-popupContent">
   626          <button type="button" id="error-ok-btn">OK</button>
   627      </div>
   628  </div>
   629  
   630                      <div class="dbSet-inputContainer" id="dbSet-descrContainer">
   631                          <label for="dbSet-dbDescr">Description</label>
   632                          <textarea class="dbSet-dbDescr" id="dbSet-dbDescr" placeholder="Description"></textarea>
   633                      </div>
   634                      <div class="dbSet-saveBtnContainer">
   635                      </div>
   636                  </div>
   637                  <div class="dbSet-jsonModelHTML">
   638                      <span class="dbSet-jsonModelTitle">JSON Model</span>
   639                      <div class="dbSet-textareaContainer">
   640                          <textarea class="dbSet-jsonModelData"
   641                              placeholder="{'field 1':'value 1',\n 'field 2': 'value 2'}" disabled></textarea>
   642                          <div class="copy" title="Copy"></div>
   643                      </div>
   644                  </div>
   645              </div>
   646          </div>
   647      </div>
   648  
   649  
   650      <script src="./js/lib/chart.umd.min.js"></script>
   651      <script src="./js/common.js?cb=1_1_10"></script>
   652      <script src="./js/navbar.js?cb=1_1_10"></script>
   653      <script src="./js/event-handlers.js?cb=1_1_10"></script>
   654      <script src="./js/available-fields.js?cb=1_1_10"></script>
   655      <script src="./js/log-results-grid.js?cb=1_1_10"></script>
   656      <script src="./js/ag-grid-seg-stats.js?cb=1_1_10"></script>
   657      <script src="./js/date-picker.js?cb=1_1_10"></script>
   658      <script src="./js/saved-query.js?cb=1_1_10"></script>
   659      <script src="./js/index.js?cb=1_1_10"></script>
   660      <script src="./js/dashboard-charts.js?cb=1_1_10"></script>
   661      <script src="./js/dashboard.js?cb=1_1_10"></script>
   662      <script src="./js/edit-panel-screen.js?cb=1_1_10"></script>
   663      <script src="./js/dashboard-logs-results-grid.js?cb=1_1_10"></script>
   664      <script src="./component/upper-navbar/upper-navbar.js"></script>
   665  
   666      {{ .RunCheck2 | safeHTML }}
   667      {{ .RunCheck3 | safeHTML }}
   668  </body>
   669  
   670  </html>