Opened 12 years ago

Closed 12 years ago

Last modified 12 years ago

#1655 closed enhancement (fixed)

GUI improvements

Reported by: Nicklas Nordborg Owned by: Nicklas Nordborg
Priority: major Milestone: BASE 3.1
Component: web Version:
Keywords: Cc:

Description

There are several minor things that have annoying me for some time. For example:

  • Some popup dialogs automatically resize their content when the dialog is resized but some don't.
  • Difficulties to use the entire area of a popup dialog and nothing more. Some dialogs have lots of unused space, some get scrollbars because the content is too big.
  • #160: List pages should be able to list subset of items
  • Space is wasted due to borders, space between borders, a secondary border, etc.

Attachments (7)

login.png​ (114.4 KB ) - added by Nicklas Nordborg 12 years ago.
Login page
home.png​ (140.6 KB ) - added by Nicklas Nordborg 12 years ago.
Home page
sample-view.png​ (101.6 KB ) - added by Nicklas Nordborg 12 years ago.
Sample view page
sample-overview.png​ (155.6 KB ) - added by Nicklas Nordborg 12 years ago.
Sample overview page
sample-edit.png​ (68.4 KB ) - added by Nicklas Nordborg 12 years ago.
Sample edit dialog
job-view.png​ (82.1 KB ) - added by Nicklas Nordborg 12 years ago.
Job dialog
logout.png​ (33.3 KB ) - added by Nicklas Nordborg 12 years ago.
Logout dialog

Download all attachments as: .zip

Change History (87)

comment:1 by Nicklas Nordborg, 12 years ago

Owner: changed from everyone to Nicklas Nordborg
Status: new → assigned

comment:2 by Nicklas Nordborg, 12 years ago

(In [5900]) References #1655: GUI improvements

  • Added a CacheControlFilter which can be configured to disable caching for certain file types. This is very useful in a development environment, but not recommended in production.
  • Redesigned buttons with rounded corners.

  • Use more modern css rules for buttons and button groups. Got rid of "align" attribute that is deprecated in html.

  • Place buttons in popup dialogs using coordinates

relative to the bottom of the dialog so that they follow along if the dialog is resized. Only the popups in the "BASE" menu has been fixed so far.

Due to changes in css files, some other layout is now really "ugly", but this will be fixed later...

comment:3 by Nicklas Nordborg, 12 years ago

(In [5901]) References #1655: GUI improvements

  • Changed style of the header in popup dialog.

  • Use PNG instead of GIF for help icon.

comment:4 by Nicklas Nordborg, 12 years ago

(In [5902]) References #1655: GUI improvements

  • Make sure content on dialog can be placed so that it fills the free space between the title and buttons.

  • The 'Logout' dialog is easy and provides the simple case where everything is centered in the remaining space. Should also work when resizing the dialog.

  • The 'Reset filters' and 'Broadcast message' dialogs need a bit more work. The look ok now, but there are some minor things to fix yet.

comment:5 by Nicklas Nordborg, 12 years ago

(In [5903]) References #1655: GUI improvements

  • Switch to PNG for some more icons.
  • Changed background and border colors to a brighter gray
  • Re-designed buttons again using a blue-ish border to indicate hovering.
  • Finalized the "Broadcast message" and "Reset filters" popups.

comment:6 by Nicklas Nordborg, 12 years ago

(In [5904]) References #1655: GUI improvements

  • Started on tabcontrol re-design. It does look good on popup windows with tabs at bottom, but there are optimizations to be made still.

  • Started working on a few more dialogs in the BASE menu. The look good, but there is more optimizations to be made.

comment:7 by Nicklas Nordborg, 12 years ago

(In [5905]) References #1655: GUI improvements

  • Use relative font sizes (em and %) instead of pixel values. This should make it possible to use relative values for everything and we don't have to split up into size_*.css

  • Removed "valign" attribute from lots of tables.

  • Removed "wrap" attribute from lots of texarea fields.

comment:8 by Nicklas Nordborg, 12 years ago

(In [5906]) References #1655: GUI improvements

  • Implement vertical button groups.
  • Replaced some gif icons with png variants.

comment:9 by Nicklas Nordborg, 12 years ago

(In [5907]) References #1655: GUI improvements

New design on some more pages:

  • Impersonate
  • Switch user
  • Calendar
  • Close popup message
  • Configure columns
  • Manage lists contexts
  • View help
  • Set owner
  • Share items
  • About

comment:10 by Nicklas Nordborg, 12 years ago

(In [5908]) References #1655: GUI improvements

  • File manager dialogs
  • File server edit dialog
  • Changed zoom.gif to png

comment:11 by Nicklas Nordborg, 12 years ago

