<?php 
require_once 'library/top_application.php';
require_once 'library/logged.php';


//權限 
$sql_right = mysql_query('SELECT `manage_product` FROM `'.TBL_USER.'` WHERE `uid` = '.$_SESSION['Logged_Uid']);
$row_right = mysql_fetch_assoc($sql_right);

if($row_right['manage_product'] != 1){
	header("Location: listUser.php");
}

if (isset($_GET['id'])) {
  $id=$_GET['id'];
}
$album_name=$_GET['album_name'];

$sql_size = mysql_query('SELECT `photo_w`, `photo_h` FROM `general_setting` WHERE `id` = 1');
$row_size = mysql_fetch_assoc($sql_size);
if(!$row_size['photo_w']){
	$pic_w = DEFAULT_PHOTO_W;
} else {
	$pic_w = $row_size['photo_w'];
}
if(!$row_size['photo_h']){
	$pic_h = DEFAULT_PHOTO_H;
} else {
	$pic_h = $row_size['photo_h'];
}


$sql_photo = mysql_query("SELECT * FROM `photo` WHERE `p_product_id` = ".$id." ORDER by `rank` ASC, `photo_id` ASC");
$row_photo = mysql_fetch_assoc($sql_photo);	
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Artech Creative</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href='css/photo.css' rel='stylesheet' type='text/css' media='all' />
<link href="css/css_admin.css" rel="stylesheet" type="text/css">
<link href="../css/tiny.css" rel="stylesheet" type="text/css">

<script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="../js/jquery-ui-min.js"></script>
<script type="text/javascript" src="../js/tinybox_product.js"></script>

<script type="text/javascript">
$(window).load(function(){
	$('img').each(function(){
		var img_h = $(this).height();
		var img_w = $(this).width();
		var h_fix = (150-img_h)/2;
		var w_fix = (150-img_w)/2;
		
		if (img_w > img_h){
			$(this).css('margin-top',  h_fix+'px');
		} else if (img_h > img_w){
			$(this).css('margin-left', w_fix +'px');
		}
	})
});
$(document).ready(function(){
	$('.check_all input[type=checkbox]').click(function(){
		var check_status = $(this).is(':checked');
		if(check_status == true){
			$('input[type=checkbox]').attr('checked', true);
		} else {
			$('input[type=checkbox]').attr('checked', false);
		}
	});
	
	$('.btn_delete_all').click(function(){
		updateDelete();
		var delete_id = $('#delete_val').val();
		var count = $(".checkbox:checked").length;
		
		if(!delete_id){
			alert('請選擇要刪除的相片');
		} else {		
			if (confirm("要刪除選擇的 "+count+" 張相片?")){
				$.ajax({
					type: "POST",
					url: "ajax/delete_multi_photo.php",
					data: {"delete_items" : delete_id},
					cache: false,
					success: function(html){
						$("#info").html(html);
					}
				});
			}
		}
	});
	
	$('#btn_desc_ok').click(function(){
		var send_val = $('.input_desc').val();
		var this_id = $('.input_desc').attr('id');
		if (!send_val){
			$('#desc_error').css('display', 'block');
			$(".input_desc").focus();
		} else {
			$('#desc_error').css('display', 'none');
			$.ajax({
				type: "POST",
				url: "ajax/update_photo.php",
				data: {"photo_id" : this_id, "value" : send_val},
				cache: false,
				success: function(html){
					$('#field_desc').html(html);
					setTimeout(function(){
						$('#desc_edit').fadeOut(300)
					},1000)
				}
			});
			
		}
	})
	
	
	$('#photo-list li').each(function(){
		var this_id_name = 'photo_id';
		var this_table = 'photo';
		
		var this_photo_show = $('.photo_showing', this)
		var this_photo_not_show = $('.photo_not_showing', this)
		this_photo_show.click(function(){
			var this_field = $(this).attr('rel');
			var this_id = parseInt($(this).attr('rev'));
			$.ajax({
				type: "POST",
				url: "ajax/update_yesno.php",
				data: {"id_name" : this_id_name, "id" : this_id, "update_field" :this_field, "show" : 2, "table": this_table},
				cache: false,
				success: function(html){
					this_photo_show.hide();
					this_photo_not_show.show();
				}
			});
		})
		
		this_photo_not_show.click(function(){
			var this_field = $(this).attr('rel');
			var this_id = parseInt($(this).attr('rev'));
			$.ajax({
				type: "POST",
				url: "ajax/update_yesno.php",
				data: {"id_name" : this_id_name, "id" : this_id, "update_field" :this_field, "show" : 1, "table": this_table},
				cache: false,
				success: function(html){
					this_photo_not_show.hide();
					this_photo_show.show();
				}
			});
		})
	})
	
	var table_name = 'photo';
	var rank_name = 'rank';
	var id_name = 'photo_id';
	
	$("#photo-list").sortable({
      handle : '.handle',
      update : function () {
		  var order = $('#photo-list').sortable('serialize');
  		$("#info").load('ajax/update_rank.php?'+order+'&sortList='+table_name+'&rank_name='+rank_name+'&id_name='+id_name);
      }
    });
	var _preventDefault = function(evt) { evt.preventDefault(); };
	$(".handle").bind("dragstart", _preventDefault).bind("selectstart", _preventDefault);
	
})
function updateDelete() {         
	var allVals = [];
	$('.checkbox:checked').each(function() {
		allVals.push($(this).val());
	});
	$('#delete_val').val(allVals)
}


