CODEWITHSUNDEEP
javascripthtmltwitterwebintents
toby1kenobi
toby1kenobi

Reputation: 1701

Twitter web intent popup opening twice

I have a link (on a Font Awesome icon), that looks like this:

<a href="https://twitter.com/intent/tweet?text=Some text about this link&amp;url=http://some.site.co/wow/greatamp;via=toby1kenobi">
    <span class="fa fa-twitter-square"></span>
</a>

and I'm using the Javascript snippet under 'Limited Dependencies' on this page, this is just after the link. It's the only web intent on the page.

If I click the link the Twitter popup opens and the original page navigates to the same content displayed in the popup.

I can't figure out what I've done wrong - if I attach another event to the link and call preventDefault(), that stops the duplication, but I gather that shouldn't be necessary.

EDIT Here is Twitter's code:

(function() {
  if (window.__twitterIntentHandler) return;
  var intentRegex = /twitter\.com(\:\d{2,4})?\/intent\/(\w+)/,
      windowOptions = 'scrollbars=yes,resizable=yes,toolbar=no,location=yes',
      width = 550,
      height = 420,
      winHeight = screen.height,
      winWidth = screen.width;
 
  function handleIntent(e) {
    e = e || window.event;
    var target = e.target || e.srcElement,
        m, left, top;
 
    while (target && target.nodeName.toLowerCase() !== 'a') {
      target = target.parentNode;
    }
 
    if (target && target.nodeName.toLowerCase() === 'a' && target.href) {
      m = target.href.match(intentRegex);
      if (m) {
        left = Math.round((winWidth / 2) - (width / 2));
        top = 0;
 
        if (winHeight > height) {
          top = Math.round((winHeight / 2) - (height / 2));
        }
 
        window.open(target.href, 'intent', windowOptions + ',width=' + width +
                                           ',height=' + height + ',left=' + left + ',top=' + top);
        e.returnValue = false;
        e.preventDefault && e.preventDefault();
      }
    }
  }
 
  if (document.addEventListener) {
    document.addEventListener('click', handleIntent, false);
  } else if (document.attachEvent) {
    document.attachEvent('onclick', handleIntent);
  }
  window.__twitterIntentHandler = true;
}());

It binds to the click event of the document (rather than any anchors), I don't understand why it does not cancel the default navigation though. It seems to hit the "e.preventDefault && e.preventDefault();" line ok.

Upvotes: 2

Views: 1128

Answers (3)

Mel Jennings
Mel Jennings

Reputation: 1

The problem is caused by the widget.js code adding a second intent with original_referer= added to your requested intent and presto 2 for the price of one.

https://twitter.com/intent/user?screen_name= &original_referer=

{function r(t){var e=~a.host.indexOf("poptip.com")?"https://poptip.com":a.href,n="original_referer="+e;return[t,n].join(-1==t.indexOf("?")?"?":"&")}

In other words your added code is duplicating Intent Pop up code functionality already included in the widget.js

Upvotes: -1

Ezra Free
Ezra Free

Reputation: 754

I know this question is from back in July, but in case anyone else comes across this I just experienced the same thing when creating a link with an onclick attribute that opens a popup window. It looks like because we are also including platform.twitter.com/widgets.js this widgets.js file includes code to trigger a popup window as well. I removed the onclick and the popup window is still created (with just a normal <a> tag link). It's just a workaround but it does resolve the issue at hand. Now I am just trying to figure out if there's a way to disable the open.window functionality from widgets.js somehow.

Upvotes: 4

Vishnu Prasad
Vishnu Prasad

Reputation: 727

Try with

   var factText = <!---text you want to share -->;
   var redirectUrl = <!---url you want to redirect from twitter -->;

        // Convert to string
        var factStr = factText.toString();

        // Fact length
        var factLen = factText.length;

        // Formats "facts" that are too long... remove if not needed
        if (factLen > 103) { // max chacters allowed
            // trim, and allow space for '...'"
            var trimFact = factStr.substring(0, 70);
            var trimFact = trimFact.trim(); //<-- ensures the last character isnt ' '
            factStr = trimFact + "...";
        }

        // Update the link

        var linkRef = " https://twitter.com/intent/tweet?text= " + factStr +"&url="+ redirectUrl +"&hashtags=tweetTest";

        window.open(linkRef, 'mywin','left=20,top=20,width=500,height=500,toolbar=1,resizable=0')

        jQuery('#factLink').attr('href', linkRef);

Upvotes: 0

Related Questions