changeset 442:40deb6525337

improved buttons
author Sebastien Jodogne <s.jodogne@gmail.com>
date Fri, 17 May 2013 16:06:38 +0200
parents 23e5b35e3c5c
children be93b666ed79
files OrthancExplorer/explorer.html
diffstat 1 files changed, 50 insertions(+), 26 deletions(-) [+]
line wrap: on
line diff
--- a/OrthancExplorer/explorer.html	Wed May 15 17:44:15 2013 +0200
+++ b/OrthancExplorer/explorer.html	Fri May 17 16:06:38 2013 +0200
@@ -88,12 +88,18 @@
 	            <option value="on">Protected</option>
                   </select>
                 </div>
-                <!--a href="#find-patients" data-role="button" data-icon="search">Go to patient finder</a-->
-                <a href="#" data-role="button" data-icon="delete" id="patient-delete">Delete this patient</a>
-                <a href="#" data-role="button" data-icon="forward" id="patient-store">Store in another DICOM modality</a>
-                <a href="#" data-role="button" data-icon="gear" id="patient-archive">Download ZIP</a>
-                <a href="#" data-role="button" data-icon="star" id="patient-anonymize">Anonymize</a>
               </p>
+              <ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="c">
+                <li data-role="list-divider">Interact</li>
+                <li data-icon="delete"><a href="#" id="patient-delete">Delete this patient</a></li>
+                <li data-icon="forward"><a href="#" id="patient-store">Send to DICOM modality</a></li>
+                <li data-icon="star"><a href="#" id="patient-anonymize">Anonymize</a></li>
+              </ul>
+
+              <ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="c">
+                <li data-role="list-divider">Access</li>
+                <li data-icon="gear"><a href="#" id="patient-archive">Download ZIP</a></li>
+              </ul>
             </div>
           </div>
           <div class="ui-block-b" style="width:70%">
@@ -122,12 +128,18 @@
             <div style="padding-right:10px">
               <ul data-role="listview" data-inset="true" data-theme="a" id="study-info">
               </ul>
-              <p>
-                <a href="#" data-role="button" data-icon="delete" id="study-delete">Delete this study</a>
-                <a href="#" data-role="button" data-icon="forward" id="study-store">Store in another DICOM modality</a>
-                <a href="#" data-role="button" data-icon="gear" id="study-archive">Download ZIP</a>
-                <a href="#" data-role="button" data-icon="star" id="study-anonymize">Anonymize</a>
-              </p>
+
+              <ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="c">
+                <li data-role="list-divider">Interact</li>
+                <li data-icon="delete"><a href="#" id="study-delete">Delete this study</a></li>
+                <li data-icon="forward"><a href="#" id="study-store">Send to DICOM modality</a></li>
+                <li data-icon="star"><a href="#" id="study-anonymize">Anonymize</a></li>
+              </ul>
+
+              <ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="c">
+                <li data-role="list-divider">Access</li>
+                <li data-icon="gear"><a href="#" id="study-archive">Download ZIP</a></li>
+              </ul>
             </div>
           </div>
           <div class="ui-block-b" style="width:70%">
@@ -156,15 +168,21 @@
         <div class="ui-grid-a">
           <div class="ui-block-a" style="width:30%">
             <div style="padding-right:10px">
-              <ul data-role="listview" data-inset="true" data-theme="a"  id="series-info">
+              <ul data-role="listview" data-inset="true" data-theme="a" id="series-info">
               </ul>
-              <p>
-                <a href="#" data-role="button" data-icon="delete" id="series-delete">Delete this series</a>
-                <a href="#" data-role="button" data-icon="search" id="series-preview">Preview this series</a>
-                <a href="#" data-role="button" data-icon="forward" id="series-store">Store in another DICOM modality</a>
-                <a href="#" data-role="button" data-icon="gear" id="series-archive">Download ZIP</a>
-                <a href="#" data-role="button" data-icon="star" id="series-anonymize">Anonymize</a>
-              </p>
+
+              <ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="c">
+                <li data-role="list-divider">Interact</li>
+                <li data-icon="delete"><a href="#" id="series-delete">Delete this series</a></li>
+                <li data-icon="forward"><a href="#" id="series-store">Send to DICOM modality</a></li>
+                <li data-icon="star"><a href="#" id="series-anonymize">Anonymize</a></li>
+              </ul>
+
+              <ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="c">
+                <li data-role="list-divider">Access</li>
+                <li data-icon="search"><a href="#" id="series-preview">Preview this series</a></li>
+                <li data-icon="gear"><a href="#" id="series-archive">Download ZIP</a></li>
+              </ul>
             </div>
           </div>
           <div class="ui-block-b" style="width:70%">
@@ -195,13 +213,19 @@
             <div style="padding-right:10px">
               <ul data-role="listview" data-inset="true" data-theme="a"  id="instance-info">
               </ul>
-              <p>
-                <a href="#" data-role="button" data-icon="delete" id="instance-delete">Delete this instance</a>
-                <a href="#" data-role="button" data-icon="arrow-d" id="instance-download-dicom">Download the DICOM file</a>
-                <a href="#" data-role="button" data-icon="arrow-d" id="instance-download-json">Download the JSON file</a>
-                <a href="#" data-role="button" data-icon="search" id="instance-preview">Preview the instance</a>
-                <a href="#" data-role="button" data-icon="forward" id="instance-store">Store in another DICOM modality</a>
-              </p>
+
+              <ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="c">
+                <li data-role="list-divider">Interact</li>
+                <li data-icon="delete"><a href="#" id="instance-delete">Delete this instance</a></li>
+                <li data-icon="forward"><a href="#" id="instance-store">Send to DICOM modality</a></li>
+              </ul>
+
+              <ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="c">
+                <li data-role="list-divider">Access</li>
+                <li data-icon="arrow-d"><a href="#" id="instance-download-dicom">Download the DICOM file</a></li>
+                <li data-icon="arrow-d"><a href="#" id="instance-download-json">Download the JSON file</a></li>
+                <li data-icon="search"><a href="#" id="instance-preview">Preview the instance</a></li>
+              </ul>
             </div>
           </div>
           <div class="ui-block-b" style="width:70%">