@extends('layouts.common')
 
 @section('title')
	Laiqa | Admin | Dashboard
 @endsection
 @section('content')



	<div class="page-wrapper">
		<div class="content">
			<div class="row">
				<div class="col-sm-4 col-3">
					<h4 class="page-title">Add Notification</h4>
				</div>
				<div class="col-sm-8 col-9 text-right m-b-20">
					<a href="{{  env('APP_URL') }}custom_notification" class="btn btn btn-primary btn-rounded float-right"><i class="fa fa-arrow-left"></i> Back</a>
				</div>
			</div>
			<div class="row">
				<div class="col-md-12">
					 @if ($message = Session::get('success'))

						<div class="alert alert-success alert-block">

							<button type="button" class="close" data-dismiss="alert">×</button>
								<strong>{{ $message }}</strong>
						</div>
						@endif

						@if (count($errors) > 0)
							<div class="alert alert-danger">
								<strong>Whoops!</strong> There were some problems with your input.
								<ul>
									@foreach ($errors->all() as $error)
										<li>{{ $error }}</li>
									@endforeach
								</ul>
							</div>
						@endif
					<form name="add_custom_notification" method="post" action="{{ env('APP_URL') }}create_cus_notification" enctype="multipart/form-data">
						<input type="hidden" value="{{csrf_token()}}" name="_token" />
						<div class="row">
							<div class="col-md-6">
								<div class="form-group">
									<label>Notification Type</label>
									<div class="radio">
										<label>
											<input type="radio" name="notification_type" class="notification_type" value="1" required > In-app pop up
										</label>
									</div>
									<div class="radio">
										<label>
											<input type="radio" name="notification_type" class="notification_type" value="2" required> Push notification
										</label>
									</div>
								</div>
							</div>
							<div class="col-md-6 in_app_noti">
								<div class="form-group">
									<label>Title</label>
									<input class="form-control" type="text" name="title" value="" >
								</div>
							</div>
						</div>
						<div class="row">
							<div class="col-md-6 in_app_noti">
								<div class="form-group">
									<label>Content Type</label>
									<select class="select content_type" name="not_type">
										<option value="0">Select</option>
										<option value="1">Text Content</option>
										<option value="2">Image</option>
										<option value="3">Link</option>
									</select>
								</div>
							</div>
							
							<div class="col-md-6 push_notify">
								<div class="form-group">
									<label>Title for Notification</label>
									<input type="text" name="notify_title"  class="form-control" 	id="notify_title" accept="image/*">
								</div>
							</div>
							<div class="row push_for push_notify">
							</div>
							<div class="col-md-6">
								<label>Push for</label>
								<div class="form-group push_for">
									<select class="select" name="push_for">
										<option value="0">Select</option>
										<option value="1">All user</option>
										<option value="2">Android User</option>
										<option value="3">iOS User</option>
										<option value="4">Male User</option>
										<option value="5">Female User</option>
										<option value="6">Registered Users</option>
										<option value="7">Not Registered Users</option>
										<option value="8">Free Registered Users</option>
										<option value="9">Donated Users</option>
									</select>
								</div>
							</div>
						</div>
						<!--
						<div class="col-md-6">
							<div class="form-group">
								<label>Link to redirect</label>
								<input type="text" name="deep_link_url"  class="form-control">
							</div>
						</div>
						-->
							<div class="col-md-6">
								<div class="form-group noti_image">
									<label>Image</label>
									<input type="file" name="notify_image" id="notify_image" accept="image/*">
								</div>
							</div>
						
						<div class="row in_app_noti-old"> 
							<!--
							<div class="col-md-6">
								<div class="form-group">
									<label>Click action :(Redirect To)</label>
									<select class="select redirect_to" name="click_action">
										<option value="0">Select</option>
										<option value="shop">Shop Page</option>
										<option value="home">Home Page</option>
										<option value="order_history">Order History</option>
										<option value="order_detail">Order Detail</option>
										<option value="cart">cart page</option>
										<option value="create_query">Consult a Consultant</option>
										<option value="consulation_query_list">View Query</option>
										<option value="log_symptoms">Log your symptoms</option>
										<option value="period">Period Calendar</option>
										<option value="deep_link">Deep Link</option>
									</select>
								</div>
							</div>
							-->
							<div class="col-md-6">
								<div class="form-group">
									<label>Link to redirect</label>
									<input type="text" name="deep_link_url"  class="form-control">
								</div>
							</div>
						</div>
						
						<div class="form-group noti_msg">
							<label>Message</label>
							<textarea cols="30" rows="4" name="desc_content" id="editor" class="form-control"></textarea>
						</div>
						
						<div class="form-group noti_Push_msg">
							<label>Message</label>
							<input type="text" name="desc_content_push"  class="form-control">
						</div>
						
						<div class="row in_app_noti">
							<div class="col-md-6">
								<div class="row">
									<div class="col-md-6">
										<div class="form-group">
											<label>Active from date</label>
											<div class="cal-icon">
												<input type="text" name="active_from_date" class="form-control datetimepicker">
											</div>
										</div>
									</div>
									<div class="form-group">
										<label>Active from time</label>
										<div class="time-icon">
											<input type="text" name="active_from_time" class="form-control" id="datetimepicker1">
										</div>
									</div>
								</div>
							</div>
							<div class="col-md-6">
								<div class="row">
									<div class="col-md-6">
										<div class="form-group">
											<label>Active to date</label>
											<div class="cal-icon">
												<input type="text" name="active_to_date" class="form-control datetimepicker">
											</div>
										</div>
									</div>
									<div class="col-md-6">
										<div class="form-group">
											<label>Active to time</label>
											<div class="time-icon">
												<input type="text" name="active_to_time" class="form-control" id="datetimepicker2">
											</div>
										</div>
									</div>
								</div>
								
							</div>
						</div>
						<div class="row push_notify">
							<div class="col-md-4">
								<div class="row">
									<div class="form-group">
										<label>Active from date</label>
										<div class="cal-icon">
											<input type="text" name="active_from_date1" class="form-control datetimepicker">
										</div>
									</div>
								</div>
							</div>
							<div class="col-md-4">
								<div class="row">
									<div class="form-group">
										<label>Active to date</label>
										<div class="cal-icon">
											<input type="text" name="active_to_date1" class="form-control datetimepicker">
										</div>
									</div>
								</div>
							</div>
							<div class="col-md-4">
								<div class="form-group">
									<label>Time Interval</label>
									<div class="cal-icon">
										<input type="text" name="time_interval" class="form-control" id="datetimepicker3">
									</div>
								</div>
							</div>
						</div>
						
						<div class="form-group">
							<label class="display-block">Status</label>
							<div class="form-check form-check-inline">
								<input class="form-check-input" type="radio" name="status" id="noti_active" value="1" checked>
								<label class="form-check-label" for="noti_active">
								Active
								</label>
							</div>
							<div class="form-check form-check-inline">
								<input class="form-check-input" type="radio" name="status" id="noti_active" value="2">
								<label class="form-check-label" for="noti_active">
								Inactive
								</label>
							</div>
						</div>
						<div class="m-t-20 text-center">
							<button class="btn btn-primary submit-btn">Add</button>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>
		
		

