@extends('layouts.master1')

@section('content')
<style>
    .wrapper{
  width:100%;
}
@media(max-width:992px){
 .wrapper{
  width:100%;
} 
}
.panel-heading {
  padding: 0;
	border:0;
}
.panel-title>a, .panel-title>a:active{
	display:block;
	padding:15px;
  color:#555;
  font-size:16px;
  font-weight:bold;
	text-transform:uppercase;
	letter-spacing:1px;
  word-spacing:3px;
	text-decoration:none;
}
.panel-heading  a:before {
    content: "\f0ab";
font-family: FontAwesome;
   float: right;
   transition: all 0.5s;
}
.panel-heading.active a:before {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	transform: rotate(180deg);
}

.panel-title
{
    margin-bottom:0px;
}

.panel-group .panel {
    margin-bottom: 0;
    border-radius: 4px;
}
.panel-group .panel+.panel {
    margin-top: 5px;
}
/* .panel-default {
    border-color: #ddd !important;
} */
.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
}

.panel-body {
    padding: 15px;
    border-top: 1px solid #ddd;
}
</style>
<div class="container">
    <div class="white-title mt45">
        @if($cid=='')
            <div class="row">
                <div class="col-xl-12">
                    <h3>Content Generator</h3>
                </div>         
            </div>
        @else
        <form method="POST" action="{{url('urlgenerate')}}" id="scriptFrm">
                {!! csrf_field() !!}
		<div class="row GWC-mt10">
            <div class="col-md-4">
				<div class="form-group">
					<input type="text" name="scriptTitle" autocomplete="off" id="scriptTitle" class="form-control" placeholder="Enter Headline" value="{{$pageVal->scriptTitle}}"> 
				</div> 
			</div>
			<div class="col-md-4">
				<div class="form-group">
					<input type="text" name="grabUrl" id="v_url" class="form-control" placeholder="Enter any Web URL to Grab the Content" value="{{$pageVal->grabUrl}}"> 
				</div> 
			</div>
			<div class="col-md-4 GWC-pl0">
				<div class="button-box">
                
                <textarea name="scriptDescription1"  id="new_script" style="display:none;"></textarea>
					<button type="submit" id="deselect-all" class="btn btn-extempore-write" href="javascript:void(0)"><i id="fa-spiner-continue" class="fa fa-spinner fa-spin GWC-fa-spin" style="display:none;"></i> Get Content </button> 
                    <button type="button" class="btn btn-extempore-write" href="javascript:void(0)" id="saveStory"> Save Story</button> 
                </div>
                <!-- <div class="button-box">
					
				</div> -->
			</div>
            <!-- <div class="col-md-2 GWC-pl0">
                
			</div> -->
            <input type="hidden" name="contentmode" id="contentmode" value="0"/>
            <input type="hidden" name="ids" value="{{$cid}}"/>
		</div>
        </form>
        @endif
    </div>
    <div class="row main-panel main-panel-setting_ extempore_no_margin">
        <div class="col-sm-12 main-panel-content mb-20"> 
            <div class="col-md-12">
                @if($cid=='')
                <div class="col-md-12">
                <div class="row GWC-mt10">
                    <div class="col-md-2">
                    </div>
                    <div class="col-md-6">
                        <h3>Grab content from any url</h3>
                    </div>
		        </div>
        <form method="POST" action="{{url('urlgenerate')}}" >
                {!! csrf_field() !!}
		<div class="row GWC-mt10">
			<div class="col-md-2">
			</div>
            
			<div class="col-md-6">
				<div class="form-group">
					<input type="text" name="grabUrl" id="v_url" class="form-control" placeholder="Enter any Web URL to Grab the Content" value=""> 
				</div> 
			</div>
			<div class="col-md-2 GWC-pl0">
				<div class="button-box">
					<button type="submit" id="deselect-all" class="btn btn-info b1color GWC-wid100" href="#"><i id="fa-spiner-continue" class="fa fa-spinner fa-spin GWC-fa-spin" style="display:none;"></i> Get Content </button> 
				</div>
			</div>
            
		</div>
        </form>
                </div>
                @else
                <div class="video_wrap" style="">
                    <div class="video_container" style="margin-top:15px;">
                    <div class="row">
                    <!-- Column -->					
                    <div class="col-lg-8 col-md-7" style="flex: 0 0 46.666667%;max-width: 66.666667%;">
                        <div class="card" style="margin-bottom: 0px;">
                            <div class="card-body" id="slimtest3">
								<div class="content-inner"><!--cotent-inner block begin-->
								
								</div>
                                @if($errorMsg==1)
                                <div class="choosecontent col_12 m-t-40 text-center" style="background: #ed433785;">This URL has restricted access and so it cannot be loaded inside the tool. Please try a different URL.</div>
                                @endif
                            </div>
                        </div>
                    </div> 
					<div class="col-lg-4 col-md-5" style="flex: 0 0 55.333333%;max-width: 53.333333%;">
                        <div class="card"  style="margin-bottom: 0px;">
                            <div class="card-body" id="slimtest4">
                                <div id="sortable_list" class="com height2">
                                <div ng-repeat="data in datas" class="col_12 mtb content-items" data-item="@{{data.data_item}}" ng-cloak>
                                            <div class="col_12 dragpadd content-bg">
                                                <div class="col_9 dragpadd editBlock">
                                                    <!-- <textarea ng-model="data.content" class="texteditable" ng-cloak></textarea> -->
                                                    <textarea ng-model="data.content" class="texteditable" ng-cloak>@{{data.content}}</textarea>
                                                </div>
                                                <div class="col_2_right">
												<div  class="col_1 dragpadd dragmove">
													<i class="fa fa-arrows-alt" aria-hidden="true" style="font-size:18px;color:#C2C3C7"></i>
												</div>
												<div ng-click="remove(data)"class="dragpadd dragdelect">
													<i class="fa fa-trash" aria-hidden="true"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Delete"></i>
												</div> 
												<div ng-click="addItem(data)"  class="dragpadd dragadd">
													<i class="fa fa-plus-circle" aria-hidden="true"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Add Content"></i>
												</div><br/>
												<div style="float:left;" ng-class="{'red': (data.content).length > 140, 'green': (data.content).length <= 140}"  class="legcom ">
                                                @{{(data.content).length}}/140
												</div>
											</div>
                                                
                                            </div>
									</div>								
								</div>
								<div ng-show="!datas.length" class="choosecontent col_12 m-t-40 text-center">Please choose the content from the left <br> to be added in the Story.</div>
                            </div>
                        </div>
                    </div>			
					
                </div>
                    </div>
                </div>
                @endif
            </div>
        </div>            
    </div>
