<link rel="stylesheet" type="text/css" href="<?php echo GLOBAL_ADMIN_CSS_PATH; ?>bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="<?php echo GLOBAL_ADMIN_CSS_PATH; ?>bootstrap-ie6.min.css" />
<link rel="stylesheet" type="text/css" href="<?php echo GLOBAL_ADMIN_CSS_PATH; ?>bootstrap-image-gallery.min.css" />
<link rel="stylesheet" type="text/css" href="<?php echo GLOBAL_ADMIN_CSS_PATH; ?>bootstrap-responsive.min.css" />

<link type="text/css" href="<?php echo SITE_PATH; ?>powerpanel/html/css/photogallery.css" rel="stylesheet" />
<script type="text/javascript" src="<?php echo SITE_PATH; ?>powerpanel/html/js/jquery.dragsort-0.5.1.min.js"></script>
<script type="text/javascript" src="<?php echo GLOBAL_ADMIN_JS_PATH; ?>highslide/highslide-with-gallery.js"></script>
<link rel="stylesheet" type="text/css" href="<?php echo GLOBAL_ADMIN_JS_PATH; ?>highslide/highslide.css" />
<script type="text/javascript" language="javascript">
    
    function uploadphoto()
    {   
        if(document.getElementById('varphotoname').value == '')
        {
            alert('Please upload the photo.');
            document.getElementById('varphotoname').focus();
            return false;
        }
        else if(document.getElementById('varphotoname').value != '' && !LimitAttach_Image(document.getElementById('varphotoname').value))
        {
            alert('Please upload only *.jpg, *.jpeg, *.png, *.bmp, *.gif');
            document.getElementById('varphotoname').focus();
            return false;
        }
        else
        {
            document.getElementById('QT').value = 10;
            document.frmPhoto.submit();
        }
        return true;
    }

    function funuseoriginal(value)  // To display a Original And Corp Button
    {
        if(value=='Use Original')
        {
            document.getElementById('id_useoriginal').style.display='';
            document.getElementById('testWrap').style.display='none';
            document.getElementById('td_Crop').style.display='none';
            document.getElementById('useoriginal').value ='Crop Mode';
            document.getElementById('cropandexit').style.display='none';
        }
        else if(value=='Crop Mode')
        {
            document.getElementById('id_useoriginal').style.display='none';
            document.getElementById('testWrap').style.display='';
            document.getElementById('td_Crop').style.display='';
            document.getElementById('useoriginal').value ='Use Original';
            document.getElementById('cropandexit').style.display='';
        }
    }

    var extArray = new Array(".jpg", ".png", ".bmp",".gif");
    function LimitAttach_Image(file)
    {
        allowSubmit = false;
        if (!file) return;
        while (file.indexOf("\\") != -1)
            file = file.slice(file.indexOf("\\") + 1);
        ext = file.slice(file.indexOf(".")).toLowerCase();
        for (var i = 0; i < extArray.length; i++) {
            if (extArray[i] == ext) { allowSubmit = true; break; }
        }
        if (allowSubmit) return true;
        else
            return false;
    }

    function chkvalid()
    {
        if(document.getElementById('varphotoname').value == '' && document.getElementById('hidvarphotoname').value == '' && document.getElementById('oldphotoimage').value== '')
        {
            alert('Please upload the photo.');
            document.getElementById('varphotoname').focus();
            return false;
        }
        if(document.getElementById('hidvarphotoname').value == '' && document.getElementById('oldphotoimage').value== '')
        {
            alert('Please upload the photo.');
            document.getElementById('upload').focus();
            return false;
        }
        else if(document.getElementById('varphotoname').value != '' && !LimitAttach_Image(document.getElementById('varphotoname').value))
        {
            alert('Please upload only *.jpg, *.jpeg, *.png, *.bmp, *.gif');
            document.getElementById('varphotoname').focus();
            return false;
        }
        else if(trim(document.getElementById('intdisplayorder').value) == '')
        {
            alert('Please enter the Display order.');
            document.getElementById('intdisplayorder').focus();
            return false;
        }
        else if(trim(document.getElementById('intdisplayorder').value) == 0)
        {
            alert('Please enter proper display order.');
            document.getElementById('intdisplayorder').value='';
            document.getElementById('intdisplayorder').focus();
            return false;
        }
        else
        {
            return true;
        }
    }
