fanbinit/rhymix
1
0
Fork 0
mirror of https://github.com/Lastorder-DC/rhymix.git synced 2026-05-11 04:52:14 +09:00
Code Issues Projects Releases Packages Wiki Activity

Improve debug panel styles, and change color to red if there are errors

Browse source
This commit is contained in:
Kijin Sung 2016-02-15 15:38:01 +09:00
parent 83bf38c245
commit 3045ac9c42
2 changed files with 55 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

32
common/css/xe.css
View file

@ -296,6 +296,7 @@ button.btn {
position: fixed; position: fixed;
left: 0; bottom: 40px; left: 0; bottom: 40px;
background: #eeeeee; background: #eeeeee;
background: linear-gradient(to bottom, #f4f4f4 0%, #eaeaea 100%);
border: 1px solid #ccc; border-left: 0; border: 1px solid #ccc; border-left: 0;
border-top-right-radius: 4px; border-top-right-radius: 4px;
border-bottom-right-radius: 4px; border-bottom-right-radius: 4px;
@ -303,7 +304,8 @@ button.btn {
z-index: 1073741824; z-index: 1073741824;
} }
#rhymix_debug_button:hover { #rhymix_debug_button:hover {
background: #444444; background: #dddddd;
background: linear-gradient(to bottom, #e8e8e8 0%, #d9d9d9 100%);
} }
#rhymix_debug_button a { #rhymix_debug_button a {
display: block; display: block;
@ -312,8 +314,8 @@ button.btn {
text-decoration: none; text-decoration: none;
padding: 4px 8px; padding: 4px 8px;
} }
#rhymix_debug_button a:hover { #rhymix_debug_button a.has_errors {
color: #eeeeee; color: #f44336;
} }
#rhymix_debug_panel { #rhymix_debug_panel {
display: none; display: none;
@ -369,6 +371,7 @@ button.btn {
padding-bottom: 8px; padding-bottom: 8px;
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
position: relative; position: relative;
cursor: pointer;
} }
#rhymix_debug_panel .debug_page .debug_page_header h3 { #rhymix_debug_panel .debug_page .debug_page_header h3 {
color: #444; color: #444;
@ -401,16 +404,25 @@ button.btn {
} }
#rhymix_debug_panel .debug_page .debug_entry { #rhymix_debug_panel .debug_page .debug_entry {
font-family: Consolas, "Courier New", monospace; font-family: Consolas, "Courier New", monospace;
color: #666; color: #444;
margin-left: 38px; margin-left: 38px;
margin-bottom: 8px; margin-bottom: 8px;
text-indent: -28px; text-indent: -28px;
white-space: pre-wrap; word-wrap: break-word;
word-break: break-all;
} }
#rhymix_debug_panel .debug_page .debug_entry.no_indentation { #rhymix_debug_panel .debug_page .debug_entry ul.debug_metadata {
margin-left: 10px; margin: 0 0 0 -16px; padding: 0;
text-indent: 0;
} }
#rhymix_debug_panel .debug_page .debug_entry.collapse_spaces { #rhymix_debug_panel .debug_page .debug_entry ul.debug_metadata li {
white-space: pre-line; list-style: disc;
margin: 0; padding: 0; text-indent: 0;
}
#rhymix_debug_panel .debug_page .debug_entry ul.debug_backtrace {
margin: 4px 0 0 16px; padding: 0;
}
#rhymix_debug_panel .debug_page .debug_entry ul.debug_backtrace li {
list-style: disc;
margin: 0; padding: 0; text-indent: 0;
color: #888;
} }

55
common/js/debug.js
View file

