@extends('admin/layouts/default')

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

	{{-- page level styles --}}
@section('header_styles')
			<!--page level css -->
	<link href="{{ asset('assets/vendors/jasny-bootstrap/css/jasny-bootstrap.css') }}" rel="stylesheet">
	<link href="{{ asset('assets/vendors/select2/css/select2.min.css') }}" type="text/css" rel="stylesheet">
	<link href="{{ asset('assets/vendors/select2/css/select2-bootstrap.css') }}" rel="stylesheet">
	<link href="{{ asset('assets/vendors/datetimepicker/css/bootstrap-datetimepicker.min.css') }}" rel="stylesheet">
	<link href="{{ asset('assets/vendors/iCheck/css/all.css') }}"  rel="stylesheet" type="text/css" />
	<link href="{{ asset('assets/css/pages/wizard.css') }}" rel="stylesheet">
	<!--end of page level css-->
@stop

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

@section('content')
	<section class="content-header">
		<h1>Add New Image</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="#"> Images</a></li>
			<li class="active">Add New Image</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 Image
						</h3>
                                <span class="pull-right clickable">
                                    <i class="glyphicon glyphicon-chevron-up"></i>
                                </span>
					</div>
					<div class="panel-body">
	{!! Form::open([
			'action' => ['Admin\ImageController@store'],
			'files' => true
		])
	!!}

		@include('admin.images.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