This commit is contained in:
2021-11-21 22:33:57 +03:00
parent 5f02b7a453
commit cafa01c3a5
9 changed files with 311 additions and 164 deletions
-100
View File
@@ -1,100 +0,0 @@
:root {
--logger-color-emergency: hsl(0, 100%, 55%);
--logger-color-alert: hsl(192, 100%, 98%);
--logger-color-critical: hsl(0, 100%, 55%);
--logger-color-error: hsl(0, 100%, 55%);
--logger-color-warning: hsl(31, 100%, 55%);
--logger-color-notice: #909090;
--logger-color-info: hsl(205, 100%, 61%);
--logger-color-debug: #909090;
--logger-color-success: #8bc34a;
--logger-lvl: 0;
}
.kit-logger, #kit-logger {
margin: 0;
padding: 5px;
font-family: monospace;
background: hsla(0, 0%, 11%, 1);
color: #909090;
height: 100%;
overflow-y: scroll !important;
word-break: break-all;
display: block;
}
.kit-logger--fixed {
position: sticky;
bottom: 0;
height: 30vh;
}
logger-item {
margin: 0;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-align-content: flex-start;
-ms-flex-line-pack: start;
align-content: flex-start;
-webkit-align-items: flex-start;
-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;
}
logger-item__value * {
color: inherit;
}
logger-item__msg {
}
logger-item__key {
min-width: 25px;
padding-right: 5px;
white-space: nowrap;
color: var(--logger-color-key, #909090);
}
logger-item__key:empty {
display: none;
}
logger-item__lvl {
min-width: 25px;
}
logger-item__value {
flex: 1 0 0;
white-space: pre-wrap;
color: var(--logger-color-value, #c1c1c1);
}
logger-item__value * {
font-size: inherit !important;
line-height: inherit !important;
color: inherit !important;
white-space: inherit !important;
}
.kit-logger-row--error {
--logger-color-key: var(--logger-color-error);
--logger-color-value: var(--logger-color-error);
}
.kit-logger-row--info {
--logger-color-key: var(--logger-color-info);
--logger-color-value: var(--logger-color-info);
}
.kit-logger-row--warning {
--logger-color-key: var(--logger-color-warning);
--logger-color-value: var(--logger-color-warning);
}
.kit-logger-row--success {
--logger-color-key: var(--logger-color-success);
--logger-color-value: var(--logger-color-success);
}
+25 -126
View File
@@ -1,162 +1,61 @@
/** @module logger */
/** @module Logger */
__PluginManager__.register('Logger', function(module, exports, require, global){
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(key)?lightMap[i]['class']:addClass;
}
return addClass;
};
var collectionTemplater = '<div class="kit-logger kit-logger--fixed"></div>';
// function dump(value) {
// var rArray = [];
// if(value === null) {
// rArray[0] = 'null';
// } else {
// rArray[0] = String(typeof value);
// rArray[1] = emptyPHP(value)?'empty':'';
// }
// return rArray.join(' ');
// };
function getRowNode(level, key, value, opClass = ''){
if(opClass) {
opClass = ' kit-logger-row--'+opClass;
}
var i = 0, lvlTemplate = '';
key = String(key);
value = String(value);
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 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) {
var args = [];
for (var i = 0; i < arguments.length; i++) {
args.push(arguments[i]);
}
return args;
}
var Collection = require('Collection');
/**
* @class Logger
* @memberOf kit
*/
var Logger = function() {
this.collection = undefined;
this.collection = new Collection();
this.onLog = new Collection();
};
/**
* @param node {HTMLElement}
* @param collection {kit.Collection}
*/
Logger.prototype.setCollection = function (node) {
/**
* @type {HTMLElement}
*/
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)
}
};
Logger.prototype.__row = function(message, lvl = 0, opClass = '') {
if (!this.collection) {
this.setCollection();
}
var log = this.collection;
function setObjectValue(log, lvl, key, value, opClass, depth = 3, openDepth = 1, isRoot = true) {
var rowChild, isObj = support.isObject(value), id = isObj?support.uniqueId():'',
val = (isObj&&depth)?'<label for="'+id+'">'+value+'</label>':value, inp, j,
len = isObj?Object.keys(value).length:0;
if(!isRoot || (isRoot && !isObj)) {
log.appendChild(getRowNode(lvl, key, '' + val + (isObj?(' ['+len+']'):''), opClass));
}
if(isObj&&depth) {
!isRoot && ++lvl;
depth = Math.max(0, depth - 1);
log.appendChild(inp = support.makeNode('<input id="'+id+'" type="checkbox" style="display: none;">'));
inp.checked = !!openDepth;
openDepth = Math.max(0, openDepth - 1);
log.appendChild(rowChild = getItemObjectNode(id));
for(j in value) {
if(value.hasOwnProperty(j))
setObjectValue(rowChild, lvl, j, value[j], opClass, depth, openDepth, false);
}
}
}
setObjectValue(log, lvl, '', message, opClass, 6, 3);
log.scrollTop = log.scrollHeight;
};
Logger.prototype.__log = function(lvl, type, message, context){
lvl = Number(lvl);
var opClass = '';
if(arguments.length >= 2) opClass = type;
if(arguments.length >= 3)
this.__row(message, lvl, opClass);
if(arguments.length >= 4)
this.__row(context, lvl+1);
Logger.prototype.setCollection = function (collection) {
this.collection = collection;
};
Logger.prototype.emergency = function (message, context) {
this.__log.apply(this, [0, 'emergency'].concat(args2array(arguments)));
this.log(0, message, context, 'emergency');
};
Logger.prototype.alert = function (message, context) {
this.__log.apply(this, [0, 'alert'].concat(args2array(arguments)));
this.log(0, message, context, 'alert');
};
Logger.prototype.critical = function (message, context) {
this.__log.apply(this, [0, 'critical'].concat(args2array(arguments)));
this.log(0, message, context, 'critical');
};
Logger.prototype.error = function (message, context) {
this.__log.apply(this, [0, 'error'].concat(args2array(arguments)));
this.log(0, message, context, 'error');
};
Logger.prototype.warning = function (message, context) {
this.__log.apply(this, [0, 'warning'].concat(args2array(arguments)));
this.log(0, message, context, 'warning');
};
Logger.prototype.notice = function (message, context) {
this.__log.apply(this, [0, 'notice'].concat(args2array(arguments)));
this.log(0, message, context, 'notice');
};
Logger.prototype.info = function (message, context) {
this.__log.apply(this, [0, 'info'].concat(args2array(arguments)));
this.log(0, message, context, 'info');
};
Logger.prototype.debug = function (message, context) {
this.__log.apply(this, [0, 'debug'].concat(args2array(arguments)));
this.log(0, message, context, 'debug');
};
Logger.prototype.success = function (message, context) {
this.__log.apply(this, [0, 'success'].concat(args2array(arguments)));
this.log(0, message, context, 'success');
};
Logger.prototype.log = function (lvl = 0, message = '', context, type) {
lvl = Number(lvl);
var opClass = '';
if(arguments.length >= 4) opClass = type;
if(arguments.length >= 2)
this.__row(message, lvl, opClass);
if(arguments.length >= 3)
this.__row(context, lvl+1, opClass);
var data = {
lvl: lvl,
type: type,
message: message,
context: context,
};
this.collection.push(data);
this.onLog.eachCall(this, data);
};
return module.exports = Logger;