
  <script type="text/javascript" src="{!! asset('js/angular.js') !!}"></script>

<script>

	var APP = APP || {};
	APP.Subapp = APP.Subapp || {};

	APP.Subapp.Admin = angular.module('APP.Subapp.Admin', []);

	APP.Subapp.Admin.config(function($interpolateProvider) 
	{
		$interpolateProvider.startSymbol('{[{').endSymbol('}]}');
	});
	
	APP.Subapp.Admin.controller('MyController', function ($scope, $window) 
	{
		
		$scope.authors = [];
		$scope.author_option = [];
		$scope.country_option = [];
		
		$scope.country = 
		[
			@foreach ($country as $key => $countries)
				{'id': '{{$countries->printable_name}}', 'text': '{{$countries->printable_name}}'},
			@endforeach
        
		];
		
		$scope.author_type = [
				{id : "a", text : "Author"},
				{id : "ca", text : "Co-Author"},
				{id : "e", text : "Editor"},
				{id : "ce", text : "Co-Editor"},
				{id : "ge", text : "Guest-Editor"}
			];
	
			@if( old('sequence') )

				@foreach (old('sequence') as $key => $vals)
				
					$scope.authors.push(
					{
						'principle' 	: @if(isset(old("principle")[$key])) {{ old("principle")[$key] }} @else 0 @endif,
						'sequence' 		: '{{ old("sequence")[$key] }}',
						'author_type' 	: '{{ old("author_type")[$key] }}',
						'initials' 		: '{{ old("initials")[$key] }}',
						'first_name' 	: '{{ old("first_name")[$key] }}',
						'last_name' 	: '{{ old("last_name")[$key] }}',
						'h_index' 		: '{{ old("h_index")[$key] }}',
						'email' 		: '{{ old("email")[$key] }}',
						'affiliation' 	: '{{ old("affiliation")[$key] }}',
						'country' 		: '{{ old("country")[$key] }}'
						
					});
					
					$scope.author_option.push({'id': {{$key}},'value': '{{ old("author_type")[$key] }}'});	
					$scope.country_option.push({'id': {{$key}},'value': '{{ old("country")[$key] }}'});	
					
				@endforeach
				
			@else
				
				var new_data =   
				{
					'principle' 	: '',
					'sequence' 		: '',
					'author_type' 	: '',
					'initials' 		: '',
					'first_name' 	: '',
					'last_name' 	: '',
					'h_index' 		: '',
					'affiliation' 	: '',
					'country' 		: ''
				}
				$scope.authors = [{new_data}];
				
			@endif
			
			
		
		$scope.Add = function () {
			//Add the new item to the Array.
			var new_data =   
			{
				'principle' 	: '',
				'sequence' 		: '',
				'initials' 		: '',
				'author_type' 	: '',
				'first_name' 	: '',
				'last_name' 	: '',
				'h_index' 		: '',
				'affiliation' 	: '',
				'country' 		: ''
			}

			$scope.authors.push(new_data);
			
		};

		$scope.Remove = function (index) {
			//Find the record using Index from Array.
			$scope.authors.splice(index, 1);

		}
	
	});
  
</script>

<div ng-app="APP.Subapp.Admin">
	
	<div ng-controller="MyController">
	
	<h3>Add Authors</h3>
	
	<div class="form-group col-lg-12 col-md-12 col-sm-12">
		<input class="btn btn-success btn-xs pull-right " type="button" ng-click="Add()" value="Add Author" />
	</div>
	
		<div ng-repeat="(key , m) in authors" >	
		
			<div class="form-group col-lg-1 col-md-1 col-sm-1">
				<label  class="control-label">Principle:</label>
				<input type="checkbox" name="principle_{[{key}]}" class="input-md" placeholder="Principle" value="1">
			</div>
		
			<div class="form-group col-lg-2 col-md-2 col-sm-2">
				<label  class="control-label">Sequence:</label>
				<input type="text"  name="sequence[]" class="form-control input-md" placeholder="Sequence" value="{[{ m.sequence }]}">
			</div>
			<div class="form-group col-lg-2 col-md-2 col-sm-2">
			<label class="control-label">Author Type:</label>
			<select class="form-control" name="author_type[]">
					<option ng-selected="author_option[key].value == a.id" ng-repeat="a in author_type" value="{[{a.id}]}">{[{a.text}]}</option>
			</select>
			</div>
			<div class="form-group col-lg-2 col-md-2 col-sm-2">
				<label  class="control-label">Initials:</label>
				<input type="text" name="initials[]" class="form-control input-md" placeholder="Initials" value="{[{ m.initials }]}">
			</div>
			<div class="form-group col-lg-2 col-md-2 col-sm-2">
				<label  class="control-label">h index:</label>
				<input type="text" name="h_index[]" class="form-control input-md" 
				placeholder="h index" value="{[{ m.h_index }]}">
			</div>
			
			<div class="form-group col-lg-3 col-md-3 col-sm-3" >
				<label  class="control-label">Country:</label>
				<select class="form-control" name="country[]">
					<option ng-selected="country_option[key].value == item.id" ng-repeat="item in country" ng-value="item.id">{[{item.text}]}</option>
				</select>
			
			</div>
			
			<div class="form-group col-lg-6 col-md-6 col-sm-6">
				<label  class="control-label">first_name:</label>
				<input type="text" name="first_name[]" class="form-control input-md" placeholder="first_name" value="{[{ m.first_name }]}" required>
			</div>
			<div class="form-group col-lg-6 col-md-6 col-sm-6">
				<label  class="control-label">last_name:</label>
				<input type="text" name="last_name[]" class="form-control input-md" placeholder="last_name" value="{[{ m.last_name }]}" required>
			</div>
			<div class="form-group col-lg-6 col-md-6 col-sm-6">
				<label  class="control-label">Email:</label>
				<input type="email" name="email[]" class="form-control input-md" 
				placeholder="email" value="{[{ m.email }]}" required>
			</div>
			<div class="form-group col-lg-6 col-md-6 col-sm-6">
				<label  class="control-label">affiliation:</label>
				<input type="text" name="affiliation[]" class="form-control input-md" placeholder="affiliation" value="{[{ m.affiliation }]}" required>
			</div>
			
			<div class="form-group col-lg-12 col-md-12 col-sm-12">
				<input class="btn btn-danger btn-xs pull-right " type="button" ng-click="Remove($index)" value="Remove" />
			</div>
			
			<div style ="clear:both;"></div>
		</div>
	
		<hr>
		
    </div>
	
	
  
</div>