</div>
@if($cid !='')
<div id="external_link" class="row" style="display:none;">
    {!!$page!!}
</div> 
@endif
@endsection
@section('scripts')
    <script type="text/javascript">
    @if($cid !='')
    var myApp = angular
.module("myModule",[])
.controller("myController", function($scope){	
var datas = {!!$v_json!!};
$scope.datas  = datas;
$scope.d_status = 1;
$scope.addItem = function(item) {
	
    //var content_temArr = { video_url:'https://videosly.io/members/imgupload/default.mp4', video_obj:'', video_blk_id:'',fontcolor:'', content: 'Click here to edit', data_item:'new' };
    var content_temArr = { content: '', data_item:'new' };
   // var content_temArr = { video_url:'https://player.vimeo.com/external/183786525.hd.mp4?s=6ba35e0fb97b3bd2f2638e750672bfd65562cdce&profile_id=119', video_obj:'', video_blk_id:'',fontcolor:'', content: 'Click here to edit', data_item:'new' };
    var length = $scope.datas.length;
     if(length >= 250){
         $('.jq-toast-wrap').children().remove(); 
         $.toast({
                   heading: 'Welcome to Video Render',
                   text: 'Reached limit, you can add upto 25 slides. ',
                   position: 'top-right',
                   loaderBg:'#ff6849',
                   icon: 'error',
                   hideAfter: 5000
               });
               
         return false;
         
     }else{	  
       var index=	$scope.datas.indexOf(item);
       index = index + 1
       $scope.datas.splice(index,0,content_temArr);
       
       var wtf = $('#slimtest4');
       var height = wtf[0].scrollHeight;
       //  wtf.scrollTop(height);
       $("#slimtest4").animate({
           scrollTop:  height
       },1000);

        saveComman_json();
     }
}

//custom fields remove editCustom 
$scope.remove = function(item){
var remove = item.data_item;
var index=	$scope.datas.indexOf(item);

if(remove == 'new'){
     $scope.datas.splice(index,1);  
     saveComman_json();
}else{
    $scope.datas.splice(index,1);   
    $(".content-inner").find('span').eq(remove).removeClass();
     saveComman_json();
}
 var wtf = $('#slimtest4');
   var height = wtf[0].scrollHeight;
 //  wtf.scrollTop(height);
       $("#slimtest4").animate({
           scrollTop:  height
       },1000);
};
function saveComman_json(){
   var datas_json = JSON.stringify($scope.datas);
   datas_json.replace(/\"/g,'\\"');
   $.ajax({
               url:BASE_URL +'/scriptgenerate',
               type: 'post',
               data: {
                '_token': '{{ csrf_token() }}',   
               'id' :{{$cid}},
               'scriptDescription':datas_json,
               'mode':'data'
               },
               success: function(msg){
                   
               }
           });
}

         angular.element(document).ready(function () {
	$scope.keyEditable = function(data){
		var index = $scope.datas.indexOf(data);
		var text = $('.texteditable:eq('+index+')').text();		
		data.content = $.trim(text);
	} 
	$(document).on('click','.content-inner span',function(event){
		 event.stopPropagation();
	var text = $.trim($(this).html());
	text = text.replace(/&nbsp;/g,'');
	text = text.replace('&amp;','&');
	var index = $(this).attr('data-mode');
	
	//text = text.replace('"', '\"');
	//alert(text);
	
	if($(this).hasClass( "selected-section" )){
		$(this).removeClass('selected-section');
		
			/* $('#sortable_list').find('.content-items').each(function(){
				var listindex = $(this).attr('data-item');
				if(listindex == index) $(this).remove();
			}); */
			
			
		 angular.forEach($scope.datas, function(value, key) {
			if(value.data_item == index){
				$scope.datas.splice(key,1);
				 $scope.$apply(); 
				 saveComman_json();
			}
		//console.log(key + ': ' + value.content); 
		
		});
		
	}else{
		var leg = text.length;
		var legClass = 'green';
		if(leg > 140){
			legClass = 'red';
		}
		var html = '<div class="col_12 mtb content-items" data-item="'+index+'"><div class="col_12 dragpadd content-bg"><div class="col_9 dragpadd editBlock"><div class="texteditable" contenteditable="true">'+text+'</div></div><div class="col_2_right"><div class="col_1 dragpadd dragmove"><i class="fa fa-arrows-alt" aria-hidden="true" style="font-size:18px;color:#C2C3C7"></i></div><div class="dragpadd dragdelect"><i class="fa fa-trash" aria-hidden="true" ></i></div><div class="dragpadd dragadd"><i class="fa fa-plus-circle" aria-hidden="true" ></i></div><br/><div style="float:left;" class="legcom '+legClass+'">'+leg+'/140</div></div></div></div>';
		 
	  // $('#sortable_list').append(html);	
	  
	  var length = $scope.datas.length;
	  if(length >= 25){
		  $('.jq-toast-wrap').children().remove();
		  $.toast({
					heading: 'Welcome to Video Render',
					text: 'Reached limit, you can add upto 25 slides. ',
					position: 'top-right',
					loaderBg:'#ff6849',
					icon: 'error',
					hideAfter: 5000
				});
				
		  return false;
		  
	}
	   		
				   
	 //  var content_temArr = { video_url:"https://videosly.io/members/imgupload/default.mp4", video_obj:'', video_blk_id:'',fontcolor:'', content: text, data_item:index };
	   var content_temArr = { content: text, data_item:index };
	 //  var content_temArr = { video_url:"https://player.vimeo.com/external/183786525.hd.mp4?s=6ba35e0fb97b3bd2f2638e750672bfd65562cdce&profile_id=119", video_obj:'', video_blk_id:'',fontcolor:'', content: text, data_item:index };
	   
	   $scope.datas.push(content_temArr);
	   $scope.$apply();  
	    
		$(this).addClass('selected-section');
		
		var le = $scope.datas.length-1;
		
		var p = $( '.content-items:eq('+le+')' );
		var position = p.position();

		
		/* $("#slimtest4").animate({
			scrollTop:  position.top+370
		},1000); */
		
		var wtf = $('#slimtest4');
		var height = wtf[0].scrollHeight;
		//  wtf.scrollTop(height);
		$("#slimtest4").animate({
		scrollTop:  height
		},1000);
	
		saveComman_json();
	}	
	$('body').hilight();
});

$('.texteditable').keyup(function(){ 
$(this).attr('data-key',1);
});
$('.texteditable').focusout(function(){
	var key = $(this).attr('data-key');
	if(key == 1){
		saveComman_json();
		$(this).attr('data-key',0);
	}    
});
//Add new content in the list  
$(document).on('click','.dragadd1',function(){
	var text = 'Click here to edit';
	var leg = text.length; 
		var legClass = 'green';
		if(leg > 140){
			legClass = 'red';
		} 
		
	var html = '<div class="col_12 mtb content-items" data-item="new"><div class="col_12 dragpadd content-bg"><div class="col_9 dragpadd editBlock"><div class="texteditable" contenteditable="true">'+text+'</div></div><div class="col_2_right"><div class="col_1 dragpadd dragmove"><i class="fa fa-arrows-alt" aria-hidden="true" style="font-size:18px;color:#C2C3C7"></i></div><div class="dragpadd dragdelect"><i class="fa fa-trash" aria-hidden="true" ></i></div><div class="dragpadd dragadd"><i class="fa fa-plus-circle" aria-hidden="true" ></i></div><br/><div style="float:left;" class="legcom '+legClass+'">'+leg+'/140</div></div></div></div>';
	var obj = $(this).closest(".content-items");
	$(html).insertAfter(obj);  
});

//make_video
//$scope.makeVideo = function() {
$(document).on('click','#make_video',function(){
	
	/* if($scope.d_status == '3' ){
				swal("Only the new changes made here will reflect. The previous slides will be deleted.", "Do you wish to proceed?");
				
		
			  return false;
	} */
	
	
	$('#fa-spiner-continue').show();
	var submit_mode = 1;
	var verifiy_mode = 1;
	
	var leg = $('#sortable_list').find('.content-items').length
	if(leg == 0){
		 $('.jq-toast-wrap').children().remove();
		$.toast({
					heading: 'Welcome to Video Render',
					text: 'Video overlay content is empty, please add the content for Video Render. ',
					position: 'top-right',
					loaderBg:'#ff6849',
					icon: 'error',
					hideAfter: 5000
				});
				
		setTimeout(function(){
			$('#fa-spiner-continue').hide();
		}, 5000);
		
	}else{
	
	$('.content-items').each(function(){
		var content = $(this).find('.texteditable').text();
		content = content.length;
		if(content > 140 && verifiy_mode == 1){
			 $('.jq-toast-wrap').children().remove();
				$.toast({
					heading: 'Welcome to Video Render',
					text: 'Each item of content length should be less then 140 charachers only allowed.',
					position: 'top-right',
					loaderBg:'#ff6849',
					icon: 'error',
					hideAfter: 5000
				});
			//var height = $('#slimtest4').height();
			var p = $(this);
			var position = p.position();	
			var top = position.top;
			
			$("#slimtest4").animate({
				scrollTop:  top
			});
			
			//alert(height+" dsfsf"+top);
			setTimeout(function(){
				$('#fa-spiner-continue').hide();
			}, 5000);
			
			submit_mode = 0;
			verifiy_mode = 0;
			return false;
		}
	});
	
	if(submit_mode == 1) {
		/* $('.content-items').each(function(index){
			var content = $(this).find('.texteditable').text();
			var content_temArr = { id:index+1 , content: content };
			$scope.datas.push(content_temArr);
			$scope.$apply();
		});	 */
		//$scope.$apply();
		function formatMMSS(s) {
		m = Math.floor(s / 60);
		m = (m >= 10) ? m : "0" + m;
		s = Math.floor(s % 60);
		s = (s >= 10) ? s : "0" + s;
		return m + ":" + s;
  }
		var color_json =  [];
		for(i=1;i<=$scope.datas.length;i++){
			var text = $scope.datas[i-1].content;
			var regex = /\s+/gi;
			var length = text.trim().replace(regex, ' ').split(' ').length;
			length = Math.round(length/3);
			result = length +2;
			result = formatMMSS(result);
		
			$scope.datas[i-1].v_time = result;
			var temp = { text_color:'#fff',bg_color:''};
			color_json.push(temp);
		}
		var color_json = JSON.stringify(color_json);
		//alert(color_json);
		$('#color_json').val(color_json);
		
		//var json_data = jQuery.parseJSON($scope.datas);
		var json_data = JSON.stringify($scope.datas);
		//json_data = json_data.replace(/\\n/g, "\\n");
		json_data.replace(/\"/g,'\\"');
		$('#content_array').val(json_data);
		
		console.log(json_data); 
		//alert(JSON.stringify(json_data));
		
		//alert(JSON.stringify($scope.datas));
		if($scope.d_status == '3' ){
			swal({   
				title: "Only the new changes made here will reflect. The previous slides will be deleted.",   
				text: "Do you wish to proceed?",   
				type: "warning",   
				showCancelButton: true,   
				confirmButtonColor: "#DD6B55",   
				confirmButtonText: "Yes",   
				cancelButtonText: "No",   
				closeOnConfirm: false,   
				closeOnCancel: false 
				}, function(isConfirm){  
						if (isConfirm) {  								
							$( "#form_data" ).submit(); 
						} else {
							 swal.close();
							 $('#fa-spiner-continue').hide();
						} 
			});
		}else $( "#form_data" ).submit(); 
	}
	
	}//else end
    
});
//}

//content
$(document).on('click','#cot-continue',function(){
	   
		var content = $.trim($('#v_cnt').val());
		
		 if(content == '' ){ 
			$('#v_cnt').addClass('error-content');
			return false;
		}else{
			$('#con-spiner').show();
			$.ajax({
					type :"POST",
					url :"https://videosly.io/members/include/ajax/ajax_videoboard.php",
					data: {
						'board_cnt': content,
						'board_type':2,
						'id':{{$cid}}
					},
					cache: false,
					success : function(data){
						data = $.trim(data);
						if(data != 'error'){
							
							$('#con-spiner').fadeIn();
							$('.content-inner').children().remove();
								
								
							angular.forEach($scope.datas, function(value, key) {
								value.data_item = 'new';
							});
							
							var v_cnt = content;
							v_cnt = v_cnt.split(".");
							var index = -1;
							$.each(v_cnt,function(i){
								content = v_cnt[i];		
								content_s = content.split("\n");								
								$.each(content_s,function(v){
									content1 = content_s[v];
									if(content1 != ''){					
										index = index + 1;
										var c = '<p><span data-mode="'+index+'">'+content1+'</span></p>';
										$('.content-inner').append(c);
									}
								});
								
								 
							});

							$('#c_mode').val(2);
							
							$('#con-spiner').fadeOut();
							$('#myModal').modal('hide');
						}else{
							$('#myModal').modal('show');
							$('#con-spiner').fadeOut();
							
						}
					
					}
			});
			
			
			
			
			
			
			
		/* 	$('#sortable_list').find('.content-items').each(function(){
				$(this).attr('data-item','new');
			}); */
			
			/* angular.forEach($scope.datas, function(value, key) {
				//value.data_item = 'new';
				//$scope.datas.splice(key,1);
				$scope.$apply();			
			}); */
			
			
			
			

			setTimeout(function(){
				 
			}, 1000);
			
			
			
		} 
});

$(document).on('click','#saveStory',function(){
    var story = null;
    angular.forEach($scope.datas, function(item, key) {
            if(story===null){
                story = item.content +"</br>";
            }else{
                story = story + item.content +"</br>";
            }
            
    });
    $("#contentmode").val(1);
    if(story !==null){
        console.log(story);
        $("textarea#new_script").val(story);
        $('#scriptFrm').submit();
    }
    
    
});
//Url Validation function
function validateUrl(textval)  // return true or false. 
{
	var pattern = /^(http|https)?:\/\/[a-zA-Z0-9-\.]+\.[a-z]{2,4}/;
	var urlregex = new RegExp(pattern);
	return urlregex.test(textval);
}
$('#v_cnt').focus(function(){
	$(this).removeClass('error-content');
});
//url continue
$(document).on('click','#url-continue',function(){
	$('.danger1').hide();
		var v_url = $.trim($('#v_url').val());
		if(v_url == ''){
			$('.danger1').html('Please paste blog url').show();
			$('#v_url').addClass('form-error');
			return false;
		}
		
		var prefix = 'https://';
			var prefix1 = 'http://';
		if (v_url.substr(0, prefix.length) !== prefix && v_url.substr(0, prefix1.length) !== prefix1)
		{
		v_url = prefix + v_url;
		}
		
		
		if(!validateUrl(v_url) && v_url != ''){
			$('.danger1').html('Blog url invalid').show();
			$('#v_url').addClass('form-error');
			return false;
		} 
		else{ 		
			 $('#fa-spiner').fadeIn();
			$.ajax({
					type :"POST",
					url :"https://videosly.io/members/include/ajax/ajax_videoboard.php",
					data: {
                        '_token': '{{ csrf_token() }}',
						'v_url': v_url,
						'board_type':1,
						'id':{{$cid}}
					},
					cache: false,
					success : function(data){ 
					data = $.trim(data);
						if(data != 'error'){
						$('.content-inner').children().remove();
						 $('#external_link').children().remove();						 
						 $('#external_link').children().html('');						 
							
						angular.forEach($scope.datas, function(value, key) {
							value.data_item = 'new';
						});		
						$scope.$apply();					
						saveComman_json();
						 $('#external_link').append(data);
						 $('.overlay2').hide();
						 $('#fa-spiner').fadeOut();
						 $('#myModal').modal('hide');
						 contentLoopThrough();
						}
						else{
							$('#myModal').modal('show');
							$('.alert-success').show();
							$('#fa-spiner').fadeOut();
						} 
					}
			});	
		}	
});

function contentLoopThrough(){
	var err_mode = 1;	
	var allElems = $('#external_link').find('*');
		var index = -1;
		allElems.each(function(){
			  var elm = this; //javascript DOM object
			  elm = elm.tagName;
			  var tag = elm.toLowerCase();
			  //console.log(tag);
			  if(tag == 'title'){
				  var content = $.trim($(this).text()); 
				   index = index + 1;
				  var c = '<p><span data-mode="'+index+'">'+content+'</span></p>';
				  $('.content-inner').append(c); 
				  $(this).remove();
				  err_mode = 0;
			  }
			  else if(tag == 'p'){
				   var content = $(this).text();
				   
						v_cnt = content.split(".");
						$.each(v_cnt,function(i){
							content = $.trim(v_cnt[i]);
							if(content != ''){
								index = index + 1;							
								var c = '<p><span data-mode="'+index+'">'+content+'.</span></p>';
								$('.content-inner').append(c); 
							} 
						});
		
				  /*  index = index + 1;
				  var c = '<p><span data-mode="'+index+'">'+content+'</span></p>';
				  $('.content-inner').append(c);
				  $(this).remove(); */
				 err_mode = 0;
			  }
			  else if(tag == 'li'){
				  var content = $.trim($(this).text()); 
				   index = index + 1;
				  var c = '<p><span data-mode="'+index+'">'+content+'</span></p>';
				  $('.content-inner').append(c);
				  $(this).remove();
				  err_mode = 0;
			  }
			  else if(tag == 'h1' || tag == 'h2' || tag == 'h3' || tag == 'h4' || tag == 'h5' || tag == 'h6'|| tag == 'span'){
				  var content = $.trim($(this).text()); 
				 
				  if(tag != 'span'){
					   index = index + 1;
					 c = '<'+tag+'><span data-mode="'+index+'">'+content+'</span></'+tag+'>';
					  $('.content-inner').append(c);
				  }
					else{
						if(content.length>4){
							 index = index + 1;
							c = '<p><span class="span_block" data-mode="'+index+'">'+content+'</span></p>';
							$('.content-inner').append(c);
						}
					}
				 
				  $(this).remove();
				  err_mode = 0;
			  }
			  else {
				  $(this).remove();
			  }
		}).promise().done(function(){
			if(err_mode == 1){
				$('#myModal').modal('show');
							$('.alert-success').show();
							$('#fa-spiner').fadeOut();
			}
		
		
			//$('body').find('#external_link').remove();
				//var allElems = $('#external_link').find('*');
				//allElems.each(function(){
				//	$(this).remove();
				//});
			//$('#external_link').find('*').remove();
			//alert(2);
		});
		
		
}

contentLoopThrough();
				angular.forEach($scope.datas, function(value, key) {
					if(value.data_item != 'new'){
						$('.content-inner span:eq('+value.data_item+')').addClass('selected-section'); 
					}
				});


});
 // Plugin definition.
 $.fn.hilight = function() {
		dragStart = function(e, ui) {
			 ui.item.data('start', ui.item.index());
		}
		dragEnd = function(e, ui) {
			var start = ui.item.data('start'),end = ui.item.index();

			$scope.datas.splice(end, 0, $scope.datas.splice(start, 1)[0]);

			$scope.$apply(); 
            saveComman_json();
		}
	
	//Sortable action
	$( "#sortable_list").sortable({
		handle: ".dragmove",
		axis: "y",
		cursor :'move',
		placeholder: "portlet-state-content",
		tolerance: "pointer",
		forcePlaceholderSize: true,
		cursorAt : {
			left : 8,
			top : 8
					},
		helper : function() {
			return $("<div><img style='' src='https://engagr.io/members/images/moving.svg'></div>");
		},
		over: function(e, ui) {
		var place_hover = $('body').find('.portlet-state-content').children('.draghere').attr('class');
		if(typeof place_hover === "undefined") 
			$('body').find('.portlet-state-content').append('<div class="draghere"><div class="draghere-inner">Drag it here</div></div>');
		},
		start:dragStart,
		update:dragEnd
	}); 
	};	
	$('body').hilight();
            //Angular onReady function end
});

            function applySlimScroll(){
var w_height = $(window).height();
// var f_height = $('#footer_block').height();
var t_height = $('#headerNav').height();
w_height = w_height - (t_height+130);

    $('#slimtest3').slimScroll({
		color: '#1E88E5',
		position: 'right',
		height: w_height,
		alwaysVisible: true
    });
	$('#slimtest4').slimScroll({
		color: '#1E88E5', 
		position: 'right',
		height: w_height,
		alwaysVisible: true
	});
}

// Resetting slim scroll
function resetSlimScrollLessonSlide(){
    $('.slimScrollDiv #slimtest3').unwrap();
    $('.slimScrollDiv #slimtest4').unwrap();
    $('.slimScrollBar, .slimScrollRail').remove();
}

// Let the resize event interval be larger, so resized in 500ms!
function resizedw(){
    resetSlimScrollLessonSlide();
    applySlimScroll()
}
var doit;
$(window).resize(function () {
    clearTimeout(doit);
    doit = setTimeout(resizedw, 50);
});
resizedw();
@endif
    </script>
@stop