@extends('default')

@section('head')
<link rel="stylesheet" href="/assets/bootstrap-tokenfield/dist/css/bootstrap-tokenfield.min.css"/><script src="/assets/bootstrap-tokenfield/dist/bootstrap-tokenfield.min.js"></script>
<script src="/assets/holderjs/holder.js"></script>
@append

@section('content')
	{{var_dump($blog->toArray())}}
	<div class="col-md-12" ng-controller="BlogController">
		<?=Form::open(['route'=>$routeSubmit, 'enctype'=>'multipart/form-data', 'role'=>'form', 'class'=> 'form-horizontal'])?>
			@if(Route::current()->getName()=='blog.create')
				<h3>{{trans('blog::common.blog_create')}}</h3>
			@else
				<h3>{{trans('blog::common.blog_edit')}}</h3>
			@endif
			<ul class="nav nav-tabs" id="blogTabs" role="tablist">
				<li><a href="#info" role="tab" data-toggle="tab">Info</a></li>
				<li><a href="#image" role="tab" data-toggle="tab">Image</a></li>
				<li><a href="#seo" role="tab" data-toggle="tab">SEO</a></li>
				<li><a href="#protect" role="tab" data-toggle="tab">Protect</a></li>
			</ul>
			<div class="tab-content" style="margin-top: 10px">
				<div id="info" class="tab-pane fade">
                    <div class="form-group">
						<div class="col-md-9">
							<?=Form::label('name', trans('blog::common.blog_name'), ['class'=>'control-label'])?>
							<?=Form::text('name', Input::get('name', $blog->name), ['class'=>'form-control'])?>
						</div>
                        <div class="col-md-offset-1 col-md-2">
                            <?=Form::label('state', trans('blog::common.blog_state'), ['class'=>'control-label'])?>
                            <?=Form::select('state', [trans('Disabled'), trans('Active')], Input::get('state', $blog->state), ['class'=>'form-control'])?>
                        </div>
					</div>

                    <div class="form-group">
						<div class="col-md-12">
							<?=Form::label('dscription', trans('blog::common.blog_description'), ['class'=>'control-label'])?>
							<?=Form::textarea('description', $blog->description, ['class'=>'form-control'])?>
						</div>
					</div>
				</div>
				<div id="image" class="tab-pane fade">
					<div class="row">
						<div class="col-md-12">
							<div class="fileinput fileinput-new" data-provides="fileinput">
								<div class="fileinput-new thumbnail" style="width: 200px; height: 150px;">
									<img data-src="holder.js/100%x100%" alt="image">
								</div>
								<div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 200px; max-height: 150px;"></div>
								<div>
									<span class="btn btn-default btn-file"><span class="fileinput-new">Select image</span><span class="fileinput-exists">Change</span><input type="file" name="image"></span>
									<a href="#" class="btn btn-default fileinput-exists" data-dismiss="fileinput">Remove</a>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div id="seo" class="tab-pane fade">
					<div class="row">
						<div class="col-md-12">
							<div class="form-group">
								<?=Form::label('seo_description', trans('blog::common.blog_description'), ['class'=>'control-label'])?>
								<?=Form::textarea('seo_description', Input::get('seo_description', $blog->seo_description), ['class'=>'form-control', 'rows'=>3])?>
							</div>
							<div class="form-group">
	                            <?=Form::label('seo_keywords', trans('blog::common.blog_keywords'), ['class'=>'control-label'])?>
							    <?=Form::text('seo_keywords', Input::get('seo_keywords', $blog->seo_keywords), ['class'=>'form-control'])?>
							</div>
						</div>
					</div>
				</div>
				<div id="protect" class="tab-pane fade">
                    <div class="col-md-12">
                        <div class="form-group">
                            <?=Form::label('protect', trans('blog::common.protect'), ['class'=>'col-sm-2 control-label'])?>
                            <div class="col-sm-2">
	                            <?=Form::select('protect', [], null, ['class'=>'form-control', 'ng-model'=>'data.protect', 'ng-options'=>'protect.value as protect.title for protect in protects', 'ng-change'=>'selectProtect()'])?>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="form-group">
	                        <div ng-show="data.protect=='none'">
		                        <div class="alert alert-info" role="alert">{{trans(blog::messages.for_all)}}</div>
	                        </div>
                            <div ng-show="data.protect=='private'">
	                            <div class="alert alert-info" role="alert">{{trans(blog::messages.private)}}</div>
                            </div>
                            <div ng-show="data.protect=='password'">
	                            <div class="alert alert-info" role="alert">{{trans(blog::messages.protect_password)}}</div>
	                            <?=Form::label('password', trans('blog::common.password'), ['class'=>'col-md-2 control-label'])?>
                                <div class="col-md-3">
	                                <?=Form::input('password', 'protect_password', Input::get('protect_password', $blog->password), ['class'=>'form-control', 'ng-model'=>'data.protect_password', 'autocomplete'=>'off'])?>
                                </div>
                            </div>
                            <div ng-show="data.protect=='users'">
	                            <div class="alert alert-info" role="alert">{{trans('blog::messages.allow_users')}}</div>
                                <textarea ng-model="data.protect_users" cols="30" rows="10" class="form-control"></textarea>
                            </div>
                        </div>
                    </div>
				</div>
			</div>
			<div class="col-md-12">
				<div class="form-group text-right">
					<?=Form::submit(trans('blog::common.save'), ['class'=>'btn btn-primary'])?>
					<?=link_to_route('blog.my', trans('blog::common.cancel'), [], ['class'=>'btn btn-default'])?>
				</div>
			</div>
		</form>
	</div>
@endsection

@section('footer_adds')
	<script>
		$(function(){
			var hash = window.location.hash;

			(hash) ? hash && $('#blogTabs a[href="' + hash + '"]').tab('show') : $('#blogTabs a:first').tab('show');

			$('#blogTabs a').click(function (e) {
				e.preventDefault()
				$(this).tab('show');
				var scrollmem = $('body').scrollTop();
				window.location.hash = this.hash;
				$('html,body').scrollTop(scrollmem);
			});

			$('#seo_keywords').tokenfield();
		});

		app.controller('BlogController', function($scope){
            $scope.protects = [
                {value:'none',      title:'<?=trans('None')?>'},
                {value:'private',   title:'<?=trans('Private')?>'},
                {value:'password',  title:'<?=trans('Password')?>'},
                {value:'users',     title:'<?=trans('Users')?>'}
            ];

            $scope.data = {
				protect: '<?=Input::get('protect', 'none')?>'
            }
		});
	</script>
@endsection