New perf dashboard should have the ability to overlay moving average with an envelope
[WebKit-https.git] / Websites / perf.webkit.org / public / v2 / index.html
index 50b8740..394aa93 100755 (executable)
                 <header>
                     <h1 {{action "toggleDetails"}}>{{metric.fullName}} - {{ platform.name}}</h1>
                     <a href="#" title="Close" class="close-button" {{action "close"}}>{{partial "close-button"}}</a>
+                    {{#if movingAverageStrategies}}
+                        <a href="#" title="Statistical Tools" class="stat-button" {{action "toggleStatPane"}}>{{partial "stat-button"}}</a>
+                    {{/if}}
                     {{#if App.Manifest.bugTrackers}}
                         <a href="#" title="Analysis" class="bugs-button" {{action "toggleBugsPane"}}>
                             {{partial "analysis-button"}}
                             rangeRoute="analysisTask"
                             selection=timeRange
                             selectedPoints=selectedPoints
-                            selectionIsLocked=timeRangeIsLocked
                             markedPoints=markedPoints
                             zoom="zoomed"}}
                     {{else}}
                     </div>
                 </div>
 
-                <form {{bind-attr class=":search-pane showingSearchPane::hidden"}}>
+                <div {{bind-attr class=":popup-pane :analysis-pane showingAnalysisPane::hidden"}}>
+                    <label>Name: {{input type=text value=newAnalysisTaskName}}</label>
+                    <button {{action "createAnalysisTask"}} {{bind-attr disabled=cannotAnalyze}}>Analyze</button>
+                </div>
+
+                <form {{bind-attr class=":popup-pane :search-pane showingSearchPane::hidden"}}>
                     <span class="repositories">
                         {{view Ember.Select
                             content=App.Manifest.repositoriesWithReportedCommits
                     {{input action="searchCommit" placeholder="Name or email" value=commitSearchKeyword}}
                 </form>
 
-                <div {{bind-attr class=":analysis-pane showingAnalysisPane::hidden"}}>
-                    <table>
-                        <tbody>
-                            <tr>
-                                <th>
-                                    <label>Name: {{input type=text value=newAnalysisTaskName}}</label>
-                                    <button {{action "createAnalysisTask"}} {{bind-attr disabled=cannotAnalyze}}>Analyze</button>
-                                </th>
-                            </tr>
-                        </tbody>
-                    </table>
-                </div>
-
+                {{partial "stat-pane"}}
             </section>
         {{/each}}
     </script>
         </svg>
     </script>
 
+    <script type="text/x-handlebars" data-template-name="stat-button">
+        <svg class="stat-button icon-button" viewBox="10 0 110 100">
+            <g stroke="none" stroke-width="0" fill="black">
+                <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" />
+                <use xlink:href="#upper-sigma" transform="translate(0, 100) scale(1, -1)" />
+            </g>
+        </svg>
+    </script>
+
+    <script type="text/x-handlebars" data-template-name="stat-pane">
+        <section {{bind-attr class=":popup-pane :stat-pane showingStatPane::hidden"}}>
+            <section class="stat-option">
+                <h1>Moving average</h1>
+                <label>Type: {{view Ember.Select
+                    content=movingAverageStrategies
+                    optionValuePath='content'
+                    optionLabelPath='content.label'
+                    selection=chosenMovingAverageStrategy}}</label>
+                {{#each chosenMovingAverageStrategy.parameterList}}
+                    <label>{{label}}: {{input type="number" value=value min=min max=max step=step}}</label>
+                {{/each}}
+            </section>
+            {{#if chosenMovingAverageStrategy.execute}}
+                <section class="stat-option">
+                    <h1>Envelope</h1>
+                    <label>Type: {{view Ember.Select
+                        content=envelopingStrategies
+                        optionValuePath='content'
+                        optionLabelPath='content.label'
+                        selection=chosenEnvelopingStrategy}}</label>
+                    {{#if chosenEnvelopingStrategy.description}}
+                        <p class="description">{{chosenEnvelopingStrategy.description}}</p>
+                    {{/if}}
+                    {{#each chosenEnvelopingStrategy.parameterList}}
+                        <label>{{label}}: <input type="number" {{bind-attr value=value min=min max=max step=step}}></label>
+                    {{/each}}
+                </section>
+            {{/if}}
+        </section>
+    </script>
+
     <script type="text/x-handlebars" data-template-name="analysis-button">
         <svg class="analysis-button icon-button" viewBox="0 0 100 100">
-            <g stroke="black" stroke-width="15">
+            <g stroke="black" fill="black" stroke-width="15">
                 <circle cx="50" cy="50" r="40" fill="transparent"/>
                 <line x1="50" y1="25" x2="50" y2="55"/>
-                <circle cx="50" cy="67.5" r="2.5" fill="transparent"/>
+                <circle cx="50" cy="67.5" r="10" stroke="none"/>
             </g>
         </svg>
     </script>