Bug 374020: Re-work the bug editing form to be more usable.

Patch By Guy Pyrzak <guy.pyrzak@gmail.com> r=mkanat, a=mkanat

11 files changed, 883 insertions, 502 deletions

diff --git a/js/field.js b/js/field.js
index ca58329f4..164ce1c31 100644
--- a/js/field.js
+++ b/js/field.js
@@ -134,3 +134,60 @@ function updateCalendarFromField(date_field) {
         cal.render();
     }
 }
+
+
+/* Hide input fields and show the text with (edit) next to it */  
+function hideEditableField( container, input, action, field_id, original_value ) {
+    YAHOO.util.Dom.setStyle(container, 'display', 'inline');
+    YAHOO.util.Dom.setStyle(input, 'display', 'none');
+    YAHOO.util.Event.addListener(action, 'click', showEditableField, new Array(container, input) );
+    if(field_id != ""){
+      YAHOO.util.Event.addListener(window, 'load', checkForChangedFieldValues, new Array(container, input, field_id, original_value ));
+    }
+}
+
+/* showEditableField (e, ContainerInputArray)
+ * Function hides the (edit) link and the text and displays the input
+ *
+ * var e: the event
+ * var ContainerInputArray: An array containing the (edit) and text area and the input being displayed
+ * var ContainerInputArray[0]: the conainer that will be hidden usually shows the (edit) text
+ * var ContainerInputArray[1]: the input area and label that will be displayed
+ *
+ */
+function showEditableField (e, ContainerInputArray) {
+    YAHOO.util.Dom.setStyle(ContainerInputArray[0], 'display', 'none');
+    YAHOO.util.Dom.setStyle(ContainerInputArray[1], 'display', 'inline');
+    YAHOO.util.Event.preventDefault(e);
+}
+
+
+/* checkForChangedFieldValues(e, array )
+ * Function checks if after the autocomplete by the browser if the values match the originals.
+ *   If they don't match then hide the text and show the input so users don't get confused.
+ *
+ * var e: the event
+ * var ContainerInputArray: An array containing the (edit) and text area and the input being displayed
+ * var ContainerInputArray[0]: the conainer that will be hidden usually shows the (edit) text
+ * var ContainerInputArray[1]: the input area and label that will be displayed
+ * var ContainerInputArray[2]: the field that is on the page, might get changed by browser autocomplete 
+ * var ContainerInputArray[3]: the original value from the page loading.
+ *
+ */  
+function checkForChangedFieldValues(e, ContainerInputArray ) {
+    var el = document.getElementById(ContainerInputArray[2]);
+    if ( el ) {
+        if ( el.value != ContainerInputArray[3] || ( el.value == "" && el.id != "alias") ) {
+            YAHOO.util.Dom.setStyle(ContainerInputArray[0], 'display', 'none');
+            YAHOO.util.Dom.setStyle(ContainerInputArray[1], 'display', 'inline');
+        } 
+    }
+}
+
+function hideAliasAndSummary(short_desc_value, alias_value){
+  // check the short desc field
+  hideEditableField( 'summary_alias_container', 'summary_alias_input', 'editme_action', 'short_desc', short_desc_value);  
+  // check that the alias hasn't changed
+  bz_alias_check_array = new Array('summary_alias_container', 'summary_alias_input', 'alias', alias_value )
+  YAHOO.util.Event.addListener( window, 'load', checkForChangedFieldValues, bz_alias_check_array);
+}
diff --git a/skins/contrib/Dusk/.cvsignore b/skins/contrib/Dusk/.cvsignore
index 193d1507b..8e2561a25 100644
--- a/skins/contrib/Dusk/.cvsignore
+++ b/skins/contrib/Dusk/.cvsignore
@@ -10,6 +10,7 @@ index.css
 panel.css
 params.css
 release-notes.css
+show_bug.css
 show_multiple.css
 summarize-time.css
 voting.css
diff --git a/skins/standard/global.css b/skins/standard/global.css
index 4d8102f88..9d87927c7 100644
--- a/skins/standard/global.css
+++ b/skins/standard/global.css
@@ -28,6 +28,10 @@
         color: #000;
         background: #fff url("global/body-back.gif") repeat-x;
     }
+    body, td, th, input {
+        font-family: Verdana, sans-serif;
+        font-size: small;
+    }    
 /* global (end) */
 
 /* header (begin) */
@@ -41,11 +45,6 @@
         display: inline;
     }
 
-    #header .btn,
-    #header .txt {
-        font-size: 80%;
-    }
-
     #header .links {
         font-size: 85%;
         border-left: 1px solid silver;
@@ -397,3 +396,5 @@ form#Create .comment {
     -moz-border-radius: 5px;
     background: white;
 }
+
+
diff --git a/skins/standard/show_bug.css b/skins/standard/show_bug.css
new file mode 100644
index 000000000..0546b4165
--- /dev/null
+++ b/skins/standard/show_bug.css
@@ -0,0 +1,65 @@
+.bz_alias_short_desc_container {
+    margin: 8px 0; 
+    padding: 0.3em; 
+    background-color: rgb(208, 208, 208); 
+    -moz-border-radius: 0.5em; 
+    font-size: 125%; 
+    font-weight: bold;
+}
+
+.bz_column_spacer {
+    width: 2em;
+}
+
+.bz_default_hidden {
+    display: none;
+}
+
+.related_actions {
+    font-size: 0.85em; 
+    float: right;
+    list-style-type: none;
+    white-space: nowrap;
+    margin: 0;
+    padding: 0;
+}
+
+.related_actions li {
+    display: inline;
+}
+
+.bz_show_bug_column {
+  vertical-align: top;
+}
+
+.bz_section_spacer {
+    height: 1em;
+}
+
+#bz_field_status {
+    white-space: nowrap;
+}
+
+.bz_time_tracking_table {
+    border-collapse: collapse;
+}
+
+.bz_time_tracking_table th {
+    text-align: center;
+    background-color: #ccc;
+}
+
+.bz_time_tracking_table td {
+    text-align: center;
+}
+
+.bz_time_tracking_table th, 
+.bz_time_tracking_table td {
+    padding: 4px;
+    border: 1px solid black;
+
+}
+
+.bz_time_tracking_table .bz_summarize_time {
+    text-align: right;
+}
diff --git a/t/008filter.t b/t/008filter.t
index d4053461e..8b92d94d0 100644
--- a/t/008filter.t
+++ b/t/008filter.t
@@ -176,7 +176,7 @@ sub directive_ok {
     return 1 if $directive =~ /^(IF|END|UNLESS|FOREACH|PROCESS|INCLUDE|
                                  BLOCK|USE|ELSE|NEXT|LAST|DEFAULT|FLUSH|
                                  ELSIF|SET|SWITCH|CASE|WHILE|RETURN|STOP|
-                                 TRY|CATCH|FINAL|THROW|CLEAR|MACRO)/x;
+                                 TRY|CATCH|FINAL|THROW|CLEAR|MACRO|FILTER)/x;
 
     # ? :
     if ($directive =~ /.+\?(.+):(.+)/) {
diff --git a/template/en/default/attachment/created.html.tmpl b/template/en/default/attachment/created.html.tmpl
index 5522380ac..d0358dac3 100644
--- a/template/en/default/attachment/created.html.tmpl
+++ b/template/en/default/attachment/created.html.tmpl
@@ -30,7 +30,7 @@
   title = "Attachment $attachment.id added to $terms.Bug $attachment.bug_id"
   javascript_urls = [ "js/util.js", "js/keyword-chooser.js", "js/field.js",
                       "js/yui/yahoo-dom-event.js", "js/yui/calendar.js" ]
-  style_urls = [ "skins/standard/yui/calendar.css" ]
+  style_urls = [ "skins/standard/yui/calendar.css", "skins/standard/show_bug.css" ]
   doc_section = "bug_page.html"
 %]
 
