@extends('admin/layouts/default')

{{-- Page title --}}
@section('title')
	Add User
	@parent
	@stop

	{{-- page level styles --}}
	@section('header_styles')
			<!--page level css -->

	<!--end of page level css-->
@stop

@section('page-header')
	Customer  <small>{{ trans('app.add_new_item') }}</small>
@stop

@section('content')
	<section class="content-header">
		<h1>Add New User</h1>
		<ol class="breadcrumb">
			<li>
				<a href="{{ route('admin.dashboard') }}">
					<i class="livicon" data-name="home" data-size="14" data-color="#000"></i>
					Dashboard
				</a>
			</li>
			<li><a href="#"> Users</a></li>
			<li class="active">Add New User</li>
		</ol>
	</section>
	<section class="content">
	<div class="row">
		<div class="col-md-12">
			<div class="panel panel-primary">
				<div class="panel-heading">
					<h3 class="panel-title">
						<i class="livicon" data-name="user-add" data-size="18" data-c="#fff" data-hc="#fff" data-loop="true"></i>
						Add New User
					</h3>
                                <span class="pull-right clickable">
                                    <i class="glyphicon glyphicon-chevron-up"></i>
                                </span>
				</div>
				<div class="panel-body">
	{!! Form::open([
			'action' => ['UserController@store'],
			'files' => true
		])
	!!}

		@include('admin.users.form')

		<button type="submit" class="btn btn-primary">{{ trans('app.add_button') }}</button>
		
	{!! Form::close() !!}

			</div>
			</div>
			</div>
		</div>
	<!--row end-->
	</section>
@stop

{{-- page level scripts --}}
@section('footer_scripts')
	<script src="{{ asset('assets/vendors/iCheck/js/icheck.js') }}"></script>
	<script src="{{ asset('assets/vendors/moment/js/moment.min.js') }}" ></script>
	<script src="{{ asset('assets/vendors/jasny-bootstrap/js/jasny-bootstrap.js') }}"  type="text/javascript"></script>
	<script src="{{ asset('assets/vendors/select2/js/select2.js') }}" type="text/javascript"></script>
	<script src="{{ asset('assets/vendors/bootstrapwizard/jquery.bootstrap.wizard.js') }}" type="text/javascript"></script>
	<script src="{{ asset('assets/vendors/bootstrapvalidator/js/bootstrapValidator.min.js') }}" type="text/javascript"></script>
	<script src="{{ asset('assets/vendors/datetimepicker/js/bootstrap-datetimepicker.min.js') }}" type="text/javascript"></script>
	<script src="{{ asset('assets/js/pages/adduser.js') }}"></script>
	<script>
		function formatState (state) {
			if (!state.id) { return state.text; }
			var $state = $(
					'<span><img src="{{ asset('assets/img/countries_flags') }}/'+ state.element.value.toLowerCase() + '.png" class="img-flag" width="20px" height="20px" /> ' + state.text + '</span>'
			);
			return $state;

		}
		$("#countries").select2({
			templateResult: formatState,
			templateSelection: formatState,
			placeholder: "select a country",
			theme:"bootstrap"
		});

	</script>
@stop