291 lines
13 KiB
HTML
291 lines
13 KiB
HTML
|
<!--
|
||
|
|
Copyright (c) 2018 Julian Knight (Totally Information)
|
||
|
|
|
||
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
||
|
|
you may not use this file except in compliance with the License.
|
||
|
|
You may obtain a copy of the License at
|
||
|
|
|
||
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
||
|
|
|
||
|
|
Unless required by applicable law or agreed to in writing, software
|
||
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
||
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||
|
|
See the License for the specific language governing permissions and
|
||
|
|
limitations under the License.
|
||
|
|
-->
|
||
|
|
|
||
|
|
<!-- This creates and configures the onscreen elements of the node -->
|
||
|
|
|
||
|
|
|
||
|
|
<!-- First, the content of the edit dialog is defined. -->
|
||
|
|
<script type="text/x-red" data-template-name="moment">
|
||
|
|
<!-- data-template-name identifies the node type this is for -->
|
||
|
|
|
||
|
|
<!-- INPUT -->
|
||
|
|
<div class="form-row">
|
||
|
|
<label for="node-input-input"><i class="fa fa-arrow-left"></i> Input from</label>
|
||
|
|
<input type="text" id="node-input-input" style="width: 70%;" placeholder="payload">
|
||
|
|
<input type="hidden" id="node-input-inputType">
|
||
|
|
</div>
|
||
|
|
<!-- INPUT TIMEZONE -->
|
||
|
|
<div class="form-row">
|
||
|
|
<label for="node-input-inTz">Input Timezone</label>
|
||
|
|
<input type="text" id="node-input-inTz" placeholder="[determined by system]" style="width:70%;">
|
||
|
|
</div>
|
||
|
|
<!-- ADJUSTMENT -->
|
||
|
|
<div class="form-row">
|
||
|
|
<label for="node-input-adjAmount"> Adjustment</label>
|
||
|
|
<select id="node-input-adjDir" style="width:4em">
|
||
|
|
<option value="add">+</option>
|
||
|
|
<option value="subtract">-</option>
|
||
|
|
</select>
|
||
|
|
<input type="text" id="node-input-adjAmount" placeholder="0" style="width:25%;">
|
||
|
|
<select id="node-input-adjType" style="width:30%">
|
||
|
|
<option value="days">Days</option>
|
||
|
|
<option value="hours">Hours</option>
|
||
|
|
<option value="weeks">Weeks</option>
|
||
|
|
<option value="months">Months</option>
|
||
|
|
<option value="quarters">Quarters</option>
|
||
|
|
<option value="years">Years</option>
|
||
|
|
<option value="minutes">Minutes</option>
|
||
|
|
<option value="seconds">Seconds</option>
|
||
|
|
<option value="milliseconds">Milliseconds</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- OUTPUT FORMAT -->
|
||
|
|
<br />
|
||
|
|
<div class="form-row">
|
||
|
|
<label for="node-input-format"><i class="fa fa-eye-open"></i> Output Format</label>
|
||
|
|
<input type="text" id="node-input-format" placeholder="ISO8601 (UTC)">
|
||
|
|
</div>
|
||
|
|
<!-- OUTPUT LOCALE -->
|
||
|
|
<div class="form-row">
|
||
|
|
<label for="node-input-locale"><i class="fa fa-flag"></i> Locale</label>
|
||
|
|
<input type="text" id="node-input-locale" placeholder="en">
|
||
|
|
</div>
|
||
|
|
<!-- OUTPUT TIMEZONE -->
|
||
|
|
<div class="form-row">
|
||
|
|
<label for="node-input-outTz">Output Tz</label>
|
||
|
|
<input type="text" id="node-input-outTz" placeholder="[determined by system]" style="width:70%;">
|
||
|
|
</div>
|
||
|
|
<!-- OUTPUT OBJECT -->
|
||
|
|
<div class="form-row">
|
||
|
|
<label for="node-input-output"><i class="fa fa-arrow-right"></i> Output to</label>
|
||
|
|
<input type="text" id="node-input-output" style="width: 70%;" placeholder="payload">
|
||
|
|
<input type="hidden" id="node-input-outputType">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<br/>
|
||
|
|
<!-- TOPIC -->
|
||
|
|
<div class="form-row">
|
||
|
|
<label for="node-input-topic"><i class="fa fa-tasks"></i> Topic</label>
|
||
|
|
<input type="text" id="node-input-topic" placeholder="Topic">
|
||
|
|
</div>
|
||
|
|
<!-- NODE NAME - Should always be the last field -->
|
||
|
|
<div class="form-row">
|
||
|
|
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
|
||
|
|
<input type="text" id="node-input-name" placeholder="Name">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="form-tips" style="font-size:83%">
|
||
|
|
See the info sidebar for formatting details. <br />
|
||
|
|
Use locale and format to change string output.<br />
|
||
|
|
See the info sidebar for several warnings about inputting strings.
|
||
|
|
</div>
|
||
|
|
</script>
|
||
|
|
|
||
|
|
|
||
|
|
<!-- Next, some simple help text is provided for the node. -->
|
||
|
|
<!-- The first <p> is used as the pop-up tool tip when hovering over pallette -->
|
||
|
|
<script type="text/x-red" data-help-name="moment">
|
||
|
|
<p>
|
||
|
|
Convert date/time object or string to nicely formatted text or date/time object.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
Uses the moment.js library. Now updated to use moment-timezone.js for full timezone and DST handling.
|
||
|
|
Also uses moment.parseFormat for string inputs and os-locale for output localisation.
|
||
|
|
This version requires Node v6+.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
See the <a href="https://github.com/TotallyInformation/node-red-contrib-moment">readme file</a> for a change log.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>Input</h3>
|
||
|
|
<p>
|
||
|
|
If the input property does not exist or is left blank, the current date/time will be assumed.
|
||
|
|
This can be used to add a current timestamp to a flow of any kind easily.
|
||
|
|
</p>
|
||
|
|
<p>Otherwise, the input is processed as follows:</p>
|
||
|
|
<ul>
|
||
|
|
<li>If input is "timestamp" or a JS datetime object or a <a href="http://momentjs.com/docs/#/parsing/">string that Moment.js</a> can resolve
|
||
|
|
(with the help of <a href="https://github.com/gr2m/moment-parseformat">moment.parseFormat</a>). It will be processed as normal.</li>
|
||
|
|
<li>If the input is null, is a blank string or a string that cannot be converted. The output will be an empty string.</li>
|
||
|
|
</ul>
|
||
|
|
|
||
|
|
<h4>String input warnings</h4>
|
||
|
|
<p>
|
||
|
|
Note that parsing date/time strings is a hard problem. moment.parseFormat helps but it isn't magic.
|
||
|
|
We assume that ambiguous input dates such as <code>3/5/05</code> are in EU/UK format <code>dd/mm/yy</code> <i>unless</i>
|
||
|
|
either the input timezone is in <i>America</i> or the locale is set to <i>en_US</i>.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>Input Timezone</h3>
|
||
|
|
<p>
|
||
|
|
If blank, the node will try to guess. If you have set your host system to a local timezone (e.g. <code>dpkg-reconfigure tzdata</code> on Linux)
|
||
|
|
then by default, input timestamps from the <code>inject</code> node will be in that timezone, otherwise they will be in UTC.
|
||
|
|
You can override this by specifying the full timezone in the format <code>region/location</code>,
|
||
|
|
e.g. <code>Europe/London</code>. Note that spellings are not validated, if it doesn't seem to work, check the valid timezone
|
||
|
|
list built in to moment-timezone.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>Output</h3>
|
||
|
|
<p>
|
||
|
|
Is a formatted string if the output format is anything other than <code>date</code> or <code>object</code>
|
||
|
|
in which case, the output is a Javascript date object or an object as described below respectively.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
Output string formatting is controlled by the Locale setting and the output format field.
|
||
|
|
Note that the output Timezone is ignored for ISO8601 output (the default), such output is <i>always</i>
|
||
|
|
in UTC. For other formats, the output will be in the specified timezone which defaults to your host timezone.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
Specifying different input and output timezones allows you to translated between them.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
The output msg will pass through the input msg.topic unless it is overridden. If the "Output to" field is changed
|
||
|
|
from the default <code>msg.payload</code>, the input msg.payload will also be passed through.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>Output String Formatting</h3>
|
||
|
|
<p>
|
||
|
|
May be any <a href="http://momentjs.com/docs/#/displaying/format/">format string
|
||
|
|
allowed by Moment.JS</a> (try <code>LLL</code> for a localised output for example).
|
||
|
|
The formatting additions from moment-timezone are also allowed.<br>
|
||
|
|
In addition, the following (not case sensitive, alternatives in brackets) format strings are also allowed:
|
||
|
|
</p>
|
||
|
|
<dl>
|
||
|
|
<dt>Blank (ISO8601, ISO)</dt>
|
||
|
|
<dd>
|
||
|
|
ISO 8602 format, e.g. "2015-01-28T16:24:48.123Z"<br>
|
||
|
|
Note that ISO8601 formatted output is ALWAYS in UTC ('Z', Zulu time) not
|
||
|
|
local, no matter what output timezone you may specify.
|
||
|
|
</dd>
|
||
|
|
<dt>date (jsDate)</dt>
|
||
|
|
<dd>
|
||
|
|
A Javascript Date object<br>
|
||
|
|
This is the default if the input is a recognised date string
|
||
|
|
</dd>
|
||
|
|
<dt>object</dt>
|
||
|
|
<dd>
|
||
|
|
A Javascript object in the form <code>{years:nnnn, months:n, date:n, hours:n, minutes:n, seconds:n, milliseconds:n}</code>
|
||
|
|
<br>
|
||
|
|
<em>WARNING</em>: moment.js has a bizarre object format where the month is zero-based (0-11) instead of 1-based (1-12) like all the other elements are.
|
||
|
|
I don't currently know why, I've raised an upstream issue but this appears to be a deliberate decision for some strange reason.
|
||
|
|
</dd>
|
||
|
|
<dt>fromNow (timeAgo)</dt>
|
||
|
|
<dd>
|
||
|
|
Human readable output<br />
|
||
|
|
e.g. 30 minutes ago
|
||
|
|
</dd>
|
||
|
|
<dt>calendar (aroundNow)</dt>
|
||
|
|
<dd>
|
||
|
|
Human readable alternative<br />
|
||
|
|
e.g. "Last Monday", "Tomorrow 2:30pm"<br />
|
||
|
|
Note that dates beyond a week from now are output as yyyy-mm-dd
|
||
|
|
</dd>
|
||
|
|
</dl>
|
||
|
|
<p>
|
||
|
|
Note that with the exception of ISO8601, other formats are in the specified
|
||
|
|
timezone & DST. If not specified, the output timezone/DST is the same as the input.<br />
|
||
|
|
Use an output timezone of <code>UTC</code> to force output to that.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
If output is shown in the wrong format, such as dates in US mm/dd/yy format, change the
|
||
|
|
output locale. For example, using <code>en_gb</code> will force short dates to output in
|
||
|
|
dd/mm/yy format. The default is <code>en</code> which moment assumes means the USA :-(
|
||
|
|
</p>
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<!-- Finally, the node type is registered along with all of its properties -->
|
||
|
|
<script type="text/javascript">
|
||
|
|
function tzValidate(val) {
|
||
|
|
// auto-correct the entry
|
||
|
|
//$('#node-input-inTz').val( val.replace(/^GMT|UTC/i, 'ETC/GMT') )
|
||
|
|
return true
|
||
|
|
}
|
||
|
|
|
||
|
|
RED.nodes.registerType('moment',{
|
||
|
|
category: 'formats', // the palette category
|
||
|
|
color: '#E6E0F8',
|
||
|
|
defaults: {
|
||
|
|
name: {value:''},
|
||
|
|
topic: {value:''},
|
||
|
|
input: {value:''},
|
||
|
|
inputType: {value:'msg'},
|
||
|
|
inTz: {value:'', validate:tzValidate},
|
||
|
|
adjAmount: {value:0, validate:RED.validators.number()},
|
||
|
|
adjType: {value:'days'},
|
||
|
|
adjDir: {value:'add'},
|
||
|
|
format: {value:''},
|
||
|
|
locale: {value:''},
|
||
|
|
output: {value:''},
|
||
|
|
outputType: {value:'msg'},
|
||
|
|
outTz: {value:'', validate:tzValidate}
|
||
|
|
},
|
||
|
|
inputs:1, // set the number of inputs - only 0 or 1
|
||
|
|
outputs:1, // set the number of outputs - 0 to n
|
||
|
|
// set the icon (held in icons dir below where you save the node)
|
||
|
|
icon: 'timer.png', // saved in icons/myicon.png
|
||
|
|
label: function() { // sets the default label contents
|
||
|
|
return this.name||this.topic||'Date/Time Formatter';
|
||
|
|
},
|
||
|
|
labelStyle: function() { // sets the class to apply to the label
|
||
|
|
return this.name?'node_label_italic':'';
|
||
|
|
},
|
||
|
|
oneditprepare: function() {
|
||
|
|
// Make sure we can reference parent this in async fns
|
||
|
|
var _this = this
|
||
|
|
|
||
|
|
if (!this.inputType) {
|
||
|
|
this.inputType = 'msg';
|
||
|
|
}
|
||
|
|
$('#node-input-input').typedInput({
|
||
|
|
default: 'msg',
|
||
|
|
types: ['msg','flow','global','date','str'],
|
||
|
|
typeField: $('#node-input-inputType')
|
||
|
|
});
|
||
|
|
if (!this.outputType) {
|
||
|
|
this.outputType = 'msg';
|
||
|
|
}
|
||
|
|
$('#node-input-output').typedInput({
|
||
|
|
default: 'msg',
|
||
|
|
types: ['msg','flow','global'],
|
||
|
|
typeField: $('#node-input-outputType')
|
||
|
|
});
|
||
|
|
|
||
|
|
// Get host locale and timezone
|
||
|
|
$.getJSON('contribapi/moment',function(data) {
|
||
|
|
// Save to parent object
|
||
|
|
_this.localeData = data
|
||
|
|
|
||
|
|
if ( $('#node-input-inTz').val() === '' ) $('#node-input-inTz').val(data.tz);
|
||
|
|
if ( $('#node-input-outTz').val() === '' ) $('#node-input-outTz').val(data.tz);
|
||
|
|
if ( $('#node-input-locale').val() === '' ) $('#node-input-locale').val(data.locale);
|
||
|
|
});
|
||
|
|
|
||
|
|
// Autocorrect timezone entries
|
||
|
|
$('#node-input-inTz').add('#node-input-outTz').blur( function(){
|
||
|
|
if( this.value === '' ) {
|
||
|
|
// Use saved locale data from parent object as default
|
||
|
|
this.value = _this.localeData.tz
|
||
|
|
} else {
|
||
|
|
// autocorrect common tz errors
|
||
|
|
this.value = this.value.replace(/^GMT|UTC/i, 'ETC/GMT')
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
} // --- end of oneditprepare --- //
|
||
|
|
}); // ---- end of RED.nodes.registerType ---- //
|
||
|
|
</script>
|