<?php
$file = explode('.', $video_info->upload_video_location);
$file_extention = $file[count($file) - 1];
?>

<div class="col-sm-7">
    <div class="row ">
        <div class="col-sm-12 ">
            <div id="videoArea">
                <div class="col-sm-12 gray" style="padding: 0">
                    <div id="video_player">
                        <a href="http://www.adobe.com/go/getflash">
                            <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
                        </a>
                        <p>This page requires Flash Player version 10.3.0 or higher.</p>
                    </div>
                    <span id="time"></span>
                </div>                
            </div>
            <div class="col-sm-12 " style="padding: 0" >                                 
                <br>
            </div>

            <div class="col-sm-12 " style="padding: 0" >                                 
                <br>
            </div>
            <div class="col-sm-12 gray" style="padding: 10" >                                 
                <div class="media col-sm-12">
                    <div class="media-left">
                        <a href="#">
                            <img class="media-object " src="img/logo.png" alt=" " style="width: 30px">
                        </a>
                    </div>
                    <div class="media-body">
                        <h4 class="media-heading green text-justify">Suddam Hossain Rana</h4>
                        <p class="text-justify"> Give us a call, ask us your questions! Need more information?</p>
                    </div>
                    <div class="media-bottom" style="margin-left: 75px" >
                        <p class="text-justify">  
                            <a href="#">Like</a> -
                            <a href="#" onclick="ShowReplyArea()">Reply</a>-
                            <a href="#">Follow</a>-
                            <span>40 Minutes ago near Dhaka</span>
                        </p>
                    </div>
                    <script>
                        function ShowReplyArea() {
                            var reply = document.getElementById('reply');
                            reply.setAttribute('style', 'display:block');
                        }
                    </script>
                    <div class="col-sm-12 " style="padding: 10px;display: none" id="reply" >                                 
                        <span class="col-sm-2" > <img src="images/logo-50.png" class="img-responsive" style="width: 30px"></span>
                        <span class="col-sm-10 " >  <input type="text" placeholder="Write a Reply ..." name="comment" id="comment" class="form-control" autofocus></span>
                    </div> 
                    <div>
                        <hr>
                    </div>


                </div>
                <div class="col-sm-12 " style="padding: 10px" >     <br>                            
                    <span class="col-sm-2" > <img src="images/logo-50.png" class="img-responsive" ></span>

                    <span class="col-sm-10 " >  <input type="text" placeholder="Write a Comment ..." name="comment" id="comment" class="form-control"></span>
                </div>
            </div>  

            <div class="col-sm-12"><br></div> 

        </div>

    </div>

</div>

<!--RIGHT CONTENT-->
<div class="col-sm-5 ">

    <div class="row ">

        <div class="col-sm-12 gray">
            <span class="text-center" >
                <h4><?php echo $video_course_info->video_course_title; ?></h4> 
            </span>
        </div>

        <div class="col-sm-12 " id="content-1" style="height: 300px" >  
            <?php
            $i = 1;
            $security_code = '#learn';
            foreach ($all_video as $v_video) {
                $id = $v_video->upload_video_id . $security_code;
                $e_id = $this->encrypt->encode($id);
                $e_id = str_replace('/', '%F2', $e_id);
                ?>
                <div class="col-sm-12 <?php
                if ($i % 2 == 0) {
                    echo 'gray';
                } else {
                    echo 'white';
                }
                ?>" >
                    <div class="col-sm-8">
                        <div class="text-left">
                            <a href="javascript:;" style="color:
                            <?php
                            if ($video_info->upload_video_id == $v_video->upload_video_id) {
                                echo "red;";
                            }
                            ?>"
                               onclick="video_loader('<?php echo $video_course_info->url; ?>', '<?php echo $e_id; ?>')">

                                <?php echo $v_video->upload_video_name; ?>

                            </a>
                            <br>
                            By <a href="<?php echo base_url() . $video_course_info->p_url . '/profile'; ?>">   <?php echo $video_course_info->person_first_name . ' ' . $video_course_info->person_last_name; ?></a>
                        </div>
                    </div>
                    <div class="col-sm-4" style="padding: 0px;font-size: 12px" >
                        <address class="text-left" >
                            <span>Uploaded</span><span style="margin-left: 10px"><?php echo date('Y-m-d', strtotime($v_video->upload_video_date)); ?></span>
                            <span>Viewed</span><span style="margin-left: 20px"><?php echo $v_video->upload_video_view + 1; ?></span>
                        </address>
                    </div>
                </div>
                <div class="col-sm-12"></div>
                <?php
                $i++;
            }
            ?>
        </div>


        <!--Related video & Discus Message Panel-->
        <div class="col-sm-12"></br></div>
        <div class="col-sm-12" style="padding: 0;">

            <!--Related video Panel-->
            <div class="col-sm-12 text-left">
                <span class="col-sm-12" >
                    <span class="bg-primary lead col-sm-12" style="text-align: center;background-color: #8CC73F;font-size: 14px">Related Video</span>

                    <span id="related_video">
                        <?php
                        $i = 1;
                        foreach ($related_video_course as $v_video) {
                            $id = $v_video->upload_video_id . $security_code;
                            $e_id = $this->encrypt->encode($id);
                            $e_id = str_replace('/', '%F2', $e_id);
                            ?>
                            <span class="col-sm-12">
                                <span class="col-sm-6">
                                    <a target="_blank" href="<?php echo base_url() . 'view-video/' . $v_video->vm_url . '/' . $e_id; ?>">  
                                        <?php echo $v_video->upload_video_name; ?>
                                    </a>
                                </span>
                                <div class="col-sm-4" style="padding: 0px;font-size: 12px" >
                                    <address class="text-left" >
                                        <span>Uploaded</span><span style="margin-left: 10px"><?php echo date('Y-m-d', strtotime($v_video->upload_video_date)); ?></span>
                                        <span>Viewed</span><span style="margin-left: 20px"><?php echo $v_video->upload_video_view + 1; ?></span>
                                    </address>
                                </div>
                            </span>

                            <span class="col-sm-12"><br></span>

                            <?php
                            $i++;
                            if ($i > 5) {
                                break;
                            }
                        }
                        ?>
                        <?php if (count($related_video_course) > 5) { ?>
                            <span class="col-sm-12 text-right"><a href="<?php echo base_url() . 'course'; ?>">  More ..</a></span>
                        <?php } ?>
                    </span>
                </span>

            </div>

            <!-- Discus Message Panel-->

            <div class="col-sm-12 ">
                <span class="col-sm-12" >
                    <span class="bg-primary lead col-sm-12" style="text-align: left;background-color: #8CC73F;font-size: 14px;">Discus with Student / Discus with Teacher</span>
                    <script src="js/bootstrap-filestyle.js" type="text/javascript"></script>
                    <span class="col-sm-3" style="padding: 0">To:</span>
                    <span class="col-sm-9" style="padding: 0"><input type="text" class="form-control"></span>

                    <span class="col-sm-12"><br></span>
                    <span class="col-sm-3" style="padding: 0">Message:</span>
                    <span class="col-sm-9" style="padding: 0"><textarea cols="30" rows="3" class="form-control"></textarea></span>
                    <span class="col-sm-12"><br><br></span>
                    <span class="col-sm-12">
                        <span class="col-sm-3">
                            <script>
                               $(":file").filestyle({'iconName', 'glyphicon glyphicon-paperclip'});</script>
                            <input title="Upload File" type="file" class="filestyle" data-input="false" data-iconName="glyphicon glyphicon-paperclip" data-buttonText="" ><br>
                        </span>
                        <span class="col-sm-3">
                            <script>
                                        $(":file").filestyle({'iconName', 'glyphicon glyphicon-camera'});</script>
                            <input title="Upload Image" type="file" class="filestyle" data-input="false" data-iconName="glyphicon glyphicon-camera" data-buttonText="" ><br>
                        </span>
                        <span class="col-sm-3 pull-right">
                            <a href="#">   <i class="fa fa-send fa-2x" title="Send Message"></i></a>
                        </span>
                    </span>
                </span>
            </div>

        </div>
    </div>

