Now that we have created our filter all that remains is to invoke it in our PodLoader and use the saved value to filter our list of Movies. Appendix A.6 contains the updated version of the createPod(...) method. The code extract below shows the specific code that creates our text filter and adds it to the Pod.
009 // Create the configuration for the filter renderer. 010 RendererConfig titleFilterRenderer = 011 new RendererConfig(RendererConfigType.STYLE, "pod-text-filter"); 012 013 // Create the filter. 014 PodFilter titleFilter = 015 new PodFilter("title", document, titleFilterRenderer); 016 titleFilter.addFilterLabel("Title"); 017 018 // Retrieve the saved filter value and extract to an array 019 Node titleTextNode = 020 getPodFilterById(PODTYPE.MYFAVMOVIES, "title", document); 021 ArrayList<String> titleTextArray = 022 PodFilter.convertSelectionsNodeToArrayList(titleTextNode); 023 024 // Create the Node that the filter Renderer expects and add the 025 // saved filter text to it. 026 String titleFilterText = ""; 027 if (!titleTextArray.isEmpty()) { 028 titleFilterText = titleTextArray.get(0); 029 } 030 Element titleFilterNode = document.createElement("text-filter"); 031 titleTextNode = document.createTextNode(titleFilterText); 032 titleFilterNode.appendChild(titleTextNode); 033 titleFilter.addFilter(titleFilterNode); 034 035 // Add the title filter to the Pod 036 moviesPod.addFilter(titleFilter);
Create a new filter
In lines 10-11 we create the configuration for our new filter by referencing the style we created in the StylesConfig.xml. We pass this to the PodFilter constuctor along with the id of our filter, 'title' in this case.
Retrieve saved filter values
In lines 19-22 we use the utility functions to return the saved values for our 'title' filter and convert them to an array for ease of use.
Create input to Renderer
In lines 19-33 we create the text Node that will passed to our Renderer. The Renderer is expecting a Node named "text-filter" so we create this and add the filter text to it. We add the Node to our PodFilter object using the addFilter(...) method.
Add the filter to the Pod
Finally we pass our PodFilter object to the addFilter(...) method of our PodBuilder object.
When we iterate over the movies we only select movies whose title contains the substring that was returned from the filter. When we put it all together we can load our Pod, select the pen icon to open the filter, choose a genre and click save. The page will re-draw with the new filtered list.