</script>
<style type="text/css" >
    #swfupload-control p{ margin:10px 5px; font-size:12px; }
    #log { list-style:none; margin:0; padding:0;}
    #log li {
        float: left;
        height: 255px;
        padding: 10px;
        width: 241px;
        font:12px Arial, Helvetica, sans-serif;
        line-height:18px;
        color:#999;
    }
    #log li .progressbar{ border:1px solid #E6E6E6; height:5px; background:#fff; }
    #log li .progress{ background:#CFDBEC; width:0%; height:5px; }
    #log li p{ margin:0; line-height:18px; }

    #log li span.cancel{ position:absolute; top:5px; right:5px; width:20px; height:20px;
                         background:url(swfupload/cancel.png) no-repeat; cursor:pointer; }

    .form_titles {
        color: #464646;
        font-size: 12px;
        font-weight: bold;
        margin-top: 5px;
        padding-left: 5px;
        padding-right: 5px;
    }
</style>
<script type="text/javascript">

    hs.graphicsDir = '<?php echo GLOBAL_ADMIN_JS_PATH; ?>highslide/graphics/';
    hs.align = 'center';
    hs.transitions = ['expand', 'crossfade'];
    hs.wrapperClassName = 'dark borderless floating-caption';
    hs.fadeInOut = true;
    hs.dimmingOpacity = .75;

    // Add the controlbar
    if (hs.addSlideshow) hs.addSlideshow({
        slideshowGroup: 'group1',
        interval: 5000,
        repeat: false,
        useControls: true,
        fixedControls: 'fit',
        overlayOptions: {
            opacity: .6,
            position: 'bottom center',
            hideOnMouseOut: true
        }
    });
