To continue to advance the DSpace, Fedora and VIVO projects, your institution’s financial support is critical. Please talk to your leadership about joining DuraSpace as a member! Visit: http://duraspace.org/about_membership to learn more.
Child pages
  • DSpace ClientUI built on RESTful API - GSoC 2011
Skip to end of metadata
Go to start of metadata

Summary

Project

DSpace ClientUI built on RESTful API

Student

Vibhaj Rajan

Mentors

Technologies

DSpace REST
JavaScript jQuery FireSpark

Proposal

Melange

Repository

https://github.com/tr4n2uil/restclient

Demo

http://107.20.35.121:8080/restclient/

Presentation

DSpace REST ClientUI

Notes

jQuery
DSpace deployment on Amazon EC2

Project Requirements

  1. Client run interface
  2. Attractive look and feel
  3. Easy to customize

Features

DSpace REST

Built on the DSpace REST API developed as GSoC project in 2009-10
https://wiki.duraspace.org/display/DSPACE/REST+API

FireSpark

Interface powered by FireSpark - JavaScript Service Computing Platform - which is an experimental platform currently
under my research.
https://github.com/tr4n2uil/firespark

RESTClient Extensions

Services and Workflows built for RESTClient using FireSpark for providing core UI functionality while interfacing the
RESTful API
https://github.com/tr4n2uil/restclient

jQuery Templates

Client side processing supported by flexible templates written in JavaScript thereby enabling easier evolution of the UI
http://api.jquery.com/category/plugins/templates/

CKEditor

HTML Rich Text Editor supported for easier text input during repository manipulation
http://ckeditor.com/

User Documentation

Source Structure

File / Directory / Subdirectory

Description

Files

index.html

initialization page for loading all necessary client scripts + basic document layout

 

README

 

 

ui/

top level folder containing interface resources

 

ui/css/

styles and themes directory
default theme is redmond
other themes provided are smoothness and ui-lightness
more themes may be downloaded from http://jqueryui.com/themeroller/

 

ui/css/default.css

global styles

 

ui/css/jquery.css

jquery styles

 

ui/css/restclient-styles.css

RESTClient styles unified from dev/
see dev/ structure description for information on unification during build

 

ui/img/

images directory

 

ui/js/

scripts directory

 

ui/js/jquery-1.6.1.min.js

jQuery

 

ui/js/jquery-ui-1.8.13.min.js

jQuery UI

 

ui/js/jquery.tmpl.min.js

jQuery Templates

 

ui/js/jquery-firespark.js

jQuery FireSpark

 

ui/js/ckeditor

CKEditor directory

 

ui/js/restclient-jquery.js

RESTClient Extensions unified from dev/

 

ui/js/restclient-templates.js

RESTClient Templates unified from dev/

 

dev/

top level folder containing developer resources

 

dev/styles/

individual styles directory
files will be unified to ui/css/restclient-styles.css during build

  • home.css
  • layout.css
  • all-communities.css
  • all-collections.css
  • all-items.css
  • all-users.css
  • all-groups.css
  • all-stats.css
  • community.css
  • collection.css
  • item.css
  • user.css

dev/templates/

individual templatesdirectory
files will be unified to ui/js/restclient-templates.js during build

  • Account.js
  • Browse.js
  • Login.js
  • AllCommunities.js
  • AllCollections.js
  • AllItems.js
  • AllUsers.js
  • AllGroups.js
  • AllStats.js
  • Community.js
  • Collection.js
  • Item.js
  • User.js
  • Group.js
  • CommunityEdit.js
  • CollectionEdit.js
  • CommunityDelete.js

dev/build.bat (build.sh for linux)

Build script for unification
Unification is the merging of individual files to single file for client use

 

dev/init.js

RESTClient initialization
It will be unified to ui/js/restclient-jquery.js during build

 

dev/helpers/

individual helpers directory
files will be unified to ui/js/restclient-jquery.js during build

  • GetDate.js
  • ReadFileSize.js

dev/services/

individual services directory
files will be unified to ui/js/restclient-jquery.js during build

  • Resource.RESTURL.service.js
  • Session.RESTURL.service.js
  • Session.Write.service.js

dev/workflows/

individual workflows directory
files will be unified to ui/js/restclient-jquery.js during build

  • Session.Begin.workflow.js
  • Session.End.workflow.js
  • Resource.Load.workflow.js
  • Resource.Edit.workflow.js
  • Resource.Delete.workflow.js

Customizations

Customization

Support

Description

Stylesheets (CSS)

Yes

Individual stylesheets in dev/styles/ control the styles for different pages
Additionally, ui/css/default.css is the global style sheet
(Note : Individual stylesheets override global styles)

Layout

Yes

