Changeset 4986

Timestamp:

04/16/14 08:13:37 (10 years ago)

Author:

Twan Goosen

Message:

Created an abstract panel that toggles content with a toggle link.
Applied it in record page for 'all fields' and 'technical details' sections. Adjusted CSS for this.

Location:

vlo/branches/vlo-3.0/vlo-web-app/src/main

Files:

• java/eu/clarin/cmdi/vlo/wicket/model/XsltModel.java (modified) (1 diff)
• java/eu/clarin/cmdi/vlo/wicket/pages/RecordPage.html (modified) (1 diff)
• java/eu/clarin/cmdi/vlo/wicket/pages/RecordPage.java (modified) (3 diffs)
• java/eu/clarin/cmdi/vlo/wicket/panels/TogglePanel.html (added)
• java/eu/clarin/cmdi/vlo/wicket/panels/TogglePanel.java (added)
• resources/eu/clarin/cmdi/vlo/wicket/pages/vlo-record.css (modified) (2 diffs)
• webapp/js/vlo-record.js (modified) (1 diff)

vlo/branches/vlo-3.0/vlo-web-app/src/main/java/eu/clarin/cmdi/vlo/wicket/model/XsltModel.java

@@ -18 +18 @@
 
 import eu.clarin.cmdi.vlo.VloWicketApplication;
-import java.io.IOException;
-import java.io.InputStreamReader;
-import java.io.StringWriter;
 import java.net.URL;
 import javax.xml.transform.TransformerException;
-import javax.xml.transform.stream.StreamSource;
-import net.sf.saxon.s9api.Processor;
-import net.sf.saxon.s9api.SaxonApiException;
-import net.sf.saxon.s9api.Serializer;
-import net.sf.saxon.s9api.XdmNode;
-import net.sf.saxon.s9api.XsltCompiler;
-import net.sf.saxon.s9api.XsltExecutable;
-import net.sf.saxon.s9api.XsltTransformer;
 import org.apache.wicket.model.IModel;
 import org.apache.wicket.model.LoadableDetachableModel;

vlo/branches/vlo-3.0/vlo-web-app/src/main/java/eu/clarin/cmdi/vlo/wicket/pages/RecordPage.html

@@ -68 +68 @@
                 <div wicket:id="resources" id="recordresources">[RESOURCES]</div>
 
-                <p id="recordcmditoggle" class="recordtogglelinks">
-                    <a href="#" id="showrecordcmdi" class="recordshowlink">Show all metadata fields</a>
-                    <a href="#" id="hiderecordcmdi" class="recordhidelink">Hide all metadata fields</a>
-                </p>
                 <div wicket:id="cmdi" id="recordcmdi">[CMDI metadata]</div>
 
-                <p id="recordtechnicaldetailstoggle" class="recordtogglelinks">
-                    <a href="#" id="showrecordtechnicaldetails" class="recordshowlink">Show technical details</a>
-                    <a href="#" id="hiderecordtechnicaldetails" class="recordhidelink">Hide technical details</a>
-                </p>
-                <div id="recordtechnicaldetails">
-                    <h2>Technical details</h2>
-
-                    <div id="recordtechnicalattributes">
-                        <wicket:container wicket:id="technicalProperties">[PROPERTIES TABLE]</wicket:container>
-                    </div>
-                </div> <!-- recordtechnicaldetails -->
+                <div wicket:id="technicalProperties" id="recordtechnicaldetails">[TECHNICAL PROPERTIES TABLE]</div>
+                
             </div>
         </wicket:extend>

vlo/branches/vlo-3.0/vlo-web-app/src/main/java/eu/clarin/cmdi/vlo/wicket/pages/RecordPage.java

@@ -32 +32 @@
 import eu.clarin.cmdi.vlo.wicket.model.XsltModel;
 import eu.clarin.cmdi.vlo.wicket.panels.BreadCrumbPanel;
+import eu.clarin.cmdi.vlo.wicket.panels.TogglePanel;
 import eu.clarin.cmdi.vlo.wicket.panels.TopLinksPanel;
 import eu.clarin.cmdi.vlo.wicket.panels.record.ContentSearchFormPanel;