(In [5909]) References #1655: GUI improvements

  • Project dialog
  • Permission template dialog
  • Jobs dialog
  • Messages dialog
  • Session dialog

comment:12 by Nicklas Nordborg, 12 years ago

(In [5910]) References #1655: GUI improvements

  • Plugin wizards

comment:13 by Nicklas Nordborg, 12 years ago

(In [5911]) References #1655: GUI improvements

  • Plugin wizards
  • Dialogs on login page (forgot password, get account, broadcast message)
  • Select color dialog

comment:14 by Nicklas Nordborg, 12 years ago

(In [5912]) References #1655: GUI improvements

  • Table exporter

comment:15 by Nicklas Nordborg, 12 years ago

(In [5913]) References #1655: GUI improvements

  • Edit dialogs in Biomaterial LIMS

comment:16 by Nicklas Nordborg, 12 years ago

(In [5914]) References #1655: GUI improvements

  • Item overview (Validation options dialog)
  • Some minor changes to border placement

comment:17 by Nicklas Nordborg, 12 years ago

(In [5915]) References #1655: GUI improvements

  • Physical, derived and raw bioassay edit dialogs
  • Data files dialog tab
  • Spotimages and raw data dialogs
  • Some other minor size adjustments

comment:18 by Nicklas Nordborg, 12 years ago

(In [5916]) References #1655: GUI improvements

Edit dialogs for experiments, formulas, reporters and reporter lists.

comment:19 by Nicklas Nordborg, 12 years ago

(In [5917]) References #1655: GUI improvements

Edit dialogs for array lims.

comment:20 by Nicklas Nordborg, 12 years ago

(In [5918]) References #1655: GUI improvements

Started with the redesign of list and view pages. I am using the biosource and sample pages for testing. Changes affect more of the non-fixed pages since a lot of the contents is generated by taglibs. This means that the non-fixed pages doesn't look very good at the moment.

Table listings has only been fixed so that they display and can be used. Much more work is needed as part of #160.

I have also fixed the following pages:

  • The main menu
  • Login page + Home page
  • Item overview frameset
  • Plugins and extensions overview

by Nicklas Nordborg, 12 years ago

Attachment: login.png​ added

Login page

by Nicklas Nordborg, 12 years ago

Attachment: home.png​ added

Home page

by Nicklas Nordborg, 12 years ago

Attachment: sample-view.png​ added

Sample view page

by Nicklas Nordborg, 12 years ago

Attachment: sample-overview.png​ added

Sample overview page

by Nicklas Nordborg, 12 years ago

Attachment: sample-edit.png​ added

Sample edit dialog

by Nicklas Nordborg, 12 years ago

Attachment: job-view.png​ added

Job dialog

by Nicklas Nordborg, 12 years ago

Attachment: logout.png​ added

Logout dialog

comment:21 by Nicklas Nordborg, 12 years ago

(In [5919]) References #1655: GUI improvements

Fixes image alignment in several places.

comment:22 by Nicklas Nordborg, 12 years ago

(In [5920]) References #1655: GUI improvements

Edit dialogs in plates section of Array LIMS.

comment:23 by Nicklas Nordborg, 12 years ago

(In [5921]) References #1655: GUI improvements

Edit dialogs for all items in the first level under the Administrate menu.

comment:24 by Nicklas Nordborg, 12 years ago

(In [5922]) References #1655: GUI improvements

Edit dialog for the rest of the items in the administrate menu.

comment:25 by Nicklas Nordborg, 12 years ago

(In [5923]) References #1655: GUI improvements

  • Edit dialogs for bioassay set, bioassay, transformation and some other experiment related dialogs
  • Analysis plug-in that have special jsp forms
  • Change history

comment:26 by Nicklas Nordborg, 12 years ago

(In [5924]) References #1655: GUI improvements

Plot functions for spot data and in experiment explorer.

comment:27 by Nicklas Nordborg, 12 years ago

(In [5927]) References #1655: GUI improvements

Started with the bioplate event wizards. The 'place-on-plate' and 'move biomaterial' wizards are looking good so far, but there are a few more cases to test. The 'create child plate' remains and the bioplate view page should also be checked.

comment:28 by Nicklas Nordborg, 12 years ago

(In [5928]) References #1655: GUI improvements

The "create child plate" wizard.

comment:29 by Nicklas Nordborg, 12 years ago

(In [5929]) References #1655: GUI improvements

Started to re-design the table taglib.

comment:30 by Nicklas Nordborg, 12 years ago

(In [5935]) References #1655: GUI improvements

  • More changes to table and section taglibs. Simple item lists should now display ok (after using a different set of tags for the header row)
  • Hidable sections have been re-designed and should now look a bit better. However, in many of the places we use a section it is only used when there is data to list. The section should be used in all cases so we need to move the conditional test inside.
  • The code for listing "Shared to" information for items have been moved to an "include" page and the old code has been replaced in a lot of pages (may still be missing some).
  • The "Annotations & parameter" tab have been fixed with the new design.
  • The biosource, sample, extract and tag view pages have also been fixed.

