mirror of
https://bitbucket.org/bellord13/kit.git
synced 2026-11-13 19:06:11 +03:00
fix
This commit is contained in:
@@ -8,6 +8,7 @@
|
||||
--logger-color-info: hsl(205, 100%, 61%);
|
||||
--logger-color-debug: #909090;
|
||||
--logger-color-success: #8bc34a;
|
||||
--logger-lvl: 0;
|
||||
}
|
||||
.kit-logger, #kit-logger {
|
||||
margin: 0;
|
||||
@@ -25,7 +26,7 @@
|
||||
bottom: 0;
|
||||
height: 30vh;
|
||||
}
|
||||
bx_kit_log {
|
||||
logger-item {
|
||||
margin: 0;
|
||||
display: -ms-flexbox;
|
||||
display: -webkit-flex;
|
||||
@@ -46,34 +47,34 @@ bx_kit_log {
|
||||
-ms-flex-align: start;
|
||||
align-items: flex-start;
|
||||
white-space: pre-line;
|
||||
|
||||
padding-left: calc(var(--logger-lvl, 0) * 25px);
|
||||
font-size: 12px !important;
|
||||
line-height: 14px !important;
|
||||
}
|
||||
bx_kit_log_value * {
|
||||
logger-item__value * {
|
||||
color: inherit;
|
||||
}
|
||||
bx_kit_log_msg {
|
||||
logger-item__msg {
|
||||
|
||||
}
|
||||
bx_kit_log_key {
|
||||
logger-item__key {
|
||||
min-width: 25px;
|
||||
padding-right: 5px;
|
||||
white-space: nowrap;
|
||||
color: var(--logger-color-key, #909090);
|
||||
}
|
||||
bx_kit_log_key:empty {
|
||||
logger-item__key:empty {
|
||||
display: none;
|
||||
}
|
||||
bx_kit_log_lvl {
|
||||
logger-item__lvl {
|
||||
min-width: 25px;
|
||||
}
|
||||
bx_kit_log_value {
|
||||
logger-item__value {
|
||||
flex: 1 0 0;
|
||||
white-space: pre-wrap;
|
||||
color: var(--logger-color-value, #c1c1c1);
|
||||
}
|
||||
bx_kit_log_value * {
|
||||
logger-item__value * {
|
||||
font-size: inherit !important;
|
||||
line-height: inherit !important;
|
||||
color: inherit !important;
|
||||
|
||||
+37
-29
@@ -1,23 +1,19 @@
|
||||
/** @module logger */
|
||||
__PluginManager__.register('Logger', function(module, exports, require, global){
|
||||
|
||||
function makeNode(html = '') {
|
||||
var nodeWrap = document.createElement('div');
|
||||
nodeWrap.innerHTML = html;
|
||||
var r = nodeWrap.firstElementChild;
|
||||
r.remove();
|
||||
return r;
|
||||
}
|
||||
var support = require('support');
|
||||
|
||||
var lightMap = [
|
||||
{class: '', keys: []},
|
||||
{class: 'text-danger', keys: []},
|
||||
{class: 'text-secondary', keys: []},
|
||||
];
|
||||
var getLightClass = function(key) {
|
||||
key = ''+key;
|
||||
var addClass = '', ar;
|
||||
for(var i=0; i < lightMap.length; i++){
|
||||
ar = lightMap[i]['keys'];
|
||||
addClass = ar.includes(String(key))?lightMap[i]['class']:addClass;
|
||||
addClass = ar.includes(key)?lightMap[i]['class']:addClass;
|
||||
}
|
||||
return addClass;
|
||||
};
|
||||
@@ -32,20 +28,26 @@ __PluginManager__.register('Logger', function(module, exports, require, global){
|
||||
// }
|
||||
// return rArray.join(' ');
|
||||
// };
|
||||
function getRowNode(level, key, value, opClass){
|
||||
function getRowNode(level, key, value, opClass = ''){
|
||||
if(opClass) {
|
||||
opClass = ' kit-logger-row--'+opClass;
|
||||
}
|
||||
var i = 0, lvlTemplate = '', setStyle = '';
|
||||
level = Number(level);
|
||||
var i = 0, lvlTemplate = '';
|
||||
key = String(key);
|
||||
value = String(value);
|
||||
for(i = 0; i < level; i++){
|
||||
lvlTemplate += '<bx_kit_log_lvl></bx_kit_log_lvl>';
|
||||
}
|
||||
var result = '<bx_kit_log class="'+getLightClass(key)+opClass+'" style="'+setStyle+'">'+lvlTemplate+'<bx_kit_log_key class="">'+key+'</bx_kit_log_key><bx_kit_log_value class="text-log-value">'+value+'</bx_kit_log_value></bx_kit_log>';
|
||||
lvlTemplate = level?'style="--logger-lvl:'+level+';" ':'';
|
||||
var result = '<logger-item '+lvlTemplate+'class="'+getLightClass(key)+opClass+'"><logger-item__key>'+key+'</logger-item__key><logger-item__value>'+value+'</logger-item__value></logger-item>';
|
||||
|
||||
return makeNode(result);
|
||||
return support.makeNode(result);
|
||||
}
|
||||
function getItemObjectNode(id = ''){
|
||||
var entity = '', css = '', style = '';
|
||||
if(id) {
|
||||
css = '<style>input#'+id+':checked ~ [data-entity-id="'+id+'"] {display: block !important;}</style>';
|
||||
entity = ' data-entity-id="'+id+'"';
|
||||
style = ' style="display: none"'
|
||||
}
|
||||
return support.makeNode('<logger-item-object'+entity+style+'>'+css+'</logger-item-object>');
|
||||
}
|
||||
|
||||
function args2array(arguments) {
|
||||
@@ -70,7 +72,7 @@ __PluginManager__.register('Logger', function(module, exports, require, global){
|
||||
/**
|
||||
* @type {HTMLElement}
|
||||
*/
|
||||
this.collection = node || document.getElementById('kit-logger') || document.querySelector('.kit-logger') || makeNode(collectionTemplater);
|
||||
this.collection = node || document.getElementById('kit-logger') || document.querySelector('.kit-logger') || support.makeNode(collectionTemplater);
|
||||
|
||||
if((this.collection instanceof HTMLElement) && !this.collection.parentElement) {
|
||||
document.body.appendChild(this.collection)
|
||||
@@ -81,22 +83,28 @@ __PluginManager__.register('Logger', function(module, exports, require, global){
|
||||
this.setCollection();
|
||||
}
|
||||
var log = this.collection;
|
||||
var k = 0, j = 0, i = 0, m = 0, rowNode;
|
||||
var k = 0, j = 0, i = 0, m = 0, rowNode1, valNode1, rowNode2, isObj, val;
|
||||
|
||||
if(typeof message == 'object') {
|
||||
if(support.isObject(message)) {
|
||||
for(k in message) {
|
||||
log.appendChild(getRowNode(lvl, k, message[k], opClass));
|
||||
if(typeof message[k] == 'object') {
|
||||
log.appendChild(rowNode2 = getRowNode(lvl, k, message[k], opClass));
|
||||
if(support.isObject(message[k])) {
|
||||
log.appendChild(rowNode1 = getItemObjectNode());
|
||||
for(j in message[k]) {
|
||||
log.appendChild(getRowNode(lvl+1, j, message[k][j]));
|
||||
if(typeof message[k][j] == 'object') {
|
||||
isObj = support.isObject(message[k][j]);
|
||||
id = support.uniqueId();
|
||||
val = isObj?'<label for="'+id+'">'+message[k][j]+'</label>':message[k][j];
|
||||
rowNode1.appendChild(getRowNode(lvl+1, j, val));
|
||||
rowNode1.appendChild(support.makeNode('<input id="'+id+'" type="checkbox" style="display: none;">'));
|
||||
if(isObj) {
|
||||
rowNode1.appendChild(rowNode2 = getItemObjectNode(id));
|
||||
for(i in message[k][j]) {
|
||||
log.appendChild(getRowNode(lvl+2, i, message[k][j][i]));
|
||||
if(typeof message[k][j][i] == 'object') {
|
||||
for(m in message[k][j][i]) {
|
||||
log.appendChild(getRowNode(lvl+3, m, message[k][j][i][m]));
|
||||
}
|
||||
}
|
||||
rowNode2.appendChild(getRowNode(lvl+2, i, message[k][j][i]));
|
||||
// if(typeof message[k][j][i] == 'object') {
|
||||
// for(m in message[k][j][i]) {
|
||||
// log.appendChild(getRowNode(lvl+3, m, message[k][j][i][m]));
|
||||
// }
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user