frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00
Code Issues Releases Wiki Activity

Enhance Comment block with a editbox to allow for longer comments and possible help etc

Browse Source
This commit is contained in:
Dave C-J 2013-09-19 11:07:57 +01:00
parent 9b320d93ea
commit 3c456eaec4
2 changed files with 46 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
nodes/core/90-comment.html
View File

@ -19,10 +19,16 @@
<label for="node-input-name"><i class="icon-tag"></i> Comment</label>
<input type="text" id="node-input-name" placeholder="Comment">
</div>
<div class="form-row">
<label for="node-input-info"><i class="icon-file"></i> More</label>
<input type="hidden" id="node-input-info">
<div style="height: 250px;" class="node-text-editor" id="node-input-info-editor" ></div>
</div>
<div class="form-tips">Tip: this isn't meant for War and Peace - but useful notes can be kept here.</div>
</script>
<script type="text/x-red" data-help-name="comment">
<p>Simple comment block. More of a label really...</p>
<p>Simple comment block.</p>
</script>
<script type="text/javascript">
@ -30,7 +36,8 @@
category: 'function',
color:"#ffffff",
defaults: {
name: {value:""}
name: {value:""},
info: {value:""}
},
inputs:0,
outputs:0,
@ -40,6 +47,39 @@
},
labelStyle: function() {
return this.name?"node_label_italic":"";
},
oneditprepare: function() {
$( "#node-input-outputs" ).spinner({
min:1
});
function functionDialogResize(ev,ui) {
$("#node-input-info-editor").css("height",(ui.size.height-235)+"px");
};
$( "#dialog" ).on("dialogresize", functionDialogResize);
$( "#dialog" ).one("dialogopen", function(ev) {
var size = $( "#dialog" ).dialog('option','sizeCache-function');
if (size) {
functionDialogResize(null,{size:size});
}
});
$( "#dialog" ).one("dialogclose", function(ev,ui) {
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-info-editor'),
lang:"text",
showLinesRuler:false,
showFoldingRuler:false,
contents: $("#node-input-info").val()
});
});
},
oneditsave: function() {
$("#node-input-info").val(this.editor.getText());
delete this.editor;
}
});
</script>

3
public/style.css
View File

@ -238,6 +238,9 @@ a.brand img {
.node_label_italic {
font-style: italic;
}
.node_label_white {
fill: #eee !important;
}
.node_label {
stroke-width: 0;
fill: #333;