Layout is configured in dev/styles/layout.css
Currently jQuery UI Tabpanel (which is the container supported in FireSpark) is used for viewing different
pages as it provides faster navigation (without breadcrumbs) although simple layout is also possible.
(Containers may be developed/changed easily though it shall require understanding of FireSpark whose documentation will be
completed by the end of the 2011)
Other UI containers are under development in FireSpark.

Themes

Yes

Themes are supported natively by jQuery UI
Themes may be downloaded from http://jqueryui.com/themeroller

Internationalization

No

Support for i18n is planned to be integrated into FireSpark soon using the i18n plugin
This will allow easy internationalization for RESTClient

Developer Documentation

RESTClient Extensions

Services

Name

Description

Options (Parameters passed to service in FireSpark)

Return Values

SessionWrite

Saves session information (email/password) for use in further requests

  • form : string : Selector for login form : optional default false

None

ResourceRESTURL

Generates REST URL from resource information

  • rsrctype : string : Resource type : values ('allcommunities', 'community', 'community-edit', 'community-delete', 'community-change', 'allcollections', 'collection', 'collection-edit', 'collection-delete', 'collection-change', 'allitems', 'item', 'item-edit', 'item-delete', 'item-change', 'allusers', 'user', 'allgroups', 'group', 'allstats')
  • rsrcid : number : Resource ID : optional default false
  • rsrcfield : string : Resource Field : optional default false
  • rsrcvalue : string : Resource Value : optional default false
  • end : boolean : Should '.json' be appended to URL formed : optional default false
  • url : string : Resource URL generated

SessionRESTURL

Appends Session information (email/password) to URL

  • url : string : Resource URL
  • url : string : Resource URL with session appended

Workflows

Name

Description

Options (Parameters passed to service in FireSpark)

Return Values

SessionBegin

Stores login information into session, authenticates and loads account template

  • cntr : string : Container selector for account panel : optional default '#account-panel'
  • sel : string : Selector for login form : optional default '#login-container'

None

SessionEnd

Deletes session and loads account template

  • cntr : string : Container selector for account panel : optional default '#account-panel'
  • sel : string : Selector for login form : optional default '#login-container'
  • data : object : Indicate whether to show invalid message : optional default { invalid : false }

None

ResourceLoad

Loads resource using GET and applies template into selected element

  • type : string : Resource Type : values (refer ResourceRESTURL service rsrctype values)
  • tabui : string : Saved reference index for Tabpanel : optional default 'tabuipanel'
  • title : string : Tab Title : optional default 'DSpace RESTUI'
  • id : number : Resource ID : optional default false
  • ld : string : HTML Loading content : optional default RESTClient.jquery.constant.loadmsg
  • anm : string : Animation Type : optional default 'fadein' : values ('fadein', 'fadeout', 'slidein', 'slideout')
  • dur : number : Animation Duration : optional default 100
  • dly : number : Animation Delay : optional default 0

None

ResourceEdit

Edits resource fields using PUT

  • type : string : Resource Type : values (refer ResourceRESTURL service rsrctype values)
  • id : number : Resource ID : optional default false
  • field : string : Resource Field
  • sel : string : Selector for element where response is to be loaded
  • cf : boolean : Confirm edit : optional default false
  • cfmsg : string : Confirmation Message : optional default 'Are you sure you want to continue ?'
  • ld : string : HTML Loading content : optional default RESTClient.jquery.constant.loadmsg
  • anm : string : Animation Type : optional default 'fadein' : values ('fadein', 'fadeout', 'slidein', 'slideout')
  • dur : number : Animation Duration : optional default 100
  • dly : number : Animation Delay : optional default 0

None

ResourceDelete

Deletes resource fields using DELETE

  • type : string : Resource Type : values (refer ResourceRESTURL service rsrctype values)
  • id : number : Resource ID : optional default false
  • field : string : Resource Field : optional default false
  • sel : string : Selector for element where response is to be loaded
  • cf : boolean : Confirm edit : optional default false
  • cfmsg : string : Confirmation Message : optional default 'Are you sure you want to continue ?'
  • ld : string : HTML Loading content : optional default RESTClient.jquery.constant.loadmsg
  • anm : string : Animation Type : optional default 'fadein' : values ('fadein', 'fadeout', 'slidein', 'slideout')
  • dur : number : Animation Duration : optional default 100
  • dly : number : Animation Delay : optional default 0

None

Helpers

Name

Description

Arguments

Return Value

getDate

Returns timestamp as properly formatted date string

time : number : Timestamp

date : string : Formatted Date

readFileSize

Returns size in bytes as properly formatted string

size : number : Size in bytes

size : string : Formatted Size

init.js

Option

Description

Default Value

RESTClient.urls

URLs to be used

