Question

I am looking for a widget/jquery plugin/hosted service or similar, that you can drop onto a html-page and it will display and update tweets live that contains a certain hashtag, but only from one or more configurable accounts + moderation to approve other people’s tweets with same hashtag.

Think newspaper that wants to live-tweet an event, but have control over what shows up on the page from others.

I have searched, but not found anything suitable – and I am sure it must exist.

Answer 1

Hiya demo http://jsfiddle.net/RGrgM/ or http://jsfiddle.net/RGrgM/show/

I have linked someone (my) tweets with this demo but you can link yours 🙂 I am lazy in twitter anyhooo 😛 this will help you. It will work with live feeds.

Rest everything is there and you can right click and see the source as well as read below code. B-)

This [link] might come handy: http://boxmodeljunkie.com/create-a-simple-twitter-widget-with-yui-3-and-yql/

🙂

D’uh don’t forget to accept and up vote innit!

it uses:

  <title>Twitter Feed Widget with YUI 3 &amp; YQL - jsFiddle demo</title>

  <script type='text/javascript' src='/js/lib/yui-min-3.2.0.js'></script>

Jquery code

// top-level global namespace
YUI.namespace('CIF');

// accepts a tweet timestamp and produces relational time text
YUI.CIF.relativeTime = function ( c ) {

    var origStamp = Date.parse( c ),

        curDate = new Date(),

        currentStamp = curDate.getTime(),

        difference = parseInt( ( currentStamp - origStamp ) / 1000, 10 ),

        dateArr = c.toString().split(' ');

    // if no difference, do nothing
    if ( difference < 0 ) {
        return false;
    }

    if ( difference <= 5 ) {
        return "Just now";
    }

    if ( difference <= 20 ) {
        return "Seconds ago";
    }

    if ( difference <= 60 ) {
        return "A minute ago";
    }

    if ( difference < 3600 ) {
        return parseInt( difference / 60, 10 ) + ' minutes ago';
    }

    if (difference <= 1.5 * 3600) {
        return "One hour ago";
    }

    if ( difference < 23.5 * 3600 ) {
        return Math.round( difference / 3600 ) + ' hours ago';
    }

    if (difference < 1.5*24*3600) {
        return "One day ago";
    }

    // produce date stamp for tweets older than a day
    return dateArr[3].replace( /\:\d+$/,'' ) + ' ' + dateArr[2] + ' ' + dateArr[1] + dateArr[5] !== curDate.getFullYear().toString() ? ' ' + dateArr[5] : '';

};

// load required modules and set up YUI instance
YUI().use( 'node', 'substitute', 'yql', function ( Y ) {

    var n = Y.one( '#twitterFeed' ),

        // accepts a YQL JSON result object and produces a list of 
        // tweets using Y.substitute for templating
        formatTwitterFeed = function ( r ) {

            if (r) {

                var s = r.query.results.statuses.status,

                    // HTML markup template
                    t = '<li><span class="status-text">{sText}</span> <span ' + 
                        'class="quiet status-time">{sTime}</span></li>',

                    l = s.length,

                    f = '<ul>',

                    i;

                for ( i = 0; i < l; i++ ) {

                    // Y.substitute method to merge HTML markup and result object
                    f += Y.substitute( t, {

                        // convert usernames, hash tags and URLs to links
                        sText : s[i].text
                            .replace(/(http\S+)/i,'<a href="$1" target="_blank">$1</a>')
                            .replace(/(@)([a-z0-9_\-]+)/i,
                                '<a href="http://twitter.com/$2" target="_blank">$1$2</a>')
                            .replace(/(#)(\S+)/ig, 
                                '<a href="http://search.twitter.com/search' + 
                                '?q=%23$2" target="_blank">$1$2</a>'),

                        sTime : YUI.CIF.relativeTime( s[i].created_at )

                    } );

                }

                f += '</ul>';

                f += '<a class="button" href="http://twitter.com/tats_innit" title="Follow @Tats_innit on Twitter" target="_blank">Follow on Twitter&nbsp;&raquo;</a>';

                // append output to target parent node
                n.append( f );

            }

        };

    // YQL Twitter query limited to five results for a specified username
    Y.YQL( 'select * from twitter.user.timeline( 5 ) ' + 
            'where screen_name="@tats_innit"', formatTwitterFeed );

});
​