node-red-nodes/social/twitter/27-twitter.html

<!--
  Copyright 2013, 2015 IBM Corp.

  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.
-->

<script type="text/x-red" data-template-name="twitter-credentials">
    <div class="form-row" id="node-config-twitter-row"></div>
    <input type="hidden" id="node-config-input-screen_name">
</script>

<script type="text/javascript">
(function() {
    var twitterConfigNodeId = null;
    var twitterConfigNodeIntervalId = null;

    RED.nodes.registerType('twitter-credentials',{
        category: 'config',
        defaults: {
            screen_name: {value:""}
        },
        credentials: {
            screen_name: {type:"text"},
            access_token: {type: "password"},
            access_token_secret: {type:"password"}
        },
        label: function() {
            return this.screen_name;
        },
        exportable: false,
        oneditprepare: function() {
            var twitterConfigNodeId = this.id;
            var clickhere = this._("twitter.label.clickhere");
            var twitterID = this._("twitter.label.twitter-id");
            function showTwitterAuthStart() {
                var pathname = document.location.pathname;
                if (pathname.slice(-1) != "/") {
                    pathname += "/";
                }
                var callback = encodeURIComponent(location.protocol+"//"+location.hostname+":"+location.port+pathname+"twitter-credentials/"+twitterConfigNodeId+"/auth/callback");
                $("#node-config-dialog-ok").button("disable");
                $("#node-config-twitter-row").html('<div style="text-align: center; margin-top: 20px; "><a class="btn" id="node-config-twitter-start" href="twitter-credentials/'+twitterConfigNodeId+'/auth?callback='+callback+'" target="_blank">'+clickhere+'</a></div>');
                $("#node-config-twitter-start").click(function() {
                    twitterConfigNodeIntervalId = window.setTimeout(pollTwitterCredentials,2000);
                });
            }
            function updateTwitterScreenName(sn) {
                $("#node-config-input-screen_name").val(sn);
                $("#node-config-twitter-row").html('<label><i class="fa fa-user"></i> '+twitterID+'</label><span class="input-xlarge uneditable-input">'+sn+'</span>');
            }
            function pollTwitterCredentials(e) {
                $.getJSON('credentials/twitter-credentials/'+twitterConfigNodeId,function(data) {
                    if (data.screen_name) {
                        updateTwitterScreenName(data.screen_name);
                        twitterConfigNodeIntervalId = null;
                        $("#node-config-dialog-ok").button("enable");
                    } else {
                        twitterConfigNodeIntervalId = window.setTimeout(pollTwitterCredentials,2000);
                    }
                })
            }
            if (!this.screen_name || this.screen_name === "") {
                showTwitterAuthStart();
            } else {
                if (this.credentials.screen_name) {
                    updateTwitterScreenName(this.credentials.screen_name);
                } else {
                    showTwitterAuthStart();
                }
            }
        },
        oneditsave: function() {
            if (twitterConfigNodeIntervalId) {
                window.clearTimeout(twitterConfigNodeIntervalId);
            }
        },
        oneditcancel: function(adding) {
            if (twitterConfigNodeIntervalId) {
                window.clearTimeout(twitterConfigNodeIntervalId);
            }
        }
    });
})();
</script>

<script type="text/x-red" data-template-name="twitter in">
    <div class="form-row">
        <label for="node-input-twitter"><i class="fa fa-user"></i> <span data-i18n="twitter.label.twitter-id"></span></label>
        <input type="text" id="node-input-twitter">
    </div>
    <div class="form-row">
        <label for="node-input-user"><i class="fa fa-search"></i> <span data-i18n="twitter.label.search"></span></label>
        <select type="text" id="node-input-user" style="display: inline-block; vertical-align: middle; width:60%;">
            <option value="false" data-i18n="twitter.search.public"></option>
            <option value="true" data-i18n="twitter.search.follow"></option>
            <option value="user" data-i18n="twitter.search.user"></option>
            <option value="dm" data-i18n="twitter.search.direct"></option>
        </select>
    </div>
    <div class="form-row" id="node-input-tags-row">
        <label for="node-input-tags"><i class="fa fa-tags"></i> <span id="node-input-tags-label" data-i18n="twitter.label.for"></span></label>
        <input type="text" id="node-input-tags" data-i18n="[placeholder]twitter.placeholder.for">
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="node-red:common.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]node-red:common.label.name">
    </div>
    <div class="form-tips"><span data-i18n="[html]twitter.tip"></span></div>
