This is an interesting module and I hope to use it to 'jazz up' this page of our company website: http://www.accessadvertising.co.uk/work

However, when I setup this view using Views Quicksand on a test website, I noticed that the Quicksand view rows are output after the main view container div. This means that all the styles targeted at the view rows don't work and that the pager now appears above the view rows.

For reference, this is the structure of the html produced:

<div class="view view-our-work view-id-our_work view-display-id-page view-dom-id-1 views-processed">
  <div class="view-header">...Header text...</div>
  <div class="view-filters">...Filters...</div>
  <div class="view-content clearfix" style="display: none;">... standard rows hidden by Quicksand...</div>
  <div class="item-list"><ul class="pager">...Pager...</ul></div>
</div>
<div class="views-quicksand-container">
  ... Quicksand view rows ...
</div>

I've tried changing where the div views-quicksand-container is output in views_quicksand.js but this just breaks the Quicksand view each time.

My thoughts are that the Quicksand container is output inside the main views div, below the hidden rows and above the pager:

<div class="view view-our-work view-id-our_work view-display-id-page view-dom-id-1 views-processed">
  <div class="view-header">...Header text...</div>
  <div class="view-filters">...Filters...</div>
  <div class="view-content clearfix" style="display: none;">... standard rows hidden by Quicksand...</div>
  <div class="views-quicksand-container">
    ... Quicksand view rows ...
  </div>
  <div class="item-list"><ul class="pager">...Pager...</ul></div>
</div>

Any thoughts?

Paul

Comments

leschekfm’s picture

Category: support » bug
Status: Active » Needs review

Hi,
I waited for someone to notice this behaviour :D

The problem with putting the quicksand container inside the view is that on every ajax request the whole view gets replaced. So the quicksand container would be gone and there would be nothing to compare the new result set against.

Nonetheless I solved this by cloning the pager and appending it to the quicksand container.

Please test the latest dev version and provide feedback.

paul_gregory’s picture

That seems to work quite well.

Can I make another suggestion that I think would help with theming. Because the Quicksand rows and the cloned pager sit out side of the View div, there are no view-specific classes wrapping this content. If you have more than one quicksand view on your site it could be difficult to theme them separately.

How about wrapping the Quicksand content in a div with similar classes found on the View div? Example:

<div class="quicksand-view-our-work quicksand-view-id-our_work">
  <div class="views-quicksand-container">
    ... Quicksand view rows ...
  </div>
  <div class="item-list">
    ... Pager ...
  </div>
</div>
Macronomicus’s picture

the pager shows but no loger works in the .dev version that has this tweak, but going back to your last release with the pager left alone it works, for me at least.

Im using jquery 1.7 too, not sure if that could be it.

leschekfm’s picture

@macrocosm:
Yes it seems that your jquery version is causing this. I replaced my standard jquery.js with a 1.7 version and the pager stopped working. But I think that is a general problem as there has to be some reason that jquery update only updates to jquery 1.5.2.

@Paul Gregory:
I don't think this is really a problem as you are able to select the views-quicksand-container in combination with it's view using the CSS adjacent sibling combinator.

leschekfm’s picture

Status: Needs review » Fixed
bluephx’s picture

Status: Closed (fixed) » Fixed
bluephx’s picture

Hi,
Simple replace $viewContainer.after = $viewContainer.before in views_quicksand.js
gud luck!

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

sam152’s picture

Status: Fixed » Needs work

The correct fix for this would be to maintain a complete copy of the original view element and keep the quicksand container in the same place in the cloned structure. Then it's a matter of hiding the original and letting the copy take the originals place, with all the correct styles/pagers/themes.

sam152’s picture

Status: Needs work » Closed (fixed)

This has been fixed. The quicksand container is now a deep copy of the original view.