@ -13,7 +13,7 @@ $(function() {
var button = $("#rhymix_debug_button"); var button = $("#rhymix_debug_button");
// Initialize the debug button. // Initialize the debug button.
$('<a href="#"></a>').text("DEBUG").appendTo(button).click(function(event) { var button_link = $('<a href="#"></a>').text("DEBUG").appendTo(button).click(function(event) {
event.preventDefault(); event.preventDefault();
var max_width = Math.min(540, $(window).width()); var max_width = Math.min(540, $(window).width());
panel.css({ width: max_width, left: max_width * -1 }).show().animate({ left: 0 }, 200); panel.css({ width: max_width, left: max_width * -1 }).show().animate({ left: 0 }, 200);
@ -55,10 +55,13 @@ $(function() {
} }
// Create the page header. // Create the page header.
var page_header = $('<div class="debug_page_header"></div>').prependTo(page); var page_header = $('<div class="debug_page_header"></div>').prependTo(page).click(function() {
$(this).find("a.debug_page_collapse").triggerHandler("click");
});
page_header.append($('<h3></h3>').text(data.page_title).attr("title", data.url)); page_header.append($('<h3></h3>').text(data.page_title).attr("title", data.url));
page_header.append($('<a class="debug_page_collapse" href="#"></a>').text(open ? "▲" : "▼").click(function(event) { page_header.append($('<a class="debug_page_collapse" href="#"></a>').text(open ? "▲" : "▼").click(function(event) {
event.preventDefault(); event.preventDefault();
event.stopPropagation();
if (page_body.is(":visible")) { if (page_body.is(":visible")) {
page_body.slideUp(200); page_body.slideUp(200);
$(this).text("▼"); $(this).text("▼");
@ -70,10 +73,12 @@ $(function() {
// Add general information. // Add general information.
page_body.append($('<h4></h4>').text('General Information')); page_body.append($('<h4></h4>').text('General Information'));
page_body.append($('<div class="debug_entry no_indentation"></div>').text( entry = $('<div class="debug_entry"></div>').appendTo(page_body);
'Request: ' + data.request.method + ' (' + data.request.size + ' bytes)' + "\n" + var metadata = $('<ul class="debug_metadata"></ul>').appendTo(entry);
'Response: ' + data.response.method + ' (' + data.response.size + ' bytes)' + "\n" + metadata.append($('<li></li>').text('Request: ' + data.request.method + (data.request.method !== "GET" ? (' - ' + data.request.size + ' bytes') : "")));
'Time: ' + data.timing.total)); metadata.append($('<li></li>').text('Response: ' + data.response.method + ' - ' + data.response.size + ' bytes'));
metadata.append($('<li></li>').text('Total Time: ' + data.timing.total));
metadata.append($('<li></li>').text('Query Time: ' + data.timing.db_query));
// Add debug entries. // Add debug entries.
if (data.entries && data.entries.length) { if (data.entries && data.entries.length) {
@ -81,13 +86,13 @@ $(function() {
for (i in data.entries) { for (i in data.entries) {
entry = $('<div class="debug_entry"></div>').appendTo(page_body); entry = $('<div class="debug_entry"></div>').appendTo(page_body);
num = parseInt(i) + 1; if (num < 10) num = "0" + num; num = parseInt(i) + 1; if (num < 10) num = "0" + num;
backtrace = ""; entry.text(num + ". " + data.entries[i].message);
backtrace = $('<ul class="debug_backtrace"></ul>').appendTo(entry);
for (j in data.entries[i].backtrace) { for (j in data.entries[i].backtrace) {
if (data.entries[i].backtrace[j].file) { if (data.entries[i].backtrace[j].file) {
backtrace += "\n• " + data.entries[i].backtrace[j].file + ":" + data.entries[i].backtrace[j].line; backtrace.append($('<li></li>').text(data.entries[i].backtrace[j].file + ":" + data.entries[i].backtrace[j].line));
} }
} }
entry.text(num + ". " + data.entries[i].message + backtrace);
} }
} }
@ -97,13 +102,13 @@ $(function() {
for (i in data.errors) { for (i in data.errors) {
entry = $('<div class="debug_entry"></div>').appendTo(page_body); entry = $('<div class="debug_entry"></div>').appendTo(page_body);
num = parseInt(i) + 1; if (num < 10) num = "0" + num; num = parseInt(i) + 1; if (num < 10) num = "0" + num;
backtrace = ""; entry.text(num + ". " + data.errors[i].type + ": " + data.errors[i].message);
backtrace = $('<ul class="debug_backtrace"></ul>').appendTo(entry);
for (j in data.errors[i].backtrace) { for (j in data.errors[i].backtrace) {
if (data.errors[i].backtrace[j].file) { if (data.errors[i].backtrace[j].file) {
backtrace += "\n• " + data.errors[i].backtrace[j].file + ":" + data.errors[i].backtrace[j].line; backtrace.append($('<li></li>').text(data.errors[i].backtrace[j].file + ":" + data.errors[i].backtrace[j].line));
} }
} }
entry.text(num + ". " + data.errors[i].type + ": " + data.errors[i].message + backtrace);
} }
} }
@ -111,24 +116,30 @@ $(function() {
if (data.queries && data.queries.length) { if (data.queries && data.queries.length) {
page_body.append($('<h4></h4>').text('Queries (' + data.queries.length + ')')); page_body.append($('<h4></h4>').text('Queries (' + data.queries.length + ')'));
for (i in data.queries) { for (i in data.queries) {
entry = $('<div class="debug_entry collapse_spaces"></div>').appendTo(page_body); entry = $('<div class="debug_entry"></div>').appendTo(page_body);
num = parseInt(i) + 1; if (num < 10) num = "0" + num; num = parseInt(i) + 1; if (num < 10) num = "0" + num;
description = ""; entry.text(num + ". " + data.queries[i].query_string);
if (data.queries[i].query_connection) { description = $('<ul class="debug_backtrace"></ul>').appendTo(entry);
description += "\n• Caller: " + data.queries[i].file + ":" + data.queries[i].line + " (" + data.queries[i].method + ")"; if (data.queries[i].file && data.queries[i].line) {
description += "\n• Connection: " + data.queries[i].query_connection; description.append($('<li></li>').text("Caller: " + data.queries[i].file + ":" + data.queries[i].line).append("<br>(" + data.queries[i].method + ")"));
description += "\n• Query ID: " + data.queries[i].query_id; description.append($('<li></li>').text("Connection: " + data.queries[i].query_connection));
description += "\n• Query Time: " + (data.queries[i].query_time ? (data.queries[i].query_time.toFixed(4) + " sec") : ""); description.append($('<li></li>').text("Query ID: " + data.queries[i].query_id));
description.append($('<li></li>').text("Query Time: " + (data.queries[i].query_time ? (data.queries[i].query_time.toFixed(4) + " sec") : "")));
} }
description += "\n• Result: " + ((data.queries[i].message === "success" || !data.queries[i].message) ? "success" : ("error " + data.queries[i].error_code + " " + data.queries[i].message)); description.append($('<li></li>').text("Result: " + ((data.queries[i].message === "success" || !data.queries[i].message) ? "success" : ("error " + data.queries[i].error_code + " " + data.queries[i].message))));
entry.text(num + ". " + data.queries[i].query_string + description);
} }
} }
// If there are errors, turn the button text red.
if (data.errors && data.errors.length) {
button_link.addClass("has_errors");
}
}; };
// Add debug data from the previous request. // Add debug data from the previous request.
if (window.rhymix_debug_previous) { if (window.rhymix_debug_previous) {
window.rhymix_debug_previous.page_title = 'PREVIOUS POST: ' + window.rhymix_debug_previous.ajax_module + "." + window.rhymix_debug_previous.ajax_act; window.rhymix_debug_previous.page_title = 'PREVIOUS POST : ' + window.rhymix_debug_previous.ajax_module + "." + window.rhymix_debug_previous.ajax_act;
rhymix_debug_add_data(window.rhymix_debug_previous, false); rhymix_debug_add_data(window.rhymix_debug_previous, false);
} }