Combine "dateFunction": momentDateFormatter" and"customCallback": populateTpl

[saturday1]

I am trying to use the template version (Example 8) combined with moment (Example 6, I think). But then I get problems with the moment js. It does not run the function at all and it does not catch the language moment.locale('sv_SE');. The code looks like this:

    <script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.3/moment.min.js"></script>

    <script type="text/javascript" src="js/twitterFetcher_min.js"></script>
<script>

moment.locale('sv_SE');

var config = {
    "id": '573452057987973120',
    "dataOnly": true,
    "maxTweets": 3,
    "dateFunction": momentDateFormatter,
    "customCallback": populateTpl
};

function momentDateFormatter(date, dateString) {
    return moment(dateString).fromNow();
}

twitterFetcher.fetch(config);

function populateTpl(tweets){
    var html = '<ul>';
    for (var i = 0, lgth = tweets.length; i < lgth ; i++) {
        var tweetObject = tweets[i];

        html += '<li>'
        + (tweetObject.image ? '<div class="tweet-img"><img src="'+tweetObject.image+'" /></div>' : '')
        + '<p class="tweet-content">' + tweetObject.tweet + '</p>'
        + '<p class="tweet-infos">Posted on the ' + tweetObject.time + ', by ' + tweetObject.author + '</p>'
        + '<p class="tweet-link"><a href="' + tweetObject.permalinkURL + '">Link</a></p>'
        + '</li>';
    }
    html += '</ul>';

    $('#twitter-feed').append(html);
}
</script>

You can see all HTML as well over here: https://cdn.axiell.com/dev/twitter/test/index.html

How do I run moment before the template function is running?

[jasonmayes]

I'm afraid I am not a user of moment, but it is possible in the recent Twitter changes the classname changed for the dates which means it may be returning null. Let me check.

[jasonmayes]

I can confirm Twitter Fetcher calls the function see this fiddle: https://jsfiddle.net/sxvfeza7/

There must be something not being used right with Moment in that case which is outside the scope of this project.

[saturday1]

Yes, above example works as intended, also over here (I have similar solution already in place). It is only when I use "dataOnly" it stops working. See the fiddle here which represents my code: https://jsfiddle.net/sxvfeza7/3/. As you can see it does not write anything in console.log. When I turn "dataonly" to false, it does work with dateFormatter.

[jasonmayes]

Ah, I see. I shall have a look at that.

[CoalaWeb]

I'm not sure if it helps but I submitted a pull request for this type of situation in the past as I found the dataonly option wasn’t allowing me to format the date. I forked the Fiddle @saturday1 created and you can see my changes from line 297-320 (open to improvement)

I can then format the date with out needing to load moment using some like this:

function dateFormatter(date) { var options = { weekday: "short", year: "numeric", month: "short", day: "numeric" }; return date.toLocaleDateString("sv-SE", options); }

I'm using it with the CMS Joomla and I load in the current language being used so the dates are formated as needed.

Cheers,

[eballeste]

when setting dataOnly to true, you can modify the raw data from the callback function

customCallback: (data) => {
  const convertedData = data.map( (post) => {
    const { timestamp } = post;
    const unixTimestamp = new Date(timestamp).getTime() / 1000;
    post.timestamp = unixTimestamp;
    
    return post;
  });

   // do something with convertedData
}