Child pages
  • Proposal: UI Makeover with Bootstrap
Skip to end of metadata
Go to start of metadata

Status

About 60% done

Target Release

6.0?

Original Authors

Dave Johnson

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
  • Create & Edit → Entries
    • Bug : date pickers are broken
  • Create & Edit → Comments
  • 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
    • 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
  • Design → Theme
  • Design → Stylesheet
  • Design → Templates
  • Preferences → Settings (WeblogConfig)
    • Remove weblog page
  • 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
  • Planet Admin -> Custom Groups 

Comments

Other can leave comments here.



  • No labels