{
    base : '/dspace/',
    allcommunities : 'communities',
    community : 'communities/',
    allcollections : 'collections',
    collection : 'collections/',
    allitems : 'items',
    item : 'items/',
    bitstream : 'bitstream/',
    receive : 'receive',
    allusers : 'users',
    user : 'users/',
    allgroups : 'groups',
    group : 'groups/',
    allstats : 'stats'
};

RESTClient.jquery.constant.loadmsg

HTML content to show while loading content

'<p class="loading">Loading ...</p>'

RESTClient.jquery.constant.successimg

HTML content to indicate successful execution

'<img src="ui/img/icons/ok.gif">'

RESTClient.jquery.constant.errorimg

HTML content to indicate erroneous execution

'<img src="ui/img/icons/error.gif">'

Documentation Resources

Name

Available

Description

FireSpark

No

Partially available in the heavily commented source code
https://github.com/tr4n2uil/firespark

jQuery Templates

Yes

Available as jQuery plugin API documentation
http://api.jquery.com/category/plugins/templates/template-tags/

Screenshots














Functional Specifications

  1. Features to be supported
    1. Respository Browsing
    2. Repository Manipulation
    3. Content Searching
    4. Statistics
    5. Administration
  2. Customizations to be supported
    1. Stylesheets (CSS)
    2. Layout
    3. Themes
    4. Internationalization

Project Timeline

(tick)

Ready

(plus)

Base done, Improvement phase

(thumbs up)

In Progress

Before May 24

  1. Obtain access to :
    • (tick) Wiki
    • (tick) Project repository
  2. (tick) Download, build and install local DSpace instance
  3. (tick) Download, build and install DSpace REST module
  4. (tick) Test and verify the installation
  5. (tick) Go through the functionality of DSpace and DSpace REST API
  6. (tick) Compare possible JavaScript UI frameworks -- Ext JS preferred

Mark: I would like to see a bit more dialog with Bojan concerning the REST API contracts and migration to Spring, mainly, are we happy with these API contracts and using them for the students project, or do we need to consider some possible changes int he API to adopt to using Spring REST instead of Entity Broker. And if so, is there a timeline for providing those changes in scope of the 1.8 release?

Vibhaj: Confirmed that the possible migration shall not affect the REST interface and hence RestClient project.

May 25 - June 15

  1. (plus) Get familiar with DSpace REST API
    1. collections, communities, items and bitstreams
      • create
      • (tick) view
      • (tick) edit
      • (tick) delete
    2. users and groups
      • (tick) view
    3. search
    4. (tick) generating statistics
  2. (tick) Decide the JavaScript Library to be used by discussing with the DSpace community: jQuery [decided by community]
  3. (plus) Learn the jQuery JavaScript Library
    • (tick) Selectors
    • (tick) Actions and Methods
    • (tick) Events
    • (plus) UI Widgets
  4. (plus) Design client run FireSpark framework supporting JavaScript UI for RESTful (JSON) services
  5. (plus) Design generic Services and Workflows in FireSpark
  6. (plus) Plan these extensions for RestClient
    • (plus) RESTUI.Resource.Load Workflow
    • (plus) RESTUI.Resource.Edit Workflow
    • (plus) RESTUI.Resource.Delete Workflow
    • (thumbs up) ParseItemMetadata helper

June 15 - July 10

  1. (plus) Implement extensions (Services and Workflows) to FireSpark in RESTClient to provide support for :
    1. Repository Browsing
      • Communities
        • (plus) All
        • (plus) Single
        • (plus) Subcommunities
        • (plus) Recent Submissions
        • Sort
      • Collections
        • (plus) All
        • (plus) Single
        • Sort
      • Items
        • (plus) All
        • (plus) Single
        • (thumbs up) Read Metadata
      • Bitstreams
        • (plus) Download

July 11 - July 15

  1. (tick) GSoC Mid Term Evaluations

July 15 - July 31

  1. (plus) Implement extensions (Services and Workflows) to FireSpark in RESTClient to provide support for :
    1. Repository Manupulation
      • Communities
        • (plus) Edit
        • (plus) Delete
      • Collections
        • (plus) Edit
    2. Administration
      • Users
        • (plus) Login
        • (plus) Logout
        • (plus) All
        • (plus) Single
      • Groups
        • (plus) All
        • (plus) Single
    3. Content Searching
    4. Statistics
      • (plus) Reports (simple)
      • (plus) Charts and Visualization (simple)

August 1 - August 15

  1. (plus) Enhancing the look and feel
  2. (thumbs up) Look into and improve scope for customizations
  3. (thumbs up) Improve the architecture of RESTClient and FireSpark
  4. (plus) Testing
  5. (plus) Complete Documentation
  6. (thumbs up) Final Improvements
  • No labels