How do I toggle list/grid view on section index page without affect category filtering

Question

I have a section "projects" with entry type (projectPage) with and an index page set up displaying a grid view of entries. I have also set up category filtering via links to the {{category.url}} which point to the projects/index template.

I want to add another entry type (projectList) that will have entries that 1. have only title and category relationships defined 2. do not have their own url.

I want to add a toggle button to the page that will change the display from a grid view to a list view combining the (projectPage) entries and (projectList) entries, but I want it to remain in effect as you cycle through the categories, until it is deselected.

I had some success setting up a route to projects/list that filtered the entry types based on the url with {% if craft.request.getSegment(2) == link %}

but the relationship brakes when I click on a category link. I'd prefer to have everything in the same template file and not add the "list" to the url if possible.

Currently I'm think that to hide the (projectList) entry URL's I'd have to set up another section "projectListings" and set up routes for project/list to point to the new index template and add routes for each category for project/list/{{cat}} but I'm hitting a roadblock as to if this is the best way to go about it, and how exactly to implement it.

Hopefully this is not too broad a question, as I could use a little direction. Thanks.

Answer 1

If I don't misunderstand anything from your question, you're basically looking for a way to pass data with a link, in your case the toggle state, which is responsible for the grid / list view.

There's multiple ways to do that. See Brad's short but precise answer on an related question.

You said that you're preferably looking for a way that doesn't reveal the toggle state in the URL. I can understand the thinkings behind that, but keep in mind, that this is the only way one could save the site or post a link to someone else with the information included.

Another idea: Most sites probably use Javascript for such a toggle (I've seen many Wordpress themes with such a feature). But you'd still need to save the state somehow or completely AJAXify the relevant pages.