</script>
<script type="text/javascript">

    $(document).ready(function(){
        
        var fk_product=document.getElementById('fk_product').value;
        
        $("#ajaxproductphotogallery").dragsort({ 
            dragSelector: "div", 
            dragBetween: true, 
            dragEnd: saveOrder, 
            placeHolderTemplate: "<li class='placeHolder'><div class='backdrag'><table><tr><td align='center' valign='middle' width='241' height='255'>Drag Photo</td></tr></table></div></li>" 
        });
        
        get_rec_photo(fk_product);
        
    });
    function setalbumcoverphoto(photoID,fk_product)
            {

                var url = "index.php?module=productphotogallery&action=set_primary&photoID="+photoID+"&albumID="+fk_product;    
                
                $.ajax({

                    type: "GET",
                    url: encodeURI(url),
                    async: true,
                    start : ProcessLoader(),
                    success: function(data){
                        if(data){
                             get_rec_photo(fk_product);
                        }

                        document.getElementById('dvprocessing').style.display = 'none';
                    }
                });
        
                return false;
            }
    function saveOrder() {
        var rec_ID = document.getElementById('photoAlbumID').value;
        var dataid = $("#ajaxproductphotogallery li").map(function() { return $(this).attr('id'); }).get();                    
        set_photo_displayorder(rec_ID,dataid);  
    }
    
    function set_photo_displayorder(fk_product,photointglcode)
    {
        var url = "index.php?module=productphotogallery&action=set_photo_displayorder&fk_product="+fk_product+"&photointglcode="+photointglcode;
       
        $.ajax({
            type: "GET",
            url: encodeURI(url),
            async: true,
            start : ProcessLoader(),
            success: function(data){
              
                get_rec_photo(fk_product);
                document.getElementById('dvprocessing').style.display = 'none';
            }
        });      
    }
   
   
    
    function get_rec_photo(fk_product)
    {
        if(fk_product == ""){
                    $('#photo_div').css('visibility','hidden');
                    return false;
                }
                else{
                    $('#photo_div').css('visibility','visible');
                }
        
    

        var url = "index.php?module=productphotogallery&action=photo_grid&fk_product="+fk_product+"&rand=<?php echo rand(); ?>";
       
        $.ajax({
            type: "GET",
            url: url,
            async: true,
            start : ProcessLoader(),
            success: function(data){
                if(trim(data) == 'invalid'){
                    document.getElementById('ajaxproductphotogallery').innerHTML = '';
                    window.location.href = "index.php?module=productphotogallery&fk_product="+fk_product;
                }
                else{
                   
                    document.getElementById('ajaxproductphotogallery').innerHTML = trim(data);
                    document.getElementById('fk_product').value = fk_product;
                    
                }    
                document.getElementById('dvprocessing').style.display = 'none';
            }
        });
        if ( history.pushState ) 
            window.history.pushState( {}, document.title, "index.php?module=productphotogallery&fk_product="+fk_product);
    }
    
    function deletealbumphoto(photoID,fk_product,delete1)
    {
        var fk_product=document.getElementById('fk_product').value;
        if(confirm("Are you sure you want to delete this photo?")){
            var url = "index.php?module=productphotogallery&action=delphoto&photoID="+photoID+"&fk_product="+fk_product+"&delete="+delete1;  
            $.ajax({
                type: "GET",
                url: encodeURI(url),
                async: true,
                start : ProcessLoader(),
                success: function(data){
                    get_rec_photo(fk_product);
                    document.getElementById('dvprocessing').style.display = 'none';
                    alert("Photo deleted successfully."); 
                }
            });
        } else {
            return true;
        }
        return false;
    }

    function setpublish_unpublish(photoID,fk_product,publish)
    {
        var url = "<?php echo SITE_PATH; ?>powerpanel/index.php?module=productphotogallery&action=set_publish&fk_product="+fk_product+"&photoID="+photoID+"&publish="+publish;    
        $.ajax({
            type: "GET",
            url: encodeURI(url),
            async: true,
            start : ProcessLoader(),
            success: function(data){
                get_rec_photo(fk_product);
                document.getElementById('dvprocessing').style.display = 'none';
            }
        });
    }

    function savealbumcaption(photoID,fk_product)
    {
        var fk_product=document.getElementById('fk_product').value;
        if(confirm("Are you sure you want to change the photo title?")) {
            var photocaption = trim(document.getElementById('varphotocaption_'+photoID).value);
            
            var url = "index.php?module=productphotogallery&action=savealbumcaption&photoID="+photoID+"&fk_product="+fk_product+"&photocaption="+photocaption;    
           
            $.ajax({
                type: "GET",
                url: encodeURI(url),
                async: true,
                start : ProcessLoader(),
                success: function(data){
                    get_rec_photo(fk_product);
                    document.getElementById('dvprocessing').style.display = 'none';
                    if(data){
                        alert("Photo Title save successfully.");
                    }
                }
            });
        } else {
            return true;
        }
        return false;
    }
    
    function change_album(fk_product){
       
        if(fk_product == ""){
            return false;
        }

        window.location = "http://nserver/eclipze.ky/powerpanel/index.php?gallery_id="+fk_product;
    }
    
jQuery('#var_image').live('change', function() {
    $('#fileupload').submit();
});
</script>
<div class="breadcrumbs">
    <a href="index.php">Home</a>&nbsp;>&nbsp;
    <?php if ($_REQUEST['fk_product'] != '') { ?>
        <a href="index.php?module=product"> Manage Products</a> &nbsp;>&nbsp;&nbsp;
        <span class="current"> Manage Photo Gallery</span> &nbsp;&nbsp;&nbsp;
    <?php } ?>
    <!--Add Photos</span>  </div>-->
<?php if ($_REQUEST['fk_product'] != '') { ?>
    <span style="float:right; margin-right:15px;*margin-top:-15px; "><a href="index.php?module=product"><img src="<?= GLOBAL_ADMIN_IMAGES_PATH ?>back-button-blue.gif"></a></span>

    <table>
        <tr><td width="25%">Select Product :</td> <td> <?php echo $productphotogalleryObj->get_albumcmb($_REQUEST['fk_product']); ?></td>
    </table>
<?php } ?>
    <div id="photo_div">
<h3 class="add_detail">Photos & Details</h3>