@@ -134 +135 @@
         // Technical section
         add(createCmdiContent("cmdi"));
-        add(new FieldsTablePanel("technicalProperties", new DocumentFieldsProvider(getModel(), technicalPropertiesFilter)));
+        add(createTechnicalDetailsPanel("technicalProperties"));
 
         createSearchLinks("searchlinks");
@@ -219 +220 @@
     }
 
-    private Label createCmdiContent(String id) {
+    private Component createCmdiContent(String id) {
+
         final IModel<String> locationModel = new SolrFieldStringModel(getModel(), FacetConstants.FIELD_FILENAME);
         final UrlFromStringModel locationUrlModel = new UrlFromStringModel(locationModel);
-        final Label cmdiContentLabel = new Label(id, new XsltModel(locationUrlModel));
-        cmdiContentLabel.setEscapeModelStrings(false);
-        return cmdiContentLabel;
+        return new TogglePanel(id, Model.of("Show all metadata fields"), Model.of("Hide all metadata fields")) {
+
+            @Override
+            protected Component createContent(String id) {
+                final Label cmdiContentLabel = new Label(id, new XsltModel(locationUrlModel));
+                cmdiContentLabel.setEscapeModelStrings(false);
+                return cmdiContentLabel;
+            }
+        };
+    }
+
+    private TogglePanel createTechnicalDetailsPanel(String id) {
+        return new TogglePanel(id, Model.of("Show technical details"), Model.of("Hide technical details")) {
+
+            @Override
+            protected Component createContent(String id) {
+                return new FieldsTablePanel(id, new DocumentFieldsProvider(getModel(), technicalPropertiesFilter));
+            }
+        };
     }
 

vlo/branches/vlo-3.0/vlo-web-app/src/main/resources/eu/clarin/cmdi/vlo/wicket/pages/vlo-record.css

@@ -227 +227 @@
 /* Technical details */
 
-.recordtogglelinks {
-    clear: both;
-    padding: 0 0 1em 0;
+#record .collapsed a.contenttoggle:before {
+    content: '+ ';
+}
+
+#record .expanded a.contenttoggle:before {
+    content: '- ';
+}
+
+#recordcmdi {
+    clear: both; /* first div after records, clear */
+    padding: 1em 0 1em 0;
 }
 
@@ -236 +244 @@
 }
 
-a.recordshowlink:before {
-    content: '+ ';
-}
-
-a.recordhidelink:before {
-    content: '- ';
-}
-
-#recordtechnicaldetails, #recordcmdi {
+#recordtechnicaldetails .togglecontent, #recordcmdi .togglecontent {
     border-top: 1px dashed;
     padding: 1em 0;

vlo/branches/vlo-3.0/vlo-web-app/src/main/webapp/js/vlo-record.js

@@ -17 +17 @@
 
 $(document).ready(function() {
-    $("#recordtechnicaldetails, #recordcmdi").hide();
-    $("#hiderecordtechnicaldetails, #hiderecordcmdi").hide();
-    $("#recordcmditoggle a").click(function(event) {
-        event.preventDefault();
-        $("#recordcmdi").toggle();
-        $("#recordcmditoggle a").toggle();
-    });
-    $("#recordtechnicaldetailstoggle a").click(function(event) {
-        event.preventDefault();
-        $("#recordtechnicaldetails").toggle();
-        $("#recordtechnicaldetailstoggle a").toggle();
-    });
+//    $("#recordtechnicaldetails, #recordcmdi").hide();
+//    $("#hiderecordtechnicaldetails, #hiderecordcmdi").hide();
+//    $("#recordcmditoggle a").click(function(event) {
+//        event.preventDefault();
+//        $("#recordcmdi").toggle();
+//        $("#recordcmditoggle a").toggle();
+//    });
+//    $("#recordtechnicaldetailstoggle a").click(function(event) {
+//        event.preventDefault();
+//        $("#recordtechnicaldetails").toggle();
+//        $("#recordtechnicaldetailstoggle a").toggle();
+//    });
 });