Changeset 5912

Timestamp:

Dec 15, 2011, 9:51:01 AM (11 years ago)

Author:

Nicklas Nordborg

Message:

References #1655: GUI improvements

• Table exporter

Location:

trunk/www

Files:

• common/plugin/download_immediately.jsp (modified) (3 diffs)
• plugins/net/sf/basedb/clients/web/plugins/simple_export.jsp (modified) (9 diffs)

trunk/www/common/plugin/download_immediately.jsp

@@ -88 +88 @@
       var remainElement = document.getElementById('percentRemain');
       remainElement.style.width = (100-percentDone)+'%';
-      if (percentDone == 100) Main.hide('percentRemain');
+      if (percentDone == 100) 
+      {
+        Main.hide('percentRemain');
+        Main.hide('cancel');
+        Main.show('close');
+      }
     }
     function init()
@@ -112 +117 @@
         Do not close this window until the download has finished. 
         </div>
-        <br>
+        
+        <table id="download" style="margin: auto; margin-top: 2em;"><tr><td>
+        <base:button onclick="downloadExport();" title="Download" image="download.gif" />
+        </td></tr></table>
+        
         <!-- The progress bar -->
-        <div id="progress" style="align:center;">
+        <div id="progress" style="align:center; margin-top: 2em;">
           <table class="progressbar" style="margin: auto;">
           <tr>
@@ -135 +144 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button id="download" onclick="downloadExport();" title="Download" image="download.gif" />
-      <base:button onclick="doCancel();" title="Cancel" />
+      <base:button id="cancel" onclick="doCancel();" title="Cancel" />
+      <base:button id="close" onclick="window.close()" title="Close" style="display: none; "/>
     </base:buttongroup>
     

trunk/www/plugins/net/sf/basedb/clients/web/plugins/simple_export.jsp

@@ -276 +276 @@
   </base:head>
   <base:body onload="init()">
+    <h1>Export options <base:help helpid="simpleexport.options" /></h1>
     <form name="export" action="index.jsp" method="post" onsubmit="return false;">
     <input type="hidden" name="ID" value="<%=ID%>">
@@ -283 +284 @@
     <input type="hidden" name="subcontext" value="<%=subContext == null ? "" : subContext%>">
     
-    <h3 class="docked">Export options <base:help helpid="simpleexport.options" /></h3>
-    <div class="boxed">
+    <div class="content">
     
     <%
@@ -321 +321 @@
     }
     %>
-      <table class="form" width="100%">
-      <tr >
-        <td class="prompt">Format</td>
+      <table class="fullform input100 bottomborder">
+      <tr>
+        <th style="height: 4em;">Format</th>
         <td>
           <input type="radio" name="parameter:format" id="formatText" value="text" checked
@@ -331 +331 @@
         </td>
       </tr>
-      <tr >
-        <td class="prompt">Which items?</td>
+      <tr>
+        <th style="height: 5em;">Which items?</th>
         <td>
           <input type="radio" name="parameter:whichItems" id="whichSelected" value="selected"
@@ -342 +342 @@
         </td>
       </tr>
-      <tr >
-        <td class="prompt">
+      <tr class="big">
+        <th>
           Which columns?<br>
           <select name="presets" onChange="updateColumns()">
@@ -370 +370 @@
             %>
           </select>
-          <br>
-          <table align="right">
+        </th>
+        <td>
+          <table width="100%">
           <tr>
-          <td>
-            <base:button
-              onclick="moveSelected(document.forms['export'].exported, false)" 
-              title="<img src='../../images/move_up.png' alt='' style='vertical-align: middle;'>" 
-              tooltip="Move up" 
-            /><p>
-            <base:button 
-              onclick="moveSelected(document.forms['export'].exported, true)" 
-              title="<img src='../../images/move_down.png' alt='' style='vertical-align: middle;'>" 
-              tooltip="Move down" 
-            />
-          </td>
-          </tr>
-          </table>
-        </td>
-        <td>
-          <table border=0 cellspacing=0 cellpadding=2 width="100%">
-          <tr>
+            <td>
+            <base:buttongroup vertical="true">
+              <base:button
+                onclick="moveSelected(document.forms['export'].exported, false)" 
+                image="move_up.png" 
+                tooltip="Move up" 
+              />
+              <base:button 
+                onclick="moveSelected(document.forms['export'].exported, true)" 
+                image="move_down.png" 
+                tooltip="Move down" 
+              />
+            </base:buttongroup>
+            </td>
             <td width="50%">
               <b>Exported columns</b><br>
@@ -397 +394 @@
               </select>
             </td>
-        
-            <td>
-              <br>
+            <td style="padding-left: 2px;">
+            <base:buttongroup vertical="true">
               <base:button
                 onclick="moveBetween(document.forms['export'].not_exported, document.forms['export'].exported)" 
-                title="<img src='../../images/move_left.png' alt='' style='vertical-align: middle;'>" 
+                image="move_left.png" 
                 tooltip="Make the selected hidden column(s) visible" 
-              /><p>
+              />
               <base:button 
                 onclick="moveBetween(document.forms['export'].exported, document.forms['export'].not_exported)" 
-                title="<img src='../../images/move_right.png' alt='' style='vertical-align: middle;'>" 
+                image="move_right.png" 
                 tooltip="Make the selected visible column(s) hidden" 
               />
-              <br>
+            </base:buttongroup>
             </td>
             <td width="50%">
@@ -422 +418 @@
         </td>
       </tr>
-      <tr >
-        <td class="prompt">Units</td>
+      <tr>
+        <th>Units</th>
         <td><input type="checkbox" name="sameUnits" id="sameUnits"
           value="true" checked><label for="sameUnits"
           >Use same unit for all annotations in a column</label></td>
       </tr>
-      <tr >
-        <td class="prompt">Column prefix</td>
+      <tr>
+        <th>Column prefix</th>
         <td>
           <input type="text" name="parameter:columnPrefix" 
             class="text" size="50" maxlength="255" value=""></td>
       </tr>
-      <tr >
-        <td class="prompt">Save as</td>
-        <td>
-          <table cellpadding="0" border="0" cellspacing="0">
+      <tr>
+        <th>Save as</th>
+        <td>
+          <table style="width:98%;">
           <tr>
-          <td><input type="text" class="text" name="path" size="50" value=""><br>
-          Leave empty to download immediately</td>
+          <td style="width: 98%;"><input type="text" class="text" name="path" value="" placeholder="Leave empty to download immediately"></td>
           <td><base:button 
               title="Browse..."
               onclick="browseOnClick()"
-              style="margin-left: 6px;"
+              
               />
           </td>
           </tr>
           </table>
+        </td>
+      </tr>
+      <tr>
+        <th class="subprompt"></th>
+        <td>
           <input type="checkbox" name="parameter:overwrite" id="overwrite" value="true">
-            <label for="overwrite">Overwrite existing file</label><br>
+            <label for="overwrite">Overwrite existing file</label>
         </td>
+      </tr>
+        
+      <tr class="dynamic">
+        <th></th>
+        <td></td>
       </tr>
       </table>
@@ -457 +462 @@
     </form>
   
-    <table align="center">
-    <tr>
-      <td width="50%"><base:button onclick="doExport();" title="Ok" /></td>
-      <td width="50%"><base:button onclick="doCancel();" title="Cancel" /></td>
-    </tr>
-    </table>
+    <base:buttongroup subclass="dialogbuttons">
+      <base:button onclick="doExport();" title="Ok" />
+      <base:button onclick="doCancel();" title="Cancel" />
+    </base:buttongroup>
   </base:body>
   </base:page>