Websites/perf.webkit.org/public/v2/index.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4     <meta charset="utf-8">
   5     <title>WebKit Performance Monitor (Beta)</title>
   6
   7     <link rel="prefetch" href="../data/manifest.json">
   8     <script type="application/json" src="../data/manifest.json"></script>
   9
  10     <link rel="stylesheet" href="app.css">
  11     <link rel="stylesheet" href="chart-pane.css">
  12
  13     <script src="js/jquery.min.js" defer></script>
  14     <script src="js/jquery.min.js" defer></script>
  15     <script src="js/handlebars.js" defer></script>
  16     <script src="js/ember.js" defer></script>
  17     <script src="js/ember-data.js" defer></script>
  18     <script src="js/d3/d3.min.js" defer></script>
  19     <script src="js/statistics.js" defer></script>
  20     <script src="data.js" defer></script>
  21     <script src="app.js" defer></script>
  22     <script src="manifest.js" defer></script>
  23     <script src="analysis.js" defer></script>
  24     <script src="popup.js" defer></script>
  25     <script src="interactive-chart.js" defer></script>
  26     <script src="commits-viewer.js" defer></script>
  27
  28     <script type="text/x-handlebars" data-template-name="dashboard">
  29         <header id="header">
  30             {{partial "navbar"}}
  31             {{view App.NumberOfDaysControlView tagName="ul" numberOfDays=numberOfDays}}
  32             <ul class="controls">
  33                 <li>
  34                     <a href="#" class="control-button" {{action toggleEditMode}}>
  35                         {{#if controller.editMode}}
  36                             Finish editing
  37                         {{else}}
  38                             Edit
  39                         {{/if}}
  40                     </a>
  41                 </li>
  42             </ul>
  43         </header>
  44
  45         <table {{bind-attr class=":dashboard editMode:editMode:readonly"}}>
  46         <thead>
  47             <tr>
  48                 <td></td>
  49                 {{#each headerColumns}}
  50                     {{#if controller.editMode}}
  51                         <th>
  52                             <a href="#" title="Remove column" {{action "removeColumn" index}}>
  53                                 {{partial "close-button"}}
  54                             </a>
  55                             {{input value=label}}
  56                         </th>
  57                     {{else}}
  58                         <th>{{label}}</th>
  59                     {{/if}}
  60                 {{/each}}
  61                 {{#if controller.editMode}}
  62                     <td>{{input value=newColumnHeader action="addColumn" placeholder="Add a column"}}</td>
  63                 {{/if}}
  64             </tr>
  65         </thead>
  66         <tbody>
  67             {{#each rows}}
  68                 <tr>
  69                     {{#if controller.editMode}}
  70                         <th>
  71                             <a href="#" title="Remove row" {{action "removeRow" this}}>
  72                                 {{partial "close-button"}}
  73                             </a>
  74                             {{input value=header}}
  75                         </th>
  76                     {{else}}
  77                         <th><span class="label">{{header}}</span></th>
  78                     {{/if}}
  79                     {{#each cells}}
  80                         <td>
  81                             {{#if empty}}
  82                                 {{#if controller.editMode}}
  83                                     {{view App.PopupView list=pickerData label='Choose'}}
  84                                 {{/if}}
  85                             {{else}}
  86                                 {{#if chartData}}
  87                                     <div class="dashboard-status">
  88                                         {{#if latestStatus}}
  89                                             {{latestStatus.currentValue}} {{chartData.unit}}
  90                                             {{#if latestStatus.label}}
  91                                                 <span {{bind-attr class=":status-label latestStatus.className"}}>{{latestStatus.label}}</span>
  92                                             {{/if}}
  93                                         {{/if}}
  94                                     </div>
  95                                     {{#link-to 'charts' (query-params paneList=paneList since=controller.since)}}
  96                                         {{interactive-chart
  97                                             chartData=chartData
  98                                             domain=controller.sharedDomain
  99                                             enableSelection=false}}
 100                                     {{/link-to}}
 101                                 {{else}}
 102                                     {{#if failure}}
 103                                         <div class="failure">{{failure}}</div>
 104                                     {{else}}
 105                                         <div class="progress">{{partial "spinner"}}</div>
 106                                     {{/if}}
 107                                 {{/if}}
 108                                 {{#if controller.editMode}}
 109                                     <a href="#" title="Reset pane" class="reset" {{action "resetPane" this}}>
 110                                         {{partial "close-button"}}
 111                                     </a>
 112                                 {{/if}}
 113                             {{/if}}
 114                         </td>
 115                     {{/each}}
 116                     {{#if controller.editMode}}
 117                         <td></td>
 118                     {{/if}}
 119                 </tr>
 120             {{/each}}
 121             {{#if controller.editMode}}
 122                 <tr>
 123                     <td>{{input value=newRowHeader action="addRow" placeholder="Add a row"}}</td>
 124                     {{#each emptyRow}}
 125                         <td></td>
 126                     {{/each}}
 127                     <td></td>
 128                 </tr>
 129             {{/if}}
 130         </tbody>
 131         </table>
 132     </script>
 133
 134     <script type="text/x-handlebars" data-template-name="charts">
 135         <header id="header">
 136             {{partial "navbar"}}
 137             <ul class="controls">
 138                 <li>{{view App.PopupView list=platforms label='Add pane'}}</li>
 139             </ul>
 140             <ul class="controls">
 141                 <li>{{view App.StartTimeSliderView startTime=startTime oldestStartTime=oldestStartTime}}</li>
 142             </ul>
 143         </header>
 144
 145         {{#each panes itemController="pane"}}
 146             <section class="chart-pane" tabindex="0">
 147                 <header>
 148                     <h1 {{action "toggleDetails"}}>{{metric.fullName}} - {{ platform.name}}</h1>
 149                     <a href="#" title="Close" class="close-button" {{action "close"}}>{{partial "close-button"}}</a>
 150                     {{#if movingAverageStrategies}}
 151                         <a href="#" title="Statistical Tools" class="stat-button" {{action "toggleStatPane"}}>{{partial "stat-button"}}</a>
 152                     {{/if}}
 153                     {{#if App.Manifest.bugTrackers}}
 154                         <a href="#" title="Analysis" class="bugs-button" {{action "toggleBugsPane"}}>
 155                             {{partial "analysis-button"}}
 156                         </a>
 157                     {{/if}}
 158                     {{#if App.Manifest.repositoriesWithReportedCommits}}
 159                         <a href="#" title="Search" class="search-button" {{action "toggleSearchPane"}}>{{partial "search-button"}}</a>
 160                     {{/if}}
 161                 </header>
 162
 163                 <div class="body">
 164                     <div class="svg-container">
 165                     {{#if chartData}}
 166                         {{interactive-chart
 167                             chartData=chartData
 168                             ranges=analyticRanges
 169                             domain=mainPlotDomain
 170                             interactive=true
 171                             chartPointRadius=2
 172                             currentItem=hoveredOrSelectedItem
 173                             currentTime=sharedTime
 174                             selectedItem=selectedItem
 175                             highlightedItems=highlightedItems
 176                             rangeRoute="analysisTask"
 177                             selection=timeRange
 178                             selectedPoints=selectedPoints
 179                             showFullYAxis=showFullYAxis
 180                             zoomable=true
 181                             zoom="zoomed"}}
 182                     {{else}}
 183                         {{#if failure}}
 184                             <div class="failure">{{failure}}</div>
 185                         {{else}}
 186                             <div class="progress">{{partial "spinner"}}</div>
 187                         {{/if}}
 188                     {{/if}}
 189                     </div>
 190                     <div class="details">
 191                         <div class="overview">
 192                         {{#if chartData}}
 193                             {{interactive-chart
 194                                 chartData=chartData
 195                                 showYAxis=false
 196                                 domain=overviewDomain
 197                                 selection=overviewSelection}}
 198                         {{/if}}
 199                         </div>
 200                         <div class="details-table-container">
 201                             {{partial "chart-details"}}
 202                         </div>
 203                     </div>
 204                 </div>
 205
 206                 <div {{bind-attr class=":popup-pane :analysis-pane showingAnalysisPane::hidden"}}>
 207                     <label>Name: {{input type=text value=newAnalysisTaskName}}</label>
 208                     <button {{action "createAnalysisTask"}} {{bind-attr disabled=cannotAnalyze}}>Analyze</button>
 209                 </div>
 210
 211                 <form {{bind-attr class=":popup-pane :search-pane showingSearchPane::hidden"}}>
 212                     <span class="repositories">
 213                         {{view Ember.Select
 214                             content=App.Manifest.repositoriesWithReportedCommits
 215                             optionValuePath='content.id'
 216                             optionLabelPath='content.name'
 217                             selection=commitSearchRepository}}
 218                     </span>
 219                     {{input action="searchCommit" placeholder="Name or email" value=commitSearchKeyword}}
 220                 </form>
 221
 222                 {{partial "stat-pane"}}
 223             </section>
 224         {{/each}}
 225     </script>
 226
 227     <script type="text/x-handlebars" data-template-name="components/interactive-chart">
 228         {{#if interactive}}
 229             <div class="selection-toolbar" style="display: none;">
 230                 <a href="#" class="button" {{action "zoom"}}>
 231                     <svg class="zoom" viewBox="0 0 100 100">
 232                         <g stroke-width="0" stroke="none">
 233                             <polygon points="25,25 5,50 25,75"/>
 234                             <polygon points="75,25 95,50 75,75"/>
 235                         </g>
 236                         <line x1="20" y1="50" x2="80" y2="50" stroke-width="10"></line>
 237                     </svg>
 238                 </a>
 239             </div>
 240         {{/if}}
 241         <div class="rangeBarsContainerInlineStyle">
 242             {{#each rangeBars}}
 243                 {{#link-to linkRoute linkId title=label}}
 244                     <span class="rangeBar" {{bind-attr style=inlineStyle}}></span>
 245                 {{/link-to}}
 246             {{/each}}
 247         </div>
 248     </script>
 249
 250     <script type="text/x-handlebars" data-template-name="chart-details">
 251     {{#if details}}
 252         <table class="details-table">
 253             <tbody class="bugs">
 254             {{#each details.bugTrackers}}
 255                 {{#if bugs}}
 256                     <tr>
 257                         <th>{{label}}</th>
 258                         <td>
 259                             {{#each bugs}}
 260                                 <a {{bind-attr href=bugUrl}} target="_blank">{{bugNumber}}</a>
 261                             {{/each}}
 262                         </td>
 263                     </tr>
 264                 {{/if}}
 265             {{/each}}
 266             </tbody>
 267             <tbody class="status">
 268                 <tr>
 269                     <th>Current</th>
 270                     <td>
 271                         {{details.status.currentValue}} {{chartData.unit}}
 272                         {{#if details.status.valueDelta}}
 273                             ({{details.status.valueDelta}} {{chartData.unit}} / {{details.status.relativeDelta}})
 274                         {{/if}}
 275                         {{#if details.status.label}}
 276                             <br>
 277                             <span {{bind-attr class=details.status.className}}>{{details.status.label}}</span>
 278                         {{/if}}
 279                     </td>
 280                 </tr>
 281             </tbody>
 282             <tbody>
 283             {{#if details.buildNumber}}
 284                 <tr>
 285                     <th>Build</th>
 286                     <td>
 287                         {{#if details.buildURL}}
 288                             <a {{bind-attr href=details.buildURL}} target="_blank">{{details.buildNumber}}</a>
 289                         {{else}}
 290                             {{details.buildNumber}}
 291                         {{/if}}
 292                         ({{details.buildTime}})
 293                     </td>
 294                 </tr>
 295             {{/if}}
 296             {{#each details.revisions}}
 297                 <tr>
 298                     <th>{{name}}</th>
 299                     <td>
 300                         {{#if url}}
 301                             <a {{bind-attr href=url}} target="_blank">{{label}}</a>
 302                         {{else}}
 303                             {{label}}
 304                         {{/if}}
 305                     </td>
 306                 </tr>
 307             {{/each}}
 308             </tbody>
 309         </table>
 310         <div class="commits">
 311             {{#each details.revisions}}
 312                 {{commits-viewer repository=repository revisionInfo=this caption=name}}
 313             {{/each}}
 314         </div>
 315     {{/if}}
 316     </script>
 317
 318     <script type="text/x-handlebars" data-template-name="components/commits-viewer">
 319     {{#if commits}}
 320         <table {{bind-attr class=":commits-viewer visible::hidden"}}>
 321             {{#if caption}}
 322                 <caption {{action toggleVisibility}}>{{caption}} commits</caption>
 323             {{/if}}
 324             {{#if visible}}
 325                 <tbody>
 326                     {{#each commits}}
 327                         <tr>
 328                             <th>
 329                                 {{#if url}}
 330                                     <a {{bind-attr href=url}} target="_blank">{{revision}}</a>
 331                                 {{else}}
 332                                     {{revision}}
 333                                 {{/if}}
 334                             </th>
 335                             <th>{{author}}</th>
 336                             <td>{{message}}</td>
 337                         </tr>
 338                     {{/each}}
 339                 </tbody>
 340             {{/if}}
 341         </table>
 342     {{/if}}
 343     </script>
 344
 345     <script type="text/x-handlebars" data-template-name="close-button">
 346         <svg class="close-button icon-button" viewBox="0 0 100 100">
 347             <g stroke="black" stroke-width="10">
 348                 <circle cx="50" cy="50" r="45" fill="transparent"/>
 349                 <polygon points="30,30 70,70" />
 350                 <polygon points="30,70 70,30" />
 351             </g>
 352         </svg>
 353     </script>
 354
 355     <script type="text/x-handlebars" data-template-name="stat-button">
 356         <svg class="stat-button icon-button" viewBox="10 0 110 100">
 357             <g stroke="none" stroke-width="0" fill="black">
 358                 <path id="upper-sigma" d="M 5 5 H 95 V 40 h -10 c -5 -20 -5 -20 -25 -20 H 35 L 60 50 l -20 0" />
 359                 <use xlink:href="#upper-sigma" transform="translate(0, 100) scale(1, -1)" />
 360             </g>
 361         </svg>
 362     </script>
 363
 364     <script type="text/x-handlebars" data-template-name="stat-pane">
 365         <section {{bind-attr class=":popup-pane :stat-pane showingStatPane::hidden"}}>
 366             <section class="stat-option">
 367                 <h1>Moving average</h1>
 368                 <label>Type: {{view Ember.Select
 369                     content=movingAverageStrategies
 370                     optionValuePath='content'
 371                     optionLabelPath='content.label'
 372                     selection=chosenMovingAverageStrategy}}</label>
 373                 {{#each chosenMovingAverageStrategy.parameterList}}
 374                     <label>{{label}}: {{input type="number" value=value min=min max=max step=step}}</label>
 375                 {{/each}}
 376             </section>
 377             {{#if chosenMovingAverageStrategy.execute}}
 378                 <section class="stat-option">
 379                     <h1>Envelope</h1>
 380                     <label>Type: {{view Ember.Select
 381                         content=envelopingStrategies
 382                         optionValuePath='content'
 383                         optionLabelPath='content.label'
 384                         selection=chosenEnvelopingStrategy}}</label>
 385                     {{#if chosenEnvelopingStrategy.description}}
 386                         <p class="description">{{chosenEnvelopingStrategy.description}}</p>
 387                     {{/if}}
 388                     {{#each chosenEnvelopingStrategy.parameterList}}
 389                         <label>{{label}}: <input type="number" {{bind-attr value=value min=min max=max step=step}}></label>
 390                     {{/each}}
 391                 </section>
 392             {{/if}}
 393             {{#if chosenEnvelopingStrategy.execute}}
 394                 <section class="stat-option">
 395                     <h1>Anomaly Detection</h1>
 396                     {{#each anomalyDetectionStrategies}}
 397                         <label {{bind-attr title=description}}>{{input type="checkbox" name=id checked=enabled}}{{label}}</label>
 398                     {{/each}}
 399                 </section>
 400             {{/if}}
 401         </section>
 402     </script>
 403
 404     <script type="text/x-handlebars" data-template-name="analysis-button">
 405         <svg class="analysis-button icon-button" viewBox="0 0 100 100">
 406             <g stroke="black" fill="black" stroke-width="15">
 407                 <circle cx="50" cy="50" r="40" fill="transparent"/>
 408                 <line x1="50" y1="25" x2="50" y2="55"/>
 409                 <circle cx="50" cy="67.5" r="10" stroke="none"/>
 410             </g>
 411         </svg>
 412     </script>
 413
 414     <script type="text/x-handlebars" data-template-name="search-button">
 415         <svg class="search-button icon-button" viewBox="0 0 100 100">
 416             <g stroke="black" stroke-width="15">
 417                 <circle cx="60" cy="40" r="30" fill="transparent"/>
 418                 <line x1="10" y1="90" x2="40" y2="60"/>
 419             </g>
 420         </svg>
 421     </script>
 422
 423     <script type="text/x-handlebars" data-template-name="spinner">
 424         <svg class="spinner" viewBox="0 0 100 100">
 425             <line x1="10" y1="50" x2="30" y2="50" stroke="black" stroke-width="10" stroke-linecap="round"/>
 426             <line x1="21.72" y1="21.72" x2="35.86" y2="35.86" stroke="black" stroke-width="10" stroke-linecap="round"/>
 427             <line x1="50" y1="10" x2="50" y2="30" stroke="black" stroke-width="10" stroke-linecap="round"/>
 428             <line x1="78.28" y1="21.72" x2="64.14" y2="35.86" stroke="black" stroke-width="10" stroke-linecap="round"/>
 429             <line x1="70" y1="50" x2="90" y2="50" stroke="black" stroke-width="10" stroke-linecap="round"/>
 430             <line x1="65.86" y1="65.86" x2="78.28" y2="78.28" stroke="black" stroke-width="10" stroke-linecap="round"/>
 431             <line x1="50" y1="70" x2="50" y2="90" stroke="black" stroke-width="10" stroke-linecap="round"/>
 432             <line x1="21.72" y1="78.28" x2="35.86" y2="65.86" stroke="black" stroke-width="10" stroke-linecap="round"/>
 433         </svg>
 434     </script>
 435
 436     <script type="text/x-handlebars" data-template-name="navbar">
 437         <nav id="navigation" role="navigation">
 438             <h1><a href="#">WebKit Perf Monitor</a></h1>
 439             <ul>
 440                 {{#each App.Manifest.dashboards}}
 441                     {{#if name}}
 442                         {{#link-to 'dashboard' name tagName='li'}}
 443                             {{#link-to 'dashboard' name}}{{label}}{{/link-to}}
 444                         {{/link-to}}
 445                     {{/if}}
 446                 {{/each}}
 447                 {{#link-to 'charts' tagName='li'}}
 448                     {{#link-to 'charts'}}Charts{{/link-to}}
 449                 {{/link-to}}
 450                 {{#link-to 'analysis' tagName='li'}}
 451                     {{#link-to 'analysis'}}Analysis{{/link-to}}
 452                 {{/link-to}}
 453             </ul>
 454         </nav>
 455     </script>
 456
 457     <script type="text/x-handlebars" data-template-name="number-of-days-controls">
 458         <li class="numberOfDaysIs1">
 459             <a href="#" class="control-button" {{action "setNumberOfDays" 1}}>1D</a>
 460         </li>
 461         <li class="numberOfDaysIs7">
 462             <a href="#" class="control-button" {{action "setNumberOfDays" 7}}>1W</a>
 463         </li>
 464         <li class="numberOfDaysIs30">
 465             <a href="#" class="control-button" {{action "setNumberOfDays" 30}}>1M</a>
 466         </li>
 467         <li class="numberOfDaysIs90">
 468             <a href="#" class="control-button" {{action "setNumberOfDays" 90}}>3M</a>
 469         </li>
 470         <li class="numberOfDaysIs183">
 471             <a href="#" class="control-button" {{action "setNumberOfDays" 183}}>6M</a>
 472         </li>
 473         <li class="numberOfDaysIs365">
 474             <a href="#" class="control-button" {{action "setNumberOfDays" 365}}>1Y</a>
 475         </li>
 476     </script>
 477
 478     <script type="text/x-handlebars" data-template-name="start-time-slider">
 479         <label><input type="range"> <span class="numberOfDays">X</span> days</label>
 480     </script>
 481
 482     <script type="text/x-handlebars" data-template-name="popup">
 483         <span class="label">{{view App.PopupButtonView tagName="a" label=view.label }}</span>
 484         {{view view.popupListContainerView viewName="popupListContainerViewInstance"}}
 485     </script>
 486
 487     <script type="text/x-handlebars" data-template-name="popup-list">
 488         {{#each view.list}}
 489             {{#if isSeparator}}
 490                 <li><hr></li>
 491             {{else }} {{#if children}}
 492                 <li>{{view App.PopupView list=children label=label}}</li>
 493             {{else}}
 494                 <li>
 495                     {{#if actionName}}
 496                         <a href="#" class="label" {{action actionName actionArgument}}>{{label}}</a>
 497                     {{else}}
 498                         <a class="label">{{label}}</a>
 499                     {{/if}}
 500                 </li>
 501             {{/if}} {{/if}}
 502         {{/each}}
 503     </script>
 504
 505     <script type="text/x-handlebars" data-template-name="analysis">
 506         <header id="header">
 507             {{partial "navbar"}}
 508         </header>
 509
 510         <table id="analysis-tasks">
 511             <thead>
 512                 <tr>
 513                     <td>ID</td>
 514                     <td>Name</td>
 515                     <td>Created at</td>
 516                 </tr>
 517             </thead>
 518             <tbody>
 519                 {{#each model.tasks}}
 520                     <tr>
 521                         <td>{{#link-to 'analysisTask' id}}{{id}}{{/link-to}}</td>
 522                         <td>{{name}}</td>
 523                         <td>{{createdAt}}</td>
 524                     </tr>
 525                 {{/each}}
 526             </tbody>
 527         </table>
 528     </script>
 529
 530     <script type="text/x-handlebars" data-template-name="analysisTask">
 531         <header id="header">
 532             {{partial "navbar"}}
 533         </header>
 534
 535         <h2 id="analysis-task-title">{{label}}</h2>
 536         {{#if platform.label}}
 537             <h3 id="analysis-task-testname">{{metric.fullName}} - {{platform.label}}</h3>
 538         {{/if}}
 539
 540         {{#if pane}}
 541             <section class="analysis-chart-pane chart-pane" tabindex="0">
 542                 <div class="svg-container">
 543                     {{interactive-chart
 544                         chartData=pane.chartData
 545                         ranges=pane.analyticRanges
 546                         domain=overviewDomain
 547                         interactive=true
 548                         chartPointRadius=2
 549                         currentItem=pane.hoveredOrSelectedItem
 550                         selectedPoints=pane.selectedPoints
 551                         selection=timeRange
 552                         highlightedItems=highlightedItems
 553                         rangeRoute="analysisTask"}}
 554                 </div>
 555                 <div class="details">
 556                     <div class="details-table-container">
 557                         <table class="analysis-bugs">
 558                             <tbody>
 559                                 {{#each bugTrackers}}
 560                                     <tr>
 561                                         <th>{{label}}</th>
 562                                         <td>
 563                                             <form {{action "associateBug" this editedBugNumber on="submit"}}>
 564                                                 {{input type=text value=editedBugNumber}}
 565                                             </form>
 566                                         </td>
 567                                     </tr>
 568                                 {{/each}}
 569                             </tbody>
 570                         </table>
 571                         {{partial "chart-details"}}
 572                     </div>
 573                 </div>
 574             </section>
 575         {{/if}}
 576
 577         {{partial "testGroupForm"}}
 578
 579         {{#each testGroupPanes}}
 580             {{partial "testGroup"}}
 581         {{/each}}
 582     </script>
 583
 584     <script type="text/x-handlebars" data-template-name="testGroup">
 585         <section class="analysis-group">
 586             <h1>{{name}}</h1>
 587             <table class="results">
 588                 <thead>
 589                     <tr>
 590                         <td colspan="2">Configuration</td>
 591                         {{#each repositories}}
 592                             <td>{{name}}</td>
 593                         {{/each}}
 594                         <td>Results</td>
 595                         <td>Status</td>
 596                     </tr>
 597                 </thead>
 598                 {{#each configurations}}
 599                     <tbody {{bind-attr class="showRequestList::hideRequests"}}>
 600                         <tr class="summary" {{action toggleShowRequestList this}}>
 601                             <td class="config-letter" colspan="2">{{summary.configLetter}}</td>
 602                             {{#with summary}}
 603                                 {{partial "testGroupRow"}}
 604                             {{/with}}
 605                         </tr>
 606                         {{#each items}}
 607                             <tr class="request">
 608                                 {{#with ../this}}
 609                                     <td class="config-letter" {{action toggleShowRequestList this}}></td>
 610                                 {{/with}}
 611                                 <td>Run {{orderLabel}}</td>
 612                                 {{partial "testGroupRow"}}
 613                             </tr>
 614                         {{/each}}
 615                     </tbody>
 616                 {{/each}}
 617             </table>
 618             <div class="reference-chart">
 619                 {{#if referenceChart}}
 620                     {{interactive-chart
 621                         chartData=referenceChart.data
 622                         domain=overviewDomain
 623                         chartPointRadius=2
 624                         showYAxis=false
 625                         enableSelection=false
 626                         highlightedItems=referenceChart.highlightedItems}}
 627                 {{/if}}
 628             </div>
 629         </section>
 630     </script>
 631
 632     <script type="text/x-handlebars" data-template-name="testGroupRow">
 633         {{#each revisionList}}
 634             <td>{{this}}</td>
 635         {{/each}}
 636         <td>
 637             {{#if value}}
 638                 {{box-plot range=valueRange value=value delta=confidenceIntervalDelta}}
 639             {{/if}}
 640             {{formattedValue}}
 641         </td>
 642         <td>
 643             <a {{bind-attr href=url title=buildLabel}}>{{statusLabel}}</a>
 644         </td>
 645     </script>
 646
 647     <script type="text/x-handlebars" data-template-name="testGroupForm">
 648         <form method="POST" {{action "createTestGroup" newTestGroupName repetitionCount on="submit"}}>
 649             <section class="analysis-group">
 650                 <h1>{{input name="name" value=newTestGroupName placeholder="Test group name" required=true type="text"}}</h1>
 651                 <table>
 652                     <thead>
 653                         <tr>
 654                             <th>Configuration</th>
 655                             {{#each configurations}}
 656                                 <th>{{this}}</th>
 657                             {{/each}}
 658                         </tr>
 659                     </thead>
 660                     <tbody>
 661                         {{#each rootConfigurations}}
 662                             <tr>
 663                                 <th>{{name}}</th>
 664                                 {{#each sets}}
 665                                     <td>{{view Ember.Select name=name content=options disabled=true
 666                                         optionValuePath="content.value" optionLabelPath="content.label"
 667                                         selection=selection}}</td>
 668                                 {{/each}}
 669                             </tr>
 670                         {{/each}}
 671                     </tbody>
 672                 </table>
 673                 <label>Number of runs {{view Ember.Select content=possibleRepetitionCounts value=repetitionCount}}</label>
 674                 <button type="submit">Start A/B testing</button>
 675             </section>
 676         </form>
 677     </script>
 678
 679 </head>
 680 <body>
 681 </body>
 682 </html>