Virendrasingh
Virendrasingh

Reputation: 191

Why Php Media Gallery not working?

I'm trying to create VIDEO/image gallery so it will make it easier for me to upload Videos/image to the gallery. The Gallery consists of a thumbnail image of videos/images, a one line description and when click the thumbnail is display image/video within a fancy box. I think so, it's basic. (The thumbnail and fancy box image are using the same image.) I'm new in Php and trying to implement this functionality to my current project as soon as possible. I found something good here http://www.w3schools.in/php/media-gallery and I run it on my machine but got some issues listed below, Any ideas? their is few issues with me,

  1. Images are not display.
  2. "From My Computer" and "From YouTube URL" links are not working.
  3. YouTube icon not display on my YouTube video.
  4. Theme and look not same as on demo.
  5. fancy box interaction not working for me.

Php Code for index.php :

       <?php
            $result = $obj->getGalley();
            if (!empty($result)) {
                foreach ($result AS $row) {
                    /* IF is Video */
                    if ($row['media_type'] == 'YouTube') {
                        $rel = 'video';
                        $href = "http://www.youtube.com/embed/" . $row['media_name'];
                        $src_bg = 'http://img.youtube.com/vi/' . $row['media_name'] . '/mqdefault.jpg';
                        $src = 'http://img.youtube.com/vi/' . $row['media_name'] . '/mqdefault.jpg';
                    } else {
                        /* IF is Image */
                        $rel = '';
                        $href = "images/large/" . $row['media_name'];
                        $src_bg = "images/small/" . $row['media_name'];
                        $src = "images/small/" . $row['media_name'];
                    }
                    ?>
                    <div class="col-xs-6 col-md-3 col-lg-2 col-sm-4 gallery-block" data-media_guid="<?php echo $row['media_GUID']; ?>">
                        <div class="gallery-block-inner">  
                            <a class="photobox_a <?php if ($rel != '') { ?> media-video<?php } ?>" href="<?php echo $href; ?>" rel="<?php echo $rel; ?>" <?php if ($rel != '') { ?> style="background-image:url('images/placeholder.png'), url('<?php echo $src_bg; ?>');"<?php } ?>>
                                <img src="<?php echo $src; ?>" class="img-responsive">
                            </a>
                        </div>
                        <span class="media-name"><?php echo $row['media_name_original']; ?></span>
                    </div>
                    <?php
                }
            } else {
                ?>
                <p id="gallery-empty">It's Empty</p>
                <?php
            }
         ?> 

Upload Media code :

   <!-- Upload Media Starts -->
        <div class="row">
            <hr>
            <h3>ADD MORE MEDIA TO COLLECTION</h3>
            <div id="upload_button_group">
                <a href="javascript:void(0)" class="button" id="upload_button">From My Computer</a>
                <a href="javascript:void(0)" class="button button-blue" id="upload_button_URL">From YouTube URL</a>
            </div>
            <form id="upload_form" name="upload_form" method="post" action="media_upload.php" enctype="multipart/form-data">
                <input type="file" id="upload_media" name="upload_media" accept="image/*" style="display:none">
            </form>
            <form id="upload_form_url" name="upload_form_url" method="post" action="media_upload.php"  style="display:none">
                <input class="text-field" name="youtube_url" id="youtube_url" type="text" placeholder="Please enter YouTube URL">
                <a href="javascript:void(0)" class="button" id="upload_button_URL_save">Save</a>
                <a href="javascript:void(0)" class="button button-blue" id="upload_button_URL_cancel">Cancel</a>
            </form>
        </div>
   <!-- Upload Media Ends -->

Upvotes: 1

Views: 223

Answers (1)

Sarah Gebauer
Sarah Gebauer

Reputation: 96

From looking at the code my best guess is that there are incorrect links and therefore browser cannot find those files. That explains missing images (1, 3?), css (4) and not working JavaScript (2,5).

Make sure that at localhost/path to your project/js/app.js can be found. This specifically controls the uploading. And for all other files that are there.

Upvotes: 1

Related Questions