@extends('admin/admin')

	@section('content')
<!-- Breadcrumb-->
<ol class="breadcrumb">
	<li class="breadcrumb-item">{{ __('Admin') }}</li>

	<li class="breadcrumb-item">
		<a href="{{route('list_category')}}">{{ __('Campaign') }}</a>
	</li>
	<li class="breadcrumb-item active">{{__('Update Template')}}</li>
	<!-- Breadcrumb Menu-->
	<li class="breadcrumb-menu d-md-down-none">

	</li>
</ol>

<!-- Page Content -->
<div class="container-fluid login-container fakenews">
	<div class="row justify-content-center">
		<div class="col-sm-12 add-temp-col12">
			<div class="card add-temp-card">
				<div class="card-header">
					<strong>{{__('Update Template')}}</strong> 

					<div class="card-header-actions">
						<a class="btn btn-sm btn-primary" href="{{url('admin/campaign/template/list/'.$template_details->campaign_id)}}" role="button"><i class="fa fa-dot-circle-o"></i> {{ __('Template List') }}</a>
					</div>

				</div>

                    @if (session()->has('success'))
				<div class="alert alert-success">
					<h6><center>{{ session('success') }}</center></h6> 
				</div>
                    @endif

					 @if ($errors->any())
				<div class="alert alert-danger">
					<ul>
							@foreach ($errors->all() as $error)
						<li>{{ $error }}</li>
							@endforeach
					</ul>
				</div><br />
					@endif

				<div class="card-body">
					<div class="d-flex justify-content-center"><span class="badge badge-info mx-auto" style="font-size: 1.0rem;">For Customizing the template, use ‘@’ symbol e.g. @customer_full_name@  will become ‘John Smith’</span></div>
					<form class="form-horizontal add-tem-form" action="{{{ isset($template_details->id) ? route('update_save_template') : route('save_template') }}}" method="post" id="campaign_user" enctype="multipart/form-data">
						@csrf
					  <input type="hidden" name="id" value="{{$template_details->id}}"/>
					  <input type="hidden" name="campaign_id" value="{{$template_details->campaign_id}}"/>
						<div class="row fakenews-row add-temp-row">
						
							
							<div class="col-md-12 login-form-2">
								<div class="image-container">
									<img src="{{ asset('admin/img/fakenews/images.jpg') }}" class="img-live" id="image-live"/>
									
									<video width="100%" height="401" controls id="vidoe-live" controlsList="nodownload nofullscreen ">
										<source src="movie.mp4" type="video/mp4">
									</video>
									<iframe width="100%" height="auto" src="" id="url-live" style="display:none;"></iframe>
									
									<div class="image-overlay">
										<div class="image-overlay-top">
											<div class="image-overlay-top-left">
												<img src="{{ asset('admin/img/fakenews/live-icon-65.png') }}" id="overlay-left"/>
											</div>
											<div class="image-overlay-top-right">
												<img src="{{ asset('admin/img/fakenews/breaking-news.png') }}" id="overlay-right"/>
											</div>
										</div>

										<div class="image-overlay-bottom">
											<div class="image-overlay-title">BREAKING NEWS</div>
											<div class="image-overlay-head" id="news-head">SOMETHING WENT VIRAL ONLINE</div>
											<div class="image-overlay-content"><span class="time">10:48</span><div id="news-content">"Is this really news?" Ask commenter</div></div>
										</div>

										<div class="image-overlay-bottom"></div>
									</div>
								</div>
								
								<div class="login-form-1">
									
									<div class="form-group">
										<label for="first_name" class="required">Title</label>
										<input type="text" name="title" value="{{__($template_details->title)}}"  class="fakenews__textbox form-control" placeholder="Enter new title" id="fakenews_textbox_head" disabled >
									</div>
									<div class="form-group">
										<label for="first_name" class="required"> Choose one for upload </label>
										<div class="imgvideoupload_div">
											<label class="imgvideoupload_label" for="imgvideoupload_id_1"><input id="imgvideoupload_id_1" type="radio" name="upload_type" value="image" @if($template_details->upload_type == 'image') checked @endif disabled >Image</label>
											<label class="imgvideoupload_label" for="imgvideoupload_id_2"><input id="imgvideoupload_id_2" type="radio" name="upload_type" value="video" @if($template_details->upload_type == 'video') checked @endif disabled >Video</label>
											<label class="imgvideoupload_label" for="imgvideoupload_id_3"><input id="imgvideoupload_id_3" type="radio" name="upload_type" value="url" @if($template_details->upload_type == 'url') checked @endif disabled>URL</label>
										</div>
									</div>
									@if($template_details->upload_type == 'url')
									<div class="form-group" id="image_url">
										<label for="first_name" class="required">URL</label>
										<input type="text" name="image_main" value="{{__($template_details->file_path)}}" id="image-url-filed" class="fakenews__textbox form-control" placeholder="Enter Image URL" id="fakenews_textbox_head_url" disabled>
									</div>
									@endif
									<div class="form-group">                            
										<label>Introduction text:  </label>
										<textarea name="introduction" class="fakenews__textbox fakenews__textarea form-control" id="fakenews_textbox_content" disabled>{{__($template_details->introduction)}}</textarea>							
									</div>




									<div class="form-group">                            
										<label>sort codes </label>
										<h5>Title</h5>
										@if (preg_match_all($regex, $template_details->title, $matches, PREG_PATTERN_ORDER))
												
											@foreach($matches[1] as $word)
											<p> {{ __($word)}}</p>
											@endforeach
										@else
											<p style="color:red;">No sort code found!</p>											
										@endif
										<h5>Introduction text</h5>
										@if (preg_match_all($regex, $template_details->introduction, $matches, PREG_PATTERN_ORDER))
											
												@foreach($matches[1] as $word)
												<p> {{ __($word)}}</p>
												@endforeach
										@else
											<p style="color:red;">No sort code found!</p>				
										@endif
										<h5>Content text</h5>
										@if (preg_match_all($regex, $template_details->content, $matches, PREG_PATTERN_ORDER))
											
												@foreach($matches[1] as $word)
												<p> {{ __($word)}}</p>
												@endforeach
										@else
											<p style="color:red;">No sort code found!</p>			
										@endif										
									</div>


								
							</div>

								<div class="form-group">
									<label>Content text:  </label>
									<!--<div id="editor">
										<p>Going to a new place can be quite terrifying. While change and uncertainty makes us scared, traveling teaches us how ridiculous it is to be afraid of something before it happens. The moment you face your fear and see there was nothing to be afraid of, is the moment you discover bliss.</p>
									</div>-->
									<textarea name="description" id="description" class="form-control ckeditor" disabled>{{__($template_details->content)}}</textarea>	
								</div>
								
								<div class="form-group ">

									<label> {{ __('Campaign') }}:  </label>
									<input type="text" name="campaign_name" value="{{$template_details->campaign->category_name}}"  class="fakenews__textbox form-control" disabled />
									


								</div>
								
								
								<div class="form-group">
									<label> {{ __('Status') }}:</label>
									
									  <select class="fakenews__textbox form-control" id="hf-status" name="status" disabled >
										<option value="1" {{{ isset($template_details->status) ? $template_details->status == 1 ? 'selected' : '' : '' }}}>{{ __('Publish') }}</option>
										<option value="0" {{{ isset($template_details->status) ? $template_details->status == 0 ? 'selected' : '' : '' }}}>{{ __('Unpublish') }}</option>
									  </select>
									  
									
							  </div>
							</div>
						
						
						
						</div>
					</form>
				</div>

				<div class="card-footer">
					

				</div>
			</div>
		</div>
	</div>
	@php
		$logo = $template_details->logo_path;
		$exp = explode('-',$logo);
		$logo_path = Helper::getLogoPath($exp[0]);
		$logo_position = $exp[1];
	@endphp