comment:31 by Nicklas Nordborg, 12 years ago

(In [5936]) References #1655: GUI improvements

Adding file that should have been part of [5935]

comment:32 by Nicklas Nordborg, 12 years ago

(In [5937]) References #1655: GUI improvements

  • Fixes rest of view pages in biomaterials menu.
  • Use SVG filter to make disabled button images grayscale.

comment:33 by Nicklas Nordborg, 12 years ago

(In [5938]) References #1655: GUI improvements

  • Trashcan and file manager

comment:34 by Nicklas Nordborg, 12 years ago

(In [5939]) References #1655: GUI improvements

View pages for:

  • File server
  • Projects
  • Permission templates
  • Physical, derived and raw bioassays
  • Experiments, bioassay set
  • Formulas
  • Reporters
  • Reporter lists

comment:35 by Nicklas Nordborg, 12 years ago

(In [5940]) References #1655: GUI improvements

  • Transformations
  • Extra values
  • Bioassays
  • Experiment explorer

comment:36 by Nicklas Nordborg, 12 years ago

(In [5941]) References #1655: GUI improvements

View pages for all items in the Adminstrate menu.

comment:37 by Nicklas Nordborg, 12 years ago

(In [5942]) References #1655: GUI improvements

Modify lots of boolean taglib parameters.

comment:38 by Nicklas Nordborg, 12 years ago

(In [5943]) References #1655: GUI improvements

Plate section of Array LIMS.

comment:39 by Nicklas Nordborg, 12 years ago

(In [5944]) References #1655: GUI improvements

Array section of Array LIMS. This should complete the view pages for all items. Now, it is only the list pages left.

comment:40 by Nicklas Nordborg, 12 years ago

(In [5945]) References #1655: GUI improvements

Changes a few GIF to PNG. Remove all _disabled variants, since that should be CSS-controlled now.

comment:41 by Nicklas Nordborg, 12 years ago

(In [5946]) References #1655: GUI improvements

Replaces a lot of GIF images with PNG.

comment:42 by Nicklas Nordborg, 12 years ago

(In [5948]) References #1655: GUI improvements

Started with the list pages. So far the reporters and the biosurce, sample and extract list pages have been done. The other pages have just been modified to not cause any compilation problems and to display almost ok.

comment:43 by Nicklas Nordborg, 12 years ago

(In [5949]) References #1655: GUI improvements

  • Use correct width/height (1050/700) of popups for selecting items from a list.
  • Got rid of the <tbl:columns> tag.

comment:44 by Nicklas Nordborg, 12 years ago

(In [5950]) References #1655: GUI improvements

Fixes the "Disk usage" pages.

comment:45 by Nicklas Nordborg, 12 years ago

(In [5951]) References #1655: GUI improvements

  • Fixes rest of list pages in Biomaterial LIMS menu
  • Introduced an 'iframe' page type so that thos pages doesn't have to 'cannibalise' on the 'popup' page type (doesn't works well with absolutely positioned content).
  • Fixed subclass="dialogbuttons" on all list pages when used in popup form

comment:46 by Nicklas Nordborg, 12 years ago

(In [5952]) References #1655: GUI improvements

List page in the View menu

comment:47 by Nicklas Nordborg, 12 years ago

(In [5953]) References #1655: GUI improvements

Select file/directory and "save as" dialogs.

comment:48 by Nicklas Nordborg, 12 years ago

(In [5954]) References #1655: GUI improvements

List pages in Array LIMS and Administrate menus. This should complete all list pages.

comment:49 by Nicklas Nordborg, 12 years ago

(In [5955]) References #1655: GUI improvements

"Test with file" dialog.

comment:50 by Nicklas Nordborg, 12 years ago

(In [5956]) References #1655: GUI improvements

  • External program executor configuration dialog.
  • Exception dialogs.

comment:51 by Nicklas Nordborg, 12 years ago

(In [5957]) References #1655: GUI improvements

  • List of annotations and failures/warnings in the 'Item overview' details.
  • Bottom border in 'Inherit annotations' dialog.

comment:52 by Nicklas Nordborg, 12 years ago

(In [5958]) References #1655: GUI improvements

  • Some popup window sizes.
  • Activate project popup.

comment:53 by Nicklas Nordborg, 12 years ago

(In [5959]) References #1655: GUI improvements

  • Selection list for filtering tables
  • Minor issues with experiment explorer

comment:54 by Nicklas Nordborg, 12 years ago

