1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00
node-red/editor/js/ui/utils.js

564 lines
26 KiB
JavaScript
Raw Normal View History

2016-11-03 00:20:48 +01:00
/**
* Copyright JS Foundation and other contributors, http://js.foundation
2016-11-03 00:20:48 +01:00
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
**/
RED.utils = (function() {
function formatString(str) {
return str.replace(/\r?\n/g,"↵").replace(/\t/g,"→");
}
function sanitize(m) {
return m.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");
}
2016-11-03 00:20:48 +01:00
function buildMessageSummaryValue(value) {
var result;
if (Array.isArray(value)) {
result = $('<span class="debug-message-object-value debug-message-type-meta"></span>').html('array['+value.length+']');
} else if (value === null) {
result = $('<span class="debug-message-object-value debug-message-type-null">null</span>');
} else if (typeof value === 'object') {
if (value.hasOwnProperty('type') && value.type === 'Buffer' && value.hasOwnProperty('data')) {
result = $('<span class="debug-message-object-value debug-message-type-meta"></span>').html('buffer['+value.length+']');
2016-11-03 00:20:48 +01:00
} else if (value.hasOwnProperty('type') && value.type === 'array' && value.hasOwnProperty('data')) {
result = $('<span class="debug-message-object-value debug-message-type-meta"></span>').html('array['+value.length+']');
} else {
result = $('<span class="debug-message-object-value debug-message-type-meta">object</span>');
}
} else if (typeof value === 'string') {
var subvalue;
if (value.length > 30) {
subvalue = sanitize(value.substring(0,30))+"&hellip;";
} else {
subvalue = sanitize(value);
2016-11-03 00:20:48 +01:00
}
result = $('<span class="debug-message-object-value debug-message-type-string"></span>').html('"'+formatString(subvalue)+'"');
} else {
result = $('<span class="debug-message-object-value debug-message-type-other"></span>').text(""+value);
}
return result;
}
2017-05-11 16:08:10 +02:00
function makeExpandable(el,onexpand,expand) {
2016-11-03 00:20:48 +01:00
el.addClass("debug-message-expandable");
el.click(function(e) {
var parent = $(this).parent();
if (parent.hasClass('collapsed')) {
if (onexpand && !parent.hasClass('built')) {
onexpand();
parent.addClass('built');
}
parent.removeClass('collapsed');
} else {
parent.addClass('collapsed');
}
e.preventDefault();
});
2017-05-11 16:08:10 +02:00
if (expand) {
el.click();
}
2016-11-03 00:20:48 +01:00
}
2017-05-11 16:08:10 +02:00
var pinnedPaths = {};
function addMessageControls(obj,sourceId,key,msg,rootPath,strippedKey) {
if (!pinnedPaths.hasOwnProperty(sourceId)) {
pinnedPaths[sourceId] = {}
}
var tools = $('<span class="debug-message-tools"></span>').appendTo(obj);
var copyTools = $('<span class="debug-message-tools-copy button-group"></span>').appendTo(tools);
var copyPath = $('<button class="editor-button editor-button-small"><i class="fa fa-terminal"></i></button>').appendTo(copyTools).click(function(e) {
e.preventDefault();
e.stopPropagation();
RED.clipboard.copyText(key,copyPath,"clipboard.copyMessagePath");
})
2017-05-11 16:08:10 +02:00
var copyPayload = $('<button class="editor-button editor-button-small"><i class="fa fa-clipboard"></i></button>').appendTo(copyTools).click(function(e) {
e.preventDefault();
e.stopPropagation();
RED.clipboard.copyText(msg,copyPayload,"clipboard.copyMessageValue");
})
2017-05-11 16:08:10 +02:00
if (strippedKey !== '') {
var isPinned = pinnedPaths[sourceId].hasOwnProperty(strippedKey);
2017-05-11 16:08:10 +02:00
var pinPath = $('<button class="editor-button editor-button-small debug-message-tools-pin"><i class="fa fa-map-pin"></i></button>').appendTo(tools).click(function(e) {
e.preventDefault();
e.stopPropagation();
if (pinnedPaths[sourceId].hasOwnProperty(strippedKey)) {
delete pinnedPaths[sourceId][strippedKey];
$(this).removeClass("selected");
obj.removeClass("debug-message-row-pinned");
} else {
var rootedPath = "$"+(strippedKey[0] === '['?"":".")+strippedKey;
pinnedPaths[sourceId][strippedKey] = normalisePropertyExpression(rootedPath);
$(this).addClass("selected");
obj.addClass("debug-message-row-pinned");
}
}).toggleClass("selected",isPinned);
obj.toggleClass("debug-message-row-pinned",isPinned);
}
}
2017-05-11 16:08:10 +02:00
function checkExpanded(strippedKey,expandPaths,minRange,maxRange) {
if (expandPaths && expandPaths.length > 0) {
if (strippedKey === '' && minRange === undefined) {
return true;
}
for (var i=0;i<expandPaths.length;i++) {
var p = expandPaths[i];
if (p.indexOf(strippedKey) === 0 && (p[strippedKey.length] === "." || p[strippedKey.length] === "[") ) {
2016-11-03 00:20:48 +01:00
2017-05-11 16:08:10 +02:00
if (minRange !== undefined && p[strippedKey.length] === "[") {
var subkey = p.substring(strippedKey.length);
var m = (/\[(\d+)\]/.exec(subkey));
if (m) {
var index = parseInt(m[1]);
return minRange<=index && index<=maxRange;
}
} else {
return true;
}
}
}
}
return false;
}
function buildMessageElement(obj,key,typeHint,hideKey,path,sourceId,rootPath,expandPaths) {
2016-11-03 00:20:48 +01:00
var i;
var e;
var entryObj;
var header;
var headerHead;
var value;
2017-05-11 16:08:10 +02:00
var strippedKey;
if (path && rootPath) {
strippedKey = path.substring(rootPath.length+(path[rootPath.length]==="."?1:0));
}
2016-11-03 00:20:48 +01:00
var element = $('<span class="debug-message-element"></span>');
header = $('<span class="debug-message-row"></span>').appendTo(element);
2017-05-11 16:08:10 +02:00
if (sourceId) {
addMessageControls(header,sourceId,path,obj,rootPath,strippedKey);
}
2016-11-03 00:20:48 +01:00
if (!key) {
element.addClass("debug-message-top-level");
2017-05-11 16:08:10 +02:00
if (sourceId) {
var pinned = pinnedPaths[sourceId];
expandPaths = [];
if (pinned) {
for (var pinnedPath in pinned) {
if (pinned.hasOwnProperty(pinnedPath)) {
try {
var res = getMessageProperty({$:obj},pinned[pinnedPath]);
if (res !== undefined) {
expandPaths.push(pinnedPath);
}
} catch(err) {
}
}
}
expandPaths.sort();
}
}
} else {
if (!hideKey) {
$('<span class="debug-message-object-key"></span>').text(key).appendTo(header);
$('<span>: </span>').appendTo(header);
}
2016-11-03 00:20:48 +01:00
}
entryObj = $('<span class="debug-message-object-value"></span>').appendTo(header);
var isArray = Array.isArray(obj);
var isArrayObject = false;
if (obj && typeof obj === 'object' && obj.hasOwnProperty('type') && obj.hasOwnProperty('data') && ((obj.__encoded__ && obj.type === 'array') || obj.type === 'Buffer')) {
2016-11-03 00:20:48 +01:00
isArray = true;
isArrayObject = true;
}
if (obj === null || obj === undefined) {
$('<span class="debug-message-type-null">'+obj+'</span>').appendTo(entryObj);
} else if (typeof obj === 'string') {
if (/[\t\n\r]/.test(obj)) {
element.addClass('collapsed');
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
makeExpandable(header, function() {
$('<span class="debug-message-type-meta debug-message-object-type-header"></span>').html(typeHint||'string').appendTo(header);
var row = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
$('<pre class="debug-message-type-string"></pre>').text(obj).appendTo(row);
2017-05-11 16:08:10 +02:00
},checkExpanded(strippedKey,expandPaths));
}
e = $('<span class="debug-message-type-string debug-message-object-header"></span>').html('"'+formatString(sanitize(obj))+'"').appendTo(entryObj);
if (/^#[0-9a-f]{6}$/i.test(obj)) {
$('<span class="debug-message-type-string-swatch"></span>').css('backgroundColor',obj).appendTo(e);
}
2016-11-03 00:20:48 +01:00
} else if (typeof obj === 'number') {
e = $('<span class="debug-message-type-number"></span>').text(""+obj).appendTo(entryObj);
if (Number.isInteger(obj) && (obj >= 0)) { // if it's a +ve integer
e.addClass("debug-message-type-number-toggle");
e.click(function(evt) {
var format = $(this).data('format') || "date";
if (format === 'dec') {
$(this).text(""+obj).data('format','date');
} else if ((format === 'date') && (obj.toString().length===13) && (obj<=2147483647000)) {
$(this).text((new Date(obj)).toISOString()).data('format','hex');
} else if ((format === 'date') && (obj.toString().length===10) && (obj<=2147483647)) {
$(this).text((new Date(obj*1000)).toISOString()).data('format','hex');
} else {
$(this).text("0x"+(obj).toString(16)).data('format','dec');
}
evt.preventDefault();
});
}
2016-11-03 00:20:48 +01:00
} else if (isArray) {
element.addClass('collapsed');
var originalLength = obj.length;
if (typeHint) {
var m = /\[(\d+)\]/.exec(typeHint);
if (m) {
originalLength = parseInt(m[1]);
}
}
var data = obj;
var type = 'array';
if (isArrayObject) {
data = obj.data;
if (originalLength === undefined) {
originalLength = data.length;
}
if (data.__encoded__) {
data = data.data;
}
2016-11-03 00:20:48 +01:00
type = obj.type.toLowerCase();
} else if (/buffer/.test(typeHint)) {
type = 'buffer';
}
var fullLength = data.length;
if (originalLength > 0) {
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
var arrayRows = $('<div class="debug-message-array-rows"></div>').appendTo(element);
element.addClass('debug-message-buffer-raw');
makeExpandable(header,function() {
if (!key) {
headerHead = $('<span class="debug-message-type-meta debug-message-object-type-header"></span>').html(typeHint||(type+'['+originalLength+']')).appendTo(header);
}
if (type === 'buffer') {
var stringRow = $('<div class="debug-message-string-rows"></div>').appendTo(element);
var sr = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(stringRow);
2016-11-03 00:20:48 +01:00
var stringEncoding = "";
try {
stringEncoding = String.fromCharCode.apply(null, new Uint16Array(data))
} catch(err) {
console.log(err);
}
$('<pre class="debug-message-type-string"></pre>').text(stringEncoding).appendTo(sr);
2016-11-03 00:20:48 +01:00
var bufferOpts = $('<span class="debug-message-buffer-opts"></span>').appendTo(headerHead);
$('<a href="#"></a>').addClass('selected').html('raw').appendTo(bufferOpts).click(function(e) {
if ($(this).text() === 'raw') {
$(this).text('string');
element.addClass('debug-message-buffer-string').removeClass('debug-message-buffer-raw');
} else {
$(this).text('raw');
element.removeClass('debug-message-buffer-string').addClass('debug-message-buffer-raw');
}
e.preventDefault();
e.stopPropagation();
})
}
var row;
if (fullLength <= 10) {
for (i=0;i<fullLength;i++) {
row = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(arrayRows);
2017-05-11 16:08:10 +02:00
buildMessageElement(data[i],""+i,false,false,path+"["+i+"]",sourceId,rootPath,expandPaths).appendTo(row);
2016-11-03 00:20:48 +01:00
}
} else {
for (i=0;i<fullLength;i+=10) {
var minRange = i;
row = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(arrayRows);
header = $('<span></span>').appendTo(row);
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').appendTo(header);
makeExpandable(header, (function() {
var min = minRange;
var max = Math.min(fullLength-1,(minRange+9));
var parent = row;
return function() {
for (var i=min;i<=max;i++) {
var row = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(parent);
2017-05-11 16:08:10 +02:00
buildMessageElement(data[i],""+i,false,false,path+"["+i+"]",sourceId,rootPath,expandPaths).appendTo(row);
2016-11-03 00:20:48 +01:00
}
}
2017-05-11 16:08:10 +02:00
})(),checkExpanded(strippedKey,expandPaths,minRange,Math.min(fullLength-1,(minRange+9))));
2016-11-03 00:20:48 +01:00
$('<span class="debug-message-object-key"></span>').html("["+minRange+" &hellip; "+Math.min(fullLength-1,(minRange+9))+"]").appendTo(header);
}
if (fullLength < originalLength) {
$('<div class="debug-message-object-entry collapsed"><span class="debug-message-object-key">['+fullLength+' &hellip; '+originalLength+']</span></div>').appendTo(arrayRows);
}
}
2017-05-11 16:08:10 +02:00
},checkExpanded(strippedKey,expandPaths));
2016-11-03 00:20:48 +01:00
}
if (key) {
headerHead = $('<span class="debug-message-type-meta f"></span>').html(typeHint||(type+'['+originalLength+']')).appendTo(entryObj);
} else {
headerHead = $('<span class="debug-message-object-header"></span>').appendTo(entryObj);
$('<span>[ </span>').appendTo(headerHead);
var arrayLength = Math.min(originalLength,10);
for (i=0;i<arrayLength;i++) {
buildMessageSummaryValue(data[i]).appendTo(headerHead);
if (i < arrayLength-1) {
$('<span>, </span>').appendTo(headerHead);
}
}
if (originalLength > arrayLength) {
$('<span> &hellip;</span>').appendTo(headerHead);
}
if (arrayLength === 0) {
$('<span class="debug-message-type-meta">empty</span>').appendTo(headerHead);
}
$('<span> ]</span>').appendTo(headerHead);
}
} else if (typeof obj === 'object') {
element.addClass('collapsed');
var keys = Object.keys(obj);
if (key || keys.length > 0) {
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
makeExpandable(header, function() {
if (!key) {
$('<span class="debug-message-type-meta debug-message-object-type-header"></span>').html('object').appendTo(header);
}
for (i=0;i<keys.length;i++) {
var row = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
var newPath = path;
if (/^[a-zA-Z_$][0-9a-zA-Z_$]*$/.test(keys[i])) {
newPath += "."+keys[i];
} else {
newPath += "[\""+keys[i].replace(/"/,"\\\"")+"\"]"
}
2017-05-11 16:08:10 +02:00
buildMessageElement(obj[keys[i]],keys[i],false,false,newPath,sourceId,rootPath,expandPaths).appendTo(row);
2016-11-03 00:20:48 +01:00
}
if (keys.length === 0) {
$('<div class="debug-message-object-entry debug-message-type-meta collapsed"></div>').text("empty").appendTo(element);
}
2017-05-11 16:08:10 +02:00
},checkExpanded(strippedKey,expandPaths));
2016-11-03 00:20:48 +01:00
}
if (key) {
$('<span class="debug-message-type-meta"></span>').html('object').appendTo(entryObj);
} else {
headerHead = $('<span class="debug-message-object-header"></span>').appendTo(entryObj);
$('<span>{ </span>').appendTo(headerHead);
var keysLength = Math.min(keys.length,5);
for (i=0;i<keysLength;i++) {
$('<span class="debug-message-object-key"></span>').text(keys[i]).appendTo(headerHead);
$('<span>: </span>').appendTo(headerHead);
buildMessageSummaryValue(obj[keys[i]]).appendTo(headerHead);
if (i < keysLength-1) {
$('<span>, </span>').appendTo(headerHead);
}
}
if (keys.length > keysLength) {
$('<span> &hellip;</span>').appendTo(headerHead);
}
if (keysLength === 0) {
$('<span class="debug-message-type-meta">empty</span>').appendTo(headerHead);
}
$('<span> }</span>').appendTo(headerHead);
}
} else {
$('<span class="debug-message-type-other"></span>').text(""+obj).appendTo(entryObj);
}
return element;
}
2017-05-11 16:08:10 +02:00
function normalisePropertyExpression(str) {
// This must be kept in sync with validatePropertyExpression
// in editor/js/ui/utils.js
var length = str.length;
2017-01-06 22:58:17 +01:00
if (length === 0) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: zero-length");
2017-01-06 22:58:17 +01:00
}
2017-05-11 16:08:10 +02:00
var parts = [];
var start = 0;
var inString = false;
var inBox = false;
var quoteChar;
var v;
for (var i=0;i<length;i++) {
var c = str[i];
if (!inString) {
if (c === "'" || c === '"') {
if (i != start) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: unexpected "+c+" at position "+i);
}
inString = true;
quoteChar = c;
start = i+1;
} else if (c === '.') {
2017-05-11 16:08:10 +02:00
if (i===0) {
throw new Error("Invalid property expression: unexpected . at position 0");
}
if (start != i) {
v = str.substring(start,i);
if (/^\d+$/.test(v)) {
parts.push(parseInt(v));
} else {
parts.push(v);
}
}
if (i===length-1) {
throw new Error("Invalid property expression: unterminated expression");
}
// Next char is first char of an identifier: a-z 0-9 $ _
if (!/[a-z0-9\$\_]/i.test(str[i+1])) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: unexpected "+str[i+1]+" at position "+(i+1));
}
start = i+1;
} else if (c === '[') {
if (i === 0) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: unexpected "+c+" at position "+i);
}
if (start != i) {
parts.push(str.substring(start,i));
}
if (i===length-1) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: unterminated expression");
}
// Next char is either a quote or a number
if (!/["'\d]/.test(str[i+1])) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: unexpected "+str[i+1]+" at position "+(i+1));
}
start = i+1;
inBox = true;
} else if (c === ']') {
if (!inBox) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: unexpected "+c+" at position "+i);
}
if (start != i) {
v = str.substring(start,i);
2017-05-11 16:08:10 +02:00
if (/^\d+$/.test(v)) {
parts.push(parseInt(v));
} else {
throw new Error("Invalid property expression: unexpected array expression at position "+start);
}
}
start = i+1;
inBox = false;
} else if (c === ' ') {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: unexpected ' ' at position "+i);
}
} else {
if (c === quoteChar) {
if (i-start === 0) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: zero-length string at position "+start);
}
2017-05-11 16:08:10 +02:00
parts.push(str.substring(start,i));
// If inBox, next char must be a ]. Otherwise it may be [ or .
if (inBox && !/\]/.test(str[i+1])) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: unexpected array expression at position "+start);
} else if (!inBox && i+1!==length && !/[\[\.]/.test(str[i+1])) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: unexpected "+str[i+1]+" expression at position "+(i+1));
}
start = i+1;
inString = false;
}
}
}
if (inBox || inString) {
2017-05-11 16:08:10 +02:00
throw new Error("Invalid property expression: unterminated expression");
}
if (start < length) {
parts.push(str.substring(start));
}
return parts;
}
function validatePropertyExpression(str) {
try {
var parts = normalisePropertyExpression(str);
return true;
} catch(err) {
return false;
}
2017-05-11 16:08:10 +02:00
}
function getMessageProperty(msg,expr) {
var result = null;
var msgPropParts;
if (typeof expr === 'string') {
if (expr.indexOf('msg.')===0) {
expr = expr.substring(4);
}
msgPropParts = normalisePropertyExpression(expr);
} else {
msgPropParts = expr;
}
var m;
msgPropParts.reduce(function(obj, key) {
result = (typeof obj[key] !== "undefined" ? obj[key] : undefined);
if (result === undefined && obj.hasOwnProperty('type') && obj.hasOwnProperty('data')&& obj.hasOwnProperty('length')) {
result = (typeof obj.data[key] !== "undefined" ? obj.data[key] : undefined);
}
return result;
}, msg);
return result;
}
function getNodeIcon(def,node) {
if (def.category === 'config') {
return "icons/node-red/cog.png"
} else if (node && node.type === 'tab') {
return "icons/node-red/subflow.png"
} else if (node && node.type === 'unknown') {
return "icons/node-red/alert.png"
}
var icon_url;
if (typeof def.icon === "function") {
try {
icon_url = def.icon.call(node);
} catch(err) {
console.log("Definition error: "+def.type+".icon",err);
icon_url = "arrow-in.png";
}
} else {
icon_url = def.icon;
}
return "icons/"+def.set.module+"/"+icon_url;
}
function getNodeLabel(node,defaultLabel) {
defaultLabel = defaultLabel||"";
var l = node._def.label;
try {
l = (typeof l === "function" ? l.call(node) : l)||defaultLabel;
} catch(err) {
console.log("Definition error: "+node.type+".label",err);
l = defaultLabel;
}
return RED.text.bidi.enforceTextDirectionWithUCC(l);
}
2016-11-03 00:20:48 +01:00
return {
createObjectElement: buildMessageElement,
2017-05-11 16:08:10 +02:00
getMessageProperty: getMessageProperty,
normalisePropertyExpression: normalisePropertyExpression,
validatePropertyExpression: validatePropertyExpression,
getNodeIcon: getNodeIcon,
getNodeLabel: getNodeLabel,
2016-11-03 00:20:48 +01:00
}
})();