Jump to content

Jquery + PHP echo issue

jason360

By jason360
in PHP Coding Help

 Share
Go to solution Solved by jason360,

Recommended Posts

jason360 Member

jason360

Posted
Posted

Hey guys,

 

Stuck on this for a couple days now.   I am using a 3rd party video gallery function that uses jquery.

 

http://codecanyon.net/item/responsive-video-gallery-html5-youtube-vimeo/2918602

 

The gallery works great when the list is hard coded, but as soon as I use a PHP mysql query to echo out the list the video gallery becomes buggy and hangs (works about 25% of the time). 

 

The higher I set the limit on the query the worse it performs (works great if I limit it to only 1).

 

Any ideas what could be the issue?  I am completely out of ideas.  Is my PHP code bad?

 

This list hard coded list works perfect:

<ul id='mix1' data-address="mix1">
<li data-address='youtube_single1' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/SVdc8ec_bGg?v=2&format=5&alt=jsonc' ></li>
<li data-address='youtube_single2' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/WwRrKaq0IyY?v=2&format=5&alt=jsonc' ></li>
<li data-address='youtube_single3' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/36kmXKP_l7I?v=2&format=5&alt=jsonc' ></li>
<li data-address='youtube_single4' data-type='youtube_single' data-path='http://gdata.you<li data-address='youtube_single5' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/WwRrKaq0IyY?v=2&format=5&alt=jsonc' ></li>
<li data-address='youtube_single6' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/36kmXKP_l7I?v=2&format=5&alt=jsonc' ></li>
<li data-address='youtube_single7' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/36kmXKP_l7I?v=2&format=5&alt=jsonc' ></li>
<li data-address='youtube_single8' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/36kmXKP_l7I?v=2&format=5&alt=jsonc' ></li>
<li data-address='youtube_single9' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/36kmXKP_l7I?v=2&format=5&alt=jsonc' ></li>
<li data-address='youtube_single10' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/36kmXKP_l7I?v=2&format=5&alt=jsonc' ></li>
<li data-address='youtube_single11' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/36kmXKP_l7I?v=2&format=5&alt=jsonc' ></li>
<li data-address='youtube_single12' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/36kmXKP_l7I?v=2&format=5&alt=jsonc' ></li>
</ul>

Once I use the PHP query and echo for the list the gallery becomes buggy:

<ul id='mix1' data-address="mix1">
                                          
                                          
										
                                              
                                            <?php  
                                            $query = mysql_query('SELECT video_number FROM videos WHERE video_item_id="'.$pid.'" ORDER BY RAND() LIMIT 10');
                        
                                            $i = 0;
                        
                                            class myCounter implements Countable {
                                                    public function count() {
                                                        static $count = 0;
                                                        return ++$count;
                                                    }
                                                }
                                                
                                                $counter = new myCounter;
                        
                                            while ($row = mysql_fetch_array($query))
                        
                                            {
                        
                                                if($i % 10 === 0)
                        
                                                {
                        
                        
                                                }
												
												echo "<li data-address='youtube_single".count($counter)."' data-type='youtube_single' data-path='http://gdata.youtube.com/feeds/api/videos/".$row['video_number']."?v=2&format=5&alt=jsonc' ></li>";
                                               
                                                 $i++;		
                                            }
                                            
                                            ?>
                                          </ul>
Link to comment
Share on other sites
jason360 Member

jason360

Posted
  • Author
Posted

Hey josh,

 

Yes, I compared them and re-compared them.  The hard code is actually a copy of what is echoed. 

 

I am kind of guessing it may be my database.  Its hosted with godaddy.  It was actually working fine a few weeks ago then turned buggy out of nowhere.

 

There are 7 rows in my videos table.

 

Thanks!

Link to comment
Share on other sites
.josh Advanced Member

.josh

Posted
Posted

okay, well if you are absolutely 150% certain the dynamic output matches the hardcoded output, then maybe you need to provide a little more context. As far as php is concerned, it's all text. Even if your database were taking a while to return stuff.. it's still all text, and things being buggy and hanging is a client-side issue.. unless you are using this alongside with ajax... is your clientside code calling this script onclick or hover or something? Things don't seem to be adding up here..please provide more context.

Link to comment
Share on other sites
jason360 Member

jason360

Posted
  • Author
Posted

Hey Josh.  I am going to check one more time copying what is echoed into hard code.  But in the meantime, here is all the script and JS powering it all.  It is using document.ready as you can see.