(In [5960]) References #1655: GUI improvements

  • Icon sizes to 16x16
  • Catch 'missing image' event and display an error image instead for menu item and buttons.
  • Incorrectly wrapped <form> in plug-installation wizard (caused it to not display in IE).
  • Minor adjustments for displaying tables in different base font sizes.

comment:55 by Nicklas Nordborg, 12 years ago

(In [5961]) References #1655: GUI improvements

Add biomaterial to list dialog.

comment:56 by Nicklas Nordborg, 12 years ago

(In [5962]) References #1655: GUI improvements

Fixes some misplaced borders.

comment:57 by Nicklas Nordborg, 12 years ago

(In [5965]) References #1655: GUI improvements

Display item type in a smaller+grayer font.

comment:58 by Nicklas Nordborg, 12 years ago

(In [5967]) References #1655: GUI improvements

Slight adjustment to legend: can't be changed later

comment:59 by Nicklas Nordborg, 12 years ago

(In [5968]) References #1655: GUI improvements

Added note about incompatibility to the documentation.

comment:60 by Nicklas Nordborg, 12 years ago

(In [5970]) References #1655: GUI improvements

Avoid line-wrapping of message titles on home/login page. Reduce unused space in the menu.

comment:61 by Nicklas Nordborg, 12 years ago

(In [5971]) References #1655: GUI improvements

  • Started to create screen shots with the new design for the user documentation.
  • Got rid of old .gif icons in the documentation and replaced them with .png versions.
  • Fixed some issues with placement of 'required information' in two dialogs.

comment:62 by Nicklas Nordborg, 12 years ago

(In [5972]) References #1655: GUI improvements

  • More screen shots. Done to chapter 10 so far.

comment:63 by Nicklas Nordborg, 12 years ago

(In [5973]) References #1655: GUI improvements

  • More screen shots. Done to chapter 15 so far.

comment:64 by Nicklas Nordborg, 12 years ago

(In [5975]) References #1655: GUI improvements

  • More screen shots. Done to chapter 19 so far.

comment:65 by Nicklas Nordborg, 12 years ago

(In [5976]) References #1655: GUI improvements

  • All screen shots are now done.
  • Added a section about how to configure the computer to take nice-looking screen shots.

comment:66 by Nicklas Nordborg, 12 years ago

(In [5977]) References #1655: GUI improvements

  • Cleaning up css files
  • Getting rid of unuses code (taglibs, jsp, etc.)
  • Found a few places with error message not being properly formatted.

comment:67 by Nicklas Nordborg, 12 years ago

Resolution: → fixed
Status: assigned → closed

comment:68 by Nicklas Nordborg, 12 years ago

(In [5978]) References #1655: GUI improvements

Remove debug message.

comment:69 by Nicklas Nordborg, 12 years ago

(In [5984]) References #1655: GUI improvements

Show name of subtype if available in list with inherited annotations.

comment:70 by Nicklas Nordborg, 12 years ago

(In [6003]) References #1655: GUI improvements

  • Specified min column width for tables.
  • Fixed some issues with the "Test with file" display.

comment:71 by Nicklas Nordborg, 12 years ago

(In [6004]) References #1655: GUI improvements

  • Only the "Save and configure" buttons should continue with the plug-in configuration wizard.

comment:72 by Nicklas Nordborg, 12 years ago

(In [6005]) References #1655: GUI improvements

  • Use tree-like graphics when selecting platform+variant since IE doesn't use CSS on selection list options.

comment:73 by Nicklas Nordborg, 12 years ago

(In [6006]) References #1655: GUI improvements

  • Incorrect call for validating the form

comment:74 by Nicklas Nordborg, 12 years ago

(In [6007]) References #1655: GUI improvements

  • Do not use tabs when selecting items in a popup
  • Show the "Ok" and "Cancel" buttons when selecting items in a popup

comment:75 by Nicklas Nordborg, 12 years ago

(In [6008]) References #1655: GUI improvements

  • Get rid of scrollbar in annotations tab

comment:76 by Nicklas Nordborg, 12 years ago

(In [6010]) References #1655: GUI improvements

  • Use error-type message container for web exception.

comment:77 by Nicklas Nordborg, 12 years ago

(In [6011]) References #1655: GUI improvements

  • Revert to GIF for the filter icon.

comment:78 by Nicklas Nordborg, 12 years ago

(In [6012]) References #1655: GUI improvements

  • Overview and correction factor plots

comment:79 by Nicklas Nordborg, 12 years ago

(In [6013]) References #1655: GUI improvements

  • New plot examples

comment:80 by Nicklas Nordborg, 12 years ago

(In [6015]) References #1655: GUI improvements

  • Call to setOnClick(null) should make the icon disabled unless it has been explicitely enabled in the first place.
Note: See TracTickets for help on using tickets.