{"id":1693,"date":"2014-11-12T15:33:25","date_gmt":"2014-11-12T20:33:25","guid":{"rendered":"http:\/\/blogs.library.duke.edu\/bitstreams\/?p=1693"},"modified":"2014-11-12T15:33:25","modified_gmt":"2014-11-12T20:33:25","slug":"new-angles-avenues-bitstreams","status":"publish","type":"post","link":"https:\/\/blogs.library.duke.edu\/bitstreams\/2014\/11\/12\/new-angles-avenues-bitstreams\/","title":{"rendered":"New Angles & Avenues for Bitstreams"},"content":{"rendered":"

This week, we added a display of our most recent Bitstreams blog posts to our Digital Collections homepage (example<\/a>), and likewise, a view of posts relevant to a given collection on the respective collection\u2019s homepage (example<\/a>).<\/p>\n

\"Screen<\/p>\n

Background<\/h2>\n

Our Digital Projects & Production team has been writing in Bitstreams<\/a> at least weekly since February 2014. We\u2019ve had some excellent guest contributors, too. Some posts share updates about new digital collections or additions, while others share insights, lessons learned, and behind-the-scenes looks at the projects we\u2019re currently tackling.<\/p>\n

Many of our posts have been featured on our library homepage<\/a> and library news site<\/a>. But until now, we haven\u2019t been able to display any of them\u2014not even the ones about new digital collections\u2014alongside the collections themselves. So, if you visited the DukEngineer<\/a> collection in the past, you likely missed out on Melanie\u2019s excellent overview<\/a>, which puts the magazine in context and highlights the best of what\u2019s inside.<\/p>\n

Past Solutions<\/h3>\n

Syndicating tagged blog posts for display elsewhere is a pretty common use case, and we\u2019ve used a bunch of different solutions as our platforms have evolved. Each solution has naturally been painstakingly tailored to accommodate the inner workings of both the source and the destination. Seven years ago, we were writing custom XSLT to create and then consume our own RSS feeds in Cascade Server CMS. We have since hopped over to\u00a0Wordpress for managing news and blogs (whew!). An older version of our digital collections app used WordPress\u2019 XML-RPC API to get tagged posts and parsed them with Python.<\/p>\n

These days, our library website does blog syndication by using\u00a0a combo of WordPress RSS<\/a>, Drupal\u2019s feed aggregator module<\/a>, and occasionally Yahoo! Pipes<\/a> for data mashing and munging. It works well in Drupal, but other platforms require\u00a0other approaches.<\/p>\n

Under the Hood: Angular.js and\u00a0Wordpress JSON API<\/h2>\n

Bret Davidson\u2019s Code4Lib 2014 presentation,\u00a0Towards Pasta Code Nirvana: Using JavaScript MVC to Fill Your Programming Ravioli<\/a> \u00a0(slides<\/a>)\u00a0made me hungry. Hungry for pasta, yes, but also for knowledge.\u00a0I wanted to:<\/p>\n

    \n
  1. Experiment with one of the Javascript MVC frameworks to learn how they work, and in the process…<\/li>\n
  2. Build something potentially useful for digital collections that could be ported over to a new application framework in the future (e.g., from our current Django app to a future Ruby on Rails app).<\/li>\n<\/ol>\n

    From the many possibilities<\/a>, I chose AngularJS<\/a>.\u00a0It seemed well-documented, increasingly popular<\/a>, and with\u00a0Google\u2019s backing, it seems like it’ll be around for awhile.<\/p>\n

    WordPress JSON API<\/h3>\n

    Among Angular\u2019s virtues is that it really simplifies the process of getting and using\u00a0JSON data from an API. I found\u00a0Wordpress\u2019 JSON API plugin<\/a>, which was interestingly developed by staff at MoMA so they could use WordPress as a back-end to a site with a Rails front-end<\/a>. So we first had to enable\u00a0that for our Bitstreams blog.<\/p>\n

    AngularJS<\/h3>\n

    \"angularjs\"<\/a>AngularJS definitely helps keep code clean, especially by abstracting the model (the blogposts & associated\u00a0characteristics, as well as the page state) from the view (indicates how to display the data) from the\u00a0controller (gets and refines the data into\u00a0the model, updates the model upon interactions with the view).\u00a0I\u2019ve done several projects in the past using jQuery and DOM manipulation to retrieve and display data. It usually works, but in the process I create a veritable rat\u2019s nest of spaghetti code wherein \/* no amount of commenting *\/ can truly help disentangle what\u2019s happening.<\/p>\n

    Angular also supercharges HTML with more useful attributes to control a display. I’ve only just scratched the surface, but it’s clear that built-in directives like ng-repeat<\/code> and filters like limitTo<\/code> spare me from writing a ton of Javascript, e.g.,\u00a0<li ng-repeat=\"post in blogposts | limitTo:pageSize\"><\/code>. After the initial learning curve, the markup is visually intuitive. And it’s nice that directives and filters are extensible so you can make your own.<\/p>\n

    Source code<\/em>: controller<\/a>\u00a0js, HTML<\/a>\u00a0(view source)<\/p>\n

    Initial Lessons Learned<\/h2>\n