node-red-contrib-metabase-embed/mb.html

Embed Metabase dashboards into Node-Red UI

<script type="text/javascript">
    RED.nodes.registerType('mb',{
        category: 'network',
        color: '#cee6ea',
        defaults: {
            name   : {value:""},
            url    : {value:""},
            token  : {value:""},
	    expire : {value:""},
            theme  : {value:""},
            title  : {value:""},
            border  : {value:""} 
        },
        inputs:1,
        outputs:1,
        icon: "icon.png",
	paletteLabel: 'Metabase',    
        label: function() {
            return this.name||"Metabase";
        }
    });
</script>

<script type="text/html" data-template-name="mb">
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-user"></i> Name</label>
        <input type="text" id="node-input-name" placeholder="Name">
    </div>
    <div class="form-row">
        <label for="node-input-url"><i class="fa fa-external-link"></i> URL</label>
        <input type="text" id="node-input-url" placeholder="http://localhost:3000">
    </div>
    <div class="form-row">
        <label for="node-input-token"><i class="fa fa-key"></i> Token</label>
        <input type="text" id="node-input-token" placeholder="xxxxxxxxxxxxxxxxxxxxxxx">
    </div>
    <div class="form-row">
        <label for="node-input-expire"><i class="fa fa-key"></i> Expire</label>
        <input type="number" id="node-input-expire" placeholder="100">
    </div>
    <div class="form-row">
        <label for="node-input-theme"><i class="fa fa-window-restore"></i> Theme</label>
            <select id="node-input-theme">
            <option value="">Light Mode</option>
            <option value="theme=night&">Dark Mode</option>
        </select>
    </div>
    <div class="form-row">
		<label for="node-input-title"><i class="fa fa-font"></i> Show title</label>
		<input type="checkbox" id="node-input-title" style="display: inline-block; width: auto; vertical-align: top;">
    </div>
    <div class="form-row">
		<label for="node-input-border"><i class="fa fa-square-o"></i> Show frame</label>
		<input type="checkbox" id="node-input-border" style="display: inline-block; width: auto; vertical-align: top;">
    </div>
</script>


<script type="text/x-red" data-help-name="mb">
<p>
  A simple node to embed Metabase dashboards.
</p>

  <h3>Input</h3>

  <h4>Embed dashboard</h4>
  <dl class="message-properties">
      <dt>payload
          <span class="property-type"></span>
      </dt>
      <dd>any trigger on input</dd>
  </dl>


  <h3>Outputs</h3>
    <ol class="node-ports">
        <li>Output
            <dl class="message-properties">
                <dt>msg.iframeUrl <span class="property-type"></span></dt>
                <dd></dd>
            </dl>
        </li>
    </ol>


  <h3>Configure Node</h3>
    <p>
    <code>node-red-contrib-metabase-embed</code> outputs Metabase embed payload on a received trigger on the input
    </p>
    <ol class="node-ports">
        <li>Name
            <dl class="message-properties">
                <dt>Node Name - Default **Metabase** <span class="property-type"></span></dt>
                <dd></dd>
            </dl>
        </li>
	<li>URL
            <dl class="message-properties">
                <dt>Web address of Metabase - Default **http://localhost:3000**<br> <span class="property-type"></span></dt>
                <dd></dd>
            </dl>
        </li>
	<li>Token
            <dl class="message-properties">
                <dt>Token created by Metabase - Default **xxxx** <span class="property-type"></span></dt>
                <dd></dd>
            </dl>
        </li>
	<li>Expire
            <dl class="message-properties">
                <dt>Minuites before link expires - Default **100** <span class="property-type"></span></dt>
                <dd></dd>
            </dl>
        </li>
	<li>Theme
            <dl class="message-properties">
                <dt>Theme mode` - Default **Light mode** <span class="property-type"></span></dt>
                <dd></dd>
            </dl>
        </li>
	<li>Title
            <dl class="message-properties">
                <dt>Show title` - Default **false** <span class="property-type"></span></dt>
                <dd></dd>
            </dl>
        </li>
	<li>Border
            <dl class="message-properties">
                <dt>Show border` - Default **false** <span class="property-type"></span></dt>
                <dd></dd>
            </dl>
        </li>
    </ol>
    <p>
    
</script>