RichFaces Real-World demo application

Version 11


    This page is for discussion of RichFaces Real-World demo application - Photo Album.


    Page on JBoss Forum can be found there.


    Initial design and gathering.


    There are initial list of basic view which could be implemented in Real-World demo. Comments are welcome.





                Application should provide simple pictures storage with upload, management preview and sharing possibilities.

                This document describes set of view drafts that could be used within real world demo.

                Note that this document is just high level draft so some common components could be skipped in “Components used for use-cases” sections. (panels, toolbar, support, region, outputPanel and etc..)


    Similar Applications



    Functionality Summary

    Photo Album demo application provide the following features set:

    1. User Login and registration.
      1. User preferences management.
    2. Roles management
    3. Browsing the application in guest mode.(All the functionality except any kind of changing and own albums available) 
      1. Browsing application as registered user. All the functionality below available.
    4. Uploading pictures
      1. Multiple pictures upload
      2. Preview and edit pictures preferences after upload
      3. Categorizing the pictures using Drag and Drop or just bulk storing to choosen folder
        1. OPEN ISSUE should we allow to copy image to folder instead of just moving?
      4. Categorizing images with metatags
      5. OPEN ISSUE Need to provide the descriptions to images in order to create story functionality in slideshow mode.
    5. Owner Images view
      1. albums view with album sharing management capability
      2. album view. Browsing thumbnails within concrete album.
      3. single picture view and management. Preview for concrete picture with its properties. Properties management. Comments view and management. Bookmarkable full sized images links.
      4. Slideshow within the album
      5. working with images and albums added to favourite
    6. content updates
      1. "News" functionality. Browsing within latest added, commented, popular and so on.
    7. Search (Both by shared pictures and owner pictures)
      1. Browsing shared images by tags
      2. Search for existent images by metadata and other properties.
      3. Tag Cloud tags browsing
      4. Search for users by names
    8. Working with shared images
      1. browsing shared albums
      2. addition images and albums to favourites
      3. comment on images
    9. Application help
      1. Set of views describing implementation decisions details. (Seam and RF usage for the cases implemented)
      2. Information on how to use application itself within the views




    (Will be updated soon after markups design finished)

    Design Section


    1.1 Login View


                It should be some kind of standard login/register view. Some info about RF and application itself should be present in this view.


    1.2 Views for logged user


    1.2.1 User properties view


                Standard user-info properties view. Should allow the user to add or edit its detailed info.


    1.2.2 Pictures Upload View


                Every logged user should be able to upload the pictures to server. Upload restrictions should be defined (size of pictures, types, may be resolution). After uploading, the user should be able to preview pictures, edit its properties and save them or just remove some of them.

              Components used for use-case:

    • ·        rich:fileUpload
    • ·        rich:progressBar(built-in)
    • ·        rich:mediaOutput(preview)
    • ·        a4j:commandLink (store, change)
    • ·        rich:dataGrid (preview iteration)


    1.2.3 Albums management View


                View for management albums should be available for the user in order to rearrange the albums, rename or delete existent ones or just create new albums. (TBD some other properties that could be changed from this view such as sharing and etc..)

              Components used for use-case:

    • ·        rich:dataGrid for albums list representation
    • ·        a4j:commandButtons/Links
    • ·        contextMenu


    1.2.4 User Pictures View


                View for existent pictures viewing. It should contain the navigation tree for pictures groups and main area which should be switchable from list subview to slideshow subview.

                Components used for use-case:

    • ·        rich:tree for folders representation

  List subview


                The user could choose some folder from navigation panel and should be able to view all the pictures within folder. This subview also should allow moving pictures between folders delete some of them or call properties view for any picture.

                This subview could optionally contain a filter for pictures which should be shown

              Components used for use-case:

    • ·        rich:dataGrid for pictures list representation
    • ·        rich:datascroller
    • ·        drag and drop components to move between folders
    • ·        rich:calendar, inplaces, commandButtons/links for filter
    • ·        context menu

  slideshow Subview


                This subview should represent one picture in a full size in the subview. And also controls to switch between pictures (next/prev-like controls or maybe just line with clickable thumbnails). Also it should be possible to turn real-time slideshown on within this view.

                 Components used for use-case:

    • ·          context menu
    • ·        commandButtons/Links
    • ·          poll (realtime slideshow support)


    1.2.5 Pictures Properties Management View


                This view could be called for any picture from “User Pictures View”. It should be opened as modal dialog and consist of picture properties in editable controls.

                 Components used for use-case:

    • ·        inplaces
    • ·        commandButtons/links
    • ·        rich:modalPanel


    1.3 Shared Albums


                Application should provide all the users access to shared area. Albums marked as shared should be available to non logged users via the same “User Pictures View” but without any changes allowed.

                Shared Albums view should be also allowed to be used by already logged users


    1.4 Live updates


                While the user uses shared view it should be asynchronously updated after changed on server. So new albums should appears and some additional info (e.g. pictures counts in albums) info should be updated using push technique.

               Components used for use-case:

    • ·        a4j:push