Skip to content

Commit f390415

Browse files
hzrhzr
committed
Cleaning up a bit.
1 parent acf419c commit f390415

File tree

3 files changed

+49
-54
lines changed

3 files changed

+49
-54
lines changed

‎src/profiler/profiler_style.css‎

Lines changed: 11 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -191,39 +191,37 @@
191191
{
192192
min-width: 3px;
193193
height: 10px;
194-
/*border-radius: 2px;*/ /* Disable this, it's too expensive to paint */
195-
}
196-
197-
.profiler-timeline .profiler-event
198-
{
199-
position: absolute;
200-
}
201-
202-
.profiler-event-interval
203-
{
204194
margin: 3px 0;
205195
box-shadow: inset 0 2px 0 0 rgba(255, 255, 255, 0.09),
206196
inset 0 0 0 1px rgba(0, 0, 0, 0.07),
207197
inset 0 -1px 0 0 rgba(0, 0, 0, 0.05);
198+
/*border-radius: 2px;*/ /* Disable this, it's too expensive to paint */
208199
}
209200

210-
.profiler-event-interval.expandable:hover
201+
.profiler-event.expandable:hover
211202
{
212203
box-shadow: inset 0 2px 0 0 rgba(255, 255, 255, 0.09),
213204
inset 0 0 0 1px rgba(0, 0, 0, 0.07),
214205
inset 0 -1px 0 0 rgba(0, 0, 0, 0.05),
215206
0 0 0 2px #ceddf5;
216207
}
217208

218-
.profiler-event-interval.non-expandable:hover
209+
/*
210+
.profiler-event.non-expandable:hover
219211
{
220212
box-shadow: inset 0 2px 0 0 rgba(255, 255, 255, 0.09),
221213
inset 0 0 0 1px rgba(0, 0, 0, 0.07),
222214
inset 0 -1px 0 0 rgba(0, 0, 0, 0.05),
223215
0 0 0 2px #ddd;
224216
}
217+
*/
218+
219+
.profiler-timeline .profiler-event
220+
{
221+
position: absolute;
222+
}
225223

226-
.profiler-event-interval.selected
224+
.profiler-event.selected
227225
{
228226
box-shadow: 0 0 0 3px #769fe1;
229227
}

‎src/profiler/profiler_templates.js‎