function edit_desc(id){
	$('#desc_edit').fadeIn(500);
	$.ajax({
		type: "POST",
		url: "ajax/update_photo.php",
		data: {"photo_id" : id},
		cache: false,
		success: function(html){
			$('#field_desc').html(html);
		}
	});
}

</script>
</head>
<body  style="background:#fff">
<div id="desc_edit">
  <table width="230" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr>
      <td height="8"></td>
    </tr>
    <tr>
      <td id="field_desc"></td>
    </tr>
    <tr>
      <td><a class="btn_small_ok" id="btn_desc_ok" title="修改完成" style="float:right"></a><span id="desc_error" class="er_msg">Description 無效</span></td>
    </tr>
  </table>
</div>

<table width="100%" border="0" cellpadding="0" cellspacing="0" style="padding:20px;" >
  <tr>
    <td><h2><?=$album_name?></h2></td>
  </tr>
  <tr>
    <td><hr></td>
  </tr>
  <tr>
    <td><table width="100%" border="0" cellpadding="4" cellspacing="0" >
      <tr>
        <td>
            <table width="100%" border="0" cellpadding="0" cellspacing="0" class="content">
              <tr>
              <td ><div id="info">(Drag to re-arrange the order. Click to edit the description of the photos.)</div>
             <div class="check_all"><input type="checkbox" value=""> 選擇所有</div> <a href="#" class="btn_delete_all" title="刪除選擇">刪除選擇</a>
             <div class="clearfix"></div>
            <hr>
            <ul id="photo-list">
            <?php
			    if (!$row_photo){
					echo '<span class="submenu" style="color:red">There is no other photos in this Product, please upload.</span>';
				} else {
					$i =1;
					do {
						if ($row_photo["show"] == 1){
							$show_style = 'block';
							$show_style2 = 'none';
						} else {
							$show_style = 'none';
							$show_style2 = 'block';
						}
						echo '<li id="listItem_'.$row_photo["photo_id"].'">
							<input name="deleteProduct" type="checkbox" value="'.$row_photo["photo_id"].'" class="checkbox">
							<a onclick="javascript:edit_desc('.$row_photo["photo_id"].');"><img src="../upload/photos/'.$row_photo["image"].'" class="handle"></a>
							<a class="photo_showing" title="顯示中, 按下隱藏" rel="show" rev="'.$row_photo["photo_id"].'" style="display: '.$show_style.'"></a>
							
							<a class="photo_not_showing" title="隱藏中, 按下顯示" rel="show" rev="'.$row_photo["photo_id"].'" style="display: '.$show_style2.'"></a>
						</li>';
						$i++;
					} while ($row_photo = mysql_fetch_assoc($sql_photo));
				}
                ?>	
            </ul>
            <div class="clearfix"></div>
            <hr>
            <div class="check_all"><input type="checkbox" value=""> 選擇所有</div> <a href="#" class="btn_delete_all" title="刪除選擇">刪除選擇</a> 
            <input type="hidden" id="delete_val" value=""></td>
            </tr>
          </table>
        </td>
      </tr>
      <tr>
        <td><iframe id="upload_iframe" src="upload/upload_multi_photos.php?product_id=<?php echo $id?>&pic_w=<?php echo $pic_w;?>&pic_h=<?php echo $pic_h;?>" frameborder="0" height="300" width="100%" scrolling="yes" style="display:block"></iframe></td>
      </tr>
    </table></td>
  </tr>
</table>
<?php include 'library/bottom.php'; ?>
</body>
</html>
