<?php $this->load->view("main/drs/header"); ?>
<style>
	.left{
		float: left;
	}
	.right{
		float: right;
	}
	.img-holder img{
		width: 100%;
	}
	.icon_folder , .icon_camera,.icon_remove{
		font-size:17pt;
		margin-left:8px;
		margin-top:10px;
		color: #bbb;
		cursor: pointer;
	}
	.pvt_imge{
		position:fixed;
		top: 0;
		left: 0;
		z-index:10000;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.8);
	}
	#webcam{
		width: 400px;
		height: 385px;
		margin: 100px auto;
		background: #000;
	}
	#video ,canvas{
		width: 100%;
		height: 300px;
	}
	.button_panel{
		float: right;
		margin-right:9px;
	}
	.button_panel button{
		margin-left:4px;
	}
	.close_cam{
		font-size: 26px;
		color: #f00;
		float: right;
		cursor: pointer;
		margin-right:10px;
	}
	.close_cam:hover{
		color: #eee;
	}
</style>
<div class="pvt_imge" style="display:none">
	<div id="webcam">
		<span class="close_cam"><i class="icon-remove"></i></span>
		<canvas id="canvas" style="display:none;"></canvas>
		<video id="video"></video>
		<div class="button_panel">
		<button id="startbutton" class="btn btn-success"><i class="icon-camera"></i> گرفتن عکس</button>
		<button class="btn save" data_pos="0"><i class="icon-save"></i> ذخیره</button>
		</div>
	</div>
	
</div>
<div class="col-lg-12">
<section class="panel">
        <header class="panel-heading">ثبت بیمار</header>
                            <div class="panel-body">
								<?php if($this->session->flashdata('datbasetype') == "succ"){ ?>}
								<div class="alert alert-success fade in">
                                    <button class="close close-sm" type="button" data-dismiss="alert">
                                        <i class="icon-remove"></i>
                                    </button>
                                    بیمار مورد نظر با موفقیت ثبت شد.
                                </div>
								<?php } ?>
								<div class="col-lg-2 left img-holder">
									 <img src="<?php echo base_url(); ?>assets/main/img/no_profile_img.jpg" id="blah">
									 <input type="file" id="imgInp" style="display:none" >
									 <span class="icon_folder left"><i class="icon-folder-open"></i></span>
									 <span class="icon_camera left"><i class="icon-camera"></i></span>
									 <span class="icon_remove left"><i class="icon-remove"></i></span>
								</div>
								<form action="./confirm_Patient_control" method="post">
									<input type="hidden" name="image" class="imageget">
								<div class="col-lg-5">
								<div class="form-group col-lg-6">
                                        <label for="code">کد</label>
                                        <input type="text" class="form-control" name="shomareh_parvandeh" id="code">
                                    </div>
									<div class="form-group col-lg-6">
                                        <label>جنسیت</label>
                                        <select class="form-control" name="sex" style="padding:0px;">
										<option vlaue="1">مرد</option>
										<option vlaue="0">زن</option>
										</select>
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="name">نام</label>
                                        <input type="text" class="form-control" name="name"  id="name" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="family">نام خانوادگی</label>
                                        <input type="text" class="form-control" name="lname"  id="family" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="title">عنوان</label>
                                        <input type="text" class="form-control" name="title"  id="title" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="emphone">تلفن ضروری</label>
                                        <input type="text" class="form-control" name="emphone"  id="emphone" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="homephone">تلفن منزل</label>
                                        <input type="text" class="form-control" name="homephone"  id="homephone" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="brith">تاریخ تولد</label>
                                        <input type="text" class="form-control" name="brithday"  id="brith" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="email">پست الکترونیک</label>
                                        <input type="text" class="form-control" name="email"  id="email" placeholder="">
                                    </div>
									</div>
								<div class="col-lg-5">
									<div class="form-group col-lg-6">
                                        <label for="group">گروه</label>
                                         <input type="text" class="form-control" name="group" id="group" placeholder="">
                                    </div>
									<div class="form-group col-lg-6">
                                        <label for="age">سن</label>
                                         <input type="text" class="form-control" name="age" id="age" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="group">نام پدر</label>
                                         <input type="text" class="form-control" name="fathername" id="group" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="group">شماره شناسنامه</label>
                                         <input type="text" class="form-control" name="shensnameh" id="group" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="group">کد ملی</label>
                                         <input type="text" class="form-control" name="melicode" id="group" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="group">محل کار</label>
                                         <input type="text" class="form-control" name="phonework" id="group" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="group">همراه</label>
                                         <input type="text" class="form-control" name="cellphone" id="group" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="group">محل تولد</label>
                                         <input type="text" class="form-control" name="placeofb" id="group" placeholder="">
                                    </div>
									<div class="form-group col-lg-12 left">
                                        <label for="group">تاریخ ثبت</label>
                                         <input type="text" class="form-control" name="submitdate" id="group" value="<?php echo $today; ?>">
                                    </div>
								</div>
								<div class="col-lg-10">
									<div class="form-group col-lg-12 left">
                                        <label for="group">آدرس منزل</label>
                                         <input type="text" class="form-control" name="home_address" id="group" placeholder="">
                                    </div>
								</div>
								<div class="col-lg-10">
									<div class="form-group col-lg-12 left">
                                        <label for="group">آدرس محل کار</label>
                                         <input type="text" class="form-control" name="work_address" id="group" placeholder="">
                                    </div>
								</div>
								<div class="col-lg-2 left">
									<button class="btn btn-warning">انصراف</button>
									<button class="btn btn-info">ثبت</button>
								</div>
								</form>
							</div>
							
