<?php
session_start();
/*
try {
    if (isset($_COOKIE["session"])) { 
        //echo 'Cookie is active!';
        $lifetime=60*60;
        setcookie("session", "1", time() + $lifetime, "/");
    } else{ 
        //echo 'Cookie is NOT active!';
        header("Location: /login.php"); 
    }
    $auth = $_SESSION["auth"];
    if (!$auth){
        header("Location: /login.php"); 
    }
} catch(Exception $e){
    header("Location: /login.php"); 
}
*/
?>

<div class="container-fluid">

	<div class="row">
		<div class="col-lg-12 col-md-12">
			<div class="card card-plain">

				<div class="content">
					<form id="formid">

						<div class="row">
							<div class="header">
								<h5 class="title">Entri Maklumat Produk</h5><br/>
							</div>   

							<div class="row" style="padding-left:20px;padding-right:20px;">
								<div class="col-md-4" style="padding:10px;">
									<label>No. SKU *</label>
									<input id="sku" name="sku" type="text" class="form-control border-input" placeholder="No. SKU" value="" >
								</div>
								<div class="col-md-4" style="padding:10px;">
									<label>ID Produk *</label>
									<input id="produk" name="produk" type="text" class="form-control border-input" placeholder="ID Produk" value="" >
								</div>
								<div class="col-md-4" style="padding:10px;">
									<label>Tahun Keluaran *</label>
									<input id="tahun" name="tahun" type="number" class="form-control border-input" placeholder="Tahun Keluaran" value="" maxlength="4">
								</div>                                                                                
							</div>    						
							
							<div class="row" style="padding-left:20px;padding-right:20px;">
								<div class="col-md-4" style="padding:10px;">
									<label>Nama Jenama *</label>
									<input id="jenama" name="jenama" type="text" class="form-control border-input" placeholder="Nama Jenama" value="" >
								</div>
								<div class="col-md-4" style="padding:10px;">
									<label>Model Produk *</label>
									<input id="model" name="model" type="text" class="form-control border-input" placeholder="Model Produk" value="" >
								</div>
								<div class="col-md-4" style="padding:10px;">
									<label>URL Produk</label>
									<input id="url" name="url" type="text" class="form-control border-input" placeholder="URL Produk" value="" >
								</div>                                                                                
							</div>    
							
							<div class="row" style="padding-left:20px;padding-right:20px;">
								<div class="col-md-4" style="padding:10px;">
									<label>Kategori Produk *</label>
									<select id="kategori" name="kategori" class="form-control border-input">
										<option value="LED">LED</option>
										<option value="TOYS" selected>TOYS</option>
									</select>
								</div>   
								<div class="col-md-4" style="padding:10px;">
									<label>Tempoh Waranti</label>
									<input id="waranti" name="waranti" type="text" class="form-control border-input" placeholder="Tempoh Waranti" value="" >
								</div>  
								<div class="col-md-4" style="padding:10px;">
									<label>Insuran</label>
									<input id="insuran" name="insuran" type="text" class="form-control border-input" placeholder="Insuran" value="" >
								</div> 																
							</div> 

							<hr/>							                                                                         
						</div>

						<div class="row">
							<div class="header">
								<h5 class="title">Entri Spesifikasi Produk</h5><br/>
							</div>

							<div class="row" style="padding-left:20px;padding-right:20px;">							
								<div class="col-md-4" style="padding:10px;">
									<div class="col-md-8"  style="padding:1px;">
										<label>Berat Produk</label>
										<input id="berat" name="berat" type="text" class="form-control border-input" placeholder="Berat Produk" value="" disabled>
									</div>                                            
									<div class="col-md-4"  style="padding:1px;">
										<label>Unit</label>
										<select id="berat_unit" name="berat_unit" class="form-control border-input">
											<option value="-" selected>-tiada-</option>
											<option value="gram" >gram</option>
											<option value="kilogram" >kilogram</option>
											<option value="liter" >liter</option>
											<option value="tan" >tan</option>
										</select>                                             
									</div>								
								</div>
								<div class="col-md-4" style="padding:10px;">
									<label>Had Lingkungan Umur</label>
									<select id="umur" name="umur" class="form-control border-input">
										<option value="-" selected>-tiada-</option>
										<option value="01" >5 - 7 tahun</option>
									</select>                                         
								</div>                                                                             
							</div>

							<div class="row" style="padding-left:20px;padding-right:20px;">
								<div class="col-md-4" style="padding:10px;">
									<div class="col-md-8" style="padding:1px;">
										<label>Saiz Produk (L x W x H)</label>
										<input id="saiz" name="saiz" type="text" class="form-control border-input" placeholder="Saiz Produk" value="" disabled>
									</div>                                            
									<div class="col-md-4" style="padding:1px;">
										<label>Unit</label>
										<select id="saiz_unit" name="saiz_unit" class="form-control border-input">
											<option value="-" selected>-tiada-</option>
											<option value="cm" >cm</option>
											<option value="meter" >meter</option>
										</select>                                             
									</div>
								</div>
								<div class="col-md-4" style="padding:10px;">
									<label>Bahan Buatan</label>
									<select id="bahan" name="bahan" class="form-control border-input">
										<option value="-" selected>-tiada-</option>
										<option value="01" >Plastik</option>
										<option value="02" >Kaca</option>
										<option value="03" >Kayu</option>
										<option value="04" >Besi</option>
										<option value="99" >Lain-lain</option>
									</select> 
								</div>   								
							</div>      

							<div class="row" style="padding-left:20px;padding-right:20px;">
								<div class="col-md-4" style="padding:10px;">
									<div class="col-md-8" style="padding:1px;">
										<label>Input Kuasa / Tenaga</label>
										<input id="input" name="input" type="text" class="form-control border-input" placeholder="Input Kuasa Tenaga" value="" disabled>
									</div>                                            
									<div class="col-md-4" style="padding:1px;">
										<label>Jenis</label>
										<select id="input_jenis" name="input_jenis" class="form-control border-input">
											<option value="-" selected>-tiada-</option>
											<option value="Bateri" >Bateri</option>
											<option value="Solar" >Solar</option>
											<option value="Punca Elektrik">Punca Elektrik</option>
											<option value="Lain-lain">Lain-lain</option>
										</select>                                            
									</div>
								</div>
							</div>     

							<hr/>
						</div>
							

						




						<div class="row hidden">
							<div class="header">
								<h5 class="title">Entri Gambar Produk</h5><br/>
							</div>
							<div class="row" style="padding-left:20px;padding-right:20px;">
								<div class="col-md-12">
									<div class="col-md-3">
										<img src="/assets/img/blank-image.png" alt="img1" height="200px" style="border:1px dashed #C0C0C0;">
									</div>
									<div class="col-md-3">
										<img src="/assets/img/blank-image.png" alt="img2" height="200px" style="border:1px dashed #C0C0C0;">
									</div>   							
									<div class="col-md-3">
										<img src="/assets/img/blank-image.png" alt="img3" height="200px" style="border:1px dashed #C0C0C0;">
									</div>
									<div class="col-md-3">
										<img src="/assets/img/blank-image.png" alt="img4" height="200px" style="border:1px dashed #C0C0C0;">
									</div>                                                
								</div>
							</div>	
							<div class="row">
								<div class="col-md-4">
									<div class="form-group">
										<input id="fileinput1" type="file" accept="image/gif, image/jpeg, image/png" />
									</div>
								</div>                              
							</div> 							
							<hr/>							
						</div>						
						






						
						<div class="row hidden">
							<div class="header">
								<h5 class="title">Entri Pensijilan Produk</h5><br/>
							</div>
							<div class="row ">
								<div class="col-md-12">
									<div class="col-md-8">
										<div class="col-md-4"  style="padding:1px;">
											<label>No. Sijil</label>
											<input id="nosijil" name="nosjil" type="text" class="form-control border-input" placeholder="Berat Produk" value="" >
										</div>                                            
										<div class="col-md-4"  style="padding:1px;">
											<label>Pensijilan</label>
											<select id="jenis_sijil" name="jenis_sijil" class="form-control border-input">
												<option value="000" >-tiada-</option>
												<option value="001" selected>gram</option>
												<option value="002" >kilogram</option>
												<option value="003" >liter</option>
												<option value="004" >tan</option>
											</select>                                             
										</div>									
										<div class="col-md-4"  style="padding:1px;">
											<label>Logo Sijil</label>
											<input id="logo" name="logo" type="text" class="form-control border-input" placeholder="Berat Produk" value="" >
										</div> 
									</div>
									<div class="col-md-4">
									</div>								
								</div>
							</div>					

							<hr/>							
						</div>	
						

						
						<div class="row hidden">
							<div class="header">
								<h5 class="title">Entri Dokumentasi Produk</h5><br/>
							</div>
							<div class="row ">
								<div class="col-md-12">
									<div class="col-md-8">
										<div class="col-md-4"  style="padding:1px;">
											<label>Dokumen COC</label>
											<input id="dokumen" name="dokumen" type="text" class="form-control border-input" placeholder="Berat Produk" value="" >
										</div>                                            
										<div class="col-md-4"  style="padding:1px;">
											<label>Pensijilan</label>
											<select id="jenis_dokumen" name="jenis_dokumen" class="form-control border-input">
												<option value="-" >-tiada-</option>
												<option value="001" selected>gram</option>
												<option value="002" >kilogram</option>
												<option value="003" >liter</option>
												<option value="004" >tan</option>
											</select>                                             
										</div>									
										<div class="col-md-4"  style="padding:1px;">
											<label>Logo Sijil</label>
											<input id="sijil" name="sijil" type="text" class="form-control border-input" placeholder="Berat Produk" value="" >
										</div> 
									</div>
									<div class="col-md-4">
									</div>								
								</div>
							</div>	
							<div class="row ">
								<div class="col-md-4">
									<div class="form-group">
										<input id="fileinput2" type="file" accept="image/gif, image/jpeg, image/png" />
									</div>
								</div>                                
							</div> 						
							
							<hr/>  							
						</div>	
						
  
						
						<div class="row hidden">
							<div class="col-md-4">
								<div class="form-group">
									<label>&nbsp;</label>
									<textarea id="base1" name="base1" class="hidden"></textarea>      
									<img id="viewphoto1" src="" alt="" height="200px">                                 
								</div>
							</div>
							<div class="col-md-4">
								<div class="form-group">
									<label>&nbsp;</label>
									<textarea id="base2" name="base2" class="hidden"></textarea>      
									<img id="viewphoto2" src="" alt="" height="200px">                                 
								</div>
							</div>                                
						</div>                                
					   
						<div class="text-center" style="padding:20px;">							
							<button id="simpan" type="button" class="btn btn-info btn-fill btn-wd">Simpan Tambah</button>
							<button id="reset" type="button" class="btn btn-warning btn-fill btn-wd">Reset</button>
						</div>
						
						<div class="clearfix"></div>
					</form>
				</div> 
				
			</div>
		</div>
	</div>

