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

Add Markdown capability to Comment node

Browse Source 
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);