Changeset 4540

Timestamp:

02/20/14 16:09:24 (10 years ago)

Author:

twagoo

Message:

Added a panel for facets with selected valeus that allow for deselection. FacetsPanel? adds either an instance of this or of the value select panel depending on whether an existing selection is present.

Location:

vlo/branches/vlo-3.0/vlo-web-app/src/main/java/eu/clarin/cmdi/vlo

Files:

• pojo/FacetSelection.java (added)
• wicket/components/FacetValuesPanel.java (modified) (3 diffs)
• wicket/components/FacetsPanel.java (modified) (4 diffs)
• wicket/components/SelectedFacetPanel.html (copied) (copied from vlo/branches/vlo-3.0/vlo-web-app/src/main/java/eu/clarin/cmdi/vlo/wicket/components/FacetPanel.html) (1 diff)
• wicket/components/SelectedFacetPanel.java (added)

vlo/branches/vlo-3.0/vlo-web-app/src/main/java/eu/clarin/cmdi/vlo/wicket/components/FacetValuesPanel.java

@@ -33 +33 @@
 
 /**
- * A panel representing a single facet
+ * A panel representing a single facet and its selectable values
  *
  * @author twagoo
@@ -54 +54 @@
             @Override
             protected void populateItem(final Item<Count> item) {
-                item.setDefaultModel(new CompoundPropertyModel<Count>(item.getModel()));
-                final Link selectLink = new AjaxFallbackLink("facetSelect") {
-
-                    @Override
-                    public void onClick(AjaxRequestTarget target) {
-                        FacetValuesPanel.this.onValuesSelected(
-                                item.getModelObject().getFacetField().getName(),
-                                Collections.singleton(item.getModelObject().getName()),
-                                target);
-                    }
-                };
-                item.add(selectLink);
-                // 'name' field from Count (name of value)
-                selectLink.add(new Label("name"));
-                // 'count' field from Count (document count for value)
-                selectLink.add(new Label("count"));
+                addFacetValue(item);
             }
         });
+    }
+
+    private void addFacetValue(final Item<Count> item) {
+        item.setDefaultModel(new CompoundPropertyModel<Count>(item.getModel()));
+
+        // link to select an individual facet value
+        final Link selectLink = new AjaxFallbackLink("facetSelect") {
+
+            @Override
+            public void onClick(AjaxRequestTarget target) {
+                // call callback
+                onValuesSelected(
+                        item.getModelObject().getFacetField().getName(),
+                        // for now only single values can be selected
+                        Collections.singleton(item.getModelObject().getName()),
+                        target);
+            }
+        };
+        item.add(selectLink);
+
+        // 'name' field from Count (name of value)
+        selectLink.add(new Label("name"));
+        // 'count' field from Count (document count for value)
+        selectLink.add(new Label("count"));
     }
 
@@ -82 +91 @@
      * (fallback)!
      */
-    public abstract void onValuesSelected(String facet, Collection<String> values, AjaxRequestTarget target);
+    protected abstract void onValuesSelected(String facet, Collection<String> values, AjaxRequestTarget target);
 
 }

vlo/branches/vlo-3.0/vlo-web-app/src/main/java/eu/clarin/cmdi/vlo/wicket/components/FacetsPanel.java

@@ -17 +17 @@
 package eu.clarin.cmdi.vlo.wicket.components;
 
+import eu.clarin.cmdi.vlo.pojo.FacetSelection;
 import eu.clarin.cmdi.vlo.pojo.QueryFacetsSelection;
 import eu.clarin.cmdi.vlo.service.FacetFieldsService;
 import eu.clarin.cmdi.vlo.wicket.provider.FacetFieldsDataProvider;
 import java.util.Collection;
+import java.util.HashSet;
 import org.apache.solr.client.solrj.response.FacetField;
 import org.apache.wicket.ajax.AjaxRequestTarget;
@@ -27 +29 @@
 import org.apache.wicket.markup.repeater.data.DataView;
 import org.apache.wicket.model.IModel;