<!-- video gallery -->
            <link rel="stylesheet" type="text/css" href="http://www.site.com/css/video-gallery/jquery.jscrollpane.css" media="all" />
            <link rel="stylesheet" type="text/css" href="http://www.site.com/css/video-gallery/videoGallery_playlist_v_right.css" />
            <!--[if lte IE 8 ]><link rel="stylesheet" type="text/css" href="css/ie_below_9.css" /><![endif]-->

            <script type="text/javascript" src="http://www.site.com/js/video-gallery/swfobject.js"></script>
            <script type="text/javascript" src="http://www.site.com/js/video-gallery/jquery.dotdotdot-1.5.1.js"></script>
            <script type="text/javascript" src="http://www.site.com/js/video-gallery/jquery.address.js"></script>
            <script type="text/javascript" src="http://www.site.com/js/video-gallery/jquery.easing.1.3.js"></script>
            <script type="text/javascript" src="http://www.site.com/js/video-gallery/jquery.mousewheel.min.js"></script>
            <script type="text/javascript" src="http://www.site.com/js/video-gallery/jquery.jscrollpane.min.js"></script>
            <script type="text/javascript" src="http://www.site.com/js/video-gallery/froogaloop.js"></script>
            <script type="text/javascript" src="https://www.youtube.com/player_api"></script>
            <script type="text/javascript" src="http://www.site.com/js/video-gallery/jquery.apPlaylistManager.min.js"></script>
            <script type="text/javascript" src="http://www.site.com/js/video-gallery/jquery.apYoutubePlayer.min.js"></script>
            <script type="text/javascript" src="http://www.site.com/js/video-gallery/jquery.apVimeoPlayer.min.js"></script>
            <script type="text/javascript" src="http://www.site.com/js/video-gallery/jquery.func.js"></script>
    <script type="text/javascript" src="http://www.site.com/js/video-gallery/jquery.videoGallery.min.js"></script>       

    <script type="text/javascript">

                // FLASH EMBED PART
                var flashvars = {};
                var params = {};
                var attributes = {};
                attributes.id = "flashPreview";
                params.quality = "high";
                params.scale = "noscale";
                params.salign = "tl";
                params.wmode = "transparent";
                params.bgcolor = "#111";
                params.devicefont = "false";
                params.allowfullscreen = "true";
                params.allowscriptaccess = "always";
                swfobject.embedSWF("preview.swf", "flashPreview", "100%", "100%", "9.0.0", "expressInstall.swf", flashvars, params, attributes);

                //functions called from flash
                var jsReady = false;//for flash/js communication
                function flashVideoEnd() {jQuery.fn.videoGallery.flashVideoEnd();}
                function flashVideoStart() {jQuery.fn.videoGallery.flashVideoStart();}
                function dataUpdateFlash(bl,bt,t,d) {jQuery.fn.videoGallery.dataUpdateFlash(bl,bt,t,d);}
                function flashVideoPause() {jQuery.fn.videoGallery.flashVideoPause();}
                function flashVideoResume() {jQuery.fn.videoGallery.flashVideoResume();}
                function flashMainPreviewOff() {jQuery.fn.videoGallery.flashMainPreviewOff();}
                function flashResizeControls() {jQuery.fn.videoGallery.flashResizeControls();}
                function isReady() {return jsReady;}




                jQuery(document).ready(function($) {
                    jsReady = true;
                    //init component
                    $('#componentWrapper').videoGallery({   

                        /* REQUIRED */

                        /* DEEPLINKING SETTINGS */
                        /* useDeeplink: true, false */
                        useDeeplink:true,
                        /* startUrl: deeplink start url, enter 'ul' data-address/'li' data-address (two levels). Or just 'ul' data-address (single level). */
                        startUrl: 'mix1/youtube_single1',

                        /* NO DEEPLINKING SETTINGS */
                        /*activePlaylist: enter element 'id' attributte */
                        activePlaylist:'mix1',
                        /*activeItem: video number to start with (-1 = none, 0 = first, 1 = second, 2 = third ...etc) */
                        activeItem:0,

                        /* GENERAL */
                        /*thumbOrientation: horizontal, vertical (for scrolling) */
                        thumbOrientation: 'vertical',
                        /*playlistPosition: bottom / right */
                        playlistPosition: 'right',
                        /*fullSize: true/false (dont forget to edit the css as well) */
                        fullSize: true,
                        /*flashHolder: id of the flash movie */
                        flashHolder:'#flashPreview',

                        /* DEFAULTS */

                        /*defaultVolume: 0-1 */
                        defaultVolume:0.5,
                        /*autoPlay: true/false */
                        autoPlay:true,
                        /* loopingOn: loop playlist on end (last item in playlist), true/false */
                        loopingOn:true,
                        /* randomPlay: random play in playlist, true/false */
                        randomPlay:false,
                        /*autoAdvanceToNextVideo: true/false */
                        autoAdvanceToNextVideo:true,
                        /*autoMakePlaylistThumb: true/false (valid only for youtube and vimeo, auto make thumb for each video) */
                        autoMakePlaylistThumb:true,
                        /*autoMakePlaylistInfo: true/false (valid only for youtube and vimeo, auto make title and description for each video) */
                        autoMakePlaylistInfo:true,
                        /* outputPlaylistData: console.log out playlist data */
                        outputPlaylistData:false,
                        /* useYoutubeHighestQuality: true/false (use highest available quality for youtube video, if false, then it set to default)  */
                        useYoutubeHighestQuality:false,

                        videoGallerySetupDone:function() {
                            //console.log('videoGallerySetupDone');
                        }
                    });     
                });

            </script>
Link to comment
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.