@endsection

@section('scripts')
<script>
$('.noti_msg').hide();
	// ClassicEditor
		// .create( document.querySelector( '#editor' ), {
			// toolbar: [ 'heading', '|', 'bold', 'italic', 'link' ]
		// } )
		// .then( editor => {
			// window.editor = editor;
		// } )
		// .catch( err => {
			// console.error( err.stack );
		// } );
		
	$('.notification_type').change(function(){
		var notification_type = $('input[name="notification_type"]:checked').val();
		if(notification_type == 1)
		{
			$('.push_notify').hide();
			$('.in_app_noti').show();
			$('.noti_msg').show();
			$('.noti_Push_msg').hide();
		}else{
			$('.push_notify').show();
			$('.in_app_noti').hide();
			$('.noti_msg').hide();
			$('.noti_Push_msg').show();
		}
	});
	
	$('.in_app_noti').change(function(){
		var content_type = $('.in_app_noti :selected').val();
		var notification_type = $('input[name="notification_type"]:checked').val();
		if(content_type == 2)
		{
			$('.noti_msg').hide();
			//$('.noti_image').show();
			//$('.push_for').hide();
		}else{
			$('.noti_msg').show();
			//$('.noti_image').hide();
			//$('.push_for').show();
		}
	});
	$(function () {
		$('#datetimepicker1').datetimepicker({
			format: 'HH:ss'

		});
	});
	$(function () {
		$('#datetimepicker2').datetimepicker({
			format: 'HH:ss'

		});
	});
	$(function () {
		$('#datetimepicker3').datetimepicker({
			format: 'HH:ss'

		});
	});
</script>
@endsection