diff --git a/template/en/default/bug/create/created.html.tmpl b/template/en/default/bug/create/created.html.tmpl
index 1a88c98ab..c4ec8dd0a 100644
--- a/template/en/default/bug/create/created.html.tmpl
+++ b/template/en/default/bug/create/created.html.tmpl
@@ -36,7 +36,11 @@
 
 [% PROCESS global/header.html.tmpl
   title = "$terms.Bug $id Submitted"
-  javascript_urls = [ "js/util.js", "js/keyword-chooser.js" ]
+  javascript_urls = [ "js/util.js", "js/keyword-chooser.js", "js/field.js",
+                        "js/yui/yahoo-dom-event.js", "js/yui/calendar.js" ]
+  style_urls = [ "skins/standard/yui/calendar.css", "skins/standard/show_bug.css" ]
+  
+  
 %]
 
 [% header_done = 1 %]
diff --git a/template/en/default/bug/edit.html.tmpl b/template/en/default/bug/edit.html.tmpl
index c37f93838..1a99a061a 100644
--- a/template/en/default/bug/edit.html.tmpl
+++ b/template/en/default/bug/edit.html.tmpl
@@ -30,7 +30,7 @@
 
   <script type="text/javascript">
   <!--
-
+  
   /* Outputs a link to call replyToComment(); used to reduce HTML output */
   function addReplyLink(id, real_id) {
       /* XXX this should really be updated to use the DOM Core's
@@ -143,247 +143,70 @@
   <input type="hidden" name="longdesclength" value="[% bug.longdescs.size %]">
   <input type="hidden" name="id" value="[% bug.bug_id %]">
 
-  [%# That's the main table, which contains all editable fields. %]
+  [% PROCESS section_title %]
   <table>
     <tr>
-      <td valign="top">
-        <fieldset>
-          <legend>Details</legend>
-          <table>
-
-            [%# *** Summary *** %]
-            <tr>
-              <td align="right">
-                <label for="short_desc" accesskey="s"><b><u>S</u>ummary</b></label>:
-              </td>
-              [% PROCESS input inputname => "short_desc" size => "60" colspan => 2
-                               maxlength => 255 spellcheck => "true" %]
-            </tr>
-
-            <tr>
-              <td colspan="3">
-                <table>
-                  <tr>
-                    [%# *** ID, product, component, status and resolution *** %]
-                    <td valign="top">[% PROCESS section_details1 %]</td>
-
-                    [%# *** Platform, OS, severity, priority, version and milestone *** %]
-                    <td valign="top">[% PROCESS section_details2 %]</td>
-                  </tr>
-                </table>
-              </td>
-            </tr>
-
-            <tr>
-              <td colspan="3"><hr size="1"></td>
-            </tr>
-
-            [%# *** URL Whiteboard Keywords *** %]
-
-            <tr>
-              <td align="right">
-                <label for="bug_file_loc" accesskey="u"><b>
-                  [% IF bug.bug_file_loc 
-                     AND NOT bug.bug_file_loc.match("^(javascript|data)") %]
-                    <a href="[% bug.bug_file_loc FILTER html %]"><u>U</u>RL</a>
-                  [% ELSE %]
-                    <u>U</u>RL
-                  [% END %]
-                [%%]</b></label>:
-              </td>
-              [% PROCESS input inputname => "bug_file_loc" size => "60" colspan => 2 %]
-            </tr>
-
-            [% IF Param('usestatuswhiteboard') %]
-              <tr>
-                <td align="right">
-                  <label for="status_whiteboard" accesskey="w"><b><u>W</u>hiteboard</b></label>:
-                </td>
-                [% PROCESS input inputname => "status_whiteboard" size => "60" colspan => 2 %]
-              </tr>
-            [% END %]
-
-            [% IF use_keywords %]
-              <tr>
-                <td align="right">
-                  <label for="keywords" accesskey="k">
-                    <b><a href="describekeywords.cgi"><u>K</u>eywords</a></b></label>:
-                </td>
-                [% PROCESS input inputname => "keywords" size => 60 colspan => 2
-                                 value => bug.keywords.join(', ')
-                                 onfocus => "this.chooser.open()" %]
-              </tr>
-            [% END %]
-
-            [%# *** Custom Fields *** %]
-
-            [% USE Bugzilla %]
-            [% fields = Bugzilla.get_fields({ obsolete => 0, custom => 1 }) %]
-            [% IF fields %]
-              [% FOREACH field = fields %]
-                <tr>
-                  [% PROCESS bug/field.html.tmpl value=bug.${field.name}
-                                                 editable = bug.check_can_change_field(field.name, 0, 1)
-                                                 value_span = 2 %]
-                </tr>
-              [% END %]
-            [% END %]
-
-            [%# *** Dependencies *** %]
-
-            <tr>
-              [% PROCESS dependencies
-                         dep = { title => "Depends&nbsp;on", fieldname => "dependson" } %]
-            </tr>
-
-            <tr>
-              [% PROCESS dependencies accesskey = "b"
-                         dep = { title => "<u>B</u>locks", fieldname => "blocked" } %]
-            </tr>
-
-            <tr>
-              <th>&nbsp;</th>
-
-              <td colspan="2">
-                <a href="showdependencytree.cgi?id=[% bug.bug_id %]&amp;hide_resolved=1">Show
-                   dependency tree</a>
-
-                [% IF Param('webdotbase') %]
-                  - <a href="showdependencygraph.cgi?id=[% bug.bug_id %]">Show
-                       dependency graph</a>
-                [% END %]
-              </td>
-            </tr>
-          </table>
-        </fieldset>
-      </td>
-
-      [%# Force the layout to be displayed now, before drawing the second column of the table.
-        # This should prevent bug 370739 when using Firefox 2. %]
-      <script type="text/javascript">
-        <!--
-        var v = document.body.offsetHeight;
-        //-->
-      </script>
-
-      <td valign="top">
-        [%# *** Reporter, owner and QA contact *** %]
-        <fieldset>
-          <legend>People</legend>
+      [%# 1st Column %]
+      <td id="bz_show_bug_column_1" class="bz_show_bug_column">     
+        <table>
+          [%# *** ID, product, component, status, resolution, Hardware, and  OS *** %]
+          [% PROCESS section_details1 %]
+          
+          [% PROCESS section_spacer %]
+          
+          [%# *** severity, priority, version and milestone *** %]
+          [% PROCESS section_details2 %]            
+          
+          [%# *** assigned to and qa contact *** %]
           [% PROCESS section_people %]
-        </fieldset>
-
-        [%# *** Flags *** %]
-        [% show_bug_flags = 0 %]
-        [% FOREACH type = bug.flag_types %]
-          [% IF (type.flags && type.flags.size > 0) || (user.id && type.is_active) %]
-            [% show_bug_flags = 1 %]
-            [% LAST %]
-          [% END %]
-        [% END %]
-        [% IF show_bug_flags %]
-          <fieldset>
-            <legend>Flags</legend>
-            <table cellspacing="1" cellpadding="1">
-              <tr>
-                <td colspan="2" valign="top">
-                  [% IF user.id %]
-                    [% IF bug.flag_types.size > 0 %]
-                      [% PROCESS "flag/list.html.tmpl" flag_no_header = 1
-                                                       flag_types = bug.flag_types
-                                                       any_flags_requesteeble = bug.any_flags_requesteeble %]
-                    [% END %]
-                  [% ELSE %]
-                    [% FOREACH type = bug.flag_types %]
-                      [% FOREACH flag = type.flags %]
-                          [% flag.setter.nick FILTER html %]:
-                          [%+ type.name FILTER html FILTER no_break %][% flag.status %]
-                          [%+ IF flag.requestee %]
-                            ([% flag.requestee.nick FILTER html %])
-                          [% END %]<br>
-                      [% END %]
-                    [% END %]
-                  [% END %]
-                </td>
-              </tr>
-            </table>
-          </fieldset>
-        [% END %]
+          
+          [% PROCESS section_spacer %]
+          
+          [% PROCESS section_url_keyword_whiteboard %]
+          
+          [% PROCESS section_spacer %]
+          
+          [%# *** Dependencies *** %]
+          [% PROCESS section_dependson_blocks %]
+          
+        </table>
+      </td>
+      <td>
+        <div class="bz_column_spacer">&nbsp;</div>
+      </td>
+      [%# 2nd Column %]
+      <td id="bz_show_bug_column_2" class="bz_show_bug_column">
+        <table cellpadding="3" cellspacing="1">
+        [%# *** Reported and modified dates *** %]
+         [% PROCESS section_dates %]
+         
+         [% PROCESS section_cclist %]
+         
+         [% PROCESS section_spacer %] 
+         
+         [% PROCESS section_customfields %]
+         
+         [% PROCESS section_spacer %]
+         
+         [% PROCESS section_flags %]
+
+        </table>
+      </td>
+    </tr>
+    <tr>
+      <td colspan="3">
+          <hr id="bz_top_half_spacer">
       </td>
     </tr>
   </table>
 
+  
+  [% PROCESS section_restrict_visibility %]
   [% IF user.in_group(Param('timetrackinggroup')) %]
     <br>
-    <table cellspacing="0" cellpadding="4" border="1">
-      <tr>
-        <th align="center" bgcolor="#cccccc">
-          <label for="estimated_time">Orig. Est.</label>
-        </th>
-        <th align="center" bgcolor="#cccccc">
-          Current Est.
-        </th>
-        <th align="center" bgcolor="#cccccc">
-          <label for="work_time">Hours Worked</label>
-        </th>
-        <th align="center" bgcolor="#cccccc">
-          <label for="remaining_time">Hours Left</label>
-        </th>
-        <th align="center" bgcolor="#cccccc">
-          %Complete
-        </th>
-        <th align="center" bgcolor="#cccccc">
-          Gain
-        </th>
-        <th align="center" bgcolor="#cccccc">
-          <label for="deadline">Deadline</label>
-        </th>
-      </tr>
-      <tr>
-        <td align="center">
-          <input name="estimated_time" id="estimated_time"
-                 value="[% PROCESS formattimeunit
-                                   time_unit=bug.estimated_time %]"
-                 size="6" maxlength="6">
-        </td>
-        <td align="center">
-          [% PROCESS formattimeunit
-                     time_unit=(bug.actual_time + bug.remaining_time) %]
-        </td>
-        <td align="center">
-          [% PROCESS formattimeunit time_unit=bug.actual_time %] +
-          <input name="work_time" id="work_time"
-                 value="0" size="3" maxlength="6"
-                 onchange="adjustRemainingTime();">
-        </td>
-        <td align="center">
-          <input name="remaining_time" id="remaining_time"
-                 value="[% PROCESS formattimeunit
-                                   time_unit=bug.remaining_time %]"
-                 size="6" maxlength="6" onchange="updateRemainingTime();">
-        </td>
-        <td align="center">
-          [% PROCESS calculatepercentage act=bug.actual_time
-                                         rem=bug.remaining_time %]
-        </td>
-        <td align="center">
-          [% PROCESS formattimeunit time_unit=bug.estimated_time - (bug.actual_time + bug.remaining_time) %]
-        </td>
-         <td align="center">
-           <input name="deadline" id="deadline" value="[% bug.deadline %]"
-                  size="10" maxlength="10"><br />
-           <small>(YYYY-MM-DD)</small>
-        </td>        
-      </tr>
-      <tr>
-        <td colspan="7" align="right">
-          <a href="summarize_time.cgi?id=[% bug.bug_id %]&amp;do_depends=1">
-          Summarize time (including time for [% terms.bugs %]
-          blocking this [% terms.bug %])</a>
-        </td>
-      </tr>
-    </table>
+    [% PROCESS section_timetracking %]
   [% END %]
+  
 
 [%# *** Attachments *** %]
 
@@ -444,124 +267,19 @@
             </p>
           </fieldset>
         [% END %]
-      </td>
-
-      <td valign="top">
-        <fieldset>
-          <legend>Related actions</legend>
-          <ul>
-            <li><a href="show_activity.cgi?id=[% bug.bug_id %]">View [% terms.Bug %] Activity</a></li>
-            <li><a href="show_bug.cgi?format=multiple&amp;id=[% bug.bug_id %]">Format For Printing</a></li>
-            <li><a href="show_bug.cgi?ctype=xml&amp;id=[% bug.bug_id %]">XML</a></li>
-            <li><a href="enter_bug.cgi?cloned_bug_id=[% bug.bug_id %]">Clone This [% terms.Bug %]</a></li>
-          </ul>
-
-          [% IF bug.use_votes %]
-            <br>
-            <b><a href="page.cgi?id=voting.html">Votes</a></b>: [% bug.votes %]
-            <ul>
-              [% IF bug.votes %]
-                <li><a href="votes.cgi?action=show_bug&amp;bug_id=[% bug.bug_id %]">Show
-                             votes for this [% terms.bug %]</a></li>
-              [% END %]
-              <li><a href="votes.cgi?action=show_user&amp;bug_id=[% bug.bug_id %]#vote_[% bug.bug_id %]">Vote
-                           for this [% terms.bug %]</a></li>
-            </ul>
-          [% END %]
-
-          [%# Links to more things users can do with this bug. %]
-          [% Hook.process("links") %]
-        </fieldset>
+        [%# *** Additional Comments *** %]
+        <hr>
+        <div id="comments">
+        [% PROCESS bug/comments.html.tmpl
+           comments = bug.longdescs
+           mode = user.id ? "edit" : "show"
+         %]
+        </div>
+        
       </td>
     </tr>
   </table>
-  <br>
-
-  [% IF bug.groups.size > 0 %]
-    [% inallgroups = 1 %]
-    [% inagroup = 0 %]
-    [% FOREACH group = bug.groups %]
-      [% SET inallgroups = 0 IF NOT group.ingroup %]
-      [% SET inagroup = 1 IF group.ison %]
-
-      [% IF NOT group.mandatory %]
-        [% IF NOT emitted_description %]
-          [% emitted_description = 1 %]
-          <br>
-          <b>Only users in all of the selected groups can view this [% terms.bug %]:</b>
-          <br>
-          <font size="-1">
-            (Unchecking all boxes makes this a more public [% terms.bug %].)
-          </font>
-          <br>
-          <br>
-        [% END %]
-
-      &nbsp;&nbsp;&nbsp;&nbsp;
-      [% IF group.ingroup %]
-        <input type="hidden" name="defined_bit-[% group.bit %]" value="1">
-      [% END %]
-      <input type="checkbox" value="1"
-             name="bit-[% group.bit %]" id="bit-[% group.bit %]"
-             [% " checked=\"checked\"" IF group.ison %]
-             [% " disabled=\"disabled\"" IF NOT group.ingroup %]>
-      <label for="bit-[% group.bit %]">[% group.description FILTER html_light %]</label>
-      <br>
-      [% END %]
-    [% END %]
-
-    [% IF NOT inallgroups %]
-      <b>
-        Only members of a group can change the visibility of [% terms.abug %] for
-        that group
-      </b>
-    <br>
-    [% END %]
-
-    [% IF inagroup %]
-      <p>
-        <b>Users in the roles selected below can always view this [% terms.bug %]:</b>
-        <br>
-        <small>
-          (The assignee
-          [% IF (Param('useqacontact')) %]
-             and QA contact
-          [% END %]
-          can always see [% terms.abug %], and this section does not take effect unless
-          the [% terms.bug %] is restricted to at least one group.)
-        </small>
-      </p>
-
-      <p>
-        <input type="hidden" name="defined_reporter_accessible" value="1">
-        <input type="checkbox" value="1"
-               name="reporter_accessible" id="reporter_accessible"
-               [% " checked" IF bug.reporter_accessible %]
-               [% " disabled=\"disabled\"" UNLESS bug.check_can_change_field("reporter_accessible", 0, 1) %]>
-        <label for="reporter_accessible">Reporter</label>
-        <input type="hidden" name="defined_cclist_accessible" value="1">
-        <input type="checkbox" value="1"
-               name="cclist_accessible" id="cclist_accessible"
-               [% " checked" IF bug.cclist_accessible %]
-               [% " disabled=\"disabled\"" UNLESS bug.check_can_change_field("cclist_accessible", 0, 1) %]>
-        <label for="cclist_accessible">CC List</label>
-      </p>
-    [% END %]
-  [% END %]
-
 [% PROCESS bug/knob.html.tmpl IF user.id %]
-
-[%# *** Additional Comments *** %]
-
-<hr>
-
-<div id="comments">
-[% PROCESS bug/comments.html.tmpl
-   comments = bug.longdescs
-   mode = user.id ? "edit" : "show"
- %]
-</div>
-
 </form>
 
 [% IF use_keywords %]
@@ -571,66 +289,117 @@
 [% END %]
 
 [%############################################################################%]
-[%# Block for the first table in the "Details" section                       #%]
+[%# Block for the Title (alias and short desc)                               #%]
 [%############################################################################%]
 
-[% BLOCK section_details1 %]
-  <table cellspacing="1" cellpadding="1">
-    <tr>
-      <td align="right">
-        [% IF Param('useclassification') && bug.classification_id != 1 %]
-          <b>[[% bug.classification FILTER html %]]</b>
+[% BLOCK section_title %]
+  [%# That's the main table, which contains all editable fields. %]
+  <div class="bz_alias_short_desc_container">
+    
+    [% IF Param('useclassification') && bug.classification_id != 1 %]
+      <b>[[% bug.classification FILTER html %]]</b>
+    [% END %]
+     <a href="show_bug.cgi?id=[% bug.bug_id %]">
+        <b>[% terms.Bug %]&nbsp;[% bug.bug_id FILTER html %]</b>
+     </a> - 
+     <span id="summary_alias_container" class="bz_default_hidden"> 
+      [% IF Param("usebugaliases") %]
+        [% IF bug.alias != "" %]
+          (<span id="alias_nonedit_display">[% bug.alias FILTER html %]</span>) 
         [% END %]
-        <b>[% terms.Bug %]#</b>:
-      </td>
-      <td>
-        <a href="[% urlbase FILTER html %]show_bug.cgi?id=[% bug.bug_id %]">
-           [% bug.bug_id %]</a>
-      </td>
-    </tr>
+      [% END %]
+      <span id="short_desc_nonedit_display">[% bug.short_desc FILTER html %]</span>
+      [% IF bug.check_can_change_field('short_desc', 0, 1) || 
+            bug.check_can_change_field('alias', 0, 1)  %]
+        <small class="editme">(<a href="#" id="editme_action">edit</a>)</small>
+      [% END %]
+     </span>
+  
+       
+    <span id="summary_alias_input">
+      <span id="summary">                           
+        [% IF Param("usebugaliases") %]
+          [% IF bug.check_can_change_field('alias', 0, 1) %]
+            <label 
+              for="alias" 
+              title="a name for the 
+                     [% terms.bug %] that can be used in place of its ID number, 
+                     [%%] e.g. when adding it to a list of dependencies"
+              >Alias</label>:&nbsp;
+          [% ELSIF bug.alias %]
+            (
+          [% END %]
+          [% PROCESS input inputname => "alias" 
+                     size => "20" 
+                     maxlength => "20"  
+                     no_td => 1 
+                     %][% ") " IF NOT bug.check_can_change_field('alias', 0, 1) 
+                                  && bug.alias %]
+        [% END %] 
+        [%# *** Summary *** %]
+          [% IF bug.check_can_change_field('alias', 0, 1) %]
+            <label accesskey="s" for="short_desc"><u>S</u>ummary</label>:&nbsp;
+          [% END %]
+          [% PROCESS input inputname => "short_desc" size => "60" colspan => 2
+                           maxlength => 255 spellcheck => "true" no_td => 1 %]
+      </span>
+    </span>
+  </div>
+  <script type="text/javascript">
+    hideAliasAndSummary('[% bug.short_desc FILTER js %]', '[% bug.alias FILTER js %]');
+  </script>
+[% END %]
 
-    [% IF Param("usebugaliases") %]
-      <tr>
-        <td align="right">
-          <label for="alias" title="a name for the [% terms.bug %] that can be used in place of its ID number, f.e. when adding it to a list of dependencies"><b>Alias</b></label>:
-        </td>
-        [% PROCESS input inputname => "alias" size => "20" maxlength => "20" %]
-      </tr>
-    [% END %]
+[%############################################################################%]
+[%# Block for the first table in the "Details" section                       #%]
+[%############################################################################%]
+
+[% BLOCK section_details1 %]
 
+    [%#############%]
+    [%#  PRODUCT  #%]
+    [%#############%]
     <tr>
-      <td align="right">
+      <td class="field_label">
         <label for="product" accesskey="p"><b><u>P</u>roduct</b></label>:
       </td>
       [% PROCESS select selname => "product" %]
     </tr>
-
+    [%###############%]    
+    [%#  Component  #%]
+    [%###############%]
     <tr>
-      <td align="right">
-        <label for="component" accesskey="m"><b><a href="describecomponents.cgi?product=[% bug.product FILTER url_quote %]">Co<u>m</u>ponent</a></b></label>:
+      <td class="field_label">
+        <label for="component" accesskey="m">
+          <b><a href="describecomponents.cgi?product=[% bug.product FILTER url_quote %]">
+            Co<u>m</u>ponent</a>
+          </b>
+        </label>:
       </td>
       [% PROCESS select selname => "component" %]
     </tr>
-
     <tr>
-      <td align="right">
-        <b><a href="page.cgi?id=fields.html#status">Status</a></b>:
+      <td class="field_label">
+        <label for="version"><b>Version</b></label>:
       </td>
-      <td>[% get_status(bug.bug_status) FILTER html %]</td>
-    </tr>
 
+      [% PROCESS select selname => "version" %]
+    </tr>
+    [%############%]    
+    [%# PLATFORM #%]
+    [%############%]    
     <tr>
-      <td align="right">
-        <b><a href="page.cgi?id=fields.html#resolution">Resolution</a></b>:
+      <td class="field_label">
+        <label for="rep_platform" accesskey="h"><b>Platform</b></label>:
       </td>
       <td>
-        [% get_resolution(bug.resolution) FILTER html %]
-        [% IF bug.resolution == "DUPLICATE" %]
-          of [% terms.bug %] [%+ "${bug.dup_id}" FILTER bug_link(bug.dup_id) FILTER none %]
-        [% END %]
+       [% PROCESS select selname => "rep_platform" no_td=> 1 %]
+       [%+ PROCESS select selname => "op_sys" no_td=> 1 %]
       </td>
     </tr>
-  </table>
+
+
+
 [% END %]
 
 [%############################################################################%]
@@ -638,56 +407,68 @@
 [%############################################################################%]
 
 [% BLOCK section_details2 %]
-  <table cellspacing="1" cellpadding="1">
-    <tr>
-      <td align="right">
-        <label for="rep_platform" accesskey="h"><b><u>H</u>ardware</b></label>:
-      </td>
-      [% PROCESS select selname => "rep_platform" %]
-    </tr>
 
+[%############%]
+[%#  STATUS  #%]
+[%############%]
     <tr>
-      <td align="right">
-        <label for="op_sys" accesskey="o"><b><u>O</u>S</b></label>:
+      <td class="field_label">
+        <b><a href="page.cgi?id=fields.html#status">Status</a></b>:
       </td>
-      [% PROCESS select selname => "op_sys" %]
-    </tr>
+      <td id="bz_field_status">
 
-    <tr>
-      <td align="right">
-        <label for="version"><b>Version</b></label>:
+        [% get_status(bug.bug_status) FILTER html %]&nbsp;&nbsp;
+        [% get_resolution(bug.resolution) FILTER html %]
+     
+        [% IF bug.resolution == "DUPLICATE" %]
+          of [% terms.bug %] [%+ "${bug.dup_id}" FILTER bug_link(bug.dup_id) FILTER none %]
+        [% END %]
+      
       </td>
-      [% PROCESS select selname => "version" %]
     </tr>
-
+ [%###############################################################%]
+ [%# Importance (priority, severity and votes) #%]
+ [%###############################################################%]
     <tr>
-      <td align="right">
-        <label for="priority" accesskey="i"><b><a href="page.cgi?id=fields.html#priority">Pr<u>i</u>ority</a></b></label>:
+      <td class="field_label">
+        <label for="priority" accesskey="i"><b><u>I</u>mportance</b></label>:
       </td>
-      [% PROCESS select selname => "priority" %]
-    </tr>
-
-    <tr>
-      <td align="right">
-        <label for="bug_severity"><b><a href="page.cgi?id=fields.html#bug_severity">Severity</a></b></label>:
+      <td>
+        <table>
+          <tr>
+            [% PROCESS select selname => "priority" %] 
+            [% PROCESS select selname = "bug_severity" %]
+            [% IF bug.use_votes %]
+            <td>
+              [% IF bug.votes %] 
+                with 
+                <a href="votes.cgi?action=show_bug&amp;bug_id=[% bug.bug_id %]">
+                  [% bug.votes %] vote[%IF bug.votes > 1 %]s[% END %]
+                </a>. 
+              [% END %]    
+            (<a href="votes.cgi?action=show_user&amp;bug_id=
+                      [% bug.bug_id %]#vote_[% bug.bug_id %]">vote</a>)
+            </td>
+            [% END %]
+          </tr>
+        </table>
       </td>
-      [% PROCESS select selname = "bug_severity" %]
     </tr>
 
     [% IF Param("usetargetmilestone") && bug.target_milestone %]
       <tr>
-        <td align="right">
+        <td class="field_label">
           <label for="target_milestone"><b>
             [% IF bug.milestoneurl %]
               <a href="[% bug.milestoneurl FILTER html %]">
             [% END %]
-            Target Milestone[% "</a>" IF bug.milestoneurl %]
+            Target&nbsp;Milestone[% "</a>" IF bug.milestoneurl %]
           [%%]</b></label>:
         </td>
         [% PROCESS select selname = "target_milestone" %]
       </tr>
     [% END %]
-  </table>
+  
 [% END %]
 
 [%############################################################################%]
@@ -695,31 +476,37 @@
 [%############################################################################%]
 
 [% BLOCK section_people %]
-  <table cellpadding="3" cellspacing="1">
-    <tr>
-      <td align="right">
-        <b>Reporter</b>:
-      </td>
-      <td>
-        [% INCLUDE user_identity user => bug.reporter %]
-      </td>
-    </tr>
 
     <tr>
-      <td align="right" valign="top">
-        <b><a href="page.cgi?id=fields.html#assigned_to">Assignee</a></b>:
+      <td class="field_label">
+        <b><a href="page.cgi?id=fields.html#assigned_to">Assigned To</a></b>:
       </td>
       <td>
         [% IF bug.check_can_change_field("assigned_to", 0, 1) %]
-          [% INCLUDE global/userselect.html.tmpl
-               id => "assigned_to"
-               name => "assigned_to"
-               value => bug.assigned_to.login
-               size => 30
-          %]
-          <br>
-          <input type="checkbox" id="set_default_assignee" name="set_default_assignee" value="1">
-          <label for="set_default_assignee">Reset Assignee to default</label>
+          <div id="bz_assignee_edit_container" class="bz_default_hidden">
+            <span>
+              [% INCLUDE user_identity user=> bug.assigned_to %]
+              (<a href="#" id="bz_assignee_edit_action">edit</a>)
+            </span>
+          </div>
+          <div id="bz_assignee_input">
+            [% INCLUDE global/userselect.html.tmpl
+                 id => "assigned_to"
+                 name => "assigned_to"
+                 value => bug.assigned_to.login
+                 size => 30
+            %]
+            <br>
+            <input type="checkbox" id="set_default_assignee" name="set_default_assignee" value="1">
+            <label for="set_default_assignee">Reset Assignee to default</label>
+          </div>
+          <script type="text/javascript">
+           hideEditableField('bz_assignee_edit_container', 
+                             'bz_assignee_input', 
+                             'bz_assignee_edit_action', 
+                             'assigned_to', 
+                             '[% bug.assigned_to.login FILTER js %]' );
+          </script>
         [% ELSE %]
           <input type="hidden" name="assigned_to" id="assigned_to"
                  value="[% bug.assigned_to.login FILTER html %]">
@@ -730,21 +517,42 @@
 
     [% IF Param('useqacontact') %]
     <tr>
-      <td align="right" valign="top">
+      <td class="field_label">
         <label for="qa_contact" accesskey="q"><b><u>Q</u>A Contact</b></label>:
       </td>
       <td>
+
         [% IF bug.check_can_change_field("qa_contact", 0, 1) %]
-          [% INCLUDE global/userselect.html.tmpl
-              id => "qa_contact"
-              name => "qa_contact"
-              value => bug.qa_contact.login
-              size => 30
-              emptyok => 1
-          %]
-          <br>
-          <input type="checkbox" id="set_default_qa_contact" name="set_default_qa_contact" value="1">
-          <label for="set_default_qa_contact">Reset QA Contact to default</label>
+          [% IF bug.qa_contact != "" %]
+           <div id="bz_qa_contact_edit_container" class="bz_default_hidden">
+            <span>
+              <span id="bz_qa_contact_edit_display">
+              [% INCLUDE user_identity user=> bug.qa_contact %]</span>
+              (<a href="#" id="bz_qa_contact_edit_action">edit</a>)
+            </span>
+          </div>
+          [% END %]
+          <div id="bz_qa_contact_input">
+            [% INCLUDE global/userselect.html.tmpl
+                id => "qa_contact"
+                name => "qa_contact"
+                value => bug.qa_contact.login
+                size => 30
+                emptyok => 1
+            %]
+            <br>
+            <input type="checkbox" id="set_default_qa_contact" name="set_default_qa_contact" value="1">
+            <label for="set_default_qa_contact">Reset QA Contact to default</label>
+          </div>
+          [% IF bug.qa_contact != "" %]
+            <script type="text/javascript">
+             hideEditableField('bz_qa_contact_edit_container', 
+                               'bz_qa_contact_input', 
+                               'bz_qa_contact_edit_action', 
+                               'qa_contact', 
+                               '[% bug.qa_contact.login FILTER js %]');
+            </script>
+          [% END %]
         [% ELSE %]
           <input type="hidden" name="qa_contact" id="qa_contact"
                  value="[% bug.qa_contact.login FILTER html %]">
@@ -753,30 +561,266 @@
       </td>
     </tr>
     [% END %]
+     
+[% END %]
 
-    [% IF user.id %]
-      <tr>
-        <td align="right" valign="top">
-          <label for="newcc" accesskey="a"><b><u>A</u>dd&nbsp;CC</b></label>:
-        </td>
-        <td>
-           [% INCLUDE global/userselect.html.tmpl
-              id => "newcc"
-              name => "newcc"
-              value => ""
-              size => 30
-              multiple => 5
-            %]
-        </td>
-      </tr>
+[% BLOCK section_url_keyword_whiteboard %]
+[%# *** URL Whiteboard Keywords *** %]
+  <tr>
+    <td class="field_label">
+      <label for="bug_file_loc" accesskey="u"><b>
+        [% IF bug.bug_file_loc 
+           AND NOT bug.bug_file_loc.match("^(javascript|data)") %]
+          <a href="[% bug.bug_file_loc FILTER html %]"><u>U</u>RL</a>
+        [% ELSE %]
+          <u>U</u>RL
+        [% END %]
+      [%%]</b></label>:
+    </td>
+    <td>
+      [% IF bug.check_can_change_field("bug_file_loc", 0, 1) %]
+        <span id="bz_url_edit_container" class="bz_default_hidden"> 
+        [% IF bug.bug_file_loc 
+           AND NOT bug.bug_file_loc.match("^(javascript|data)") %]
+           <a href="[% bug.bug_file_loc FILTER html %]" target="_blank">
+             [% bug.bug_file_loc FILTER html%]</a>
+        [% ELSE %]
+          [% bug.bug_file_loc FILTER html %]
+        [% END %]
+        (<a href="#" id="bz_url_edit_action">edit</a>)</span>
+      [% END %]
+      <span id="bz_url_input_area">
+        [% url_output =  PROCESS input no_td=1 inputname => "bug_file_loc" size => "40" colspan => 2 %]
+        [% IF NOT bug.check_can_change_field("bug_file_loc", 0, 1)  %]
+          <a href="[% bug.bug_file_loc FILTER html %]">[% url_output FILTER none %]</a>
+        [% ELSE %]
+          [% url_output FILTER none %]
+        [% END %]
+      </span>
+      [% IF bug.check_can_change_field("bug_file_loc", 0, 1) %]
+        <script type="text/javascript">
+          hideEditableField('bz_url_edit_container', 
+                            'bz_url_input_area', 
+                            'bz_url_edit_action', 
+                            'bug_file_loc', 
+                            "[% bug.bug_file_loc FILTER js %]");
+        </script>
+      [% END %]
+    </td>
+  </tr>
+  
+  [% IF Param('usestatuswhiteboard') %]
+    <tr>
+      <td class="field_label">
+        <label for="status_whiteboard" accesskey="w"><b><u>W</u>hiteboard</b></label>:
+      </td>
+      [% PROCESS input inputname => "status_whiteboard" size => "40" colspan => 2 %]
+    </tr>
+  [% END %]
+  
+  [% IF use_keywords %]
+    <tr>
+      <td class="field_label">
+        <label for="keywords" accesskey="k">
+          <b><a href="describekeywords.cgi"><u>K</u>eywords</a></b></label>:
+      </td>
+      [% PROCESS input inputname => "keywords" size => 40 colspan => 2
+                       value => bug.keywords.join(', ')
+                       onfocus => "this.chooser.open()" %]
+    </tr>
+  [% END %]
+[% END %]
+
+[% BLOCK section_dependson_blocks %]
+  <tr>
+    [% PROCESS dependencies
+               dep = { title => "Depends&nbsp;on", fieldname => "dependson" } %]
+  </tr>
+  
+  <tr>
+    [% PROCESS dependencies accesskey = "b"
+               dep = { title => "<u>B</u>locks", fieldname => "blocked" } %]
+  
+  <tr>
+    <th>&nbsp;</th>
+  
+    <td colspan="2" align="left" id="show_dependency_tree_or_graph">
+      Show dependency <a href="showdependencytree.cgi?id=[% bug.bug_id %]&amp;hide_resolved=1">tree</a>
+  
+      [% IF Param('webdotbase') %]
+        /&nbsp;<a href="showdependencygraph.cgi?id=[% bug.bug_id %]">graph</a>
+      [% END %]
+    </td>
+  </tr>
+[% END %]
+
+
+[%############################################################################%]
+[%# Block for Restricting Visibility                                         #%]
+[%############################################################################%]
+
+[% BLOCK section_restrict_visibility %]
+  [% IF bug.groups.size > 0 %]
+  <table>
+    <tr>
+      <td class="field_label">
+        <label id="bz_restrict_group_visibility_label"><b> Restrict Group Visibility</b>:</label>
+      </td>
+      <td>
+        [% inallgroups = 1 %]
+        [% inagroup = 0 %]
+        [% FOREACH group = bug.groups %]
+          [% SET inallgroups = 0 IF NOT group.ingroup %]
+          [% SET inagroup = 1 IF group.ison %]
+    
+          [% IF NOT group.mandatory %]
+            [% IF NOT emitted_description %]
+              [% emitted_description = 1 %]
+              <div id="bz_restrict_group_visibility_help">
+                <b>Only users in all of the selected groups can view this [% terms.bug %]:</b>
+                <br>
+                <font size="-1">
+                  (Unchecking all boxes makes this a more public [% terms.bug %].)
+                </font>
+              </div>
+            [% END %]
+    
+          [% IF group.ingroup %]
+            <input type="hidden" name="defined_bit-[% group.bit %]" value="1">
+          [% END %]
+          <input type="checkbox" value="1"
+                 name="bit-[% group.bit %]" id="bit-[% group.bit %]"
+                 [% " checked=\"checked\"" IF group.ison %]
+                 [% " disabled=\"disabled\"" IF NOT group.ingroup %]>
+          <label for="bit-[% group.bit %]">[% group.description FILTER html_light %]</label>
+          <br>
+          [% END %]
+        [% END %]
+    
+        [% IF NOT inallgroups %]
+          <b>
+            Only members of a group can change the visibility of [% terms.abug %] for
+            that group.
+          </b>
+        <br>
+        [% END %]
+      </td>
+    </tr>
+    [% IF inagroup %]
+    <tr>
+      <td class="field_label">
+        <label id="bz_enable_role_visibility_label"><b>Enable Role Visibility</b>:</label>
+      </td>
+      <td>
+        <div id="bz_enable_role_visibility_help">
+          <b>Users in the roles selected below can always view this [% terms.bug %]:</b>
+          <br>
+          <small>
+            (The assignee
+            [% IF (Param('useqacontact')) %]
+               and QA contact
+            [% END %]
+            can always see [% terms.abug %], and this section does not take effect unless
+            the [% terms.bug %] is restricted to at least one group.)
+          </small>
+        </div>
+        <div>
+          <div>
+            <input type="hidden" name="defined_reporter_accessible" value="1">
+            <input type="checkbox" value="1"
+                   name="reporter_accessible" id="reporter_accessible"
+                   [% " checked" IF bug.reporter_accessible %]
+                   [% " disabled=\"disabled\"" UNLESS bug.check_can_change_field("reporter_accessible", 0, 1) %]>
+            <label for="reporter_accessible">Reporter</label>
+          </div>
+          <div>
+            <input type="hidden" name="defined_cclist_accessible" value="1">
+            <input type="checkbox" value="1"
+                   name="cclist_accessible" id="cclist_accessible"
+                   [% " checked" IF bug.cclist_accessible %]
+                   [% " disabled=\"disabled\"" UNLESS bug.check_can_change_field("cclist_accessible", 0, 1) %]>
+            <label for="cclist_accessible">CC List</label>
+          </div>
+        </div>
+      </td>
+    </tr>
     [% END %]
+  </table>  
+  [% END %]
+[% END %]
+
+[%############################################################################%]
+[%# Block for Dates                                                          #%]
+[%############################################################################%]
 
+[% BLOCK section_dates %]
+  <tr>
+    <td class="field_label">
+      <b>Reported</b>:
+    </td>
+    <td>
+     [% bug.creation_ts FILTER time %] by [% INCLUDE user_identity user => bug.reporter %]
+    </td>
+  </tr>
+  
+  <tr>
+    <td class="field_label">
+      <b> Modified</b>:
+    </td>
+    <td>
+      [% bug.delta_ts FILTER time FILTER replace(':\d\d$', '') FILTER replace(':\d\d ', ' ')%] 
+      (<a href="show_activity.cgi?id=[% bug.bug_id %]">[%# terms.Bug %]History</a>)
+    </td>
+  
+  </tr>
+[% END %]
+
+[%############################################################################%]
+[%# Block for CC LIST                                                        #%]
+[%############################################################################%]
+[% BLOCK section_cclist %]
+  [% IF user.id %]
     <tr>
-      [% IF bug.cc %]
-        <td align="right" valign="top">
-          <label for="cc"><b>CC</b></label>:
+        <td class="field_label">
+          <label for="newcc" accesskey="a"><b>CC List</b>:</label>
         </td>
-        <td valign="top">
+      <td>
+        [% IF user.id %]
+          <input type="checkbox" id="addselfcc_first" name="addselfcc"
+              [% ' checked="checked" '
+                   IF user.settings.state_addselfcc.value == 'always'
+                      || (!has_role
+                          && user.settings.state_addselfcc.value == 'cc_unless_role')
+                      || bug.cc.contains( user.email ) %]>
+          <label for="addselfcc_first">
+            Myself ([% INCLUDE user_identity user=> user FILTER collapse %])
+          </label><br> 
+        [% END %]
+        [% bug.cc.size || 0  FILTER html%]&nbsp;total users
+        [% IF user.id %]
+          [% IF bug.cc.contains( user.email ) %]
+            including you ([% INCLUDE user_identity user=> user FILTER collapse %])
+          [% END %]
+        [% END %].
+        <span id="cc_edit_area_showhide_container" class="bz_default_hidden">
+          (<a href="#" id="cc_edit_area_showhide">edit</a>)
+        </span>
+        <div id="cc_edit_area">
+          <div>
+            <div>
+              <label for="cc">
+                <b>Add</b>
+              </label>
+            </div>
+            [% INCLUDE global/userselect.html.tmpl
+                id => "newcc"
+                name => "newcc"
+                value => ""
+                size => 30
+                multiple => 5
+              %]
+          </div>
+        [% IF bug.cc %]
           <select id="cc" name="cc" multiple="multiple" size="5">
           [% FOREACH c = bug.cc %]
             <option value="[% c FILTER html %]">[% c FILTER html %]</option>
@@ -788,47 +832,234 @@
             [%%]<label for="removecc">Remove selected CCs</label>
             <br>
           [% END %]
-        </td>
-      [% ELSE %]
-        <td colspan="2"><input type="hidden" name="cc" value=""></td>
+        [% ELSE %]
+          <input type="hidden" name="cc" value="">
+        [% END %]
+        </div>
+        <script type="text/javascript">
+          hideEditableField( 'cc_edit_area_showhide_container', 
+                             'cc_edit_area', 
+                             'cc_edit_area_showhide', 
+                             '', 
+                             '');  
+        </script>
+      </td>
+    </tr>
+  [% END %]
+[% END %]
+
+[%############################################################################%]
+[%# Block for FLAGS                                                          #%]
+[%############################################################################%]
+
+[% BLOCK section_flags %]
+  [%# *** Flags *** %]
+  [% show_bug_flags = 0 %]
+  [% FOREACH type = bug.flag_types %]
+    [% IF (type.flags && type.flags.size > 0) || (user.id && type.is_active) %]
+      [% show_bug_flags = 1 %]
+      [% LAST %]
+    [% END %]
+  [% END %]
+  [% IF show_bug_flags %]
+    <tr>
+      <td class="field_label">
+        <label><b>Flags:</b></label>
+      </td>
+      <td></td>
+    </tr>
+    <tr>
+      <td colspan="2">
+    [% show_bug_flags = 0 %]
+    [% FOREACH type = bug.flag_types %]
+      [% IF (type.flags && type.flags.size > 0) || (user.id && type.is_active) %]
+        [% show_bug_flags = 1 %]
+        [% LAST %]
       [% END %]
+    [% END %]
+    [% IF show_bug_flags %]
+    
+      [% IF user.id %]
+        [% IF bug.flag_types.size > 0 %]
+          [% PROCESS "flag/list.html.tmpl" flag_no_header = 1
+                                           flag_types = bug.flag_types
+                                           any_flags_requesteeble = bug.any_flags_requesteeble %]
+        [% END %]
+      [% ELSE %]
+        [% FOREACH type = bug.flag_types %]
+          [% FOREACH flag = type.flags %]
+              [% flag.setter.nick FILTER html %]:
+              [%+ type.name FILTER html FILTER no_break %][% flag.status %]
+              [%+ IF flag.requestee %]
+                ([% flag.requestee.nick FILTER html %])
+              [% END %]<br>
+          [% END %]
+        [% END %]
+      [% END %]         
+    [% END %]
+      </td>
     </tr>
-  </table>
+  [% END %]
 [% END %]
 
 [%############################################################################%]
+[%# Block for Section Spacer                                                 #%]
+[%############################################################################%]
+
+[% BLOCK section_customfields %]
+[%# *** Custom Fields *** %]
+
+  [% USE Bugzilla %]
+  [% fields = Bugzilla.get_fields({ obsolete => 0, custom => 1 }) %]
+  [% IF fields %]
+    [% FOREACH field = fields %]
+      <tr>
+        [% PROCESS bug/field.html.tmpl value=bug.${field.name}
+                                       editable = bug.check_can_change_field(field.name, 0, 1)
+                                       value_span = 2 %]
+      </tr>
+    [% END %]
+  [% END %]
+[% END %]
+
+[%############################################################################%]
+[%# Block for Section Spacer                                                 #%]
+[%############################################################################%]
+
+[% BLOCK section_spacer %]
+  <tr>
+    <td colspan="2" class="bz_section_spacer"></td>
+  </tr>
+[% END %]
+
+
+
+
+[%############################################################################%]
 [%# Block for dependencies                                                   #%]
 [%############################################################################%]
 
 [% BLOCK dependencies %]
-  <th align="right">
+
+  <th class="field_label">
     <label for="[% dep.fieldname %]"[% " accesskey=\"$accesskey\"" IF accesskey %]>
     [% dep.title %]</label>:
   </th>
-  <td>
-  [% FOREACH depbug = bug.${dep.fieldname} %]
-    [% depbug FILTER bug_link(depbug) FILTER none %][% " " %]
-  [% END %]
-  </td>
-  <td>
+  <td>    
+    <span id="[% dep.fieldname %]_input_area">
+      [% IF bug.check_can_change_field(dep.fieldname, 0, 1) %]
+        <input name="[% dep.fieldname %]" id="[% dep.fieldname %]"
+               value="[% bug.${dep.fieldname}.join(', ') %]">
+      [% ELSE %]
+        <input type="hidden" id="[% dep.fieldname %]" name="[% dep.fieldname %]"
+               value="[% bug.${dep.fieldname}.join(', ') %]">
+      [% END %]
+    </span>
+    
+    [% FOREACH depbug = bug.${dep.fieldname} %]
+      [% depbug FILTER bug_link(depbug) FILTER none %][% " " %]
+    [% END %]
     [% IF bug.check_can_change_field(dep.fieldname, 0, 1) %]
-      <input name="[% dep.fieldname %]" id="[% dep.fieldname %]"
-             value="[% bug.${dep.fieldname}.join(', ') %]">
-    [% ELSE %]
-      <input type="hidden" id="[% dep.fieldname %]" name="[% dep.fieldname %]"
-             value="[% bug.${dep.fieldname}.join(', ') %]">
+      <span id="[% dep.fieldname %]_edit_container" class="edit_me bz_default_hidden" >
+        (<a href="#" id="[% dep.fieldname %]_edit_action">edit</a>)
+      </span>
+      <script type="text/javascript">
+        hideEditableField('[% dep.fieldname %]_edit_container', 
+                          '[% dep.fieldname %]_input_area', 
+                          '[% dep.fieldname %]_edit_action', 
+                          '[% dep.fieldname %]', 
+                          "[% bug.${dep.fieldname}.join(', ') %]");
+      </script>
     [% END %]
   </td>
+  
   [% accesskey = undef %]
+  
 [% END %]
 
+[%############################################################################%]
+[%# Block for Time Tracking Group                                            #%]
+[%############################################################################%]
+
+[% BLOCK section_timetracking %]
+  <table class="bz_time_tracking_table">
+    <tr>
+      <th>
+        <label for="estimated_time">Orig. Est.</label>
+      </th>
+      <th>
+        Current Est.
+      </th>
+      <th>
+        <label for="work_time">Hours Worked</label>
+      </th>
+      <th>
+        <label for="remaining_time">Hours Left</label>
+      </th>
+      <th>
+        %Complete
+      </th>
+      <th>
+        Gain
+      </th>
+      <th>
+        <label for="deadline">Deadline</label>
+      </th>
+    </tr>
+    <tr>
+      <td>
+        <input name="estimated_time" id="estimated_time"
+               value="[% PROCESS formattimeunit
+                                 time_unit=bug.estimated_time %]"
+               size="6" maxlength="6">
+      </td>
+      <td>
+        [% PROCESS formattimeunit
+                   time_unit=(bug.actual_time + bug.remaining_time) %]
+      </td>
+      <td>
+        [% PROCESS formattimeunit time_unit=bug.actual_time %] +
+        <input name="work_time" id="work_time"
+               value="0" size="3" maxlength="6"
+               onchange="adjustRemainingTime();">
+      </td>
+      <td>
+        <input name="remaining_time" id="remaining_time"
+               value="[% PROCESS formattimeunit
+                                 time_unit=bug.remaining_time %]"
+               size="6" maxlength="6" onchange="updateRemainingTime();">
+      </td>
+      <td>
+        [% PROCESS calculatepercentage act=bug.actual_time
+                                       rem=bug.remaining_time %]
+      </td>
+      <td>
+        [% PROCESS formattimeunit time_unit=bug.estimated_time - (bug.actual_time + bug.remaining_time) %]
+      </td>
+       <td>
+         <input name="deadline" id="deadline" value="[% bug.deadline %]"
+                size="10" maxlength="10"><br />
+         <small>(YYYY-MM-DD)</small>
+      </td>        
+    </tr>
+    <tr>
+      <td colspan="7" class="bz_summarize_time">
+        <a href="summarize_time.cgi?id=[% bug.bug_id %]&amp;do_depends=1">
+        Summarize time (including time for [% terms.bugs %]
+        blocking this [% terms.bug %])</a>
+      </td>
+    </tr>
+  </table> 
+[% END %]
 
 [%############################################################################%]
 [%# Block for SELECT fields                                                  #%]
 [%############################################################################%]
 
 [% BLOCK select %]
+  [% IF NOT no_td %]
   <td>
+  [% END %]
     [% IF bug.check_can_change_field(selname, 0, 1) AND bug.choices.${selname}.size > 1 %]
       <select id="[% selname %]" name="[% selname %]">
         [% FOREACH x = bug.choices.${selname} %]
@@ -841,7 +1072,10 @@
       <input type="hidden" id="[% selname %]" name="[% selname %]" value="[% bug.${selname} FILTER html %]">
       [% bug.${selname} FILTER html %]
     [% END %]
+  [% IF NOT no_td %]
   </td>
+  [% END %]
+  [% no_td = 0 %]
 [% END %]
 
 [%############################################################################%]
@@ -849,7 +1083,9 @@
 [%############################################################################%]
 
 [% BLOCK input %]
+  [% IF no_td != 1 %]
   <td[% " colspan=\"$colspan\"" IF colspan %]>
+  [% END %]
     [% val = value ? value : bug.$inputname %]
     [% IF bug.check_can_change_field(inputname, 0, 1) %]
        <input id="[% inputname %]" name="[% inputname %]"
@@ -868,7 +1104,10 @@
         [% val FILTER html %]
       [% END %]
     [% END %]
+  [% IF no_td != 1 %]  
   </td>
+  [% END %]
+  [% no_td = 0 %]
   [% maxlength = 0 %]
   [% colspan = 0 %]
   [% size = 0 %]
@@ -883,15 +1122,16 @@
 
 [% BLOCK user_identity %]
   <span class="vcard">
-    [% IF user.name %]
-      <a class="email" href="mailto:[% user.email FILTER html %]">
-        <span class="fn">[% user.name FILTER html %]</span>
-        &lt;[% user.email FILTER html %]&gt;
-      </a>
-    [% ELSE %]
-      <a class="fn email" href="mailto:[% user.email FILTER html %]">
-        [% user.email FILTER html %]
-      </a>
-    [% END %]
-  </span>
+    [% FILTER collapse %]
+      [% IF user.name %]
+        <a class="email" href="mailto:[% user.email FILTER html %]" 
+           title="[% user.email FILTER html %]"
+          ><span class="fn">[% user.name FILTER html %]</span
+        ></a>
+      [% ELSE %]
+        <a class="fn email" href="mailto:[% user.email FILTER html %]">
+          [% user.email FILTER html %]</a>
+      [% END %]
+    [% END %]</span>
 [% END %]
+
diff --git a/template/en/default/bug/navigate.html.tmpl b/template/en/default/bug/navigate.html.tmpl
index b55c4a73d..7b8f3c827 100644
--- a/template/en/default/bug/navigate.html.tmpl
+++ b/template/en/default/bug/navigate.html.tmpl
@@ -19,6 +19,21 @@
   #%]
 
 [% PROCESS global/variables.none.tmpl %]
+[% IF bottom_navigator == 1 %]
+  <ul class="related_actions">
+    <li><a href="show_bug.cgi?format=multiple&amp;id=
+                [% bug.bug_id FILTER url_quote %]">Format For Printing</a></li>
+    <li>&nbsp;-&nbsp;<a href="show_bug.cgi?ctype=xml&amp;id=
+                        [% bug.bug_id  FILTER url_quote %]">XML</a></li>
+    <li>&nbsp;-&nbsp;<a href="enter_bug.cgi?cloned_bug_id=
+                        [% bug.bug_id  FILTER url_quote %]">Clone This 
+                        [% terms.Bug %]</a></li>
+    [%# Links to more things users can do with this bug. %]
+    [% Hook.process("links") %]
+    <li>&nbsp;-&nbsp;<a href="#">Top of page </a></li>
+    </ul>
+[% END %]        
+
 
 <div class="navigation">
 [% IF bug_list && bug_list.size > 0 %]
diff --git a/template/en/default/bug/process/header.html.tmpl b/template/en/default/bug/process/header.html.tmpl
index b7c6b74f5..f31a9f8e4 100644
--- a/template/en/default/bug/process/header.html.tmpl
+++ b/template/en/default/bug/process/header.html.tmpl
@@ -44,5 +44,5 @@
 [% PROCESS global/header.html.tmpl
   javascript_urls = [ "js/util.js", "js/keyword-chooser.js", "js/field.js",
                       "js/yui/yahoo-dom-event.js", "js/yui/calendar.js" ]
-    style_urls = [ "skins/standard/yui/calendar.css" ]
+    style_urls = [ "skins/standard/yui/calendar.css", "skins/standard/show_bug.css" ]
  %]
diff --git a/template/en/default/bug/show.html.tmpl b/template/en/default/bug/show.html.tmpl
index 5dc7fe252..a6f9e8b97 100644
--- a/template/en/default/bug/show.html.tmpl
+++ b/template/en/default/bug/show.html.tmpl
@@ -41,7 +41,7 @@
                   ]
     javascript_urls = [ "js/util.js", "js/keyword-chooser.js", "js/field.js",
                         "js/yui/yahoo-dom-event.js", "js/yui/calendar.js" ]
-     style_urls = [ "skins/standard/yui/calendar.css" ]
+     style_urls = [ "skins/standard/yui/calendar.css", "skins/standard/show_bug.css" ]
 doc_section = "bug_page.html"
   %]
 [% END %]
@@ -57,13 +57,11 @@ doc_section = "bug_page.html"
 
 [% PROCESS bug/navigate.html.tmpl %]
 
-<hr>
-
 [% PROCESS bug/edit.html.tmpl %]
 
 <hr>
 
-[% PROCESS bug/navigate.html.tmpl %]
+[% PROCESS bug/navigate.html.tmpl bottom_navigator => 1%]
 
 <br>