tiff

Why you should look into Angular.js

Web apps are getting more and more complicated these days. More and more logic moves from the backend to the frontend. Libraries and frameworks of the past weren't built with these new requirements in mind. For example using jQuery to manage a large and complex web app quickly ends up in a very difficult to maintain code base.

Fortunately, a new generation of frameworks are being built to meet these challenges and Angular.js is one of them! Let me introduce you to some of the major benefits of using Angular.

Declarative user interface and databindings

Angular uses HTML to define the user interface, which is much more intuitive than defining the interface procedurally in Javascript.

Following a quick example. Give it a try using an interactive JSFiddle!

tiff

Protonet Rest API

All examples in this document are done via curl. You can however use any programming language to access the API. The API expects JSON and responds with JSON.

Authorization

The Protonet REST-API supports two authorization mechanisms:

1. Basic authorization: Send email and password as base64 encoded string within the request headers

tiff

/**
 * "Happy Birthday Nenad" OpenSocial Script
 * UNTESTED
 * Probably won't work in most OpenSocial containers
 * due to privacy settings
 */

var NENADS_USER_ID = '<UserId>'; // eg. VIEWER

var req = opensocial.newDataRequest();

tiff

/**
 * Example:
 *   convertToPrettyDate("Sat, 23 Jan 2010 18:45:42 +0100") // => "7 hours ago"
 */
var convertToPrettyDate = (function() {
  var JUST_NOW = "Just now",
      MINUTES_AGO = "{t} minute{s} ago",
      HOURS_AGO = "{t} hour{s} ago",
      YESTERDAY = "Yesterday",
      DAYS_AGO = "{t} day{s} ago",

tiff

/**
 * toLolcatString()
 * Converts a string from plain english to lolcat speak using YQL and jQuery
 * 
 * @example
 *    toLolcatString("Hi. How are you?", function(lolcatStr) { alert(lolcatStr); }); // => "OH HAI. HOWZ U?"
 */
var toLolcatString = (function() {
  var YQL_QUERY = "SELECT content FROM html WHERE url=\"http://speaklolcat.com/?from={str}\" AND xpath='//textarea[@id=\"to\"]'";
  

tiff

<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="os:Name Tag">
  <Require feature="opensocial-data"/>
  <Require feature="opensocial-templates"/>
</ModulePrefs>
<Content type="html"><![CDATA[
    
<script xmlns:os="http://ns.opensocial.org/2008/markup" type="text/os-data">
  <os:PeopleRequest key="Owner" userId="@owner" groupId="@self"/>

tiff

<?xml version="1.0" encoding="UTF-8"?>
<Module>
  <ModulePrefs title="Message Bundle Substitution in Remote Requests">
    <Require feature="opensocial-0.9" />
    <Require feature="opensocial-templates" />
    <Require feature="opensocial-data" />
    <Locale lang="all">
      <msg name="foo">Hello World</msg> 
    </Locale>
  </ModulePrefs>

tiff

<div>Message (remotely loaded): __MSG_foo__</div>

tiff

var sys           = require('sys'),
    http          = require('http'),
    urlModule     = require('url'),
    querystring   = require('querystring');

http.createServer(function(req, res) {
  var urlObj  = urlModule.parse(req.url),
      params  = querystring.parse(urlObj.query),
      url     = params.url,
      dest    = 'images/' + new Date().getTime() + '.png';

tiff

<?xml version="1.0" encoding="UTF-8"?>
<Module>
    <!--
    FIG - Feature Inspector Gadget, find out what gadget features are supported by any gadget container.
    Copyright (C) 2009 XING AG

    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.