huahaofeng
/
aspnetcore
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Removed jQuery from the error page: 

- All functionality working
- Tested in IE11/10/9/8 (via emulation mode), and Chrome latest
- Made the clickable areas cursor a pointer
- #11
This commit is contained in:
DamianEdwards 2014-05-01 18:18:27 -07:00
parent ba5f230c18
commit 257b2abc43
4 changed files with 390 additions and 240 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

313
src/Microsoft.AspNet.Diagnostics/Views/ErrorPage.cs
View File

File diff suppressed because one or more lines are too long

9
src/Microsoft.AspNet.Diagnostics/Views/ErrorPage.cshtml
View File

@ -4,9 +4,6 @@
@using Views @using Views
@functions @functions
{ {
/// <summary>
///
/// </summary>
public ErrorPageModel Model { get; set; } public ErrorPageModel Model { get; set; }
} }
@{ @{
@ -26,7 +23,6 @@
</style> </style>
</head> </head>
<body> <body>
Hello
<h1>@Resources.ErrorPageHtml_UnhandledException</h1> <h1>@Resources.ErrorPageHtml_UnhandledException</h1>
@if (Model.Options.ShowExceptionDetails) @if (Model.Options.ShowExceptionDetails)
{ {
@ -123,7 +119,7 @@
<div class="source"> <div class="source">
@if (frame.PreContextCode != null) @if (frame.PreContextCode != null)
{ {
<ol start="@frame.PreContextLine" class="collapsable"> <ol start="@frame.PreContextLine" class="collapsible">
@foreach (var line in frame.PreContextCode) @foreach (var line in frame.PreContextCode)
{ {
<li><span>@line</span></li> <li><span>@line</span></li>
@ -136,7 +132,7 @@
@if (frame.PostContextCode != null) @if (frame.PostContextCode != null)
{ {
<ol start='@(frame.Line + 1)' class="collapsable"> <ol start='@(frame.Line + 1)' class="collapsible">
@foreach (var line in frame.PostContextCode) @foreach (var line in frame.PostContextCode)
{ {
<li><span>@line</span></li> <li><span>@line</span></li>
@ -272,7 +268,6 @@
</div> </div>
*/ */
} }
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.js"></script>
<script> <script>
//<!-- //<!--
<%$ include: ErrorPage.js %> <%$ include: ErrorPage.js %>

98
src/Microsoft.AspNet.Diagnostics/Views/ErrorPage.css
View File

@ -1,5 +1,5 @@
body { body {
font-family: 'Segoe UI',Tahoma,Arial,Helvetica,sans-serif; font-family: 'Segoe UI', Tahoma, Arial, Helvetica, sans-serif;
font-size: .813em; font-size: .813em;
line-height: 1.4em; line-height: 1.4em;
color: #222; color: #222;
@ -25,7 +25,7 @@ h3 {
} }
code { code {
font-family: consolas, "Courier New", courier, monospace; font-family: Consolas, "Courier New", courier, monospace;
} }
body .titleerror { body .titleerror {
@ -47,22 +47,23 @@ body .location {
margin-bottom: 0px; margin-bottom: 0px;
} }
#header li { #header li {
display: inline; display: inline;
margin: 5px; margin: 5px;
padding: 5px; padding: 5px;
color: #a0a0a0; color: #a0a0a0;
} cursor: pointer;
}
#header li:hover { #header li:hover {
background: #A9E4F9; background: #a9e4f9;
color: #fff; color: #fff;
} }
#header li.selected { #header li.selected {
background: #44C5F2; background: #44c5f2;
color: #fff; color: #fff;
} }
#stackpage ul { #stackpage ul {
list-style: none; list-style: none;
@ -76,9 +77,9 @@ body .location {
border-bottom: 1px #ddd solid; border-bottom: 1px #ddd solid;
} }
#stackpage .stackerror:hover { #stackpage .stackerror:hover {
background-color: #f0f0f0; background-color: #f0f0f0;
} }
#stackpage .frame:hover { #stackpage .frame:hover {
background-color: #f0f0f0; background-color: #f0f0f0;
@ -89,43 +90,44 @@ body .location {
padding: 2px; padding: 2px;
margin: 0 0 0 30px; margin: 0 0 0 30px;
border-bottom: 1px #ddd solid; border-bottom: 1px #ddd solid;
cursor: pointer;
} }
#stackpage .frame h3 { #stackpage .frame h3 {
padding: 5px; padding: 5px;
margin: 0; margin: 0;
} }
#stackpage .source { #stackpage .source {
padding: 0px; padding: 0px;
} }
#stackpage .source ol li { #stackpage .source ol li {
font-family: consolas, "Courier New", courier, monospace; font-family: Consolas, "Courier New", courier, monospace;
white-space: pre; white-space: pre;
} }
#stackpage .source ol.highlight li { #stackpage .source ol.highlight li {
/*color: #e22;*/ /*color: #e22;*/
/*font-weight: bold;*/ /*font-weight: bold;*/
} }
#stackpage .source ol.highlight li span { #stackpage .source ol.highlight li span {
/*color: #000;*/ /*color: #000;*/
} }
#stackpage .frame:hover .source ol.highlight li span { #stackpage .frame:hover .source ol.highlight li span {
color: #fff; color: #fff;
background: #B20000; background: #b20000;
} }
#stackpage .source ol.collapsable li { #stackpage .source ol.collapsable li {
color: #888; color: #888;
} }
#stackpage .source ol.collapsable li span { #stackpage .source ol.collapsable li span {
color: #606060; color: #606060;
} }
.page table { .page table {
border-collapse: separate; border-collapse: separate;
@ -153,20 +155,20 @@ body .location {
box-sizing: border-box; box-sizing: border-box;
} }
.page th:last-child, .page td:last-child { .page th:last-child, .page td:last-child {
border-right: 1px transparent solid; border-right: 1px transparent solid;
} }
.page td.length { .page td.length {
text-align: right; text-align: right;
} }
a { a {
color: #1ba1e2; color: #1ba1e2;
text-decoration: none; text-decoration: none;
} }
a:hover { a:hover {
color: #13709e; color: #13709e;
text-decoration: underline; text-decoration: underline;
} }

210
src/Microsoft.AspNet.Diagnostics/Views/ErrorPage.js
View File

@ -1,35 +1,191 @@
(function (window, undefined) { (function (window, undefined) {
$('.collapsable').hide(); "use strict";
$('.page').hide();
$('#stackpage').show();
$('.frame').click(function () { function $(selector, element) {
$(this).children('.source').children('.collapsable').toggle('fast'); return new NodeCollection(selector, element);
}); }
$('.frame').keypress(function (e) { function NodeCollection(selector, element) {
if (e.which == 13) { this.items = [];
$(this).children('.source').children('.collapsable').toggle('fast'); element = element || window.document;
var nodeList;
if (typeof (selector) === "string") {
nodeList = element.querySelectorAll(selector);
for (var i = 0, l = nodeList.length; i < l; i++) {
this.items.push(nodeList.item(i));
}
} else if (selector.tagName) {
this.items.push(selector);
} else if (selector.splice) {
this.items = this.items.concat(selector);
} }
}); }
$('#header li').click(function () {
var unselected = $('#header .selected').removeClass('selected').attr('id'); NodeCollection.prototype = {
var selected = $(this).addClass('selected').attr('id'); each: function (callback) {
for (var i = 0, l = this.items.length; i < l; i++) {
$('#' + unselected + 'page').hide(); callback(this.items[i], i);
$('#' + selected + 'page').show('fast'); }
}); return this;
},
$('#header li').keypress(function (e) { children: function (selector) {
if (e.which == 13) { var children = [];
var unselected = $('#header .selected').removeClass('selected').attr('id');
var selected = $(this).addClass('selected').attr('id');
$('#' + unselected + 'page').hide(); this.each(function (el) {
$('#' + selected + 'page').show('fast'); children = children.concat($(selector, el).items);
});
return $(children);
},
hide: function () {
this.each(function (el) {
el.style.display = "none";
});
return this;
},
toggle: function () {
this.each(function (el) {
el.style.display = el.style.display === "none" ? "" : "none";
});
return this;
},
show: function () {
this.each(function (el) {
el.style.display = "";
});
return this;
},
addClass: function (className) {
this.each(function (el) {
var existingClassName = el.className,
classNames;
if (!existingClassName) {
el.className = className;
} else {
classNames = existingClassName.split(" ");
if (classNames.indexOf(className) < 0) {
el.className = existingClassName + " " + className;
}
}
});
return this;
},
removeClass: function (className) {
this.each(function (el) {
var existingClassName = el.className,
classNames, index;
if (existingClassName === className) {
el.className = "";
} else if (existingClassName) {
classNames = existingClassName.split(" ");
index = classNames.indexOf(className);
if (index > 0) {
classNames.splice(index, 1);
el.className = classNames.join(" ");
}
}
});
return this;
},
toggleClass: function (className) {
this.each(function (el) {
var classNames = el.className.split(" ");
if (classNames.indexOf(className) >= 0) {
$(el).removeClass(className);
} else {
$(el).addClass(className);
}
});
return this;
},
attr: function (name) {
if (this.items.length === 0) {
return null;
}
return this.items[0].getAttribute(name);
},
on: function (eventName, handler) {
this.each(function (el, idx) {
var callback = function (e) {
e = e || window.event;
if (!e.which && e.keyCode) {
e.which = e.keyCode; // Normalize IE8 key events
}
handler.apply(el, [e]);
};
if (el.addEventListener) { // DOM Events
el.addEventListener(eventName, callback, false);
} else if (el.attachEvent) { // IE8 events
el.attachEvent('on' + eventName, callback)
} else {
el['on' + type] = callback;
}
});
return this;
},
click: function (handler) {
return this.on("click", handler);
},
keypress: function (handler) {
return this.on("keypress", handler);
} }
}); };
})(window); function frame(el) {
$(el).children(".source .collapsible").toggle();
}
function tab(el) {
var unselected = $("#header .selected").removeClass("selected").attr("id");
var selected = $(el).addClass("selected").attr("id");
$("#" + unselected + "page").hide();
$("#" + selected + "page").show();
}
$(".collapsible").hide();
$(".page").hide();
$("#stackpage").show();
$(".frame")
.click(function () {
frame(this);
})
.keypress(function (e) {
if (e.which === 13) {
frame(this);
}
});
$("#header li")
.click(function () {
tab(this)
})
.keypress(function (e) {
if (e.which === 13) {
tab(this);
}
});
})(window);