</div>
	@endsection 
	@section('footer-scripts')
	@parent
	
	<script>
	function get_youtube_id(youtube_url)
	{
		if (youtube_url.indexOf('?v=') > -1) {
			   var res = youtube_url.split("?v=");
			   
			  var url =  'https://www.youtube.com/embed/'+res[1];
			}
			else{
				var res = youtube_url.split("youtu.be/");
				var url =  'https://www.youtube.com/embed/'+res[1];
			}
			return url;
	}
	jQuery(document).ready(function() {
		//jQuery("#logo-right").prop("checked", true);
		//jQuery( "#logo-right" ).trigger( "click" );
		//jQuery("#logo-right").attr('checked', 'checked');
		
			CKEDITOR.instances['description'].destroy(true);
		CKEDITOR.replace( 'description', {
		  height: 300,
		    filebrowserUploadUrl: '{{ route('editor_upload',['_token' => csrf_token() ]) }}',
            filebrowserUploadMethod: 'form'
		 });

		jQuery('.fakenews__logolist').owlCarousel({
        autoplay:false,
        autoplayTimeout:6000,
        loop: true,
        margin: 40,
        dots: true,
        nav:false,
        responsive: {
          0: {
            items: 1
          },
           900: {
             items: 2
           },
          /*399: {
            items: 2
          }*/
        }
        });
	var main_image = '{{$template_details->upload_type}}';
	
	if(main_image == 'image')
	{
		jQuery('#image-live').attr("src",'{{ asset($template_details->file_path) }}');
		jQuery('#url-live').hide();
		jQuery('#image-live').show();
		jQuery('#vidoe-live').hide();
	}
	else if(main_image == 'video')
	{
		jQuery('#vidoe-live').attr("src",'{{ asset($template_details->file_path) }}');
		jQuery('#url-live').hide();
		jQuery('#image-live').hide();
		jQuery('#vidoe-live').show();
	}
	else if(main_image == 'url')
	{
		var url = get_youtube_id('{{ $template_details->file_path }}');
		jQuery('#url-live').attr("src",url);
		jQuery('#url-live').show();
		jQuery('#image-live').hide();
		jQuery('#vidoe-live').hide();
	}
	jQuery('#image_main').change(function(){

			var pth = $(this).val().replace("C:\\fakepath\\", "");
			jQuery(".fakenews__path").text(pth); 

			if (jQuery("#imgvideoupload_id_1").is(":checked")) 
			{			
				
				var uploadinput = jQuery('#image_main');
				uploadinput.src = URL.createObjectURL(event.target.files[0]);
				jQuery('#image-live').attr("src",uploadinput.src);
				jQuery('#url-live').hide();
				jQuery('#image-live').show();
				jQuery('#vidoe-live').hide();
				
			}
			else if (jQuery("#imgvideoupload_id_2").is(":checked")) {

				var uploadinput = jQuery('#image_main');
				uploadinput.src = URL.createObjectURL(event.target.files[0]);
				jQuery('#vidoe-live').attr("src",uploadinput.src);
				jQuery('#url-live').hide();
				jQuery('#image-live').hide();
				jQuery('#vidoe-live').show();
				
			}
			else if(jQuery("#imgvideoupload_id_3").is(":checked"))
			{
				var url = get_youtube_id('{{ $template_details->file_path }}');
				jQuery('#url-live').attr("src",url);
				jQuery('#url-live').show();
				jQuery('#image-live').hide();
				jQuery('#vidoe-live').hide();
			}
		
		});


	jQuery(function(){
		jQuery('#news-head').text(jQuery('#fakenews_textbox_head').val());
		jQuery('#fakenews_textbox_head').keyup(function(){
		jQuery('#news-head').text(jQuery(this).val());
		});
		
		jQuery('#news-content').text(jQuery('#fakenews_textbox_content').val());
		jQuery('#fakenews_textbox_content').keyup(function(){
		jQuery('#news-content').text(jQuery(this).val());
		});

		jQuery('.tst-left-radio,.tst-right-radio').change(function(){

			var ovelayleft = jQuery('#overlay-left').attr('src');


			if (jQuery(".tst-left-radio").is(":checked")) {
				
				jQuery('#overlay-right').attr('src',"{{ asset('admin/img/fakenews/breaking-news.png') }}");
				var logochecked = $(this).parent( ".tst-checkbox-left").parent('.tst-checkbox').parent('.tst-box').find('.tst-img img').attr('src');
				jQuery('#overlay-left').attr('src',logochecked);
				}
				else if (jQuery(".tst-right-radio").is(":checked")) {
					jQuery('#overlay-left').attr('src',"{{ asset('admin/img/fakenews/live-icon-65.png') }}");
					var logochecked = jQuery(this).parent( ".tst-checkbox-right").parent('.tst-checkbox').parent('.tst-box').find('.tst-img img').attr('src');
					jQuery('#overlay-right').attr('src',logochecked);
				}
				
		});
		
	var logo_pos = '{{$logo_position}}';
		if(logo_pos == 'right')
		{
			jQuery('#overlay-left').attr('src',"{{ asset('admin/img/fakenews/live-icon-65.png') }}");
			var logochecked = '{{ asset($logo_path) }}';
			jQuery('#overlay-right').attr('src',logochecked);
		}
		if(logo_pos == 'left')
		{
			jQuery('#overlay-right').attr('src',"{{ asset('admin/img/fakenews/breaking-news.png') }}");
			var logochecked = '{{ asset($logo_path) }}';
			jQuery('#overlay-left').attr('src',logochecked);
		}

	});
		jQuery('#imgvideoupload_id_1').click(function(){
		jQuery('#image-live').show();
		jQuery('#vidoe-live').hide();
		jQuery('.image-overlay').removeClass('videobottom');	
		});
		jQuery('#imgvideoupload_id_2').click(function(){
			jQuery('#image-live').hide();
			jQuery('#vidoe-live').show();
			jQuery('.image-overlay').addClass('videobottom');
		});
	

		
});
</script>

@endsection