Codebird Example

Javascript Twitter Client with codebird-js as experiemental mockup for aero.

by Alex

HTML

<script src="https://rawgithub.com/mynetx/codebird-js/master/sha1.js"></script>
<script src="https://rawgithub.com/mynetx/codebird-js/master/codebird.js"></script>
<link rel="stylesheet" href="http://f.cl.ly/items/1u293f1y061i1e3s0i2f/bootstrap.min.css">
<div class="container">
    <div class="row">
        <div class="col-2">    
            <input type="button" class="btn btn-default" id="login" value="login" />
        </div>
        <div class="col-8">
            <div class="input-group">
                <span class="input-group-addon">PIN</span>
                <input type="text" id="pin" placeholder="insert twitter #PIN here..." />
            </div>
        </div>
        <div class="col-2">    
            <input type="button" class="btn btn-default" id="load" value="load" />
        </div>
    </div>

    <div class="row">
        <div class="col-4">
            <ul class="list-group">
                <li class="list-group-item"></li>
            </ul>
        </div>
        <div class="col-8">
            <div class="panel">
            </div>
        </div>
    </div>
</div>

CSS

.container{ margin:20px; }
.panel, .list-group{ margin-top:14px; }

JavaScript

/*
Tweetmarker
*/
var since = 0;
$.getJSON('http://tweetmarker-cors-proxy.eu01.aws.af.cm/v2/lastread', {
    "api_key": "AE-E1868F0EAE44",
    "username": "kulturpessimist"
}).done(function( data ) {
    console.log(data);
    since = data.timeline.id;
});

/*
CodeBird
*/
var cb          = new Codebird;
cb.setConsumerKey("qXgECN9jqhaZgVoRmq7Y0A", "7DbWeQxH2gGJLaClQtw8eyAXm5VCApHnqwoIejZjU");
cb.setProxy("https://codebird-cors-proxy.eu01.aws.af.cm/");
console.log('cb',cb);
// gets a request token
$('#login').click(function(){
    cb.__call(
        "oauth_requestToken",
        {oauth_callback: "oob"},
        function (reply) {
            // stores it
            cb.setToken(reply.oauth_token, reply.oauth_token_secret);
            // gets the authorize screen URL
            cb.__call(
                "oauth_authorize",
                {},
                function (auth_url) {
                    window.codebird_auth = window.open(auth_url);
                }
            );
        }
    );
});
$('#pin').blur(function(){
    cb.__call(
        "oauth_accessToken",
        { oauth_verifier: $('#pin').val() },
        function (reply) {
            // if you need to persist the login after page reload,
            // consider storing the token in a cookie or HTML5 local storage
            localStorage.setItem('oauth_token',reply.oauth_token);
            localStorage.setItem('oauth_token_secret',reply.oauth_token_secret); 
            $('#load').click();
        }
    );
});
$('#load').click(function(){
    // store the authenticated token, which may be different from the request token (!)
    var oauth_token = localStorage.getItem('oauth_token');
    var oauth_token_secret = localStorage.getItem('oauth_token_secret');
    cb.setToken(oauth_token, oauth_token_secret);
    // verify Credentials
    cb.__call(
	   "account_verifyCredentials",
       {  }, //skip_status: true
       function (reply) {
           console.log('credentials', reply);
       }
    );
  ...