Lines changed: 34 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -121,9 +121,9 @@ var ProfilerTemplates = function()
121121
event_list.forEach(function(event, index) {
122122
if (index !== -1)
123123
{
124-
var percentage = total_time
125-
? event.time / total_time * 100
126-
: 0;
124+
var self_time_amount = total_time
125+
? event.time / total_time * 100
126+
: 0;
127127
template.push(
128128
["div",
129129
["span",
@@ -136,7 +136,7 @@ var ProfilerTemplates = function()
136136
],
137137
["div",
138138
"class", "profiler-legend-time-bar",
139-
"style", "width: " + percentage + "%"
139+
"style", "width: " + self_time_amount + "%"
140140
],
141141
"class", "profiler-legend-row profiler-timeline-row" + (index % 2 ? "" : " even"),
142142
"data-event-type", String(event.type),
@@ -220,14 +220,14 @@ var ProfilerTemplates = function()
220220

221221
this._full_timeline_event = function(interval_start, ms_unit, event)
222222
{
223-
var interval = Math.round((event.interval.end - event.interval.start) * ms_unit);
224-
var event_start = Math.round((event.interval.start - interval_start) * ms_unit);
223+
var width = Math.round((event.interval.end - event.interval.start) * ms_unit);
224+
var left = Math.round((event.interval.start - interval_start) * ms_unit);
225225
var column = this._order.indexOf(event.type);
226226
return (
227227
["div",
228228
"style",
229-
"width: " + interval + "px; " +
230-
"left: " + event_start + "px; " +
229+
"width: " + width + "px; " +
230+
"left: " + left + "px; " +
231231
"top: " + (column * 3 + 1) + "px;", // TODO: 3 -> constant
232232
"class", "profiler-event-small event-type-" + event.type + "-selftime" // FIXME: not actually selftime
233233
]
@@ -236,29 +236,32 @@ var ProfilerTemplates = function()
236236

237237
this._timeline_event = function(interval_start, ms_unit, selected_id, event)
238238
{
239-
var interval = Math.round((event.interval.end - event.interval.start) * ms_unit);
240-
var self_time = Math.max(BAR_MIN_WIDTH, Math.round(event.time * ms_unit));
241-
var event_start = Math.round((event.interval.start - interval_start) * ms_unit);
239+
var duration = event.interval.end - event.interval.start;
240+
var self_time_amount = duration
241+
? (event.time / duration * 100).toFixed(2)
242+
: 0;
243+
var width = Math.round(duration * ms_unit);
244+
var left = Math.round((event.interval.start - interval_start) * ms_unit);
242245
var column = this._order.indexOf(event.type);
243246
var is_expandable = this._expandables.indexOf(event.type) != -1 && event.childCount > 1;
244247
var color = this._get_color_for_type(event.type);
245248
return (
246249
["div",
247250
"style",
248-
"width: " + interval + "px; " +
249-
"left: " + event_start + "px; " +
251+
"width: " + width + "px; " +
252+
"left: " + left + "px; " +
250253
"top: " + (column * BAR_HEIGHT + 1) + "px; " +
251254
(HAS_UNPREFIXED_GRADIENTS
252255
? "background-image: linear-gradient(0deg, transparent 0, rgba(255, 255, 255, .25) 100%), " +
253256
"linear-gradient(90deg, " + color + " 0, " +
254-
color + " " + self_time + "px, " +
255-
"transparent " + self_time + "px);"
257+
color + " " + self_time_amount + "%, " +
258+
"transparent " + self_time_amount + "%);"
256259
: "background-image: -o-linear-gradient(90deg, transparent 0, rgba(255, 255, 255, .25) 100%), " +
257260
"-o-linear-gradient(0deg, " + color + " 0, " +
258-
color + " " + self_time + "px, " +
259-
"transparent " + self_time + "px);"
261+
color + " " + self_time_amount + "%, " +
262+
"transparent " + self_time_amount + "%);"
260263
),
261-
"class", "profiler-event profiler-event-interval event-type-" + event.type +
264+
"class", "profiler-event event-type-" + event.type +
262265
(event.eventID == selected_id && is_expandable ? " selected" : "") +
263266
(is_expandable ? " expandable" : " non-expandable"),
264267
"data-event-id", String(event.eventID),
@@ -271,26 +274,26 @@ var ProfilerTemplates = function()
271274

272275
this.get_title_interval_bar = function(event)
273276
{
274-
var WIDTH = 200;
275-
var interval = event.interval.end - event.interval.start;
276-
var ms_unit = WIDTH / interval;
277-
var self_time = Math.round(event.time * ms_unit);
277+
var duration = event.interval.end - event.interval.start;
278+
var self_time_amount = duration
279+
? (event.time / duration * 100).toFixed(2)
280+
: 0;
278281
var color = this._get_color_for_type(event.type);
279282
return (
280283
["div",
281284
"style",
282-
"width: " + WIDTH + "px; " +
285+
"width: 100%; " +
283286
(HAS_UNPREFIXED_GRADIENTS
284287
? "background-image: linear-gradient(0deg, transparent 0, rgba(255, 255, 255, .25) 100%), " +
285288
"linear-gradient(90deg, " + color + " 0, " +
286-
color + " " + self_time + "px, " +
287-
"transparent " + self_time + "px);"
289+
color + " " + self_time_amount + "%, " +
290+
"transparent " + self_time_amount + "%);"
288291
: "background-image: -o-linear-gradient(90deg, transparent 0, rgba(255, 255, 255, .25) 100%), " +
289292
"-o-linear-gradient(0deg, " + color + " 0, " +
290-
color + " " + self_time + "px, " +
291-
"transparent " + self_time + "px);"
293+
color + " " + self_time_amount + "%, " +
294+
"transparent " + self_time_amount + "%);"
292295
),
293-
"class", "profiler-event profiler-event-interval event-type-" + event.type
296+
"class", "profiler-event event-type-" + event.type
294297
]
295298
);
296299
};
@@ -302,19 +305,14 @@ var ProfilerTemplates = function()
302305

303306
this.details = function(table)
304307
{
305-
return table && table.get_data().length && table.render() || this.no_events();
308+
return table && table.get_data().length && table.render() || this.empty(ui_strings.S_PROFILER_NO_DETAILS);
306309
};
307310

308311
this.status = function(time)
309312
{
310313
return ["div", ui_strings.S_PROFILER_TOTAL_SELF_TIME + ": " + this.format_time(time)];
311314
};
312315

313-
this.no_events = function()
314-
{
315-
return ["div", ui_strings.S_PROFILER_NO_DETAILS, "class", "profiler-empty"];
316-
};
317-
318316
this.format_time = function(time, fractions)
319317
{
320318
fractions = (fractions != null) ? fractions
@@ -324,7 +322,6 @@ var ProfilerTemplates = function()
324322

325323
this.get_title_all = function(event)
326324
{
327-
var details = this.get_details_title(event);
328325
return (
329326
["div",
330327
["h2",
@@ -354,7 +351,7 @@ var ProfilerTemplates = function()
354351
],
355352
this.format_time(event.time)
356353
],
357-
(details ? details : [])
354+
this.get_details_title(event) || []
358355
],
359356
"class", "profiler-event-tooltip-info"
360357
],
@@ -490,7 +487,7 @@ var ProfilerTemplates = function()
490487
]
491488
);
492489
}
493-
return [];
490+
return null;
494491
};
495492

496493
this.disabled_view = function()

‎src/profiler/profiler_view.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -225,7 +225,7 @@ var ProfilerView = function(id, name, container_class, html, default_handler)
225225
}
226226
else
227227
{
228-
this._details_ele.clearAndRender(this._templates.no_events());
228+
this._details_ele.clearAndRender(this._templates.empty(ui_strings.S_PROFILER_NO_DETAILS));
229229
}
230230

231231
container.innerHTML = "";
@@ -311,6 +311,7 @@ var ProfilerView = function(id, name, container_class, html, default_handler)
311311
this._show_details_list = function()
312312
{
313313
var child_type = this._children[this._event_type];
314+
this._status_ele.remove();
314315
if (child_type)
315316
{
316317
this._details_ele.clearAndRender(this._templates.empty(ui_strings.S_PROFILER_CALCULATING));
@@ -326,9 +327,8 @@ var ProfilerView = function(id, name, container_class, html, default_handler)
326327
}
327328
else
328329
{
330+
this._details_ele.clearAndRender(this._templates.empty(ui_strings.S_PROFILER_NO_DETAILS));
329331
this._reset_details();
330-
this._details_ele.clearAndRender(this._templates.no_events());
331-
this._status_ele.remove();
332332
}
333333
};
334334

@@ -357,7 +357,7 @@ var ProfilerView = function(id, name, container_class, html, default_handler)
357357
}
358358
else
359359
{
360-
this._details_ele.clearAndRender(this._templates.no_events());
360+
this._details_ele.clearAndRender(this._templates.empty(ui_strings.S_PROFILER_NO_DETAILS));
361361
this._status_ele.remove();
362362
}
363363
};

0 commit comments

Comments
 (0)