frodovdr
/
node-red
mirror of https://github.com/node-red/node-red.git
1
0
Fork 0
Code Issues Releases Wiki Activity

Add Markdown capability to Comment node 

body is rendered in the info tab and can be styled with Markdown
This commit is contained in:
dceejay 2015-01-29 15:57:05 +00:00
parent 27f9056360
commit 0ed8d28342
4 changed files with 35 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -16,21 +16,21 @@
<script type="text/x-red" data-template-name="comment"> <script type="text/x-red" data-template-name="comment">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-comment"></i> Comment</label> <label for="node-input-name"><i class="fa fa-comment"></i> Title</label>
<input type="text" id="node-input-name" placeholder="Comment"> <input type="text" id="node-input-name" placeholder="Comment">
</div> </div>
<div class="form-row" style="margin-bottom: 0px;"> <div class="form-row" style="margin-bottom: 0px;">
<label for="node-input-info" style="width: 100% !important;"><i class="fa fa-comments"></i> More</label> <label for="node-input-info" style="width: 100% !important;"><i class="fa fa-comments"></i> Body - will be rendered in info tab.</label>
<input type="hidden" id="node-input-info" autofocus="autofocus"> <input type="hidden" id="node-input-info" autofocus="autofocus">
</div> </div>
<div class="form-row node-text-editor-row"> <div class="form-row node-text-editor-row">
<div style="height: 250px;" class="node-text-editor" id="node-input-info-editor" ></div> <div style="height: 250px;" class="node-text-editor" id="node-input-info-editor" ></div>
</div> </div>
<div class="form-tips">Tip: this isn't meant for "War and Peace" - but useful notes can be kept here.</div> <div class="form-tips">Tip: The text here can be styled as <i><a href="https://help.github.com/articles/markdown-basics/" target="_new">Github flavored Markdown</a></i></div>
</script> </script>
<script type="text/x-red" data-help-name="comment"> <script type="text/x-red" data-help-name="comment">
<p>Simple comment block.</p> <p>Comment</p>
</script> </script>
<script type="text/javascript"> <script type="text/javascript">
@ -50,6 +50,9 @@
labelStyle: function() { labelStyle: function() {
return this.name?"node_label_italic":""; return this.name?"node_label_italic":"";
}, },
info: function() {
return "### "+this.name+"\n"+this.info;
},
oneditprepare: function() { oneditprepare: function() {
$( "#node-input-outputs" ).spinner({ $( "#node-input-outputs" ).spinner({
min:1 min:1

2
public/index.html
View File

@ -242,6 +242,7 @@
<script src="bootstrap/js/bootstrap.min.js"></script> <script src="bootstrap/js/bootstrap.min.js"></script>
<script src="jquery/js/jquery-ui-1.10.3.custom.min.js"></script> <script src="jquery/js/jquery-ui-1.10.3.custom.min.js"></script>
<script src="jquery/js/jquery.ui.touch-punch.min.js"></script> <script src="jquery/js/jquery.ui.touch-punch.min.js"></script>
<script src="marked/marked.min.js"></script>
<script src="orion/built-editor.min.js"></script> <script src="orion/built-editor.min.js"></script>
<script src="d3.v3.min.js"></script> <script src="d3.v3.min.js"></script>
<script src="red/main.js"></script> <script src="red/main.js"></script>
@ -263,5 +264,6 @@
<script src="red/ui/library.js"></script> <script src="red/ui/library.js"></script>
<script src="red/ui/notifications.js"></script> <script src="red/ui/notifications.js"></script>
<script src="red/ui/touch/radialMenu.js"></script> <script src="red/ui/touch/radialMenu.js"></script>
</body> </body>
</html> </html>

6
public/marked/marked.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

13
public/red/ui/tab-info.js
View File

@ -97,7 +97,18 @@ RED.sidebar.info = (function() {
if (node._def.info) { if (node._def.info) {
var info = node._def.info; var info = node._def.info;
table += '<div class="node-help">'+(typeof info === "function" ? info.call(node) : info)+'</div>'; marked.setOptions({
renderer: new marked.Renderer(),
gfm: true,
tables: true,
breaks: false,
pedantic: false,
sanitize: true,
smartLists: true,
smartypants: false
});
table += '<div class="node-help">'+marked(typeof info === "function" ? info.call(node) : info)+'</div>';
//table += '<div class="node-help">'+(typeof info === "function" ? info.call(node) : info)+'</div>';
} }
$("#tab-info").html(table); $("#tab-info").html(table);