apiNG

apiNG is an AngularJS directive that enables you to receive and display data from one or more sources. The data can be aggregated, limited and ordered. The complete setup is dead simple, just by adding data-attributes to your html.

Documentation

The Documentation comes up at apiNG.readme.io

Demos

Demo 1: Mixed Social Wall

apiNG Demo with some plugins and default design

Demo 1: HTML

<aping
    template-url="social_template.html"
    model="social"
    items="3"
    aping-youtube="[{'channelId':'UCuGcxogeiX5DbfzBMTl_aZQ'}]"
    aping-facebook="[{'page':'BreakingBad'}]"
    aping-codebird="[{'user':'adidas', 'showAvatar':false}]"
    aping-dailymotion="[{'userId':'electropose'}]"
    aping-tumblr="[{'page':'davidhinga'}]"
    aping-rss="[{'path':'http://blog.hackerearth.com/feed'}]"
    aping-vimeo="[{'channel':'worldhd'}]"
    aping-wikipedia="[{'search':'soccer'}]"
    aping-flickr="[{'tags':'münchen'}]">
</aping>

Demo 1: Result


Demo 2: Location based Social Wall

Social feed by coordinates (-13.163333, -72.545556) for Machu Picchu, Peru

Demo 2: HTML

<aping
    template-url="social_template_peru.html"
    model="social"
    items="6"
    aping-codebird="[{'search':'machu picchu', 'lat':'-13.163333', 'lng':'-72.545556', 'distance':5, 'result_type':'recent'}]"
    aping-youtube="[{'lat':'-13.163333', 'lng':'-72.545556', 'distance':'5000m'}]"
    aping-wikipedia="[{'title':'Machu Picchu'}]">
</aping>

Demo 2: Result

Authors and Contributors

Jonathan Hornung (@JohnnyTheTank)