</div>
<script>
    var vURL = "<?php echo base_url() . 'content-library/' . $course_creator_info->url . '/' . $video_info->upload_video_location; ?>";
    var subtitlePath = "<?php echo base_url() . $subtitle_path; ?>";
</script>

<script type="text/javascript">

    loaded(vURL, subtitlePath);
    function loaded(vURL, subtitlePath)
    {
//        alert(vURL);
//        alert(subtitlePath);
        var swfVersionStr = "10.3.0";
        var xiSwfUrlStr = "";
        var flashvars = {};
        var params = {};
        flashvars.videoURL = vURL;
        flashvars.xmlSubTitlePath = subtitlePath;
        flashvars.SkinPath = SkinPath;
        params.quality = "best";
        params.bgcolor = "#ffffff";
        params.play = "true";
        params.loop = "true";
        params.wmode = "window";
        params.scale = "showall";
        params.menu = "true";
        params.devicefont = "true";
        params.salign = "";
        params.allowscriptaccess = "sameDomain";
        params.allowFullScreen = "true";
        var attributes = {};
        attributes.id = "video_player";
        attributes.name = "video_player";
        attributes.align = "middle";
        swfobject.embedSWF(
                video_player, "video_player",
                "520", "350",
                swfVersionStr, xiSwfUrlStr,
                flashvars, params, attributes);
    }


    function video_loader(course_url, video_url) {
        var xhr = create_xmlhttp();
        var formdata = new FormData();
        formdata.append("course_url", course_url);
        formdata.append("video_url", video_url);

        xhr.addEventListener("load", function () {
            var path = xhr.responseText;
            path = path.split('##');
            vURL = path[0];
            subtitlePath = path[1];
            loaded(vURL, subtitlePath);
            reload_related_video(course_url, video_url);
            document.getElementById('video' + video_url).setAttribute('style', 'red');
        });

        xhr.open("POST", "<?php echo base_url(); ?>play-video/" + course_url + '/' + video_url);
        xhr.send(formdata);
    }

    function reload_related_video(course_url, video_url) {
        var rrv_xhr = create_xmlhttp();
        var formdata = new FormData();
        formdata.append("course_url", course_url);
        formdata.append("video_url", video_url);

        rrv_xhr.addEventListener("load", function () {
            document.getElementById('related_video').innerHTML = rrv_xhr.responseText;
//            path = path.split('##');
//            vURL = path[0];
//            subtitlePath = path[1];
//            loaded(vURL, subtitlePath);
//            reload_related_video(course_url, video_url);
        });

        rrv_xhr.open("POST", "<?php echo base_url(); ?>reload-related-video");
        rrv_xhr.send(formdata);
    }

    function create_xmlhttp() {
        var xmlhttp = false;
        try {
            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (E) {
                xmlhttp = false;
            }
        }
        if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
            xmlhttp = new XMLHttpRequest();
        }
        return xmlhttp;
    }
</script>

