Index: appengine_apps/chromium_status/static/js/status_viewer/peak_hours_view.js |
diff --git a/appengine_apps/chromium_status/static/js/status_viewer/peak_hours_view.js b/appengine_apps/chromium_status/static/js/status_viewer/peak_hours_view.js |
deleted file mode 100644 |
index 937866207809c13f2ecc24cad7f7d5dbc578d66a..0000000000000000000000000000000000000000 |
--- a/appengine_apps/chromium_status/static/js/status_viewer/peak_hours_view.js |
+++ /dev/null |
@@ -1,256 +0,0 @@ |
-// Copyright (c) 2009 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. |
- |
-/** |
- * Factory function to create a View for "peak hours". |
- * |
- * This display of the data shows tree closure/open totals during peak hours in |
- * various time zones. |
- */ |
-var CreatePeakHoursView; |
- |
-// ----------------------------------------------------------------------------- |
-// Private implementation |
-// ----------------------------------------------------------------------------- |
- |
-(function() { |
- |
-CreatePeakHoursView = function(timeRange, entries) { |
- return new PeakHoursView(timeRange, entries); |
-} |
- |
-function PeakHoursView(timeRange, entries) { |
- Draw(entries, timeRange); |
-} |
- |
-PeakHoursView.prototype.Show = function(visible) { |
- gViewerApp.ShowViewContentAndTabArea("peak", visible); |
-} |
- |
-/** |
- * Draws the peak hours chart for all days in |timeRange|. |
- * @param {array<Entry>} entries |
- * @param {TimeRange} timeRange |
- */ |
-function Draw(entries, timeRange) { |
- var utcOffsetsMillis = { |
- // Please keep this ordered by UTC offset. |
- // If you extend this list, you need to adjust column widths in |
- // AddPeakColumn() and on the status_viewer.html page. |
- MTV: -7 * DateUtil.MILLIS_PER_HOUR, // UTC-7 -- Mountain View |
- NYC: -4 * DateUtil.MILLIS_PER_HOUR, // UTC-4 -- New York |
- CET: 1 * DateUtil.MILLIS_PER_HOUR, // UTC+1 -- Denmark |
- TOK: 9 * DateUtil.MILLIS_PER_HOUR // UTC+9 -- Tokyo |
- }; |
- var graphCSV = []; |
- |
- // Find which is the minimum and maximum. |
- var minUTCOffsetMillis = utcOffsetsMillis.MTV; |
- var maxUTCOffsetMillis = utcOffsetsMillis.MTV; |
- |
- for (var timezone in utcOffsetsMillis) { |
- var offset = utcOffsetsMillis[timezone]; |
- minUTCOffsetMillis = Math.min(minUTCOffsetMillis, offset); |
- maxUTCOffsetMillis = Math.max(maxUTCOffsetMillis, offset); |
- } |
- |
- // Set the graph csv header: "Date,MTV,NYC,CET,TOK\n". |
- graphCSV.push("Date"); |
- for (var timezone in utcOffsetsMillis) { |
- graphCSV.push(","); |
- graphCSV.push(timezone); |
- } |
- graphCSV.push("\n"); |
- |
- // Figure out what days we touch. |
- // |
- // Note that we have to extend the time range by the max and |
- // minimum offsets, since those timezones may be on the next/previous |
- // day! |
- var days = DateUtil.GetUTCDaysInRange( |
- new TimeRange(timeRange.startTime + maxUTCOffsetMillis, |
- timeRange.endTime + minUTCOffsetMillis)); |
- |
- var tbody = document.getElementById("peak_tbody"); |
- // Clear anything already present in the output table. |
- tbody.innerHTML = ""; |
- |
- // Draw the rows for each day worth of data. |
- for (var i = 0; i < days.length; ++i) { |
- var day = days[i]; |
- DrawDay(tbody, entries, day, utcOffsetsMillis, graphCSV); |
- } |
- |
- // Draw a graph with the csv data across all dates. |
- // Dygraph docs at http://danvk.org/dygraphs/ |
- var peakGraph = |
- new Dygraph(document.getElementById("peak_dygraph"), |
- graphCSV.join(""), |
- { |
- rollPeriod: 1, |
- showRoller: true, |
- axisLabelFontSize: 11, |
- includeZero: true, |
- colors: ["red", "orange", "blue", "LightSkyBlue"], |
- strokeWidth: 3, |
- labelsDiv: document.getElementById("peak_dygraph_legend"), |
- labelsSeparateLines: true, |
- }); |
-} |
- |
-/** |
- * Draws a specific day's row in the peak hours chart. |
- * @parm {DOMNode} tbody |
- * @param {array<Entry>} entries |
- * @param {TimeRange} day |
- * @param {dict} utcOffsetsMillis |
- * @param {array} graphCSV |
- */ |
-function DrawDay(tbody, entries, utcDay, utcOffsetsMillis, graphCSV) { |
- var tr = DomUtil.AddNode(tbody, "tr"); |
- |
- |
- var tdForDayName = DomUtil.AddNode(tr, "td"); |
- |
- DrawUTCDayNameColumn(utcDay, tdForDayName); |
- // Start each graphCSV row with a date like "2010/08/01". |
- graphCSV.push(tdForDayName.innerText); |
- |
- var tableTd = DomUtil.AddNode(tr, "td"); |
- |
- tableTd.width = "100%"; |
- |
- var table = DomUtil.AddNode(tableTd, "table"); |
- table.cellSpacing = 0; |
- table.cellPadding = 0; |
- table.width = "100%"; |
- |
- var tr = DomUtil.AddNode(table, "tr"); |
- |
- for (var timezone in utcOffsetsMillis) { |
- AddPeakColumn(tr, |
- entries, |
- utcDay, |
- utcOffsetsMillis[timezone], |
- graphCSV); |
- } |
- graphCSV.push("\n"); |
-} |
- |
-/** |
- * @returns {StatusTotals} |
- */ |
-function GetStateCountsInRange(runs, timeRange) { |
- var statusTotalsSeconds = new StatusTotals(); |
- |
- var y1 = timeRange.startTime; |
- var y2 = timeRange.endTime; |
- |
- for (var i = 0; i < runs.length; ++i) { |
- var run = runs[i]; |
- |
- // Basically we have two boxes (x and y), and need to find the overlap. |
- var x1 = run.startTime; |
- var x2 = run.startTime - run.duration; |
- |
- if (x1 > y2 && x2 < y1) { |
- var leftEdge = Math.min(x1, y1); |
- var rightEdge = Math.max(y2, x2); |
- |
- var dt = leftEdge - rightEdge; |
- |
- statusTotalsSeconds.Increment(run.entry.GetTreeState(), |
- DateUtil.MillisToSeconds(dt)); |
- } |
- } |
- |
- return statusTotalsSeconds; |
-} |
- |
-function AddPeakColumn(tr, entries, utcDay, utcOffsetMillis, graphCSV) { |
- var td = DomUtil.AddNode(tr, "td"); |
- |
- // Width is (100/[items in utcMillisOffsets])%. |
- td.width = "25%"; |
- td.align = "center"; |
- |
- // Get a day range for the timezone. |
- var day = new TimeRange(utcDay.startTime - utcOffsetMillis, |
- utcDay.endTime - utcOffsetMillis); |
- |
- // Extract the data from |entries| that apply to |day|, and break it |
- // into (start,duration) runs. |
- var runs = MakeRuns(entries, day); |
- |
- // 9 - 5 in the local timezone. |
- var localPeakHours = new TimeRange( |
- day.endTime + 17 * DateUtil.MILLIS_PER_HOUR, |
- day.endTime + 9 * DateUtil.MILLIS_PER_HOUR); |
- |
- var statusTotalsSeconds = GetStateCountsInRange(runs, localPeakHours); |
- |
- var total = statusTotalsSeconds.GetTotalKnown(); |
- |
- var percentOpenText = ""; |
- var color = ""; |
- var className = ""; |
- |
- var percentOpenNumber = "0.0"; |
- if (total == 0) { |
- // This can happen if the day is in the future (edge day of slow timezone). |
- percentOpenText = "N/A"; |
- } else { |
- var fraction = statusTotalsSeconds.GetOpen() / total; |
- percentOpenNumber = (100 * fraction).toFixed(2); |
- percentOpenText = percentOpenNumber + "%"; |
- |
- // If we didn't fetch all the data necessary, our percentage won't be |
- // accurate as it is missing zones. |
- if (total != DateUtil.MillisToSeconds( |
- localPeakHours.startTime - localPeakHours.endTime)) { |
- percentOpenText += " [incomplete]"; |
- } |
- |
- // Choose a style based on how bad things are. |
- var badnessBuckets = [0.50, 0.75, 1.1]; |
- for (var i = 0; i < badnessBuckets.length; ++i) { |
- if (fraction < badnessBuckets[i]) { |
- className = "open_badness" + i; |
- break; |
- } |
- } |
- } |
- graphCSV.push("," + percentOpenNumber); |
- |
- var span = DomUtil.AddNode(td, "span"); |
- span.className = className; |
- DomUtil.AddText(span, percentOpenText); |
-} |
- |
-/** |
- * Draws a specific day's name column in the peak hours charts. |
- * @param {TimeRange} utcDay |
- * @param {DOMNode} td The column to print name into. |
- */ |
-function DrawUTCDayNameColumn(utcDay, td) { |
- var d = new Date(); |
- d.setTime(utcDay.endTime); |
- |
- // Display the day as for example "2009/8/38". |
- var dateText = |
- d.getUTCFullYear() + "/" + |
- PadWithZero(d.getUTCMonth() + 1, 2) + "/" + |
- PadWithZero(d.getUTCDate(), 2); |
- |
- // Color saturday and sunday differently. |
- if (d.getUTCDay() == 0) { |
- td.className = "sundayName"; |
- } else if (d.getUTCDay() == 6) { |
- td.className = "saturdayName"; |
- } |
- |
- td.innerHTML = dateText; |
-} |
- |
-})(); // Private implementation. |