</section>
</div>
<?php $this->load->view("main/drs/footer"); ?>
<script>
function take_image(){
 var streaming = false,
    video = document.querySelector('#video'),
    canvas = document.querySelector('#canvas'),
    buttoncontent = document.querySelector('#webcam'),
    photo = document.querySelector('#photo'),
    startbutton = document.querySelector('#startbutton'),
    width = 520,
    height = 0;

  navigator.getMedia = (navigator.getUserMedia ||
    navigator.webkitGetUserMedia ||
    navigator.mozGetUserMedia ||
    navigator.msGetUserMedia);

  navigator.getMedia({
      video: true,
      audio: false
    },
    function(stream) {
      if (navigator.mozGetUserMedia) {
        video.mozSrcObject = stream;
      } else {
        var vendorURL = window.URL || window.webkitURL;
        video.src = vendorURL.createObjectURL(stream);
      }
      video.play();
    },
    function(err) {
      console.log("An error occured! " + err);
    }
  );

  video.addEventListener('canplay', function(ev) {
    if (!streaming) {
      height = video.videoHeight / (video.videoWidth / width);
      video.setAttribute('width', width);
      video.setAttribute('height', height);
      canvas.setAttribute('width', width);
      canvas.setAttribute('height', height);
      streaming = true;
    }
  }, false);

  function takepicture() {
	$(".button_panel").css({"margin-top":"5px"});
	$(".save").addClass("btn-info").attr({"data_pos":"1"});;
  	video.style.display = "none";
    canvas.style.display = "block";
    startbutton.innerHTML= '<i class="icon-camera"></i> گرفتن مجدد عکس';
  	canvas.width = width;
    canvas.height = height;
    canvas.getContext('2d').drawImage(video, 0, 0, width, height);
    var data = canvas.toDataURL('image/png');
    sessionStorage.setItem("imageformcapture",data);
    photo.setAttribute('src', data);
  }

  startbutton.addEventListener('click', function(ev) {
  	if(startbutton.innerHTML==='<i class="icon-camera"></i> گرفتن عکس')
    {
    	takepicture();
    }
    else
    {
		$(".save").removeClass("btn-info").attr({"data_pos":"0"});
    	video.style.display = "block";
    	canvas.style.display = "none";
      startbutton.innerHTML= '<i class="icon-camera"></i> گرفتن عکس';
    }
    ev.preventDefault();
  }, false);	

}	
	 
	//endd 
	 function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $('#blah').attr('src', e.target.result);
			$(".imageget").val(e.target.result);
            $('input[name="image_base"]').val(e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}
$("#imgInp").change(function(){
    readURL(this);
	
});
$(".icon_folder").click(function(){
    $("#imgInp").click();
    });

$(".close_cam").click(function(){
	$(".pvt_imge").css({"display":"none"});
	});
$(".save").click(function(){
	if ($(this).attr("data_pos") == 1)  {
		$(".pvt_imge").css({"display":"none"});
		$(".img-holder img").attr({"src":sessionStorage.getItem("imageformcapture")});
	$(".imageget").val(sessionStorage.getItem("imageformcapture"));
	}
	
	});
</script>
//for webcam
<script>
	$(".icon_camera").click(
		function() {
$(".pvt_imge").css({"display":"block"});
});
	(function (){
		take_image();
	})();
</script>