[Twitter] Web Intents Javascript Events

Web Intetns, Twwet Button, Follow Button을 이용하고 계시다면, Web Intents Events를 통해 사용자가 Web Intents와 상호작용하는 정보를 얻으실 수 있습니다.

사용자가 Web Intent나 Tweet Button, Follow Button과 상호작용할 때 발생하는 event를 Web Analytics System등의 외부 시스템과의 통합도 손쉽게 구현하실 수 있습니다.

The Intent Event Object

Web Intents, Follow Button, Tweet Button에서 사용자가 특정한 행동을 취했을 때 발생하는 Event에 연결된 Callback method에는 Intent Event Object가 매개변수로 전달됩니다. 이 Intent Event Object는 다음과 같은 Method를 제공합니다.

Method	반환형	반환형 예시
type	발생한 Event 유형을 알려주는 String 값입니다.	"click", "favorite", "tweet", "retweet", "follow"
target	Event가 발생한 HTML DOM 또는 IFRAME DOM.
region	Tweet Button 또는 Follow Button에서 사용자가 클릭한 부분이 어떤 부분인지 표현하는 문자열 값입니다. 사용자가 클릭한 위치를 예를 들면 Tweet Button, Follow Button, Tweet Count, Screen Name가 있습니다.	"tweet", "follow", "count", "screen_name"
data	Web Intent의 동작정보와 관련된 Key/Value 쌍으로 이루어진 Hash값 입니다.	사용가능한 Key값은 "tweet_id", "source_tweet_id", "screen_name", "user_id" 등이 있습니다.

Intent Events

사용자가 특정 동작을 수행하면 Intent Event에 등록된 Callback 함수가 호출됩니다. 어떤 Web Intents는 하나의 동작에 여러 Event를 동시에 발생시킬 수 도 있습니다. 예를 들어 사용자가 Tweet Button을 통해 Tweet을 남기고 난 후 Follow Suggestion에 의해 해당 사용자를 Follow한다면, “follow”, “tweet” intent event가 동시에 실행 될 것입니다.

tweet

Supported by: Tweet Button, Web Intents

사용자가 tweet를 남길 경우 발생하는 event입니다.

twttr.events.bind('tweet', 
  function(event)
  {

  });

follow

Supported by: Tweet Button, Follow Button, Web Intents

사용자가 다른 사용자를 follow 할 때 발생하며, Event Object의 data method에서 user_id를 Key로 지정하면 follow된 사용자의 User Id값을 얻을 수 가 있습니다.

twttr.events.bind('follow', function(event) 
  {
    var followed_user_id = event.data.user_id;
    var followed_screen_name = event.data.screen_name;
  });

retweet

Supported by: Web Intents

retweet에 의해서 발생하며, Retweet된 원본 Tweet의 Tweet Id는 Event Object data method에 source_tweet_id라는 키로 저장되어 있습니다.

twttr.events.bind('retweet', function(event) 
  {
    var retweeted_tweet_id = event.data.source_tweet_id;
  });

favorite

Supported by: Web Intents

favorite 동작에 의해 발생하며, Event Object data method의 반환 값에 tweet_id를 Key로 지정하면 Favorite 대상 Tweet Id를 알 수 있습니다.

twttr.events.bind('favorite', function(event) 
  {
    var favorited_tweet_id = event.data.tweet_id;
  });

click

Supported by: Tweet Button, Follow Button

사용자가 Tweet Button이나 Follow Button을 클릭했을 때 발생합니다.

Callback method에 전달되는 Event Obejct의 region method는 다음과 같이 4가지 상태를 표현하는 string 값을 반환할 수 있습니다.

• “tweet” – Tweet Button이 클릭되었을 때 발생합니다.
• “count” – Tweet Button에서 Tweet Count 부분이 클릭되었을 때 발생하는 이벤트입니다.
• “follow” – Follow Button이 클릭되었을 때 발생합니다.
• “screen_name” - Follow Button의 Screen Name을 클릭했을 때 발생합니다. Screen Namq버튼을 클릭하면 Screen Name에 해당하는 User Intent가 팝업으로 나타나며 Follow할 수 있는 버튼이 제공됩니다. 만약 User Intent의 Follow Button을 클릭하면 follow event도 실행될 것입니다.

twttr.events.bind('click', function(event) 
  {
    var click_type = event.region;
  });

Detectable Events for Web Analytics

사용자가 Twitter와 상호작용하면서 발생하는 이벤트를 바탕으로 손쉽게 Web Analyrics System과 연동하실 수 있습니다. 하지만 반드시 해당 페이지는 HTTP 또는 HTTPS Protocol을 이용해야 event가 정상 동작합니다. 테스트를 위해 file://로 읽힌 페이지에서는 event가 동작하지 않을 것입니다.

// Log any kind of Web Intent event to Google Analytics
// Category: "twitter_web_intents"
// Action: Intent Event Type
// Label: Identifier for action taken: tweet_id, screen_name/user_id, click region

function clickEventToAnalytics(intent_event) 
{
    if (intent_event) 
    {
        var label = intent_event.region;
        pageTracker._trackEvent('twitter_web_intents', intent_event.type, label);
    };
}

function tweetIntentToAnalytics(intent_event) 
{
    if (intent_event) 
    {
        var label = "tweet";
        pageTracker._trackEvent('twitter_web_intents', intent_event.type, label);
    };
}

function favIntentToAnalytics(intent_event) 
{
    tweetIntentToAnalytics(intent_event);
}

function retweetIntentToAnalytics(intent_event) 
{
    if (intent_event) 
    {
        var label = intent_event.data.source_tweet_id;
        pageTracker._trackEvent('twitter_web_intents', intent_event.type, label);
    };
}

function followIntentToAnalytics(intent_event) 
{
    if (intent_event) 
    {
        var label = intent_event.data.user_id + " (" + intent_event.data.screen_name + ")";
        pageTracker._trackEvent('twitter_web_intents', intent_event.type, label);
    };
}

twttr.events.bind('click',    clickEventToAnalytics);
twttr.events.bind('tweet',    tweetIntentToAnalytics);
twttr.events.bind('retweet',  retweetIntentToAnalytics);
twttr.events.bind('favorite', favIntentToAnalytics);
twttr.events.bind('follow',   followIntentToAnalytics);