Abstract

Roller's Editor/Admin UI looks ancient and is rather clunky in some places. I propose that Roller's user-interface will be modernized and generally improved.  This will be done by modifying Roller's JSP pages to use Twitter Bootstrap Javascript components and styles. Struts 2 Bootstrap will be used to apply Bootstrap via the Struts tags that Roller already uses.

Requirements

• Rewrite Roller's JSP pages to use Bootstrap via Struts 2 Bootstrap
• Use WebJars for Javascript dependencies of jQuery and Bootstrap
• Consder using modal windows in some cases instead of separate pages
• Struts 2 Bootstrap will require removal of tables used for form formatting
• Make general improvements to admin UI

Issues

Issues to be considered

Design

Webjars for jQuery and Bootrap will be added to the Roller webapp's Maven POM.

Webjars links will be added to Roller's head.jsp file, which is included in every page.

Every web page will have to be modified to use Struts 2 Bootstrap.

Generally, this means that we will add to each Struts form tag these new attributes: theme="bootstrap" and cssClass="form-vertical"

And then for each form element we will remove any table tags used to format it and remove its label tag because Struts 2 Bootstrap will be responsible for layout and labelling.

Status

Work is ongoing in the bootstrap-ui branch. You can find screenshots of this work on Flickr here:

    https://www.flickr.com/photos/snoopdave/sets/72157666773620323

Bootstrap UI page progress checklist

Core pages

• Login page
• New User Registration   
• Edit User Profile 
• Create New Weblog 
• Setup page

Weblog editor pages

• Create & Edit → New Entry
  • Bug: status tag bad placement
  • Bug: allow comments control is broken and stuck in enabled state
  • Bug: Insert Media File modal is broken, needs a folder chooser and should use Boostrap
  • Bug: Xinha editor is not working properly (replace with Summernote)
  • Bug: too many buttons on Summernote rich text editor
  • RFE: add Insert Media File to Summernote based rich text editor
• Create & Edit → Entries
  
  • Bug : date pickers are broken
• Create & Edit → Comments
  • Bug : date pickers are broken
• Create & Edit → Blogroll
  • Bug: Only default blogroll is editable
  • Bug: Add bookmark folder broken on post
  • Bug: Add bookmarks folder should disable Save button if no name
  • Bug: After new blogroll added, need page refresh
  • Bug: switch to new blogroll combo-box looks bad, should allow-empty
  • Bug: better help text on default and custom blogroll page
• Create & Edit → Categories
  
  • Bug: Add category form should disable Save button if no name specified
• Create & Edit → Media Files   
  • Create & Edit → Add new media page
  • Bug: Media File edit modal is broken, poorly formatted
• Design → Theme
• Design → Stylesheet
• Design → Templates
• Preferences → Settings (WeblogConfig)
  • Bug: disabling ping processing caused three errors
  • Remove weblog 
• Preferences → Members
  • Preferences → Invite member
    • Bug: do not allow button submit unless user is specified
  • Preferences → Remove member

• Preferences → Pings
• Preferences → Maintenance
  

Server admin pages

• Server Admin → Global Settings (GlobalConfig)
  
  • Bug: frontpage won't save
  • Bug: bad layout around comment and trackback settings
  • Bug: checkboxes not saving
  • Bug: numbers not saving
• Server Admin → User Admin 
  • User Edit
• Server Admin → Comments
• Server Admin → Ping Targets
• Server Admin → Cache Info

Planet admin pages

• Planet Admin -> Settings

• Planet Admin -> Subscriptions
  • Bug: Custom Planet Group not populated
  • Bug: disable Custom Planet Group form unless it validates

• • Bug: disable New Subscription form unless it validates

• Planet Admin -> Custom Groups 
  
  

Comments

Other can leave comments here.