Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(59)

Side by Side Diff: appengine_apps/chromium_status/static/js/status_viewer/fragmentation_view.js

Issue 778533003: Moved chromium_status to appengine/ (Closed) Base URL: https://chromium.googlesource.com/infra/infra.git@master
Patch Set: Created 6 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 // Copyright (c) 2009 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file.
4
5 /**
6 * Factory function to create a View for "fragmentation".
7 *
8 * This display of the data shows tree closure/open events as red/green blocks.
9 */
10 var CreateFragmentationView;
11
12 // -----------------------------------------------------------------------------
13 // Private implementation
14 // -----------------------------------------------------------------------------
15
16 (function() {
17
18 CreateFragmentationView = function(timeRange, entries) {
19 return new FragmentationView(timeRange, entries);
20 }
21
22 function FragmentationView(timeRange, entries) {
23 Draw(entries, timeRange);
24 }
25
26 FragmentationView.prototype.Show = function(visible) {
27 gViewerApp.ShowViewContentAndTabArea('fragmentation', visible);
28 }
29
30 /**
31 * Draws the fragmentation chart for all days in |timeRange|.
32 * @param {array<Entry>} entries
33 * @param {TimeRange} timeRange
34 */
35 function Draw(entries, timeRange) {
36 // Figure out what days we touch.
37 var days = DateUtil.GetLocalDaysInRange(timeRange);
38
39 var tbody = document.getElementById("tbody");
40 // Clear anything already present in the output table.
41 tbody.innerHTML = "";
42
43 // Draw the rows for each day worth of data.
44 for (var i = 0; i < days.length; ++i) {
45 var day = days[i];
46 DrawDay(tbody, entries, day);
47 }
48 }
49
50 /**
51 * Draws a specific day's row in the fragmentation chart.
52 * @param {DOMNode} tbody
53 * @param {array<Entry>} entries
54 * @param {TimeRange} day
55 */
56 function DrawDay(tbody, entries, day) {
57 var tr = DomUtil.AddNode(tbody, "tr");
58
59 var tdForDayName = DomUtil.AddNode(tr, "td");
60 DrawDayNameColumn(day, tdForDayName);
61
62 var tableTd = DomUtil.AddNode(tr, "td");
63
64 tableTd.width = "100%";
65
66 // Extract the data from |entries| that apply to |day|, and break it
67 // into (start,duration) runs.
68 var runs = MakeRuns(entries, day);
69
70 DrawRunsTable(tableTd, runs);
71 }
72
73 /**
74 * Draws a specific day's name column in the fragmentation chart.
75 * @param {TimeRange} day
76 * @param {DOMNode} td The column to print name into.
77 */
78 function DrawDayNameColumn(day, td) {
79 var d = new Date();
80 d.setTime(day.endTime);
81
82 // Display the day as for example "2009/8/38".
83 var dateText =
84 d.getFullYear() + "/" +
85 PadWithZero(d.getMonth() + 1, 2) + "/" +
86 PadWithZero(d.getDate(), 2);
87
88 // Color saturday and sunday differently.
89 if (d.getDay() == 0) {
90 td.className = "sundayName";
91 } else if (d.getDay() == 6) {
92 td.className = "saturdayName";
93 }
94
95 td.innerHTML = dateText;
96 }
97
98 /**
99 * Draws a fragmentation table for |runs|.
100 *
101 * @param {DOMNode} parent Container to put table into.
102 * @param {array<Run>} runs
103 */
104 function DrawRunsTable(parent, runs) {
105 var table = DomUtil.AddNode(parent, "table");
106 table.cellSpacing = 0;
107 table.cellPadding = 0;
108 table.width = "100%";
109
110 var tr = DomUtil.AddNode(table, "tr");
111
112 // If we have any entires that lasted less than 1 minute, pretend like
113 // they were a minute in length (otherwise they will be too tiny to click on.
114 var MIN_DURATION = 60000;
115
116 // Sum up how much total time the runs span.
117 var totalDuration = 0;
118 for (var i = 0; i < runs.length; ++i) {
119 totalDuration += Math.max(MIN_DURATION, runs[i].duration);
120 }
121
122 for (var i = 0; i < runs.length; ++i) {
123 var run = runs[i];
124 var duration = Math.max(MIN_DURATION, run.duration);
125 var width = duration / totalDuration;
126 AddRunColumn(tr, run, width);
127 }
128 }
129
130 /**
131 * Inserts a column into |tr| for |run|, which occupies |widthFraction|
132 * percentage of space in the row.
133 *
134 * @param {DOMNode} tr
135 * @param {Run} run
136 * @param {number} widthFraction
137 */
138 function AddRunColumn(tr, run, widthFraction) {
139 var td = DomUtil.AddNode(tr, "td");
140 td.className = run.entry.GetTreeState();
141
142 td.width = (100 * widthFraction).toFixed(4) + "%";
143 td.innerHTML = "&nbsp;";
144
145 // When users click on the column, display details on the entry.
146 td.onclick = function() {
147 var msg = "[duration = " + (run.duration / (60 * 1000)).toFixed(0) +
148 " minutes]\n\n" +
149 DateUtil.FormatAsLocalDate(run.entry.timestamp) + "\n\n" +
150 run.entry.author + ":\n\n" +
151 run.entry.message;
152 alert(msg);
153 };
154 }
155
156 })(); // Private implementation.
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698