ansonphong / postworld

Wordpress Theme Development Framework
GNU General Public License v2.0
7 stars 0 forks source link

load-feed Ad-blocks appearing at top before post templates loaded #79

Closed ansonphong closed 8 years ago

ansonphong commented 10 years ago

Hi Michel, You'll see here an example of what the load-feed looks like while it's loading - if the ad-block template has already been pre-loaded

image

This was revealed when I finished load-panel and pre-loaded the ad-block template into the page before the load-feed finished loading all the post templates - so it shows the ad temporarily at the top instead of the loading spinner, until it's loaded - then it works fine after it's loaded.

michelhabib commented 10 years ago

Doing some test here to recreate the issue, it does not happen when using the single scroller in a div. When simulating the same home page, with 2 feeds auto-scrolling, it happens only when preloading the ad. it also happens when using the post-detail template that you are using on reality sandwich. When using a simple template, like post-list, everything works fine Will get you more info once i figure something.

michelhabib commented 10 years ago

Here you go, committed and live at http://localhost/wordpress/search/#/live-feed-2-feeds-auto/ Since you are preloading the Ad template, it loads quickly before the other template - which is huge and takes time to load. So, there are 2 solutions. 1- remove the preloading of the AD. 2- add the preloading of the feed-item template.

So, i went with solution 2 of course, and modified the loadPanel directive to accept additional parameters to load other templates, not just panels. the good thing is you don't need to change anything you created before. You can now preload feed-item in this case like this:-

<div load-panel="detail" panel-group="posts" post-type="post" ng-include="panel.templateUrl"></div>

and you can hide it like this

<div ng-hide="hideTemplate" ng-init="hideTemplate=true;">
<div load-panel="detail" panel-group="posts" post-type="post" ng-include="panel.templateUrl"></div> 
</div>

you can use the above to hide the ad-block as well

<div ng-hide="hideTemplate" ng-init="hideTemplate=true;">
<div load-panel="ad-block" ng-include="panel.templateUrl"></div>    
</div>

You can check the full example in pwLiveFeed4Widget.html