Update core nodes to use ACE editor

This commit is contained in:
Nick O'Leary
2015-02-13 00:15:07 +00:00
parent 5adbc012f3
commit ddf31e87b2
3 changed files with 99 additions and 67 deletions

View File

@@ -1,5 +1,5 @@
<!--
Copyright 2013, 2014 IBM Corp.
Copyright 2013, 2015 IBM Corp.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@@ -34,22 +34,22 @@
</script>
<script type="text/x-red" data-help-name="function">
<p>A function block where you can write code to do more interesting things.</p>
<p>The message is passed in as a JavaScript object called <code>msg</code>.</p>
<p>By convention it will have a <code>msg.payload</code> property containing
the body of the message.</p>
<p>The function should return the messages it wants to pass on to the next nodes
in the flow. It can return:</p>
<ul>
<li>a single message object - passed to nodes connected to the first output</li>
<li>an array of message objects - passed to nodes connected to the corresponding outputs</li>
<p>A function block where you can write code to do more interesting things.</p>
<p>The message is passed in as a JavaScript object called <code>msg</code>.</p>
<p>By convention it will have a <code>msg.payload</code> property containing
the body of the message.</p>
<p>The function should return the messages it wants to pass on to the next nodes
in the flow. It can return:</p>
<ul>
<li>a single message object - passed to nodes connected to the first output</li>
<li>an array of message objects - passed to nodes connected to the corresponding outputs</li>
</ul>
<p>If any element of the array is itself an array of messages, multiple
messages are sent to the corresponding output.</p>
<p>If null is returned, either by itself or as an element of the array, no
message is passed on.</p>
<p>See the <a target="_new" href="http://nodered.org/docs/writing-functions.html">online documentation</a> for more help.</p>
messages are sent to the corresponding output.</p>
<p>If null is returned, either by itself or as an element of the array, no
message is passed on.</p>
<p>See the <a target="_new" href="http://nodered.org/docs/writing-functions.html">online documentation</a> for more help.</p>
</script>
<script type="text/javascript">
@@ -68,11 +68,13 @@
return this.name;
},
oneditprepare: function() {
var that = this;
$( "#node-input-outputs" ).spinner({
min:1
});
function functionDialogResize() {
that.editor.resize();
var rows = $("#dialog-form>div:not(.node-text-editor-row)");
var height = $("#dialog-form").height();
for (var i=0;i<rows.size();i++) {
@@ -82,7 +84,6 @@
height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
$(".node-text-editor").css("height",height+"px");
};
$( "#dialog" ).on("dialogresize", functionDialogResize);
$( "#dialog" ).one("dialogopen", function(ev) {
var size = $( "#dialog" ).dialog('option','sizeCache-function');
@@ -96,25 +97,32 @@
var height = $( "#dialog" ).dialog('option','height');
$( "#dialog" ).off("dialogresize",functionDialogResize);
});
var that = this;
require(["orion/editor/edit"], function(edit) {
that.editor = edit({
parent:document.getElementById('node-input-func-editor'),
lang:"js",
contents: $("#node-input-func").val()
});
RED.library.create({
url:"functions", // where to get the data from
type:"function", // the type of object the library is for
editor:that.editor, // the field name the main text body goes to
fields:['name','outputs']
});
$("#node-input-name").focus();
ace.require("ace/ext/language_tools");
that.editor = ace.edit('node-input-func-editor');
that.editor.setText = that.editor.setValue; // alias to make library work :-)
that.editor.getText = that.editor.getValue; // alias to make library work
//that.editor.setTheme("ace/theme/solarized_light");
//that.editor.setTheme("ace/theme/crimson_editor");
//that.editor.setTheme("ace/theme/chrome");
that.editor.setTheme("ace/theme/tomorrow");
that.editor.getSession().setMode("ace/mode/javascript");
that.editor.getSession().setFoldStyle("markbeginend");
that.editor.setOptions({enableBasicAutocompletion:true, enableSnippets:true});
that.editor.$blockScrolling = Infinity;
that.editor.setValue($("#node-input-func").val());
that.editor.gotoLine(1,1);
document.getElementById('node-input-func-editor').style.fontSize='17px';
RED.library.create({
url:"functions", // where to get the data from
type:"function", // the type of object the library is for
editor:that.editor, // the field name the main text body goes to
fields:['name','outputs']
});
$("#node-input-name").focus();
},
oneditsave: function() {
$("#node-input-func").val(this.editor.getText())
$("#node-input-func").val(this.editor.getValue());
delete this.editor;
}
});