Skip to content

Commit 5680101

Browse files
author
Steven Surowiec
committed
Moved CSS rules using images into inline CSS and made the images inline as well
1 parent fc334a2 commit 5680101

File tree

4 files changed

+24
-19
lines changed

4 files changed

+24
-19
lines changed

Display.php

Lines changed: 22 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,11 @@ class Profiler_Display {
1111
public static function display($output) {
1212
self::displayJavascript();
1313

14+
$overlay_image = base64_encode(file_get_contents(dirname(__FILE__) . '/resources/images/overlay.gif'));
15+
$side_image = base64_encode(file_get_contents(dirname(__FILE__) . '/resources/images/side.png'));
16+
17+
$side_bg_style = 'padding: 10px 0 5px 0; background: url(data:image/png;base64,' . $side_image . ') repeat-y right; ';
18+
1419
$logCount = count($output['logs']['console']) - $output['queryTotals']['count'];
1520
$fileCount = count($output['files']);
1621
$memoryUsed = $output['memoryTotals']['used'];
@@ -45,27 +50,28 @@ public static function display($output) {
4550
echo '</table>';
4651

4752
// Start Console tab
48-
echo '<div id="profiler-console" class="profiler-box" style="background: url(../images/pqp/overlay.gif); border-top: 1px solid #ccc; height: 200px; overflow: auto;">';
53+
echo '<div id="profiler-console" class="profiler-box" style="background: url(data:image/gif;base64,' . $overlay_image . '); border-top: 1px solid #ccc; height: 200px; overflow: auto;">';
4954

5055
if ($logCount == 0) {
5156
echo '<h3>This panel has no log items.</h3>';
5257
} else {
5358
echo '<table class="side" cellspacing="0">';
5459
echo '<tr>';
55-
echo '<td class="alt1"><var>'.$output['logs']['logCount'].'</var><h4>Logs</h4></td>';
56-
echo '<td class="alt2"><var>'.$output['logs']['errorCount'].'</var> <h4>Errors</h4></td>';
60+
echo '<td class="alt1" style="' . $side_bg_style . '"><var>' . $output['logs']['logCount'] . '</var><h4>Logs</h4></td>';
61+
echo '<td class="alt2" style="' . $side_bg_style . '"><var>' . $output['logs']['errorCount'] . '</var> <h4>Errors</h4></td>';
5762
echo '</tr>';
5863
echo '<tr>';
59-
echo '<td class="alt3"><var>'.$output['logs']['memoryCount'].'</var> <h4>Memory</h4></td>';
60-
echo '<td class="alt4"><var>'.$output['logs']['speedCount'].'</var> <h4>Speed</h4></td>';
64+
echo '<td class="alt3" style="' . $side_bg_style . '"><var>' . $output['logs']['memoryCount'] . '</var> <h4>Memory</h4></td>';
65+
echo '<td class="alt4" style="' . $side_bg_style . '"><var>' . $output['logs']['speedCount'] . '</var> <h4>Speed</h4></td>';
6166
echo '</tr>';
6267
echo '</table>';
6368
echo '<table class="main" cellspacing="0">';
6469

6570
$class = '';
6671
foreach ($output['logs']['console'] as $log) {
67-
if (!isset($log['type']) || $log['type'] == 'query')
72+
if (!isset($log['type']) || $log['type'] == 'query') {
6873
continue;
74+
}
6975

7076
echo '<tr class="log-' . $log['type'] . '"><td class="type">' . $log['type'] . '</td><td class="' . $class . '">';
7177

@@ -88,13 +94,13 @@ public static function display($output) {
8894
echo '</div>';
8995

9096
// Start Load Time tab
91-
echo '<div id="profiler-speed" class="profiler-box" style="background: url(../images/pqp/overlay.gif); border-top: 1px solid #ccc; height: 200px; overflow: auto;">';
97+
echo '<div id="profiler-speed" class="profiler-box" style="background: url(data:image/gif;base64,' . $overlay_image . '); border-top: 1px solid #ccc; height: 200px; overflow: auto;">';
9298
if ($output['logs']['speedCount'] == 0) {
9399
echo '<h3>This panel has no log items.</h3>';
94100
} else {
95101
echo '<table class="side" cellspacing="0">';
96-
echo '<tr><td><var>' . $output['speedTotals']['total'] . '</var><h4>Load Time</h4></td></tr>';
97-
echo '<tr><td class="alt"><var>' . $output['speedTotals']['allowed'] . '</var> <h4>Max Execution Time</h4></td></tr>';
102+
echo '<tr><td style="' . $side_bg_style . '"><var>' . $output['speedTotals']['total'] . '</var><h4>Load Time</h4></td></tr>';
103+
echo '<tr><td class="alt" style="' . $side_bg_style . '"><var>' . $output['speedTotals']['allowed'] . '</var> <h4>Max Execution Time</h4></td></tr>';
98104
echo '</table>';
99105
echo '<table class="main" cellspacing="0">';
100106

@@ -113,7 +119,7 @@ public static function display($output) {
113119
echo '</div>';
114120

115121
// Start Database tab
116-
echo '<div id="profiler-queries" class="profiler-box" style="background: url(../images/pqp/overlay.gif); border-top: 1px solid #ccc; height: 200px; overflow: auto;">';
122+
echo '<div id="profiler-queries" class="profiler-box" style="background: url(data:image/gif;base64,' . $overlay_image . '); border-top: 1px solid #ccc; height: 200px; overflow: auto;">';
117123
if ($output['queryTotals']['count'] == 0) {
118124
echo '<h3>This panel has no log items.</h3>';
119125
} else {
@@ -184,7 +190,7 @@ public static function display($output) {
184190
echo '</div>';
185191

186192
// Start Memory tab
187-
echo '<div id="profiler-memory" class="profiler-box" style="background: url(../images/pqp/overlay.gif); border-top: 1px solid #ccc; height: 200px; overflow: auto;">';
193+
echo '<div id="profiler-memory" class="profiler-box" style="background: url(data:image/gif;base64,' . $overlay_image . '); border-top: 1px solid #ccc; height: 200px; overflow: auto;">';
188194
if ($output['logs']['memoryCount'] == 0) {
189195
echo '<h3>This panel has no log items.</h3>';
190196
} else {
@@ -209,14 +215,14 @@ public static function display($output) {
209215
echo '</div>';
210216

211217
// Start Files tab
212-
echo '<div id="profiler-files" class="profiler-box" style="background: url(../images/pqp/overlay.gif); border-top: 1px solid #ccc; height: 200px; overflow: auto;">';
218+
echo '<div id="profiler-files" class="profiler-box" style="background: url(data:image/gif;base64,' . $overlay_image . '); border-top: 1px solid #ccc; height: 200px; overflow: auto;">';
213219
if ($output['fileTotals']['count'] == 0) {
214220
echo '<h3>This panel has no log items.</h3>';
215221
} else {
216222
echo '<table class="side" cellspacing="0">';
217-
echo '<tr><td><var>' . $output['fileTotals']['count'] . '</var><h4>Total Files</h4></td></tr>';
218-
echo '<tr><td class="alt"><var>' . $output['fileTotals']['size'] . '</var> <h4>Total Size</h4></td></tr>';
219-
echo '<tr><td><var>' . $output['fileTotals']['largest'] . '</var> <h4>Largest</h4></td></tr>';
223+
echo '<tr><td style="' . $side_bg_style . '"><var>' . $output['fileTotals']['count'] . '</var><h4>Total Files</h4></td></tr>';
224+
echo '<tr><td class="alt" style="' . $side_bg_style . '"><var>' . $output['fileTotals']['size'] . '</var> <h4>Total Size</h4></td></tr>';
225+
echo '<tr><td style="' . $side_bg_style . '"><var>' . $output['fileTotals']['largest'] . '</var> <h4>Largest</h4></td></tr>';
220226
echo '</table>';
221227
echo '<table class="main" cellspacing="0">';
222228

@@ -244,7 +250,7 @@ public static function display($output) {
244250
}
245251

246252
public static function displayJavascript() {
247-
echo '<style type="text/css">' . file_get_contents (dirname(__FILE__) . '/resources/profiler.css') . '</style>';
253+
echo '<style type="text/css">' . file_get_contents(dirname(__FILE__) . '/resources/profiler.css') . '</style>';
248254
echo '<script type="text/javascript">' . file_get_contents(dirname(__FILE__) . '/resources/profiler.js') . '</script>';
249255
}
250256
}

resources/images/overlay.gif

-44 Bytes
Binary file not shown.

resources/images/side.png

-205 Bytes
Binary file not shown.

resources/profiler.css

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,6 @@
7070

7171
/* ----- Side ----- */
7272
.profiler .side { float: left; width: 20%; background: #000; color: #fff; -webkit-border-bottom-left-radius: 30px; -moz-border-radius-bottomleft: 30px; text-align: center; }
73-
.profiler .side td { padding: 10px 0 5px 0; background: url(../images/pqp/side.png) repeat-y right; }
7473
.profiler .side var { color: #fff; font-size: 15px; }
7574
.profiler .side h4 { font-weight: normal; color: #F4FCCA; font-size: 11px; }
7675

@@ -100,7 +99,7 @@
10099
#profiler-speed .side td.alt { background-color: #2B5481; border-bottom: 1px solid #1E3C5C; border-left: 1px solid #1E3C5C; -webkit-border-bottom-left-radius: 30px; -moz-border-radius-bottomleft: 30px; }
101100

102101
/* ----- Queries ----- */
103-
#profiler-queries .side { background-color: #953FA1; border-bottom: 1px solid #662A6E; border-left: 1px solid #662A6E; }
102+
#profiler-queries .side { background-color: #953FA1; }
104103
#profiler-queries .side td.alt { background-color: #7B3384; }
105104
#profiler-queries .main b { float: none; }
106105
#profiler-queries .main em { display: block; padding: 2px 0 0 0; font-style: normal; color: #aaa; }
@@ -111,7 +110,7 @@
111110
#profiler-memory .side td.alt { background-color: #AC7200; border-bottom: 1px solid #865900; border-left: 1px solid #865900; -webkit-border-bottom-left-radius: 30px; -moz-border-radius-bottomleft: 30px; }
112111

113112
/* ----- Files ----- */
114-
#profiler-files .side { background-color: #B72F09; border-bottom: 1px solid #7C1F00; border-left: 1px solid #7C1F00; }
113+
#profiler-files .side { background-color: #B72F09; }
115114
#profiler-files .side td.alt { background-color: #9B2700; }
116115

117116
/* ----- Footer ----- */

0 commit comments

Comments
 (0)