javascript - Formstone asap.js proper usage in wordpress -


i trying use asap.js (docs: http://formstone.it/components/asap/) component on wordpress site. plugin provided formstone set of useful scripts. can't figure out how address wordpress content using script.

i tried code doesn;t seem work nor have errors in chrome's console. can provide me simple example, can start with?

jquery(document).ready(function ($) { var $content,     $deferred;  $(document).ready(function() {     // bind asap events     $(window).on("request.asap", pagerequested)         .on("progress.asap", pageloadprogress)         .on("load.asap", pageloaded)         .on("render.asap", pagerendered)         .on("error.asap", pageloaderror);      $content = $(".mypagewrapper");      // init asap     $.asap({         cache: false,         selector: "a:not(.no-asap)",         transitionout: function() {             if ($deferred) {                 $deferred.reject();             }              $deferred = $.deferred();              $content.animate({ opacity: 0 }, 1000, function() {                 console.log("animate complete");                  $deferred.resolve();             });              return $deferred;         }     });      // remember init first page     pagerendered(); });  function pagerequested(e) {     // update state reflect loading     console.log("request new page"); }  function pageloadprogress(e, percent) {     // update progress reflect loading     console.log("new page load progress", percent); }  function pageloaded(e) {     // unbind old events , remove plugins     console.log("destroy old page"); }  function pagerendered(e) {     // bind new events , initialize plugins     console.log("render new page");      $content.animate({ opacity: 1 }, 1000); }  function pageloaderror(e, error) {     // watch load errors     console.warn("error loading page: ", error); }    }); 

the class="mypagewrapper" used in wordpress theme file content-page.php:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>  <article class="mypagewrapper">   <?php the_content(); ?>  </article> <?php endwhile; endif; ?> 

you need return json object containing content replaced when making asap request. think work in wordpress, although there better way hook core filters:

<?php   $isasap = (isset($_get["fs-asap"]) && $_get["fs-asap"] == "true"); ob_start();  if (have_posts()) :      while (have_posts()) :          the_post();           if (!$isasap) : ?> <article class="mypagewrapper"> <?php         endif;          the_content();           if (!$isasap) : ?> </article> <?php         endif;     endwhile;  endif;   if ($isasap) :     // if asap request, return json object page pieces     $page_content = ob_get_clean();      $asap_content = json_encode(array(         ".mypagewrapper" => $page_content     ));      header("content-length: " . strlen($asap_content));     die($asap_content); endif; ?> 

Comments

Popular posts from this blog

android - MPAndroidChart - How to add Annotations or images to the chart -

javascript - Add class to another page attribute using URL id - Jquery -

firefox - Where is 'webgl.osmesalib' parameter? -