lxm_front/eruda
1
0
Fork 0
mirror of https://github.com/liriliri/eruda.git synced 2026-04-05 10:28:34 +08:00
Code Issues Projects Releases Wiki Activity

Dev: Dir object viewer

Browse Source
This commit is contained in:
surunzi
2016-08-26 00:31:55 +08:00
parent c783f9eca6
commit bd389bc4cf
7 changed files with 118 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/Console/Log.es6
View File

@@ -2,6 +2,7 @@ import util from '../lib/util'
import stringify from '../lib/stringify.es6'
import highlight from '../lib/highlight.es6'
import beautify from 'js-beautify'
import JsonViewer from '../lib/JsonViewer.es6'
export default class Log
{
@@ -62,6 +63,9 @@ export default class Log
case 'log':
msg = formatMsg(args);
break;
case 'dir':
msg = formatDir(args);
break;
case 'info':
icon = 'info-circle';
msg = formatMsg(args);
@@ -98,17 +102,35 @@ export default class Log
delete this.args;
this._formattedMsg = msg;
}
static click(type, $el)
static click(type, log, $el)
{
switch (type)
{
case 'log':
case 'warn':
case 'info':
return 'src';
return 'viewSrc';
case 'error':
$el.find('.eruda-stack').toggleClass('eruda-hidden');
break;
case 'dir':
if (log.src)
{
let $json = $el.find('.eruda-json');
if ($json.hasClass('eruda-hidden'))
{
if ($json.data('init') !== 'true')
{
new JsonViewer(log.src, $json);
$json.data('init', 'true');
}
$json.rmClass('eruda-hidden');
} else
{
$json.addClass('eruda-hidden');
}
}
break;
}
return 'handled';
@@ -206,6 +228,13 @@ function formatMsg(args)
return args.join(' ');
}
function formatDir(args)
{
let msg = formatMsg(args);
return msg + '<div class="eruda-json eruda-hidden"></div>'
}
function substituteStr(args)
{
if (!util.isStr(args[0]) || args.length === 1) return args;

7
src/Console/Logger.es6
View File

@@ -224,14 +224,15 @@ export default class Logger extends util.Emitter
{
let $el = util.$(this),
idx = $el.data('idx'),
type = $el.data('type');
type = $el.data('type'),
log = self._renderLogs[idx];
let action = Log.click(type, $el);
let action = Log.click(type, log, $el);
switch (action)
{
case 'viewSrc':
let src = self._renderLogs[idx].src;
let src = log.src;
try {
if (!util.isObj(src)) src = JSON.parse(src);
self.emit('viewJson', src);

5
src/Console/Logger.scss
View File

@@ -100,6 +100,11 @@
border-top: 1px solid $yellow;
border-bottom: 1px solid $yellow;
}
&.dir {
.json {
padding-top: 10px;
}
}
&.info {
color: $blue;
}

2
src/Sources/Sources.es6
View File

@@ -2,7 +2,7 @@ import Tool from '../DevTools/Tool.es6'
import util from '../lib/util'
import beautify from 'js-beautify'
import highlight from '../lib/highlight.es6'
import JsonViewer from './JsonViewer.es6'
import JsonViewer from '../lib/JsonViewer.es6'
export default class Sources extends Tool
{

74
src/Sources/Sources.scss
View File

@@ -31,6 +31,9 @@
color: $gray;
}
}
.json {
padding: $padding 25px 10px;
}
.http {
.breadcrumb {
@include breadcrumb();
@@ -66,76 +69,5 @@
width: 100%;
height: 100%;
}
.json {
@include overflow-auto(x);
cursor: default;
font-family: $font-family-code;
font-size: $font-size-s;
line-height: 1.2;
background: #fff;
min-height: 100%;
padding: $padding 25px 10px;
&, ul {
list-style: none !important;
}
ul {
padding: 0 !important;
padding-left: 20px !important;
margin: 0 !important;
}
li {
position: relative;
white-space: nowrap;
}
& > li > .key,
& .array .key {
display: none;
}
.array .object .key {
display: inline;
}
.null {
color: #0086b3;
}
.string {
color: #183691;
}
.number {
color: #0086b3;
}
.boolean {
color: #0086b3;
}
.key {
color: #a71d5d;
}
.expanded:before {
content: "";
width: 0;
height: 0;
border: 4px solid transparent;
position: absolute;
border-top-color: $gray;
left: -12px;
top: 5px;
}
.collapsed:before {
content: "";
border-left-color: $gray;
border-top-color: transparent;
left: -10px;
top: 3px;
}
li .collapsed ~ .close:before {
content: "... ";
color: #999;
}
.hidden ~ ul {
display: none;
}
span {
position: static !important;
}
}
}
} }

4
src/Sources/JsonViewer.es6 → src/lib/JsonViewer.es6
View File

@@ -1,5 +1,5 @@
import util from '../lib/util'
import highlight from '../lib/highlight.es6'
import util from './util'
import highlight from './highlight.es6'
export default class JsonViewer
{

72
src/style/style.scss
View File

@@ -1,4 +1,5 @@
@import "variable";
@import "mixin";
.container {
pointer-events: none;
@@ -45,3 +46,74 @@
color: $green;
}
.container .json {
@include overflow-auto(x);
cursor: default;
font-family: $font-family-code;
font-size: $font-size-s;
line-height: 1.2;
background: #fff;
min-height: 100%;
&, ul {
list-style: none !important;
}
ul {
padding: 0 !important;
padding-left: 20px !important;
margin: 0 !important;
}
li {
position: relative;
white-space: nowrap;
}
& > li > .key,
& .array .key {
display: none;
}
.array .object .key {
display: inline;
}
.null {
color: #0086b3;
}
.string {
color: #183691;
}
.number {
color: #0086b3;
}
.boolean {
color: #0086b3;
}
.key {
color: #a71d5d;
}
.expanded:before {
content: "";
width: 0;
height: 0;
border: 4px solid transparent;
position: absolute;
border-top-color: $gray;
left: -12px;
top: 5px;
}
.collapsed:before {
content: "";
border-left-color: $gray;
border-top-color: transparent;
left: -10px;
top: 3px;
}
li .collapsed ~ .close:before {
content: "... ";
color: #999;
}
.hidden ~ ul {
display: none;
}
span {
position: static !important;
}
}