From 9ca8fc1d7e32a050e9a9bdf01510bb31c962b763 Mon Sep 17 00:00:00 2001 From: James Taylor Date: Tue, 31 Jul 2007 21:48:25 +0000 Subject: [PATCH] Tool forms now display labels above the fields rather than beside. This is both substantially easier to use [1], and it allows us to have longer labels (and thus, not have to worry about the details of a particular type of display when writing tool configurations). [1] http://www.uxmatters.com/MT/archives/000107.php) --- static/june_2007_style/base.css.tmpl | 71 +++++++++++- static/june_2007_style/blue/base.css | 70 +++++++++++- static/june_2007_style/blue/base_bg.png | Bin 232 -> 232 bytes static/june_2007_style/blue/error_bg.png | Bin 168 -> 168 bytes .../june_2007_style/blue/footer_title_bg.png | Bin 334 -> 334 bytes static/june_2007_style/blue/form_body_bg.png | Bin 178 -> 178 bytes static/june_2007_style/blue/form_title_bg.png | Bin 207 -> 207 bytes static/june_2007_style/blue/gray_bg.png | Bin 169 -> 169 bytes static/june_2007_style/blue/masthead_bg.png | Bin 128 -> 128 bytes static/june_2007_style/blue/menu_bg.png | Bin 624 -> 624 bytes static/june_2007_style/blue/ok_bg.png | Bin 168 -> 168 bytes .../june_2007_style/blue/panel_header_bg.png | Bin 144 -> 144 bytes static/june_2007_style/blue/warn_bg.png | Bin 169 -> 169 bytes static/light_hatched_style/base.css.tmpl | 31 +++++ static/light_hatched_style/blue/base.css | 31 +++++ static/light_hatched_style/blue/base_bg.png | Bin 279 -> 279 bytes static/light_hatched_style/blue/error_bg.png | Bin 168 -> 168 bytes .../blue/footer_title_bg.png | Bin 334 -> 334 bytes .../blue/form_title_bg.png | Bin 503 -> 503 bytes static/light_hatched_style/blue/gray_bg.png | Bin 169 -> 169 bytes .../light_hatched_style/blue/masthead_bg.png | Bin 427 -> 427 bytes static/light_hatched_style/blue/menu_bg.png | Bin 1248 -> 1248 bytes static/light_hatched_style/blue/ok_bg.png | Bin 168 -> 168 bytes static/light_hatched_style/blue/warn_bg.png | Bin 169 -> 169 bytes templates/tool_form.tmpl | 108 ++++++++++-------- 25 files changed, 257 insertions(+), 54 deletions(-) diff --git a/static/june_2007_style/base.css.tmpl b/static/june_2007_style/base.css.tmpl index 4ac2b432fe9..96813620669 100644 --- a/static/june_2007_style/base.css.tmpl +++ b/static/june_2007_style/base.css.tmpl @@ -9,8 +9,6 @@ body background-repeat: repeat-x; background-position: top; margin: 10px; - margin-right: 15px; - margin-left: 15px; } a:link, a:visited, a:active @@ -39,6 +37,8 @@ div.toolFormTitle { font-weight: bold; padding: 5px; + padding-left: 10px; + padding-right: 10px; background: $form_title_bg_bottom; background-image: url(form_title_bg.png); background-repeat: repeat-x; @@ -53,11 +53,13 @@ div.toolParamHelp div.toolFormBody { - padding: 10px; background: $form_body_bg_bottom; background-image: url(form_body_bg.png); background-repeat: repeat-x; background-position: top; + padding: 5px; + padding-left: 10px; + padding-right: 10px; } div.toolFormBody div.toolFormTitle @@ -86,11 +88,28 @@ div.form-row margin-bottom: 1em; } +div.form-title-row +{ + margin-bottom: 0.5em; +} + +div.repeat-group-item +{ + border-left: solid $form_border 5px; + padding-left: 10px; +} + +div.form-row-error +{ + background: $error_message_bg; + padding: 5px; +} + div.form-row label { font-weight: bold; display: block; - margin-bottom: .1em; + margin-bottom: .2em; } select, input, textarea @@ -242,4 +261,48 @@ div.odd_row #footer { display: none; +} + +## Tool panel stuff + +td.panel-body +{ + background: white; + color: $base_text; + background: $menu_bg_over url(menu_bg.png) top repeat-x; +} + +div.toolMenu +{ + padding: 10px; +} + +div.toolSectionPad +{ + margin: 0; + padding: 0; + height: 5px; + font-size: 0px; +} + +div.toolSectionDetailsInner +{ + margin-left: 5px; + margin-right: 5px; +} + +div.toolSectionTitle +{ + padding-bottom: 0px; + font-weight: bold; +} + +div.toolTitle +{ + padding-top: 5px; + padding-bottom: 5px; + margin-left: 16px; + margin-right: 10px; + display: list-item; + list-style: square outside; } \ No newline at end of file diff --git a/static/june_2007_style/blue/base.css b/static/june_2007_style/blue/base.css index cf6d56f1d94..3b7ad0105f6 100644 --- a/static/june_2007_style/blue/base.css +++ b/static/june_2007_style/blue/base.css @@ -9,8 +9,6 @@ body background-repeat: repeat-x; background-position: top; margin: 10px; - margin-right: 15px; - margin-left: 15px; } a:link, a:visited, a:active @@ -39,6 +37,8 @@ div.toolFormTitle { font-weight: bold; padding: 5px; + padding-left: 10px; + padding-right: 10px; background: #d2c099; background-image: url(form_title_bg.png); background-repeat: repeat-x; @@ -53,11 +53,13 @@ div.toolParamHelp div.toolFormBody { - padding: 10px; background: #FFFFFF; background-image: url(form_body_bg.png); background-repeat: repeat-x; background-position: top; + padding: 5px; + padding-left: 10px; + padding-right: 10px; } div.toolFormBody div.toolFormTitle @@ -86,11 +88,28 @@ div.form-row margin-bottom: 1em; } +div.form-title-row +{ + margin-bottom: 0.5em; +} + +div.repeat-group-item +{ + border-left: solid #d8b365 5px; + padding-left: 10px; +} + +div.form-row-error +{ + background: #FFCCCC; + padding: 5px; +} + div.form-row label { font-weight: bold; display: block; - margin-bottom: .1em; + margin-bottom: .2em; } select, input, textarea @@ -242,4 +261,47 @@ div.odd_row #footer { display: none; +} + + +td.panel-body +{ + background: white; + color: #303030; + background: #C1C9E5 url(menu_bg.png) top repeat-x; +} + +div.toolMenu +{ + padding: 10px; +} + +div.toolSectionPad +{ + margin: 0; + padding: 0; + height: 5px; + font-size: 0px; +} + +div.toolSectionDetailsInner +{ + margin-left: 5px; + margin-right: 5px; +} + +div.toolSectionTitle +{ + padding-bottom: 0px; + font-weight: bold; +} + +div.toolTitle +{ + padding-top: 5px; + padding-bottom: 5px; + margin-left: 16px; + margin-right: 10px; + display: list-item; + list-style: square outside; } \ No newline at end of file diff --git a/static/june_2007_style/blue/base_bg.png b/static/june_2007_style/blue/base_bg.png index 19ca36f9ee7c77bfd96eca57c85c56f744e92f64..1c9d75ca81f7ac48d539ea391cefdbca283d7f0b 100644 GIT binary patch delta 18 acmaFC_=0hQ9f!QAqQ&u}7da-nEdl^Qod*;E delta 18 ZcmaFC_=0hQ9S4t)1n&*Oveb!givT(C1}Ojl diff --git a/static/june_2007_style/blue/error_bg.png b/static/june_2007_style/blue/error_bg.png index 9e537638d5c6ed9c2af520f44b9ef01203e71eef..4aeea71a51b4efaf6bf863e851ea0e974530702e 100644 GIT binary patch delta 18 acmZ3%xPozl9f!QAqUDA|59dvEO9B8n+6LhO delta 18 ZcmZ3%xPozl9S4t)1fQdX`u&M+NdPUM1qA>A diff --git a/static/june_2007_style/blue/footer_title_bg.png b/static/june_2007_style/blue/footer_title_bg.png index 577046d7f3910e0e8d0ac4dfa8ca3911e8e54897..e4eb2a9e7fec295ffb5881a0ede62256aa4fe7c8 100644 GIT binary patch delta 19 bcmX@dbdG6)9f!QAqUDA|59e)k<6r~;Mgj)* delta 19 acmX@dbdG6)9S4t)1fQdX`u&Y=9E<=r>jfGB diff --git a/static/june_2007_style/blue/form_body_bg.png b/static/june_2007_style/blue/form_body_bg.png index 2d594ab7afeba5aa8cc4c2c86f98aa8741c6e86e..c1259357b3bdad8632b2c23eae678c2b81e793ac 100644 GIT binary patch delta 18 acmdnQxQTIs9f!QAqQ&u}7da-njVHlF9%it delta 18 ZcmX@lc%E^B9S4t)1fQdX`u&M+od7cQ1$qDg diff --git a/static/june_2007_style/blue/gray_bg.png b/static/june_2007_style/blue/gray_bg.png index 2c59cafd6ffd29a11eed352e477ffcc6f61eb60b..1a5e712d0a8662150277e24162e758267ac9af6c 100644 GIT binary patch delta 18 acmZ367t delta 18 ZcmZo*Y+#&V$H5~c!RIKUet)8y6#ytF1dRXy diff --git a/static/june_2007_style/blue/menu_bg.png b/static/june_2007_style/blue/menu_bg.png index 6847a88b2603321362eaad12c747828b42c2d11c..a9ce67812704544b346f831601f609f8d6688584 100644 GIT binary patch delta 19 bcmeys@_}W79f!QAqQ&u}7dbY%X)yr+NXZ7& delta 19 acmeys@_}W79S4t)1n&*Oveb=kT1)^zG6m@X diff --git a/static/june_2007_style/blue/ok_bg.png b/static/june_2007_style/blue/ok_bg.png index 838e2abdd6c2dc417b8e5516af855914b9820979..cecc373631a2729e40b76b635c8d0e6b32edbdb7 100644 GIT binary patch delta 18 acmZ3%xPozl9f!QAqUDA|59dvEO9B8n+6LhO delta 18 ZcmZ3%xPozl9S4t)1fQdX`u&M+NdPUM1qA>A diff --git a/static/june_2007_style/blue/panel_header_bg.png b/static/june_2007_style/blue/panel_header_bg.png index 195c9dade86225248165c8e8a4873afc0d361c7b..1c69e4ad7064aa071176c7dec659d6b939875495 100644 GIT binary patch delta 18 acmbQhIDv739f!QAqQ&u}7da-nc>w@4l?Ds| delta 18 ZcmbQhIDv739S4t)1n&*Oveb!gUH~oW1t92B&;{TC delta 18 ZcmbQvG@WUJ9S4t)h-{{?ChtVIivTJ71hN1C diff --git a/static/light_hatched_style/blue/error_bg.png b/static/light_hatched_style/blue/error_bg.png index 52d89b5869fbe8da57fc7757b78445e3fc660a31..ea30849efe01cc6c59034f45dd12c9c2f8e6582b 100644 GIT binary patch delta 18 ZcmZ3%xPozl9f!QAy6Jm8F5`)ANdPiZ1xx?{ delta 18 ZcmZ3%xPozl9S4t)h};LMitQ8Kk^nQs1?vC+ diff --git a/static/light_hatched_style/blue/footer_title_bg.png b/static/light_hatched_style/blue/footer_title_bg.png index 0d271f83951c6a69e3de6ba0054dd72683655a7a..438c4e047b99bfdbf2f560fc2d0baa027429d99e 100644 GIT binary patch delta 19 acmX@dbdG6)9f!QAy2%VptEC&=I2ZvvTLq>7 delta 19 acmX@dbdG6)9S4t)h-{{?ChtZ!4n_bqSp;|h diff --git a/static/light_hatched_style/blue/form_title_bg.png b/static/light_hatched_style/blue/form_title_bg.png index 2a35b6d4af3ff7e9b7c0f1bbb78dbe0421c73a54..1c3a1158fbf92b38292ba80064aeb44e17004833 100644 GIT binary patch delta 19 bcmey){GEA%9f!QAy2%VptEC&=HZlSLM3V-i delta 19 acmey){GEA%9S4t)h-{{?ChtbKjf?<1kp*=C diff --git a/static/light_hatched_style/blue/gray_bg.png b/static/light_hatched_style/blue/gray_bg.png index ed3929364499515da4ed85c40ec2681cc7c852d2..68ba1e642f74f2cd7a907926f73567cbcc87fcfa 100644 GIT binary patch delta 18 ZcmZ3 #from galaxy.util.expressions import ExpressionContext @@ -12,33 +13,32 @@ -#if $getVar( 'error_message', None ) -
$error_message
-

