Summer of Code/2013/Social Sugar project/Documentation

< Summer of Code‎ | 2013‎ | Social Sugar project
Revision as of 10:03, 24 September 2013 by Axitkhurana (talk | contribs) (→‎Detailed Description: Technical details for the cloud content implementation)

Social Sugar

Social Sugar project involves development of GUI components that can help bring user's social interactions on external platforms into Sugar.

The first component we've are working on are the mini profiles.

Mini Profiles

Mini Profiles extend Web Service code adding minimal changes to the existing models to support social features such as fetching latest posts from multiple webservices and displaying it in Group View.

Detailed Description

For identification of a user on a webservice such as Project Sharing Website, or Fedora pastebin, a unique id will be used. The API of the webservice should allow posting/fetching resources related to the user via this UID (and if required authentication credentials such as API token).

Changes to Sugar

BuddyModel

  • Each Buddy used to have properties like nick, color and current activity
  • We add another property `social_ids` to the BaseBuddyModel which are populated initially from all webservice accounts.
  • social_ids is a dictionary of `service name`: `public id` pairs. E.g. {'gmoksaya': 'a454', 'gpaste': 'adsfq524325'}
  • As are other properties like color, serialized social_ids are broadcasted to other online Sugar users via Telepathy.

WebServices Account Interface

  • Two new methods: `get_public_id()` and `get_latest_post()` are added to Account class. (webservice.account.Account)
  • `get_public_id` returns the public id associated with that account.
    • It is used to populate social_ids property initially
    • Public ids are used to fetch posts from the external webservice, e.g. latest project uploaded on Project Sharing Website. (This is implemented in the service specific extension.)
  • `get_latest_post` returns the latest post on the service.

New Classes

WebServicePost

  • This is an abstract class for WebService posts returned by `get_latest_post`
  • Has unimplemented methods for title, message, image and hyperlink.

UI additions

All additions are in Group view. (F2)

Small Cloud Icon

  • A small cloud shaped icon is displayed over your friend when you both have a social sugar extension installed.
  • This icon can be clicked to view latest posts from web service account of your friend.

 

Large Cloud Icon

  • On clicking the small cloud icon, it expands to a larger cloud
  • This Icon acts as a placeholder for the latest post from webservice.
  • The cloud has a speech bubble like pointer to the buddy.
  • The content on this icon:
    • is provided by fetching latest posts from all the webservice accounts of my friend.
    • is rotated after a fixed time to make the interface interactive and responsive.
    • can be paused using the pause icon for kids who can take longer to read a message.
    • can have a small icon (of the service) and upto 180 characters of text.
  • Large cloud is closed by clicking on the cross (x) button which automatically suspends auto fetching/rotating of the latest posts.

 

Technical details for the cloud content implementation

  • Small cloud icon inherits `sugar3.graphics.icon.CanvasIcon` which gives it the color matching that of the buddy.
  • CloudContent is placed on top of the LargeCloudIcon using Gtk.Overlay
  • LargeCloudIcon inherits `sugar3.graphics.icon.EventIcon`
  • The button-release-event is bound to SmallCloudIcon, whose callback draws the Gtk.Overlay containing LargeCloudIcon and CloudContent.
  • Cloud content consists of a VBox of service icon, a label and HBox containing close and pause icons.

Testing

You can test the current implementation by following these steps:

  1. Set up your Sugar development environment
  2. Clone the social-sugar branch from following repositories replacing the appropriate modules in your sugar-build code:
    1. Sugar
    2. Sugar Toolkit GTK 3
    3. Sugar Artwork
  3. Clone the contents of mock-service repository inside ~/.sugar/default. You'll end up with the directory structure as shown below.
  4. Build Sugar and add Akshit Khurana (or other people running the service) as a friend from the neighbourhood view(F1). You can use the search to find people.
  5. Checkout the Friend view(F2).
    1. Click on the small cloud icon over the buddy icon, to view my latest mock-post!
    2. You should see something like: "Designed from the ground up especially for children, Sugar offers an alternative to traditional "office-desktop" software. Id: 458" in a giant speech bubble like cloud.
  6. Congratulations! You've got mock service running on Mini Profiles.

Directory Structure

~/.sugar/default/extensions/webservice/
├── __init__.py
└── mock-service
    ├── __init__.py
    ├── account.py
    ├── mock-service
    │   ├── __init__.py
    │   └── mock-service.py
    └── icons
        └── mock-service.svg

~/.sugar/default/extensions/cpsection/
├── __init__.py
└── webaccount
    ├── __init__.py
    └── services
        ├── __init__.py
        └── mock-service
            ├── __init__.py
            └── service.py