</div>


    <!--   Core JS Files   -->
    <script src="/assets/js/jquery-1.10.2.js" type="text/javascript"></script>
	<script src="/assets/js/bootstrap.min.js" type="text/javascript"></script>

	<!--  Checkbox, Radio & Switch Plugins -->
	<script src="/assets/js/bootstrap-checkbox-radio.js"></script>

    <!--  Notifications Plugin    -->
    <script src="/assets/js/bootstrap-notify.js"></script>

    <!-- Paper Dashboard Core javascript and methods for Demo purpose -->
	<script src="/assets/js/paper-dashboard.js"></script>

	<script src="/assets/js/app.js"></script>


<script type="text/javascript">
    $(document).ready(function(){

		$.ajaxSetup({
			cache: false
		});			

		var url = "";
		url = getBase();

		
		$('#berat_unit').on('change', function (e) {
			//var optionSelected = $("option:selected", this);
			//console.log('selected:', this.value);
			if (this.value && this.value !== '-'){
				$("#berat").removeAttr('disabled');
				$("#berat").focus();
			}
			else {
				$("#berat").val('').change();
				$("#berat").attr('disabled','disabled');
			}
		});
		$('#saiz_unit').on('change', function (e) {
			if (this.value && this.value !== '-'){
				$("#saiz").removeAttr('disabled');
				$("#saiz").focus();
			}
			else {
				$("#saiz").val('').change();
				$("#saiz").attr('disabled','disabled');
			}
		});		
		$('#input_jenis').on('change', function (e) {
			if (this.value && this.value !== '-'){
				$("#input").removeAttr('disabled');
				$("#input").focus();
			}
			else {
				$("#input").val('').change();
				$("#input").attr('disabled','disabled');
			}
		});		


		$('#reset').on('click', function (e) {
			$('#sku').val('').change();
			$('#produk').val('').change();
			$('#tahun').val('').change();

			$('#jenama').val('').change();
			$('#model').val('').change();
			$('#url').val('').change();

			$('#berat').val('').change();
			$('#berat_unit').val('-').change();
			$('#saiz').val('').change();
			$('#saiz_unit').val('-').change();
			$('#input').val('').change();
			$('#input_jenis').val('-').change();
			$('#umur').val('-').change();

			$('#waranti').val('').change();
			$('#insuran').val('').change();

			$('#sku').focus();
		});			

		$('#simpan').on('click', function (e) {

			if (!formValidations()) return false;
			var formArray = $('#formid').serializeArray();
			var obj = objectifyForm(formArray);

			post_Simpan(obj);
		});	

		function objectifyForm(formArray) {//serialize formdata function
			var returnArray = {};
			for (var i = 0; i < formArray.length; i++){
				returnArray[formArray[i]['name']] = formArray[i]['value'];
			}
			return returnArray;
		} 	


		function formValidations(){

			var value = "";
		
			value = $('#sku').val();
			if (value === ''){
				$('#sku').focus();
				return false;
			}
			value = $('#produk').val();
			if (value === ''){
				$('#produk').focus();
				return false;
			}	
			value = $('#tahun').val();
			if (value === ''){
				$('#tahun').focus();
				return false;
			}	

			value = $('#jenama').val();
			if (value === ''){
				$('#jenama').focus();
				return false;
			}
			value = $('#model').val();
			if (value === ''){
				$('#model').focus();
				return false;
			}

			value = $('#berat_unit').val();
			if (value !== '-'){
				value = $('#berat').val();
				if (value === ''){
					$('#berat').focus();
					return false;
				}
			}							

			return true;
		}			


		function jsonSpecs(){

			var details = {};
			var value = '';

			value = $('#berat').val();
			if (value !== ''){
				details['berat'] = value;
				details['berat_unit'] = $('#berat_unit').val();
			}

			value = $('#saiz').val();
			if (value !== ''){
				details['saiz'] = value;
				details['saiz_unit'] = $('#saiz_unit').val();
			}	
			
			value = $('#input').val();
			if (value !== ''){
				details['input'] = value;
				details['input_jenis'] = $('#input_jenis').val();
			}	

			value = $('#umur').val();
			details['umur'] = value;

			value = $('#bahan').val();
			details['bahan'] = value;
			
			return details;
		}


		function post_Simpan(obj) {

			var details = jsonSpecs();
			obj['details'] = JSON.stringify(details);
			var json = JSON.stringify(obj);
			//return false;

			$.ajax({
				type: 'POST',
				url: url + "/m/ws/post_item_detail.php",
				data: json, 
				async: false,
				contentType: 'application/json',
				accepts : 'application/json',
				success: function(data) { 
					var msg = data;
					if (msg && msg.indexOf('Error:') > -1){
						alert('Simpan maklumat gagal!');
						console.log('ERR:...', msg);
					}
					else {
						alert('Simpan maklumat berjaya.'); 
						setPage(this, 'Kemaskini Produk', './edit_produk.php');
					}
				},
				error: function(data){
					alert('Simpan maklumat gagal!');
					console.log('ERR:...', data);
				}
			});

		} 			
		
	});
</script>
