= S3UI Framework =
S3XRC being a powerful backend that serves XML and JSON in a RESTful manner has now got a front-end framework that can exploit its positives. S3UI - the new ExtJS based front-end help us not only utilize S3XRC but also save a lot of bandwidth by exchanging information in JSON instead of full page reloads. This in turn aims to create an easy and quick workflow for different tasks that a user does with Sahana Eden.

== Current State ==
 * [http://wiki.sahanafoundation.org/doku.php/foundation:gsoc_mishra GSoC project] - not yet merged with Trunk

 === Outline ===
  * S3UI Framework allows end users to speed up their workflow by providing widgets that work on S3XRC.
  * Right now it has 3 major elements -
    * Grid View widget
    * Popup Forms
    * Rheader tabs
  * In place edits and creation are possible now.
  * S3UI framework communicates to backend in JSON through ExtJS

 === Usage ===
[http://www.youtube.com/watch?v=gfuVh4y7Yco Video Tour of Features]

'''1. Grid View widget'''
[[Image(Screen shot 2010-08-19 at 1.30.34 AM.png)]]
  * Top toolbar -
    * Use "Save Changes" to commit any changes done on grid. None of the changes that don't pass through backend validation are committed.
    * When you make a wrong change, or you make too many of them and wish to start fresh, hit on "Undo Changes"
    * To add a fresh record, use "Add New" to pop up a form window

  * Data Columns -
    * Used to sort data by field - ascending or descending
    * click down arrow on one of them to turn fields shown ON and OFF

  * The Data Grid -
    * Once you're logged in, and have authority to edit data, the grid rendered is an editable one.
      * How to Edit?
        * Click a field to turn it into editable mode.
        * The red blips indicate edited fields
        * Once done, hit the "Save Changes" button

  * Actions -
    * This helps you open or delete a record - as indicated by icons

  * Bottom toolbar -
    * Use pagination controle to navigate multiple pages of rows
    * Refresh button to freshen up data in current view - helpful when someone else makes a change - fast as it reloads the current page rows only
    * Page size selector - Just in case you wish to look at more number of rows, goes maximum upto 100


== See Also ==
 * BluePrint S3UI

----
UserGuidelines