<html lang="en">
        <link rel="stylesheet" href="http://blueimp.github.io/cdn/css/bootstrap.min.css">
        <!-- Generic page styles -->
        <!--<link rel="stylesheet" href="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/css/photostyle.css">-->
        <!-- Bootstrap styles for responsive website layout, supporting different screen sizes -->
        <link rel="stylesheet" href="http://blueimp.github.io/cdn/css/bootstrap-responsive.min.css">
        <!-- Bootstrap CSS fixes for IE6 -->
        <!--[if lt IE 7]><link rel="stylesheet" href="http://blueimp.github.io/cdn/css/bootstrap-ie6.min.css"><![endif]-->
        <!-- Bootstrap Image Gallery styles -->
        <link rel="stylesheet" href="http://blueimp.github.io/Bootstrap-Image-Gallery/css/bootstrap-image-gallery.min.css">
        <!-- CSS to style the file input field as button and adjust the Bootstrap progress bars -->
        <link rel="stylesheet" href="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/css/jquery.fileupload-ui.css">
        <!-- CSS adjustments for browsers with JavaScript disabled -->
        <noscript><link rel="stylesheet" href="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/css/jquery.fileupload-ui-noscript.css"></noscript>
        
            <form id="fileupload" action="<?php echo $frmaction ?>" method="POST" enctype="multipart/form-data">
                <noscript><input type="hidden" name="redirect" value="http://blueimp.github.io/jQuery-File-Upload/"></noscript>
                <input type="hidden" name="fk_product" id="fk_product" value="<?php echo $_REQUEST['fk_product']; ?>" />
                <div class="row fileupload-buttonbar">
                    <div class="span7">
                        <!-- The fileinput-button span is used to style the file input field as button -->
                        <span class="btn btn-success fileinput-button">
                            <i class="icon-plus icon-white"></i>
                            <span>Add Images...</span>
                            <input type="file" name="var_image[]" id="var_image" multiple="multiple">
                        </span>
                        <span class="fileupload-loading"></span> <br/>
                        The maximum file size for uploads is 5 MB. Only image files (JPG, GIF, PNG) are allowed.
                    </div>
                    <!-- The global progress information -->
                    <div class="span5 fileupload-progress fade">
                        <!-- The global progress bar -->
                        <div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100">
                            <div class="bar" style="width:0%;"></div>
                        </div>
                        <!-- The extended global progress information -->
                        <div class="progress-extended">&nbsp;</div>
                    </div>
                </div>
                <!-- The table listing the files available for upload/download -->
                <table role="presentation" class="table table-striped"><tbody class="files" data-toggle="modal-gallery" data-target="#modal-gallery"></tbody></table>
            </form>
            <br>
        
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="additional_detail_content" style="padding: 1px;">
    <tr>
        <td width="100%">
            <div>
                <ul id="ajaxproductphotogallery" class="photo-drag"></ul>

                <input type="hidden" name="photoAlbumID" id="photoAlbumID" value="<?php echo $_REQUEST['fk_product']; ?>" /> 
            </div>
        </td>
    </tr>
</table>
    <!--<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>-->
    <script src="js/vendor/jquery.ui.widget.js"></script>
    <script src="http://blueimp.github.io/JavaScript-Templates/tmpl.min.js"></script>
    <script src="http://blueimp.github.io/JavaScript-Load-Image/load-image.min.js"></script>
    <script src="http://blueimp.github.io/JavaScript-Canvas-to-Blob/canvas-to-blob.min.js"></script>
    <script src="http://blueimp.github.io/cdn/js/bootstrap.min.js"></script>
    <script src="http://blueimp.github.io/Bootstrap-Image-Gallery/js/bootstrap-image-gallery.min.js"></script>
        <script src="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/js/jquery.iframe-transport.js"></script>
        <script src="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/js/jquery.fileupload.js"></script>
        <script src="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/js/jquery.fileupload-process.js"></script>
        <script src="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/js/jquery.fileupload-image.js"></script>
<!--        <script src="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/js/jquery.fileupload-audio.js"></script>
        <script src="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/js/jquery.fileupload-video.js"></script>-->
        <script src="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/js/jquery.fileupload-validate.js"></script>
        <script src="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/js/jquery.fileupload-ui.js"></script>
        <script src="<?php echo GLOBAL_ADMIN_JS_PATH; ?>upload/js/main.js"></script>
        <!--[if gte IE 8]><script src="js/cors/jquery.xdr-transport.js"></script><![endif]-->

</html>