-#end if +## #if $getVar( 'error_message', None ) +##
$error_message
+##

+## #end if #def do_inputs( $inputs, $tool_state, $errors, $prefix, $context=None ) #set $context = ExpressionContext( $tool_state, $context ) #for $input_index, $input in enumerate( $inputs.itervalues() ) #if $input.type == "repeat" - #if $input_index > 0 -
- #end if - ${input.title_plural} - #set repeat_state = $tool_state[$input.name] - #for i in range( len( $repeat_state ) ): - #if $input.name in errors - #set rep_errors = $errors[$input.name][$i] - #else - #set rep_errors = dict() - #end if - ${input.title} ${i + 1} - $do_inputs( $input.inputs, $repeat_state[$i], $rep_errors, $prefix + $input.name + "_" + str(i) + "|", $context ) - - #end for -   - -
+
+
${input.title_plural}
+ #set repeat_state = $tool_state[$input.name] + #for i in range( len( $repeat_state ) ): +
+ #if $input.name in errors + #set rep_errors = $errors[$input.name][$i] + #else + #set rep_errors = dict() + #end if +
${input.title} ${i + 1}
+ $do_inputs( $input.inputs, $repeat_state[$i], $rep_errors, $prefix + $input.name + "_" + str(i) + "|", $context ) +
+
+ #end for +
+
#elif $input.type == "conditional" #set group_state = $tool_state[$input.name] #set group_errors = $errors.get( $input.name, {} ) @@ -53,19 +53,37 @@ #end def #def row_for_param( $prefix, $param, $parent_state, $parent_errors, $context, $refresh=False ) - - $param.get_label(): - - #set field = $param.get_html_field( $caller, $parent_state[ $param.name ], $context ) - #set $field.refresh_on_change = $refresh -
$field.get_html( $prefix )
- #if $parent_errors.has_key( $param.name ): -
$parent_errors[$param.name]
- #elif $param.help -
$param.help
- #end if - - + #if $parent_errors.has_key( $param.name ): + #set cls = "form-row form-row-error" + #else + #set cls = "form-row" + #end if +
+ + + #set field = $param.get_html_field( $caller, $parent_state[ $param.name ], $context ) + #set $field.refresh_on_change = $refresh +
$field.get_html( $prefix )
+ #if $parent_errors.has_key( $param.name ): +
+
 $parent_errors[$param.name]
+
+ #elif $param.help + ##
$param.help
+ #end if + + #if $param.help +
+ $param.help +
+ + #end if + +
+ +
#end def
@@ -82,27 +100,25 @@ #if $tool.display_by_page[$tool_state.page] $caller.fill_template_string( $tool.display_by_page[$tool_state.page], context=$tool.get_param_html_map( $caller, $tool_state.page, $tool_state.inputs ) ) - + #else - - + $do_inputs( $tool.inputs_by_page[ $tool_state.page ], $tool_state.inputs, $errors, "" ) - -
+
#if $tool_state.page == $tool.last_page - + #else - + #end if -
+
#if $tool_state.page == $tool.last_page - + #else - + #end if -
+
#end if