+import org.apache.wicket.model.Model;
 import org.apache.wicket.spring.injection.annot.SpringBean;
 
 /**
- * A panel representing a group of facets
+ * A panel representing a group of facets.
+ *
+ * For each facet present (retrieved from the injected
+ * {@link FacetFieldsService}, a panel is added. This is either a
+ * {@link FacetValuesPanel}, allowing for selection of facet values, or a
+ * {@link SelectedFacetPanel} representing a facet with selected values,
+ * allowing for deselection of these values.
  *
  * @author twagoo
@@ -38 +47 @@
     @SpringBean
     private FacetFieldsService facetFieldsService;
+    private final IModel<QueryFacetsSelection> model;
 
-    public FacetsPanel(final String id, final IModel<QueryFacetsSelection> model) {
+    public FacetsPanel(final String id, IModel<QueryFacetsSelection> model) {
         super(id, model);
+        this.model = model;
 
         add(new DataView<FacetField>("facets", new FacetFieldsDataProvider(facetFieldsService, model)) {
@@ -46 +57 @@
             @Override
             protected void populateItem(Item<FacetField> item) {
-                item.add(new FacetValuesPanel("facet", item.getModel()) {
-
-                    @Override
-                    public void onValuesSelected(String facet, Collection<String> value, AjaxRequestTarget target) {
-                        // A value has been selected on this facet's panel,
-                        // update the model! 
-                        model.getObject().selectValues(facet, value);
-
-                        // Trigger updates to reflect new model state
-                        modelChanged();
-
-                        if (target != null) {
-                            // reload entire page for now
-                            target.add(getPage());
-                        }
-                    }
-                });
+                createFacetPanel(item);
             }
         });
     }
 
+    private void createFacetPanel(Item<FacetField> item) {
+        // Is there a selection for this facet?
+        final IModel<FacetField> facetFieldModel = item.getModel();
+        final String facetName = facetFieldModel.getObject().getName();
+        final Collection<String> selectionValues = model.getObject().getSelectionValues(facetName);
+
+        // Show different panel, depending on selected values
+        if (selectionValues == null || selectionValues.isEmpty()) {
+            // No values selected, show value selection panel
+            item.add(createFacetValuesPanel(facetFieldModel));
+        } else {
+            // Values selected, show selected values panel (with option to remove)
+            item.add(createSelectedFacetPanel(facetName));
+        }
+    }
+
+    private FacetValuesPanel createFacetValuesPanel(final IModel<FacetField> facetFieldModel) {
+        return new FacetValuesPanel("facet", facetFieldModel) {
+
+            @Override
+            public void onValuesSelected(String facet, Collection<String> value, AjaxRequestTarget target) {
+                // A value has been selected on this facet's panel,
+                // update the model!
+                model.getObject().selectValues(facet, value);
+
+                if (target != null) {
+                    // reload entire page for now
+                    target.add(getPage());
+                }
+            }
+        };
+    }
+
+    private SelectedFacetPanel createSelectedFacetPanel(String facetName) {
+        final FacetSelection selection = new FacetSelection(facetName, model);
+        return new SelectedFacetPanel("facet", new Model(selection)) {
+
+            @Override
+            public void onValuesUnselected(String facet, Collection<String> valuesRemoved, AjaxRequestTarget target) {
+                // Values have been removed, calculate remainder
+                final Collection<String> currentSelection = model.getObject().getSelectionValues(facet);
+                final Collection<String> newSelection = new HashSet<String>(currentSelection);
+                newSelection.removeAll(valuesRemoved);
+
+                // Update model
+                model.getObject().selectValues(facet, newSelection);
+
+                if (target != null) {
+                    // reload entire page for now
+                    target.add(getPage());
+                }
+            }
+        };
+    }
 }

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

@@ -23 +23 @@
     </head>
     <body>
-    <wicket:panel>
-        <div class="facet collapsedfacet">
-            <a href="#" class="expandfacet"><span>expand</span></a>
-            <a href="#" class="collapsefacet"><span>collapse</span></a>
-            <h1><a href="#"><wicket:container wicket:id="name">[TITLE]</wicket:container></a></h1>
-            <a href class="filtertoggle"><span>filter</span></a>
-            <form class="filterform">
-                <input type="text" />
-            </form>
-            <div class="sbilinks facetvalues">
-                <ul>
-                    <li wicket:id="facetValues"><a wicket:id="facetSelect" href="index3.html"><span wicket:id="name">Dutch</span> (<span wicket:id="count">148167</span>)</a></li>
-                    <!--<li class="more-link"><a wicket:id="allFacetValuesLink" href="#">more...</a></li>-->
-                </ul>
+        <wicket:panel>
+            <div class="facet collapsedfacet">
+                <a href="#" class="expandfacet"><span>expand</span></a>
+                <a href="#" class="collapsefacet"><span>collapse</span></a>
+                <h1><a href="#"><wicket:container wicket:id="facet">[TITLE]</wicket:container></a></h1>
+                <div wicket:id="facetValueRemover" class="selectedvaluelabel">
+                    <wicket:container wicket:id="facetValue">value</wicket:container>
+                    <a wicket:id="unselectValue" class="unselectfacetvalue" title="unselect value">
+                        <span>[unselect]</span>
+                    </a>
+                </div>
+                <div class="sbilinks facetvalues">
+                    <ul>
+                        <li><span class="selectedfacetvalue">Dutch</span><a class="unselectfacetvalue" title="unselect value" href="index2.html"><span>[unselect]</span></a></li>
+                        <li><span class="facetvalue">English</span></li>
+                        <li><span class="facetvalue">German</span></li>
+                        <li><span class="facetvalue">French</span></li>
+                        <li><span class="facetvalue">Spanish</span></li>
+                        <li><span class="facetvalue">Danish</span></li>
+                        <li><span class="facetvalue">Japanese</span></li>
+                        <li><span class="facetvalue">Turkish</span></li>
+                        <li><span class="facetvalue">Chinese</span></li>
+                        <!--<li class="more-link"><a href="#">more...</a></li>-->
+                    </ul>
+                </div>
             </div>
-        </div>
-    </wicket:panel>
-</body>
+        </wicket:panel>
+    </body>
 </html>