PrettyPhoto and Touchwipe

I have tried to implement the approved answer from here: Adding jQuery TouchSwipe to prettyPhoto to accomplish using touchwipe with prettyphoto.

The site is in wordpress and I have called the touchwipe javascript properly and added the code from the link above in my page.php with in script tags.

For some reason though I cannot get it to work.

Here is my code from page.php

<?php
get_header(); 

$no_feat_class = '';
if( !options::logic( 'blog_post' , 'enb_featured' ) || !

has_post_thumbnail( $post -> ID ) ){
    $no_feat_class = ' no_feat ';
}

$post_id = $post -> ID;


/*---------------------*/
$post_format = get_post_format( $post -> ID );
if(!strlen($post_format)){ $post_format = 'standard';}
?>
<script>
$(document).ready(function(){
    function setupBox() {
       $("a[rel^='prettyPhoto']").prettyPhoto({
            social_tools: false,
            theme:'dark_rounded',
            changepicturecallback: function() {
                setupSwipe();
            }
       });
    }
    function setupSwipe() {
       $(".pp_hoverContainer").touchwipe({
        wipeLeft: function() { 
            $.prettyPhoto.changePage('next');
        },  
        wipeRight: function() { 
           $.prettyPhoto.changePage('previous');
    },
       min_move_x: 20,
       min_move_y: 20,
       preventDefaultEvents: true
   });
}
setupBox();
});
</script>
<section id="main">
<div class="main-container">    
    <?php
        while( have_posts () ){ 
            the_post();
            $meta = meta::get_meta( $post -> ID, 'settings' );
            $meta_enb = options::logic( 'blog_post' , 'meta' );   


        } /*EOF while( have_posts () ) */
    ?>
    <?php
        $resizer = new LBPageResizer('page');
        $resizer -> render_frontend();
    ?>
</div>
</section>    

<?php get_footer(); ?>

Have I done something wrong?