</script>

<script type="text/x-red" data-help-name="twitter in">
    <p>Twitter input node. Can be used to search either:
    <ul><li>the public or a user's stream for tweets containing the configured search term</li>
        <li>all tweets by specific users</li>
        <li>direct messages received by the authenticated user</li>
    </ul></p>
    <p>Use space for <i>and</i> and comma , for <i>or</i> when searching for multiple terms.</p>
    <p>Sets the <code>msg.topic</code> to <i>tweets/</i> and then appends the senders screen name.</p>
    <p>Sets <code>msg.location</code> to the tweeters location if known.</p>
    <p>Sets <code>msg.tweet</code> to the full tweet object as documented by <a href="https://dev.twitter.com/overview/api/tweets">Twitter</a>.
    <p><b>Note:</b> when set to a specific user's tweets, or your direct messages, the node is subject to
      Twitter's API rate limiting. If you deploy the flows multiple times within a 15 minute window, you may
      exceed the limit and will see errors from the node. These errors will clear when the current 15 minute window
      passes.</p>
</script>

<script type="text/javascript">
    RED.nodes.registerType('twitter in',{
        category: 'social-input',
        color:"#C0DEED",
        defaults: {
            twitter: {type:"twitter-credentials",required:true},
            tags: {value:"",validate:function(v) { return this.user == "dm" || v.length > 0;}},
            user: {value:"false",required:true},
            name: {value:""},
            topic: {value:"tweets"}
        },
        inputs:0,
        outputs:1,
        icon: "twitter.png",
        label: function() {
            if (this.name) {
                return this.name;
            }
            if (this.user == "dm") {
                var user = RED.nodes.node(this.twitter);
                return (user?user.label()+" ":"")+this._("twitter.label.dmslabel");
            } else if (this.user == "user") {
                return this.tags+" "+this._("twitter.label.tweetslabel");
            }
            return this.tags;
        },
        labelStyle: function() {
            return this.name?"node_label_italic":"";
        },
        oneditprepare: function() {
            var userlabel = this._("twitter.label.user");
            var userph = this._("twitter.placeholder.user");
            var forlabel = this._("twitter.label.for");
            var forph = this._("twitter.placeholder.for");
            $("#node-input-user").change(function() {
                var type = $("#node-input-user option:selected").val();
                if (type == "user") {
                    $("#node-input-tags-row").show();
                    $("#node-input-tags-label").html(userlabel);
                    $("#node-input-tags").attr("placeholder",userph);
                } else if (type == "dm") {
                    $("#node-input-tags-row").hide();
                } else {
                    $("#node-input-tags-row").show();
                    $("#node-input-tags-label").html(forlabel);
                    $("#node-input-tags").attr("placeholder",forph);
                }

            });
            $("#node-input-user").change();
        }
    });
</script>


<script type="text/x-red" data-template-name="twitter out">
    <div class="form-row">
        <label for="node-input-twitter"><i class="fa fa-user"></i> <span data-i18n="twitter.label.twitter-id"></span></label>
        <input type="text" id="node-input-twitter">
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="node-red:common.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]node-red:common.label.name">
    </div>
</script>

<script type="text/x-red" data-help-name="twitter out">
    <p>Twitter out node. Tweets the <code>msg.payload</code>.</p>
    <p>To send a Direct Message (DM) - use a payload like "D {username} {message}"</p>
    <p>If <code>msg.media</code> exists and is a Buffer object, this node will treat it
       as an image and attach it to the tweet.</p>
    <p>If <code>msg.params</code> exists and is an object of name:value pairs,
    this node will treat it as parameters for the update request.</p>
</script>

<script type="text/javascript">
    RED.nodes.registerType('twitter out',{
        category: 'social-output',
        color:"#C0DEED",
        defaults: {
            twitter: {type:"twitter-credentials",required:true},
            name: {value:"Tweet"}
        },
        inputs:1,
        outputs:0,
        icon: "twitter.png",
        align: "right",
        label: function() {
            return this.name;
        }
    });
</script>